{% extends "base.html" %}
{% block content %}	
{% if serv %}
<style>
@media (max-width: 1280px) {
	.div-pannel {
		height: 430px !important;
	}
}
</style>
{% endif %}
<div id="up-pannel">
	{% for s in servers %}
	{% if serv %}
		<link href="/inc/chart.min.css" rel="stylesheet">
		<script src="/inc/metrics.js"></script>
		<script src="/inc/chart.min.js"></script>
		<script>
			function showMetrics() {
				{% for s in servers %}
					getChartData('{{s.2}}')
					getWafChartData('{{s.2}}')
				{% endfor %}
				showOverviewServer('{{s.1}}', '{{s.2}}', '{{s.0}}');
			}
			showMetrics();
		</script>
	{% endif %}
	<div class="div-pannel" id="div-pannel-{{s.0}}">
		<div id="div-server-{{s.0}}" class="div-server">
			<div class="server-name">				
				{% if s.5 != False %}
					<span class="serverUp server-status" title="{{s.5.0.2}}"></span>
				{% else %}
					<span class="serverDown server-status" title="HAProxy is down"></span>
				{% endif %}
				{% if not serv %}
					<a href="/app/hapservers.py?serv={{s.2}}" title="More about {{s.1}}" style="color: #5d9ceb">{{s.1}}</a>
				{% else %}
					{{s.1}}
				{% endif %}
				{% if s.6|int() >= 1 %}
					<img 
						{% if keep_alive|int() >= 1 %}
							src="/inc/images/shield.png" title="Auto start enabled"
						{% else %}
							src="/inc/images/shield-red.png" title="Auto start enabled, but keep alive service does not work"
						{% endif %}
						width=18 style="padding-left: 5px; margin-bottom: -3px;">
				{% endif %}
				{% if role <= 1 %}
				<span class="server-action">
					<a id="start-{{ s.2 }}" class="start" title="Start HAProxy service">
						<img src=/inc/images/start.png alt="start" class="icon-hapservs" style="margin-bottom: -2px;" onclick="confirmAjaxAction('start', 'hap', '{{s.2}}')">
					</a>
					<a id="stop-{{ s.2 }}" class="stop" title="Stop HAProxy service">
						<img src=/inc/images/stop.png alt="stop" class="icon-hapservs" width="17px" onclick="confirmAjaxAction('stop', 'hap', '{{s.2}}')">
					</a>
					<a id="restart-{{ s.2 }}" class="restart" title="Restart HAProxy service" onclick="confirmAjaxAction('restart', 'hap', '{{s.2}}')">
						<img src=/inc/images/update.png alt="restart" class="icon-hapservs">
					</a>
				</span>
				{% endif %}
			</div>
			<div class="server-desc">
				{{s.3}}
				{% if s.5.0 is defined %}
					<br />
					{{s.5.0.0}} {{s.5.0.1}} {{s.5.0.2}}
				{% endif %}				 
				<br />
				<span title="Date of last edit config">
					{% if s.7 != None %}
						{% if "ls: cannot access" in s.7 %}
							Cannot find HAProxy config
						{% else %}
							Last edit: {{s.7}}
						{% endif %}
					{% else %}
						Cannot connect to HAProxy server
					{% endif %}
				</span>			
				<br />
				IP: {{s.2}}
			</div>
			<div class="server-act-links">
				<a href="/app/config.py?serv={{s.2}}&showConfig" class="ui-button ui-widget ui-corner-all" title="Open running config">Open</a>	
				<a href="/app/config.py?serv={{s.2}}&showCompare" class="ui-button ui-widget ui-corner-all" title="Compare configs">Compare</a>	
				<a href="/app/config.py?serv={{s.2}}&showMap" class="ui-button ui-widget ui-corner-all" title="Show map">Map</a>	
				<a href="/app/viewsttats.py?serv={{s.2}}" class="ui-button ui-widget ui-corner-all" title="View stat">Stat</a>	
				<a href="/app/logs.py?serv={{s.2}}&rows=10&grep=&hour=00&minut=00&hour1=24&minut1=00" class="ui-button ui-widget ui-corner-all" title="View log">Log</a>	
				{% if role <= 2 %}
					<a href="/app/versions.py?serv={{s.2}}&open=open" class="ui-button ui-widget ui-corner-all">Versions</a>	
				{% endif %}
			</div>
		</div>
		
		<div id="ajax-server-{{s.0}}" class="ajax-server"></div>
		{% if serv %}
			{% if s.8 is defined %}
			<div class="div-server div-backends">
				<div class="server-name">	
					Backends:
				</div>
				<div style="margin-top: 10px;">
				{% for b in s.8 %}
				<a href="/app/sections.py?serv={{ s.2 }}&section={{b}}" title="Edit backend {{b}}" target="_blank" style="padding-right: 10px;">
					{{b}}
				</a>
				{% endfor %}
				</div>
			</div>
			{% endif %}
		{% endif %}
	</div>
	{% endfor %}
</div>
{% if serv %}
	<div id="refresh" style="text-align: right;margin-right: 105px;clear: both;display: block;padding-top: 20px;margin-bottom: -25px;" title="Refresh metrics" onclick="showMetrics()">
		<img  src="/inc/images/update.png" alt="Refresh" class="icon">
	</div>
	{% for s in servers %}
		<div class="chart-container" style="display: block; width: 90%; height: 300px;">
			<canvas id="{{s.2}}" role="img"></canvas>
		</div>
		<div class="chart-container" style="display: block; width: 90%; height: 300px;">
			<canvas id="s_{{s.2}}" role="img"></canvas>
		</div>
	{% endfor %}
{% endif %}
<div id="dialog-confirm" style="display: none;">
  <p><span class="ui-icon ui-icon-alert" style="float:left; margin:3px 12px 20px 0;"></span>Are you sure?</p>
</div>
<script src="/inc/overview.js"></script>
{% endblock %}