{% extends "base.html" %}
{% block pagetitle -%}Build Record{%- endblock pagetitle %}
{% block stats %}{% endblock stats %}
{% block subheader %}
	<div class="page-head"><h2>{{ self.pagetitle() }}</h2>
		<ol class="breadcrumb">
			<li><a href="/">Home</a></li>
			<li><a href="#">Build Records</a></li>
			<li><a href="/{{ result }}">{{ result|capitalize() }}</a></li>
			<li class="active">{{ self.pagetitle() }}</li>
		</ol>
	</div>
{% endblock subheader %}
{%- block topcontent -%}
	<div class="row">
		<div class="col-md-4">
			<div id="summary" class="block no-padding block-color {% if result == "completed" %}success{% else %}danger{% endif %}">
				<div class="header">
					<div class="actions">
						<a class="minimize" href="#"><i class="fa fa-chevron-down"></i></a>
						<a class="refresh" href="#"><i class="fa fa-repeat"></i></a>
						<a class="close-down" href="#"><i class="fa fa-times"></i></a>
					</div>
					<h3>{% if result == "completed" %}
						<i class="glyphicon glyphicon-thumbs-up"></i>
					{% else %}
						<i class="glyphicon glyphicon-thumbs-down"></i>
					{% endif %}
						Build Number: {{ bld_obj.bnum }}</h3>
				</div>
				<div class="content no-padding">
					<table id="noDt" class="table no-border hover">
						<tbody class="no-border-y">
						<tr>
							<td>Transaction:</td>
							<td>{{ bld_obj.tnum }}</td>
						</tr>
						<tr>
							<td>Package:</td>
							<td><a href="/pkg/{{ bld_obj.pkgname }}">{{ bld_obj.pkgname }}</a></td>
						</tr>
						<tr>
							<td>Version:</td>
							<td>{{ bld_obj.version_str }}</td>
						</tr>
						<tr>
							<td>Start:</td>
							<td>{{ bld_obj.start_str }}</td>
						</tr>
						<tr>
							<td>Finish:</td>
							<td>{{ bld_obj.end_str }}</td>
						</tr>
						<tr>
							<td>Result:</td>
							<td>{{ result }}</td>
						</tr>
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>
	<div class="row">
	{% if bld_obj.gh_diff %}
		<div class="col-sm-10 col-md-10">
			<div class="block no-padding block-color pkgbuild_diff closed">
				<div class="header">
					<div class="actions">
						<a class="minimize" href="#"><i class="fa fa-chevron-down"></i></a>
						<a class="refresh" href="#"><i class="fa fa-repeat"></i></a>
						<a class="close-down" href="#"><i class="fa fa-times"></i></a>
					</div>
					<i class="fa fa-file-text-o"></i> &nbsp;{{ bld_obj.pkgname }}/PKGBUILD <span class="label label-warning">CHANGED</span>
				</div>
				<div id="pkgbuild_diff" class="content no-padding" style="display:none;"></div>
				<script>
					{%  set pkgbuild_diff = bld_obj.gh_diff|replace("'", "\\'")|replace("\n", "\\n") %}
					window.pkgbuild_diff = '{{ pkgbuild_diff|safe() }}';
				</script>
			</div>
		</div>
	{% endif %}
	</div>

{%- endblock topcontent -%}

{%- block bottomcontent %}
	<div class="row">
		<div class="col-md-10">
			<div id="" class="block block-color">
				<div class="header">
					<div class="actions">
						<a class="minimize" href="#"><i class="fa fa-chevron-down"></i></a>
						<a class="refresh" href="#"><i class="fa fa-repeat"></i></a>
						<a class="close-down" href="#"><i class="fa fa-times"></i></a>
					</div>
					<h3>Build Log</h3>
				</div>
				<div class="content no-padding">

					<div id="data" class="no-padding">{{ bld_obj.log_str|safe() }}</div>

				</div>
			</div>
		</div>
	</div>

{% endblock bottomcontent -%}
{% block scripts %}
	<style>
		.nano {
			background: #bba;
			width: 1366px;
			max-width: 100%;
			height: 340px;
			max-height: 340px;
		}

		.nano > .nano-content {
			padding: 10px;
			height: 340px;
		}

		.nano > .nano-pane {
			background: #888;
		}

		.nano > .nano-pane > .nano-slider {
			background: #111;
		}
		.pkgbuild_diff table, .pkgbuild_diff caption, .pkgbuild_diff tbody, .pkgbuild_diff tfoot, .pkgbuild_diff thead, .pkgbuild_diff tr, .pkgbuild_diff th, .pkgbuild_diff td {
			vertical-align: baseline;
			font-family: inherit;
			font-weight: inherit;
			font-style: inherit;
			font-size: 100%;
			outline: 0;
			padding: 0;
			margin: 0;
			border: 0;
		}
		.pkgbuild_diff ol, .pkgbuild_diff ul {
			list-style: none;
		}
		/* tables still need cellspacing="0" in the markup */
		.pkgbuild_diff table {
			border-collapse: separate;
			border-spacing: 0;
		}
		.pkgbuild_diff caption, .pkgbuild_diff th, .pkgbuild_diff td {
			font-weight: normal;
			text-align: left;
		}
		.pkgbuild_diff table { line-height: 1.2; }
		.pkgbuild_diff .d2h-file-header { display: none; }
		.pkgbuild_diff .actions { padding-top: 0px; }
		.pkgbuild_diff .header { font-size: 16px; font-family: "Open Sans", sans-serif; padding: 17px; }
		.label-warning { background-color: transparent; color: #fed16c; border: 1px solid #fed16c; font-size: 9px; margin-left: 3px; position: relative; bottom: 3px; }

		.pkgbuild_diff .hljs{display:block;overflow-x:auto;padding:0.5em;color:#333;background:#f8f8f8}.pkgbuild_diff .hljs-comment,.pkgbuild_diff .hljs-quote{color:#998;font-style:italic}.pkgbuild_diff .hljs-keyword,.pkgbuild_diff .hljs-selector-tag,.pkgbuild_diff .hljs-subst{color:#333;font-weight:bold}.pkgbuild_diff .hljs-number,.pkgbuild_diff .hljs-literal,.pkgbuild_diff .hljs-variable,.pkgbuild_diff .hljs-template-variable,.pkgbuild_diff .hljs-tag .pkgbuild_diff .hljs-attr{color:#008080}.pkgbuild_diff .hljs-string,.pkgbuild_diff .hljs-doctag{color:#d14}.pkgbuild_diff .hljs-title,.pkgbuild_diff .hljs-section,.pkgbuild_diff .hljs-selector-id{color:#900;font-weight:bold}.pkgbuild_diff .hljs-subst{font-weight:normal}.pkgbuild_diff .hljs-type,.pkgbuild_diff .hljs-class .pkgbuild_diff .hljs-title{color:#458;font-weight:bold}.pkgbuild_diff .hljs-tag,.pkgbuild_diff .hljs-name,.pkgbuild_diff .hljs-attribute{color:#000080;font-weight:normal}.pkgbuild_diff .hljs-regexp,.pkgbuild_diff .hljs-link{color:#009926}.pkgbuild_diff .hljs-symbol,.pkgbuild_diff .hljs-bullet{color:#990073}.pkgbuild_diff .hljs-built_in,.pkgbuild_diff .hljs-builtin-name{color:#0086b3}.pkgbuild_diff .hljs-meta{color:#999;font-weight:bold}.pkgbuild_diff .hljs-deletion{background:#fdd}.pkgbuild_diff .hljs-addition{background:#dfd}.pkgbuild_diff .hljs-emphasis{font-style:italic}.pkgbuild_diff .hljs-strong{font-weight:bold}
	</style>
	{{ super() }}
	{% if bld_obj.gh_diff %}
		<link rel="stylesheet" type="text/css" href="/static/css/diff2html.prefixed.min.css">
		<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.6.0/highlight.min.js"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.6.0/languages/bash.min.js"></script>
		<script type="text/javascript" src="/static/js/diff2html.min.js"></script>
		<script type="text/javascript" src="/static/js/diff2html-ui.min.js"></script>
		<script>
			$(document).ready(function() {
				var diff2htmlUi = new Diff2HtmlUI({diff: window.pkgbuild_diff});
				diff2htmlUi.draw('#pkgbuild_diff', {
					inputFormat: 'json',
					showFiles: false,
					matching: 'words',
					outputFormat: 'side-by-side',
					synchronisedScroll: true
				});
				diff2htmlUi.fileListCloseable('#pkgbuild_diff', false);
				diff2htmlUi.highlightCode('#pkgbuild_diff');
			});
		</script>
	{% endif %}
	<script>
		$(window).load(function () {
			$('#data .highlight').addClass('nano');
			$('.nano pre').addClass('nano-content');
			$(":not(.dropdown) .nano").nanoScroller();
		});
	</script>
{% endblock scripts %}