haproxy-wi/app/templates/config.html

{% extends "base.html" %}
{% block content %}
<link rel="stylesheet" href="/inc/codemirror/lib/codemirror.css">
<link rel="stylesheet" href="/inc/codemirror/addon/dialog/dialog.css">
<link rel="stylesheet" href="/inc/codemirror/addon/fold/foldgutter.css">
<script src="/inc/codemirror/lib/codemirror.js"></script>
<script src="/inc/codemirror/addon/search/search.js"></script>
<script src="/inc/codemirror/addon/search/searchcursor.js"></script>
<script src="/inc/codemirror/addon/search/jump-to-line.js"></script>
<script src="/inc/codemirror/addon/search/matchesonscrollbar.js"></script>
<script src="/inc/codemirror/addon/search/match-highlighter.js"></script>
<script src="/inc/codemirror/addon/dialog/dialog.js"></script>
<script src="/inc/codemirror/addon/edit/matchbrackets.js"></script>
<script src="/inc/codemirror/addon/edit/closebrackets.js"></script>
<script src="/inc/codemirror/addon/comment/comment.js"></script>
<script src="/inc/codemirror/addon/wrap/hardwrap.js"></script>
<script src="/inc/codemirror/addon/fold/foldcode.js"></script>
<script src="/inc/codemirror/addon/fold/foldgutter.js"></script>
<script src="/inc/codemirror/addon/fold/brace-fold.js"></script>
<script src="/inc/codemirror/addon/fold/comment-fold.js"></script>
<script src="/inc/codemirror/addon/scroll/annotatescrollbar.js"></script>
<script src="/inc/codemirror/mode/nginx.js"></script>
<script src="/inc/codemirror/mode/haproxy.js"></script>
<script src="/inc/codemirror/keymap/sublime.js"></script>
<script src="/inc/configshow.js"></script>
{% if is_serv_protected and role > 2 %}
<meta http-equiv="refresh" content="0; url=/app/hapservers.py?service={{service}}">
{% else %}
<center>
	{% if selects|length == 0 %}
		{% include 'include/getstarted.html' %}
	{% else %}
	<p>
		<form action="{{ action }}" method="post">
			<input type="hidden" id="service" value="{{service|default('haproxy', true)}}" />
			{% include 'include/select.html' %}
			{% if service == 'nginx' or service == 'apache' %}
			<a class="ui-button ui-widget ui-corner-all" title="Show running config" onclick="showConfigFiles()">Open</a>
			{% else %}
			<a class="ui-button ui-widget ui-corner-all" title="Show running config" onclick="showConfig()">Open</a>
			{% endif %}
			{% if service != 'keepalived' and service != 'apache' %}
				<a class="ui-button ui-widget ui-corner-all" title="View stat" onclick="openStats()">Stat</a>
			{% endif %}
			{% if service != 'keepalived' and service != 'nginx' and service != 'apache' %}
				<a class="ui-button ui-widget ui-corner-all" title="Show map" onclick="showMap()">Map</a>	
			{% endif %}
				<a class="ui-button ui-widget ui-corner-all" title="Compare configs" onclick="showCompareConfigs()">Compare</a>
			{% if role <= 3 %}
				<a class="ui-button ui-widget ui-corner-all" title="Show versions" onclick="openVersions()">Versions</a>
			{% endif %}
			{% if role <= 2 %}
				<a href="/app/servers.py#backup" class="ui-button ui-widget ui-corner-all" title="Git">Git</a>
			{% endif %}
		</form>
	</p>
	<div id="ajax-config_file_name"></div>
	{% endif %}

	{% if stderr or error %}
		{% include 'include/errors.html' %}
	{% endif %}

	{% if config %}
		{% if role <= 3 %}
			<h4>Config {% if config_file_name != 'undefined' %}{{config_file_name.replace('92', '/')}}{%endif%} from {{ serv }}</h4>
			</center>
			<form action="config.py" name="saveconfig" id="saveconfig" method="post">
				<input type="hidden" value="{{ serv }}" name="serv">
				<input type="hidden" value="{{ cfg }}.old" name="oldconfig">
				<input type="hidden" value="{{ token }}" name="token">
				<input type="hidden" value="{{ service }}" name="service">
				<input type="hidden" value="{{ config_file_name }}" name="config_file_name">
				<div style="margin-left: 23%;width: 60%;">
					<textarea name="config" id="config_text_area" class="config" rows="35" cols="100">{{ config }}</textarea>
				</div>
				<p>
					<center>
						<a href="config.py?service={{service}}&serv={{serv}}&showConfig" class="ui-button ui-widget ui-corner-all" title="Return to configuration view">Back</a>
						{% if service != 'keepalived' %}
							<button type="submit" value="test" name="save" class="btn btn-default" title="Check config without saving the config">Check config</button>
						{% endif %}
						<button type="submit" value="save" name="save" class="btn btn-default" title="Save config without reloading the service">Save</button>
						{% if is_restart|int == 0 %}
						<button type="submit" value="" name="" class="btn btn-default">Save and restart</button>
						{% endif %}
						<button type="submit" value="reload" name="save" class="btn btn-default">Save and reload</button>
						{% if service != 'keepalived' %}
						<div class="alert alert-info alert-two-rows"><b>Note:</b> When reconfiguring the master server, the slave will be reconfigured automatically</div>
						{% endif %}
					</center>
				</p>
			</form>
		{% endif %}
	{% endif %}
	</center>
<script> 
	if (cur_url[1].split('&')[2] == 'showMap') {
		showMap();
	}
	if (cur_url[1].split('&')[1] == 'showCompare' || cur_url[1].split('&')[2] == 'showCompare') {
		showCompareConfigs();
	}
	if (cur_url[1].split('&')[2] == 'showConfig') {
		showConfig();
	}
	if (cur_url[1].split('&')[2] == 'showConfigFiles') {
		showConfigFiles();
	}
	if (cur_url[1].split('&')[3].split('=')[0] == 'findInConfig') {
		var words = findGetParameter('findInConfig');
		waitForElm('#finding_words_from').then((elm) => {
			$('#find_p').show();
			$('#words').val(words);
			findInConfig(words);
		});
	}
	if (cur_url[1].split('&')[3].split('=')[0] == 'config_file_name') {
		showConfigFilesForEditing();
	}
	if (cur_url[1].split('&')[0] == 'service=haproxy' || cur_url[1].split('&')[0] == 'service=None') {
		var myCodeMirror = CodeMirror.fromTextArea(document.getElementById("config_text_area"),
				{
					mode: "haproxy",
					lineNumbers: true,
					lineWrapping: true,
					autocapitalize: true,
					autocorrect: true,
					spellcheck: true,
					autoCloseBrackets: true,
					keyMap: "sublime",
					matchBrackets: true,
					foldGutter: true,
					showCursorWhenSelecting: true,
    				gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter", "breakpoints"],
					highlightSelectionMatches: {showToken: /\w/, annotateScrollbar: true}
				});
	} else {
		var myCodeMirror = CodeMirror.fromTextArea(document.getElementById("config_text_area"),
				{
					mode: "nginx",
					lineNumbers: true,
					lineWrapping: true,
					autocapitalize: true,
					autocorrect: true,
					spellcheck: true,
					autoCloseBrackets: true,
					keyMap: "sublime",
					matchBrackets: true,
					foldGutter: true,
					showCursorWhenSelecting: true,
    				gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter", "breakpoints"],
					highlightSelectionMatches: {showToken: /\w/, annotateScrollbar: true}
				});
	}
	myCodeMirror.on("gutterClick", function(cm, n) {
		var info = cm.lineInfo(n);
		cm.setGutterMarker(n, "breakpoints", info.gutterMarkers ? null : makeMarker());
	});

	function makeMarker() {
		var marker = document.createElement("div");
		marker.style.color = "#822";
		marker.innerHTML = "●";
		return marker;
	}
</script>
<style>
.CodeMirror {
  	line-height: 1.2em;
  	height: 70%;
}
</style>
<script>
	myCodeMirror.refresh();
	$(document).bind('keydown', 'ctrl+s', function (){
		$("[type='submit'][value='save']").click();
	});
	$(document).bind('keydown', 'ctrl+d', function (){
		$("[type='submit'][value='test']").click();
	});
	$(document).bind('keydown', 'ctrl+e', function (){
		$("[type='submit'][value='reload']").click();
	});
	{% if is_restart|int == 0 %}
	$(document).bind('keydown', 'ctrl+r', function (){
		$("[type='submit'][value='restart']").click();
	});
	{% endif %}
</script>
{% endif %}
{% endblock %}