{% load split %}
    <div class="card-header" style="padding-bottom: 0;">
	  	<div class="row"  style="position: relative;">
	  		<div  class="col-sm-2">
				<div style="position:absolute; display: inline-block;">
					<span style="font-size: 28px; font-weight: bold; white-space: nowrap; line-height: 1;">{{ job.id }}</span>
				</div>
				<div style="position: relative; display: inline-block; top: 25px">

					<span style="font-size: 80%; font-weight: bold; white-space: nowrap; line-height: 1;" title="{{ job.cool_id }}">{{ job.cooler_id }}</span>
                <br>
					{% with job.quit_status_text|split:"_" as qs %}
						{% if qs.0 == "completed" %}
							<span class="fa fa-check text-success quit_status-icon" title="{{job.quit_status_text}} [RC={{job.quit_status}}]"></span>
						{% elif qs.0 == "interrupted" %}
							<span class="fa fa-hand-paper-o text-danger quit_status-icon" title="{{job.quit_status_text}} [RC={{job.quit_status}}]"></span>
						{% elif qs.0 == "autostop" %}
							<span class="fa fa-exclamation-circle text-danger quit_status-icon" title="{{job.quit_status_text}} [RC={{job.quit_status}}]"></span>
                        {% elif qs.0 == "killed" %}
							<i class="fa fa-meh-o quit_status-icon" style="color: #333;" title="{{ job.quit_status_text }} [RC={{ job.quit_status }}]"></i>
						{% else %}
							<span class="fa fa-question text-muted quit_status-icon" title="{{job.quit_status_text}} [RC={{job.quit_status}}]"></span>
						{% endif %}
					{% endwith %}
				</div>
			</div>
			<div class="col-sm-2">
				<span>{{ job.data_started|date:"d M 'y H:i:s" }} ({{ job.duration }})</span>
				<div style="padding:5px 0;">
					<b class="tag {% if net_errors != 0 %}tag-danger{% else  %}tag-success{% endif %} b-overload-offlinepage__indicator">net</b>
					&nbsp;
					{% if http_codes.2 %}<b class="tag tag-success b-overload-offlinepage__indicator" title="http">2xx</b>{% endif %}
					{% if http_codes.3 %}<b class="tag tag-info b-overload-offlinepage__indicator" title="http">3xx</b>{% endif %}
					{% if http_codes.4 %}<b class="tag tag-warning b-overload-offlinepage__indicator" title="http">4xx</b>{% endif %}
					{% if http_codes.5 %}<b class="tag tag-danger b-overload-offlinepage__indicator" title="http">5xx</b>{% endif %}
				</div>
			</div>
			<div class="col-md-5">
				<dl>
					<dd style="font-weight: bold; white-space: normal;">
						<span class="b-overload-offline-meta__title {% if owner %}b-editable{% endif %}" id="name" data-action="edit-name">{% if job.name %}{{ job.name }}{% else %}<span style="color: gray;">Test name</span>{% endif %}</span>
						{% if owner %}
						<span class="fa fa-pencil text-warning hidden" id="name_pencil"></span>
						<div class="b_editname_block hidden">
							<table>
								<tr>
									<td width="100%">
										<input type="text" id="b_editname_block__firename__" class="form-control">
									</td>
									<td>
									<div id="b_editname_block__okey__">
										<span class="fa fa-check text-success b-editable" style="font-size: 12px; cursor: pointer;"></span>
									</div></td>
									<td>
									<div id="b_editname_block__cancel__">
										<span class="fa fa-ban text-danger b-editable" style="font-size: 12px; cursor: pointer;"></span>
									</div></td>
									<td>
									<div class="hidden" id="b_editname_block__ajax__">
										<span class="krutilka fa fa-circle-o-notch fa-spin"></span>
									</div></td>
								</tr>
							</table>
						</div>
						{% endif %}
					</dd>
					<dd style="white-space: normal; max-height: 108px; overflow: auto;">
						<span class="b-overload-offline-meta__description {% if owner %}b-editable{% endif %}" id="dsc" data-action="edit-dsc" style="font-size: 80%; white-space: pre-line">{% if job.dsc %}{{ job.dsc }}{% else %}<span style="color: gray;">Description</span>{% endif %}</span>
						{% if owner %}
						<span class="fa fa-pencil text-warning" id="dsc_pencil" style="display: none;"></span>
						<div class="b_editdsc_block" style="display: none;">
							<table>
								<tr>
									<td width="100%">
										<textarea id="b_editdsc_block__dsc__" class="form-control"></textarea></td>
									<td>
									<div id="b_editdsc_block__okey__">
										<span class="fa fa-check text-success" style="font-size: 12px; cursor: pointer;"></span>
									</div>
									<div id="b_editdsc_block__cancel__">
										<span class="fa fa-ban text-danger" style="font-size: 12px; cursor: pointer;"></span>
									</div>
									<div id="b_editdsc_block__ajax__" style="display:none;">
										<span class="krutilka fa fa-circle-o-notch fa-spin"></span>
									</div></td>
								</tr>
							</table>
						</div>
						{% endif %}
					</dd>
				</dl>
			</div>
			<div class="col-md-3">
				<div style="float:right;">
				{% if owner %}
					<i class="fa fa-star b-overload-offlinepage__action {% if job.flag %}text-warning{% endif %} text-muted" aria-hidden="true" data-action="star" title="Favorite"></i>
					<i class="fa fa-pencil b-overload-offlinepage__action text-warning" data-action="edit" title="Edit" aria-hidden="true"></i>
					<i class="fa fa-trash b-overload-offlinepage__action text-danger" data-action="remove" title="Delete" aria-hidden="true"></i>
					&nbsp;
				{% endif %}
				{% if user_avatar_link %}
				<div style="line-height:1; padding-left:10px; display: inline-block; float: right;">
					{% if user_profile_link %}
						<a target="_blank" href="{{ user_profile_link }}">
							<img src="{{ user_avatar_link }}" style="float: right; border-radius: 50%" height="60" width="60" />
						</a>
					{% else %}
						<img src="{{ user_avatar_link }}" style="float: right; border-radius: 50%" height="60" width="60" />
					{% endif %}
				</div>
				{% endif %}
				</div>
			</div>
		</div>
		<ul class="nav nav-tabs card-header-tabs pull-xs-left job-tabpanel__tabs" id="job-tabpanel__tabs">
		</ul>
	</div>
<script nonce='{{ common.CSP_SCRIPT_NONCE }}' type='text/javascript' src='/media/js/offlinepage/meta.js?version=37'></script>
