From fef5855bd63d8c7033e2d2d48e2d478d3f632580 Mon Sep 17 00:00:00 2001
From: Kristian Lyngstol <kristian@bohemians.org>
Date: Mon, 14 Nov 2016 17:13:52 +0100
Subject: Provide basic UI for template-testing

Still leaves a lot to be desired, but is a good start.

References #151
---
 web/css/nms.css        |  2 +-
 web/index.html         | 11 +++++++++++
 web/js/nms-template.js | 37 +++++++++++++++++++++++++++++++++++++
 web/js/nms.js          |  4 ++--
 4 files changed, 51 insertions(+), 3 deletions(-)
 create mode 100644 web/js/nms-template.js

(limited to 'web')

diff --git a/web/css/nms.css b/web/css/nms.css
index d10dd81..17f4ff9 100644
--- a/web/css/nms.css
+++ b/web/css/nms.css
@@ -73,7 +73,7 @@ div.map-mode-legend {
 	right: 15px;
 	z-index: 999;
 }
-#admin, #oplog {
+#admin, #oplog, #template {
 	display: none;
 }
 .vertical div.map-mode-legend {
diff --git a/web/index.html b/web/index.html
index d518baf..dd0e7c4 100644
--- a/web/index.html
+++ b/web/index.html
@@ -39,6 +39,7 @@
 	  <ul class="nav navbar-nav">
 	     <li id='map-link' class="active"><a href="#" onclick="nmsUi.setActive('map');">Map<span class="sr-only">(current)</span></a></li>
 	     <li id='admin-link' class="gondul-is-private"><a href="#" onclick="nmsUi.setActive('admin');nmsAdmin.updateConfigPane();">Admin</a></li>
+	     <li id='template-link' class="gondul-is-private"><a href="#" onclick="nmsUi.setActive('template');">Templates</a></li>
 	     <li id='oplog-link' class="gondul-is-private"><a href="#" onclick="nmsUi.setActive('oplog');">Oplog</a></li>
 	    <li class="dropdown">
 	      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Menu
@@ -134,6 +135,15 @@
 	</div>
       </div>
     </div>
+    <div class="container-fluid" id="template">
+      <div class="row-fluid" id="template-row">
+	<div id="template-parent" class="template">
+		<textarea id="template-input" cols="80" rows="25"></textarea>
+		<button onclick="nmsTemplate.test()">Test</button>
+		<textarea id="template-output" disabled cols="80" rows="25"></textarea>
+	</div>
+      </div>
+    </div>
     <div class="container-fluid" id="map">
       <div class="row-fluid">
 	<div class="span12">
@@ -309,6 +319,7 @@
     <script type="text/javascript" src="js/nms-search.js"></script>
     <script type="text/javascript" src="js/nms-time.js"></script>
     <script type="text/javascript" src="js/nms-dhcp.js"></script>
+    <script type="text/javascript" src="js/nms-template.js"></script>
     <script src="js/jquery.datetimepicker.full.js" type="text/javascript"></script>
     <script type="text/javascript">
 	initNMS();
diff --git a/web/js/nms-template.js b/web/js/nms-template.js
new file mode 100644
index 0000000..cad92b0
--- /dev/null
+++ b/web/js/nms-template.js
@@ -0,0 +1,37 @@
+"use strict";
+
+var nmsTemplate = nmsTemplate || {
+
+}
+
+nmsTemplate.test = function() {
+	var input = document.getElementById("template-input");
+	var output = document.getElementById("template-output");
+	$.ajax({
+		type: "POST",
+		url: "/api/templates/test",
+		async: false,
+		data: input.value,
+		dataType: "text",
+		success: function (indata, textStatus, jqXHR) {
+			var output = document.getElementById("template-output");
+			output.value = indata;
+		}
+	});
+}
+
+nmsTemplate.fromFile = function(template) {
+	var input = document.getElementById("template-input");
+	var output = document.getElementById("template-output");
+	$.ajax({
+		type: "GET",
+		url: "/templates/" + template,
+		async: false,
+		data: input.value,
+		dataType: "text",
+		success: function (indata, textStatus, jqXHR) {
+			var output = document.getElementById("template-input");
+			output.value = indata;
+		}
+	});
+}
diff --git a/web/js/nms.js b/web/js/nms.js
index 30fb8ff..362aebc 100644
--- a/web/js/nms.js
+++ b/web/js/nms.js
@@ -518,7 +518,7 @@ function moveTimeFromKey(e,key)
 
 function keyPressed(e)
 {
-	if (e.target.nodeName == "INPUT") {
+	if (e.target.nodeName == "INPUT" || e.target.nodeName == "TEXTAREA") {
 		return false;
 	}
 	if(e.key) {
@@ -624,7 +624,7 @@ function restoreSettings()
  */
 function nmsUpdateNavbarGraph() {
 	var img = document.getElementById("navbar-graph");
-	var w = Math.floor(window.innerWidth / 3);
+	var w = Math.floor(window.innerWidth / 4);
 	if (window.innerWidth > 2300)
 		w += 400;
 	
-- 
cgit v1.2.3