{% load backend_utils %}

<html lang="en" prefix="og: http://ogp.me/ns#">
<head>

	<meta property="og:title" content="A performance analytics service" />
	<meta property="og:site_name" content="OverLoad" />
	<meta property="og:description" content="Find out about your app's performance limits and bottlenecks in order to use your resources in a most effective way. Ensure your app is scalable and find a way to make it scalable. Use Overload to choose a reliable technology stack before you even started developing your product." />
	<!-- <meta property="og:image" content="/media/img/tanklogo-jumbo.jpg" /> -->

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    
    <link rel="shortcut icon" type="image/png" href="/media/favicon.ico"/>
    <title>{% block title %}OverLoad 𝛃{% endblock %}</title>
    <script nonce='{{ common.CSP_SCRIPT_NONCE }}' type="text/javascript" src="//yandex.st/jquery/1.9.1/jquery.min.js"></script>
    <!-- <script nonce='{{ common.CSP_SCRIPT_NONCE }}' src="https://code.jquery.com/jquery-3.1.1.min.js"></script> -->
    <!--<script nonce='{{ common.CSP_SCRIPT_NONCE }}' type="text/javascript" src="/media/js/vendor/utils.js?version=37"></script> -->
    <script nonce='{{ common.CSP_SCRIPT_NONCE }}' type="text/javascript" src="/media/js/vendor/tether.min.js"></script>
	<script nonce='{{ common.CSP_SCRIPT_NONCE }}' type="text/javascript" src="/media/js/vendor/bootstrap4.js?version=37"></script>
	<script nonce='{{ common.CSP_SCRIPT_NONCE }}' type="text/javascript" src="/media/js/vendor/selectpicker.js?version=37"></script>
	<script nonce='{{ common.CSP_SCRIPT_NONCE }}' type="text/javascript" src="/media/js/vendor/highcharts/highstock.js?version=37"></script>
	<script nonce='{{ common.CSP_SCRIPT_NONCE }}' type="text/javascript" src="/media/js/vendor/highcharts/highcharts-more.js?version=37"></script>
	<script nonce='{{ common.CSP_SCRIPT_NONCE }}' src="https://code.highcharts.com/5.0.2/modules/no-data-to-display.js"></script>
	<script nonce='{{ common.CSP_SCRIPT_NONCE }}' type="text/javascript" src="/media/js/vendor/underscore.min.js?version=37"></script>
	<script nonce='{{ common.CSP_SCRIPT_NONCE }}' type="text/javascript" src="/media/js/vendor/moment.min.js?version=37"></script>
	<script nonce='{{ common.CSP_SCRIPT_NONCE }}' type="text/javascript" src="/media/js/vendor/ion.rangeSlider.min.js?version=37"></script>
	
	<link href="/media/css/styles/bootstrap.css?version=37" type="text/css" rel="stylesheet" />
    <link href="/media/css/styles/selectpicker.css?version=37" type="text/css" rel="stylesheet" />
    <link href="/media/css/styles/ionSlider.css?version=37" type="text/css" rel="stylesheet" />
    
    <link href="/media/css/header.css?version=37" type="text/css" rel="stylesheet" />
    
    <script nonce='{{ common.CSP_SCRIPT_NONCE }}' src="https://sidecar.gitter.im/dist/sidecar.v1.js" async="" defer=""></script>
    
    {% block head %}{% endblock %}
    
    {% csrf_token %}
    
    <!-- http://stackoverflow.com/questions/5100539/django-csrf-check-failing-with-an-ajax-post-request -->
    <script nonce='{{ common.CSP_SCRIPT_NONCE }}'>
	    $.ajaxSetup({ 
		     beforeSend: function(xhr, settings) {
		         function getCookie(name) {
		             var cookieValue = null;
		             if (document.cookie && document.cookie != '') {
		                 var cookies = document.cookie.split(';');
		                 for (var i = 0; i < cookies.length; i++) {
		                     var cookie = jQuery.trim(cookies[i]);
		                     // Does this cookie string begin with the name we want?
		                     if (cookie.substring(0, name.length + 1) == (name + '=')) {
		                         cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
		                         break;
		                     }
		                 }
		             }
		             return cookieValue;
		         }
		         if (!(/^http:.*/.test(settings.url) || /^https:.*/.test(settings.url))) {
		             // Only send the token to relative URLs i.e. locally.
		             xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken'));
		         }
		     } 
		});
    </script>
</head>

<script nonce='{{ common.CSP_SCRIPT_NONCE }}'>

      $(document).ready( function()
      {
            $("body").show();
            var pagename = "{% block pagename %}{% endblock %}";

      });
</script>

<body style="display:none;">
<!-- Yandex.Metrika counter -->
{% if common.production_env %}
<script nonce='{{ common.CSP_SCRIPT_NONCE }}' type="text/javascript">
    (function (d, w, c) {
        (w[c] = w[c] || []).push(function() {
            try {
                w.yaCounter38166505 = new Ya.Metrika({
                    id:38166505,
                    clickmap:true,
                    trackLinks:true,
                    accurateTrackBounce:true
                });
            } catch(e) { }
        });

        var n = d.getElementsByTagName("script")[0],
            s = d.createElement("script"),
            f = function () { n.parentNode.insertBefore(s, n); };
        s.type = "text/javascript";
        s.async = true;
        s.src = "https://mc.yandex.ru/metrika/watch.js";

        if (w.opera == "[object Opera]") {
            d.addEventListener("DOMContentLoaded", f, false);
        } else { f(); }
    })(document, window, "yandex_metrika_callbacks");
</script>
<noscript><div><img src="https://mc.yandex.ru/watch/38166505" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
<!-- /Yandex.Metrika counter -->
{% endif %}

<span id="global-login" style="display:none;" data-login="{{ user.username }}" data-id="{{ user.id }}"></span>
{% block login %}<script nonce='{{ common.CSP_SCRIPT_NONCE }}' type='text/plain' id="request_user_login">{{ user.username }}</script>{% endblock %}
<div class="b-header">
</div>

<div class="gitter">
    <script nonce='{{ common.CSP_SCRIPT_NONCE }}'>
	  ((window.gitter = {}).chat = {}).options = {
	    room: 'yandex/yandex-tank'
	  };
	</script>
</div>
<script nonce='{{ common.CSP_SCRIPT_NONCE }}'>
	
</script>

<!-- ХЕДЕР -->
{% if common.maintenance %}
    <div id="maintenance">
        <div style="width:100%; background-color:red; padding:1em;">
            <span style="color:white; font-weight: bold; font-size: 120%;">MAINTENANCE. UNABLE TO START NEW TESTS</span>
        </div>
    </div>
{% endif %}
{% if common.notify_user and common.notification_text %}
	<div id="notification">
		<div style="width:100%; background-color: Orange; padding:0.4em;">
			<span id="notification_text" style="font-weight: bold; font-size: 120%;">
				{{ common.notification_text }}
			</span>
			<a style="cursor:pointer; float: right; margin-right:1em;" id="do_not_notify">
				<span class="fa fa-times-circle-o"
				aria-hidden="true" style="font-size: 24px;" title="Close">
			</span>
			</a>
		</div>
	</div>
	<script nonce='{{ common.CSP_SCRIPT_NONCE }}'>
		$("a#do_not_notify").bind('click',
		function(event) {
			$.ajax({
				url : "/api/hide_notification.json",
				type : 'GET',
				dataType : 'json'
			}).always(function(data) {
				console.log('notification hidden', data);
				$("div#notification").remove();
			});
		});
		var notification_text = $("span#notification_text").text().replace(
	            /((http|https|ftp|ftps)\:\/\/[a-zA-Z0-9\-\.]+\.[a-zA-Z]{2,3}(\/\S*)?)/g,
	            '<a href="$1" target="_blank" class="b_link">$1</a>'
	        );
		$("span#notification_text").html(notification_text)
	</script>
{% endif %}

<header class="m-head m-head_type_at mi-bem" id="overload_header" style="border-bottom: 1px solid #eee; box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.05);">
	<div class="m-head-arrow m-head__min mi-bem m-head-arrow_js_inited">
	<a href="/" class="b_header_link">
		<span class="m-head-arrow__home" style="font-weight: 500">OverLoad&nbsp;<sup>𝛃</sup></span>
	</a>
	<div class="popup popup_theme_head popup_autoclosable_yes popup_adaptive_yes popup_animate_yes mi-bem popup_js_inited">
	<div class="popup__content"></div>
	</div></div><div class="m-head__main">
	<menu class="m-head-menu m-head-menu_type_main mi-bem m-head-menu_js_inited">
	{% if common.approved %}
	<div class="m-head-menu__list">
		<div id="firestarter_menu_link" class="m-head-menu__item">
			<a href="/" class="mlink" title="">Public tests</a>
		</div>
	</div>
	<!-- <div class="m-head-menu__list">
		<div id="firestarter_menu_link" class="m-head-menu__item">
			<span style="cursor: pointer" id="expand-url" class="mlink" title="">Expand</span>
		</div>
	</div> -->
	{% endif %}
	<div class="m-head-menu__list">
		<div id="firestarter_menu_link" class="m-head-menu__item">
			<span style="cursor: pointer" id="permalink" class="mlink" title="PermanentLink">Short Link</span>
		</div>
	</div>
    <!-- <div id="comparepage_menu_link" class="m-head-menu__item">
        <a href="/compare/" class="mlink">Compare:&nbsp;
            <span class="b_compare_count">{{ common.compare_count }}</span>
        </a>
        <span class="fa fa-times-circle-o b_compare_count__delete text-muted"
            aria-hidden="true"
            style="font-size: 12pt; {% if common.compare_count == 0 %}display:none;{% endif %}">
        </span>
    </div> -->
	<div class="m-head-menu__list">
	    <div id="firestarter_menu_link" class="m-head-menu__item">
		    <a class="mlink"  href="https://yandex.ru/legal/overload_termofuse/?lang=en" id="termofuse-url" title="Licensing information" target="_blank">License</a>
	    </div>
    </div>
    <div class="m-head-menu__list">
	    <div id="firestarter_menu_link" class="m-head-menu__item">
		    <a class="mlink" href="/mainpage/guide#install" id="tutorial-url" title="Overload lil' tutorial">Tutorial</a>
	    </div>
    </div>
    <div class="m-head-menu__list">
	    <div id="firestarter_menu_link" class="m-head-menu__item">
		    <a class="mlink" href="https://gitter.im/yandex/yandex-tank" id="gitter-url" title="Gitter chat" target="_blank"><i class="fa fa-github"></i>&nbsp;Gitter</a>
	    </div>
    </div>
	</menu>
	</div>
	{% if user.is_authenticated %}
	<div style="padding: 15px;">
		<span> {{ user.first_name }} {{ user.last_name }}</span>
	</div>
	<div class="dropdown">
		<img id="user-avatar" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" style="cursor: pointer;" src="{{ common.avatar_link }}" width="49" height="49"></img>
		<ul class="dropdown-menu dropdown-menu-right" aria-labelledby="user-avatar" style="padding-left: 10px;padding-right: 10px;">
		    <li title="Get your token" ><a href="#" id="api_token" data-toggle="modal" data-target="#apiTokenModal" aria-hidden="true">My api token</a></li>
		    <li><a href="/logout/">Logout</a></li>
		</ul>
	</div>
	{% else %}
	<div style="padding: 10px;">
		<a href="/mainpage/guide"><i class="fa fa-sign-in" style="color: #839E51; font-size: 21pt;" style=></i></a>
	</div>
	{% endif %}
</header>

<script nonce='{{ common.CSP_SCRIPT_NONCE }}'>
$('.b_compare_count__delete').on('click', function clearCompare() {
    var url = '/compare/clear_jobs';
    $.get(url).success(function(data) {
        if (data.success == "1") {
            $('.b_compare_count').text('0');
        }
    });
});
</script>


<!-- Modal -->
<div class="modal fade" id="apiTokenModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">Your api token</h4>
      </div>
      <div class="modal-body">
        <span id="apiTokenValue"></span>
      </div>
    </div>
  </div>
</div>

<script nonce='{{ common.CSP_SCRIPT_NONCE }}'>
	$( document ).ready(function() {
		$.ajax({
			url : '/api/get_api_token.json',
			type : 'GET',
			dataType : 'json',
			success : function(data) {
				if (data['approved']) {
					txt = data['token']
				}
				else {
					txt = "has not been approved yet"
				}
				$('#apiTokenValue').html(txt)
			}
		})
	})
</script>

<script nonce='{{ common.CSP_SCRIPT_NONCE }}'>
	$('span#permalink').on('click', function(event){
		console.log('here');
		$.ajax({
			url : 'https://clck.ru/--?url='+escape(window.location.href),
			type : 'GET',
			dataType : 'text',
			success : function(data) {
				console.log(data);
				window.prompt("Копировать ссылку: Ctrl+C, Enter", data);
			}
		})
	})
		
</script>
{% block padding %}
	<div class='header-bottom-padding'></div>
{% endblock %}

<!-- навигационный блок-->
<div class="b-navigation">
      {% block navigation %}{% endblock %}
</div>
<!-- конец блока -->

<!-- блок сортировки -->
<div class="b-sort">
      
    {% block sort %}{% endblock %}

</div>

<div class="b-test">
    
</div>

<!-- конец блока -->
{% block guide %}{% endblock %}
<div class="b-body">
{% block body %}{% endblock %}
</div>



{% block footer %}
{% endblock %}

</body>
</html>
