{% extends "base.html" %}
{% block content %}	
{% from 'include/input_macros.html' import input, checkbox, select, copy_to_clipboard %}
<script src="/inc/overview.js"></script>
<link href="/inc/css/chart.min.css" rel="stylesheet">
<script src="/inc/metrics.js"></script>
<script src="/inc/chart.min.js"></script>
{% if servers|length == 0 %} {% include 'include/getstarted.html' %} {% endif %}
<style>
.ui-checkboxradio-label {
	padding-bottom: 5px !important;
	padding-top: 5px !important;
}
</style>
<script>
	var ip = []
	var hostnamea = []
	{% for s in servers %}
		ip.push("{{s[2]}}")
		var host = "{{s[2]}}"
		host = host.replace(/\./g, '\\.');
		hostnamea.push(host)
		var ip_for_check = "{{s.2}}";
		ip_for_check = ip_for_check.replace(/\./g, '\\.');
		setInterval(check_service_status, 11000, {{s.0}}, '{{s.2}}', '{{service}}');
	{% endfor %}
	$( function() {
		$( ".sortable" ).sortable({
			revert: true,
			placeholder: "ui-state-highlight"
		});
		$( ".sortable" ).disableSelection();

		$( ".sortable" ).sortable({
			stop: function(event, ui) {
				var itemOrder = $('.sortable').sortable("toArray");
				for (var i = 0; i < itemOrder.length; i++) {
					var pos = i;
					var id = itemOrder[i].split('-')[2]
					change_pos(pos, id);
				}
			}
		});
		{% for s in services %}
			{% if 'is not installed' in s.1 or s.1 == '' or user_status == 0 %}
				{% if s.0 == 'roxy-wi-checker' %}
					$(':regex(id, alert-)').checkboxradio('disable');
				{% elif s.0 == 'roxy-wi-keep_alive' or s.0 == 'roxy-wi-keep-alive' %}
					$(':regex(id, active-)').checkboxradio('disable');
				{% elif s.0 == 'roxy-wi-metrics' %}
					$(':regex(id, metrics-)').checkboxradio('disable');
				{% endif %}
			{% endif %}
		{% endfor %}
	});
</script>
<div id="up-pannel" {%if not serv%} class="sortable"{%endif%}>
	{%- for s in servers %}
		{%- if serv %}
			{% set config_id = 'id=config_link' %}
			{% set compare_id = 'id=compare_link' %}
			{% set map_id = 'id=map_link' %}
			{% set stats_id = 'id=stats_link' %}
			{% set logs_id = 'id=logs_link' %}
			{% set versions_id = 'id=versions_link' %}
			<script>
				var server_ip = '{{s.2}}'
				function showMetrics() {
					{%- if service == 'haproxy' %}
						{%- for s in servers %}
							{%- if s.8.0.9 %}
								getChartData(server_ip)
								getHttpChartData(server_ip)
								getWafChartData(server_ip)
							{% endif %}
						{% endfor %}
					{% endif %}
					showOverviewServer('{{s.1}}', server_ip, '{{s.0}}', '{{service}}');
					{%- if service == 'nginx' %}
						showNginxConnections(server_ip)
						{% if s.8.0.21 %}
							getNginxChartData(server_ip)
						{% endif %}
					{%- elif service == 'apache' %}
						showApachekBytes(server_ip)
						{% if s.8.0.27 %}
							getApacheChartData(server_ip)
						{% endif %}
					{%- elif service == 'haproxy' %}
						showBytes(server_ip)
					{%- elif service == 'keepalived' %}
						keepalivedBecameMaster(server_ip)
					{% endif %}
				}
				showMetrics();
				$( function() {
					$("#time-range").on('selectmenuchange', function () {
						removeData()
						let metrics = new Promise(
								(resolve, reject) => {
									{% for s in servers %}
										{% if service == 'haproxy' %}
											getChartData(server_ip)
											getHttpChartData(server_ip)
											getWafChartData(server_ip)
										{% elif service == 'nginx' %}
											getNginxChartData(server_ip)
										{% elif service == 'apache' %}
											getApacheChartData(server_ip)
										{% endif %}
									{% endfor %}
								});
						metrics.then();
					});
				});
				$(document).on('keydown', null, 'a', start_button);
				function start_button(event) {
					confirmAjaxAction('start', '{{service}}', '{{s.2}}');
				}
				$(document).on('keydown', null, 's', stop_button);
				function stop_button(event) {
					confirmAjaxAction('stop', '{{service}}', '{{s.2}}');
				}
				$(document).on('keydown', null, 'e', reload_button);
				function reload_button(event) {
					confirmAjaxAction('reload', '{{service}}', '{{s.2}}');
				}
				{% for set in restart_settings %}
					{% if set.server_id == s.0 and set.setting == 'restart' and set.value|int == 0 %}
					$(document).on('keydown', null, 'r', restart_button);
					function restart_button(event) {
						confirmAjaxAction('restart', '{{service}}', '{{s.2}}', '{{s.1}}');
					}
					{% endif %}
				{% endfor %}
				$(document).on('keydown', null, 'k', metrics_button);
				function metrics_button(event) {
					showMetrics();
				}
				$(document).bind('keydown', 'o', function (){
					window.location = document.getElementById('compare_link').href;
				});
				$(document).bind('keydown', 'c', function (){
					window.location = document.getElementById('config_link').href;
				});
				$(document).bind('keydown', 'm', function (){
					window.location = document.getElementById('map_link').href;
				});
				$(document).bind('keydown', 't', function (){
					window.location = document.getElementById('stats_link').href;
				});
				$(document).bind('keydown', 'l', function (){
					window.location = document.getElementById('logs_link').href;
				});
				$(document).bind('keydown', 'v', function (){
					window.location = document.getElementById('versions_link').href;
				});
			</script>
		{% endif %}
		{% set checker_desc = "Checker monitors " +service_desc.service + " services. If " + service_desc.service + " service changes its status, Checker will alert via Telegram, Slack, Email, Web" %}
		{% if service == 'nginx' %}
			{% set is_auto_start_enabled = s.8.0.17 %}
			{% set is_checker_enabled = s.8.0.19 %}
			{% set is_metrics_enabled = s.8.0.21 %}
			{% if s.5.0.1 == 'active' or s.5.0.1 == 'Up' %}
				{% set additional_status_class = 'div-server-head-up' %}
			{% else %}
				{% set additional_status_class = 'div-server-head-down' %}
			{% endif %}
		{% elif service == 'keepalived' %}
			{% set is_auto_start_enabled = s.8.0.22 %}
			{% set is_checker_enabled = s.8.0.23 %}
			{% if s.5.0.1 == 'active' %}
				{% set additional_status_class = 'div-server-head-up' %}
			{% else %}
				{% set additional_status_class = 'div-server-head-down' %}
			{% endif %}
		{% elif service == 'apache' %}
			{% set is_auto_start_enabled = s.8.0.25 %}
			{% set is_checker_enabled = s.8.0.26 %}
			{% set is_metrics_enabled = s.8.0.27 %}
			{% if 'Apache' in s.4.0 %}
				{% set additional_status_class = 'div-server-head-up' %}
			{% else %}
				{% set additional_status_class = 'div-server-head-down' %}
			{% endif %}
		{% elif service == 'haproxy' %}
			{% set is_auto_start_enabled = s.8.0.12 %}
			{% set is_checker_enabled = s.8.0.8 %}
			{% set is_metrics_enabled = s.8.0.9 %}
			{% if s.5 != False %}
				{% set additional_status_class = 'div-server-head-up' %}
			{% else %}
				{% set additional_status_class = 'div-server-head-down' %}
			{% endif %}
		{% endif %}
		<div id="div-server-{{s.0}}" class="div-server-hapwi {{additional_status_class}}" {% if not serv %}style="cursor: move;"{%endif%}>
			<div class="server-name">
				<input type="hidden" id="server-name-{{s.0}}" value="{{s.1}}" />
				<input type="hidden" id="service" value="{{service}}" />
				{% if not serv %}
					<a href="/app/hapservers.py?service={{service}}&serv={{s.2}}" title="More about {{s.1}}" style="color: #5d9ceb">{{s.1}}</a>
				{% else %}
					{{s.1}}
				{% endif %}
				{% if s.6|int() >= 1 %}
					<span
						{% if keep_alive|int() >= 1 %}
						class="shield green" title="Autostart is enabled">
						{% else %}
						class="shield red" title="Autostart is enabled, but Keep alive service is not running">
						{% endif %}
					</span>
				{% endif %}
				{% if s.8.0.20 == 1 %}
					<span class="lock" title="This server is inaccessible for editing by everyone except the admin role"></span>
				{% endif %}
				{% for set in docker_settings %}
					{% if set.server_id == s.0 and set.setting == 'dockerized' and set.value == '1' %}
					<span class="box" title="This server is dockerized"></span>
					{% endif %}
				{% endfor %}
				{% if role <= 3 %}
				<span class="server-action">
					<a id="start-{{ s.2 }}" class="start" title="Start {{service}} service">
						<span class="service-start" onclick="confirmAjaxAction('start', '{{service}}', '{{s.2}}')"></span>
					</a>
					{% if service != 'keepalived' %}
					<a id="reload-{{ s.2 }}" class="reload" title="Reload {{service}} service">
						<span class="service-reload" onclick="confirmAjaxAction('reload', '{{service}}', '{{s.2}}', '{{s.1}}')"></span>
					</a>
					{% endif %}
					{% for set in restart_settings %}
						{% if set.server_id == s.0 and set.setting == 'restart' and set.value|int == 0 %}
						<a id="restart-{{ s.2 }}" class="restart" title="Restart {{service}} service">
							<span class="service-reload service-restart" onclick="confirmAjaxAction('restart', '{{service}}', '{{s.2}}')"></span>
						</a>
						{% endif %}
					{% endfor %}
					{% if restart_settings|length == 0 %}
						<a id="restart-{{ s.2 }}" class="restart" title="Restart {{service}} service">
							<span class="service-reload service-restart" onclick="confirmAjaxAction('restart', '{{service}}', '{{s.2}}')"></span>
						</a>
					{% endif %}
					<a id="stop-{{ s.2 }}" class="stop" title="Stop {{service}} service">
						<span class="service-stop" onclick="confirmAjaxAction('stop', '{{service}}', '{{s.2}}')"></span>
					</a>
					<a href="history.py?service={{service}}&serv={{s.2}}" title="View history for this service" class="history" style="margin: 0 5px 0 10px;"></a>
					{% if service != 'keepalived' %}
					<span class="menu-bar" onclick="serverSettings('{{s.0}}', '{{s.1}}')" title="Edit settings for {{s.1}} service"></span>
					{% endif %}
				</span>
				{% endif %}
			</div>
			<div class="server-desc">
				{% if s.3 is none %}
				No description
				{% else %}
				{{s.3}}
				{% endif %}
				<br />
				{% if service == 'nginx' or service == 'keepalived' %}
					Version: {{s.5.0.0}} Process_num: {{s.5.0.3}}
					<br />
					{% if s.5.0.1 == 'active' or s.5.0.1 == 'Up' %}
						Started:
					{% else %}
						Stopped:
					{% endif %}
					{{s.5.0.2}}
				{% elif service == 'apache' %}
					{% if s.4.0 is defined %}
						{{s.4.0.split(' ')[0].split('Server')[1]}} {{s.4.0.split(' ')[1]}} {{s.4.2}}
						<br />
						{{s.4.1.split(' ')[0].split('Server')[1]}} {% for i in s.4.1.split(' ')[1:5] %} {{i}}{% endfor %}
					{% else %}
						Cannot get information about Apache
					{% endif %}
				{% else %}
					{% if s.5.0 is defined %}
						{{s.5.0.0}} {{s.5.0.1}}
						<br />
						{{s.5.0.2}}
					{% else %}
						Cannot get information about HAProxy
					{% endif %}
				{% endif %}
				<span title="Date of last configuration edit">
					Last edit:
					<span id="edit_date_{{s.2}}"></span>
				</span>
				<div class="overflow_div">
				IP: {{ copy_to_clipboard(value=s.2, style='font-weight: bold') }}
				{% if s.7.0.0 != None %}
					Master for: <b>{{ copy_to_clipboard(value=s.7.0.1, style='font-weight: bold') }}</b>
				{% endif %}
				{% if s.9.0 == '1' %}
					VRRP: <b>
					{% if s.9.1 == 'MASTER' or s.9.1 == 'BACKUP' or s.9.1 == 'INIT' or s.9.1 == 'FAULT' %}
						{{s.9.1}}
					{% else %}
						<span title="Cannot get Keepalived Status" class="help_cursor">Error</span>
					{% endif %}
					</b>
				{% endif %}
				</div>
			</div>
			<div class="server-act-links" id="server-{{s.8.0.0|string()}}-{{service}}">
				{% if role <= 2 %}
					{% set id = 'alert-' + s.8.0.0|string() %}
					{% if is_checker_enabled == 1 %}
						{{ checkbox(id, title=checker_desc, value='1', desc='Checker', checked='checked') }}
					{% else %}
						{{ checkbox(id, title=checker_desc, value='1', desc='Checker') }}
					{% endif %}
				{% endif %}
				{% if role <= 2 and service != 'keepalived' %}
					{% set id = 'metrics-' + s.8.0.0|string() %}
					{% if is_metrics_enabled == 1 %}
						{{ checkbox(id, title='Collecting metrics is enabled', value='1', desc='Metrics', checked='checked') }}
					{% else %}
						{{ checkbox(id, title='Enable collecting metrics', value='1', desc='Metrics') }}
					{% endif %}
				{% endif %}
				{% if role <= 2 %}
					{% set id = 'active-' + s.8.0.0|string() %}
					{% if is_auto_start_enabled == 1 %}
						{{ checkbox(id, title='Auto Start is enabled', value='1', desc='Auto Start', checked='checked') }}
					{% else %}
						{{ checkbox(id, title='Enable Auto Start', value='1', desc='Auto Start') }}
					{% endif %}
				{% endif %}
			</div>
			<div class="server-act-links">
				{% if service == 'nginx' or service == 'apache' %}
				<a href="/app/config.py?service={{service}}&serv={{s.2}}&showConfigFiles" {{config_id}} class="ui-button ui-widget ui-corner-all" title="Open running configs">Configs</a>
				{% else %}
				<a href="/app/config.py?service={{service}}&serv={{s.2}}&showConfig" {{config_id}} class="ui-button ui-widget ui-corner-all" title="Open running config">Config</a>
				{% endif %}
				<a href="/app/config.py?service={{service}}&serv={{s.2}}&showCompare" {{compare_id}} class="ui-button ui-widget ui-corner-all" title="Compare configs">Compare</a>
			{% if service == 'haproxy' %}
				<a href="/app/config.py?service={{service}}&serv={{s.2}}&showMap" class="ui-button ui-widget ui-corner-all" {{map_id}} title="Show map">Map</a>
			{% endif %}
			{% if service != 'keepalived' %}
			<a href="/app/statsview.py?service={{service}}&serv={{s.2}}" class="ui-button ui-widget ui-corner-all" {{stats_id}} title="View {{service}} statistics">Stats</a>
			{% endif %}
			<a href="/app/logs.py?service={{service}}&serv={{s.2}}&rows=10&grep=&hour=00&minut=00&hour1=24&minut1=00" {{logs_id}} class="ui-button ui-widget ui-corner-all" title="View {{service}} logs">Logs</a>
			{% if role <= 2 %}
				<a href="/app/versions.py?service={{service}}&serv={{s.2}}&open=open" class="ui-button ui-widget ui-corner-all" {{versions_id}} title="View/Rollback to previous config">Versions</a>
			{% endif %}
			</div>
		</div>
		{% if serv %}
			<div id="bin_bout"></div>
			<div id="ajax-server-{{s.0}}" class="ajax-server"></div>
			<div class="div-server div-backends">
				<div class="server-name backends">
					{% if service == 'haproxy' %}
						Backends:
					{% elif service == 'keepalived' %}
						VRRP addresses:
					{% else %}
						Virtual hosts:
					{% endif %}
				</div>
				<div style="margin-top: 10px;" id="top-{{s.2}}"></div>
			</div>
		{% endif %}
	{% endfor %}
</div>
	{% if serv %}
	{% for s in servers %}
	{% if service in ('haproxy', 'nginx', 'apache') %}
		{% if (service == 'haproxy' and s.8.0.9)
			or (service == 'nginx' and s.8.0.21)
			or (service == 'apache' and s.8.0.27)  %}
		<div style="clear: both; width: 97%;">
			<div style="padding-left: 25px;float: left;margin-top: -15px;">
				<b>Time range:</b>
				<select title="Choose time range" id="time-range">
					<option value="30">30 minutes</option>
					<option value="60">1 hour</option>
					<option value="180">3 hours</option>
					<option value="360">6 hours</option>
					<option value="720">12 hours</option>
				</select>
			</div>
			<div id="refresh" style="text-align: right;margin-right: 3%;" title="Refresh metrics" onclick="showMetrics()">
				<span class="refresh"></span>
			</div>
		</div>
		{% endif %}
	{% endif %}
		 {% if service == 'haproxy' and s.8.0.9 %}
		<div id="server_metrics_div" class="chart-container_overview">
			<canvas id="{{s.2}}" role="img"></canvas>
		</div>
		<div class="chart-container_overview http_metrics_div">
			<canvas id="http_{{s.2}}" role="img"></canvas>
		</div>
		{% for waf_server in servers_waf %}
		{% if waf_server.server.ip == s.2 %}
		<div id="waf_metrics_div" class="chart-container_overview">
			<canvas id="waf_{{s.2}}" role="img"></canvas>
		</div>
		{% endif %}
		{% endfor %}
		{% elif service == 'nginx' and s.8.0.21 %}
		<div id="nginx_metrics_div" class="chart-container" style="display: block; width: 90%; height: 300px;">
			<canvas id="nginx_{{s.2}}" role="img"></canvas>
		</div>
		{% elif service == 'apache' and s.8.0.27 %}
		<div id="apache_metrics_div" class="chart-container" style="display: block; width: 90%; height: 300px;">
			<canvas id="apache_{{s.2}}" role="img"></canvas>
		</div>
		{% endif %}
	{% 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>
<div id="dialog-settings-service" style="display: none;"></div>
<script>
	{% if serv %}
		overviewHapserverBackends(ip, hostnamea, '{{service}}');
	{% endif %}
	showHapservers(ip, hostnamea, '{{service}}');
</script>
{% endblock %}