Make the admin-pane slightly useful

It's still not very good, but this doesn't have to be precision work.

2 files changed, 82 insertions, 2 deletions

diff --git a/web/index.html b/web/index.html
index 3569b3f..c6a8b43 100644
--- a/web/index.html
+++ b/web/index.html
@@ -97,7 +97,7 @@
 	<div id="navbar" class="navbar-collapse collapse">
 	  <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'><a href="#" onclick="nmsUi.setActive('admin');">Admin</a></li>
+	     <li id='admin-link'><a href="#" onclick="nmsUi.setActive('admin');nmsAdmin.updateConfigPane();">Admin</a></li>
 	    <li class="dropdown">
 	      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Menu
 		<span class="caret"></span>
@@ -155,7 +155,6 @@
 
     <div class="container-fluid" id="admin">
     <div class="row-fluid" id="admin-row">
-    Admin-stuff goes here.
     </div>
     </div>
     <div class="container-fluid" id="map">
@@ -326,6 +325,7 @@
     <script type="text/javascript" src="js/nms-color-util.js"></script>
     <script type="text/javascript" src="js/nms-map-handlers.js"></script>
     <script type="text/javascript" src="js/nms-ui.js"></script>
+    <script type="text/javascript" src="js/nms-admin-pane.js"></script>
     <script src="js/jquery.datetimepicker.full.js" type="text/javascript"></script>
     <script type="text/javascript">
 initNMS();
diff --git a/web/js/nms-admin-pane.js b/web/js/nms-admin-pane.js
new file mode 100644
index 0000000..9edf9f9
--- /dev/null
+++ b/web/js/nms-admin-pane.js
@@ -0,0 +1,80 @@
+"use strict";
+
+
+
+var nmsAdmin = nmsAdmin || {
+	_populated: false,
+	_elements: {},
+	_main: {
+		'shortname':"Short name", 
+		'publicvhost': "Public VHOST",
+		'data': "Misc data"
+	}
+};
+
+nmsAdmin._populatePane = function() {
+	var form = document.createElement("div");
+	form.classList.add("form-group");
+	for (var v in nmsAdmin._main) {
+		var x = document.createElement('label');
+		var y = document.createElement('input');
+		y.classList.add("form-control");
+		y.id = "nmsAdmin-input-" + v;
+		x.innerText = nmsAdmin._main[v];
+		x.htmlFor = y.id;
+		form.appendChild(x);
+		form.appendChild(y);
+		nmsAdmin._elements[v] = y;
+	}
+	var submit = document.createElement("button");
+	submit.classList.add("btn");
+	submit.classList.add("btn-default");
+	submit.onclick = nmsAdmin._commitData;
+	submit.innerHTML = "Save";
+	var topel = document.getElementById("admin-row");
+	topel.appendChild(form);
+	topel.appendChild(submit);
+	nmsAdmin._populated = true;
+}
+
+nmsAdmin._setReadOnly = function(ro) {
+	for (var v in nmsAdmin._main) {
+		nmsAdmin._elements[v].readOnly = ro;
+	}
+}
+
+nmsAdmin._commitData = function() {
+	var myData = {};
+	for (var v in nmsAdmin._main) {
+		if (v != "data") {
+			myData[v] = nmsAdmin._elements[v].value;
+		} else {
+			myData[v] = JSON.parse(nmsAdmin._elements[v].value);
+		}
+	}
+	myData = JSON.stringify(myData);
+	nmsAdmin._setReadOnly(true);
+	$.ajax({
+		type: "POST",
+		url: "/api/write/config",
+		dataType: "text",
+		data:myData,
+		success: function (data, textStatus, jqXHR) {
+			nmsData.invalidate("config");
+			nmsAdmin._setReadOnly(false);
+		}
+	});
+}
+
+nmsAdmin.updateConfigPane = function() {
+	if (nmsAdmin._populated == false) {
+		nmsAdmin._populatePane();
+	}
+	for (var v in nmsAdmin._main) {
+		if (v != "data") {
+			nmsAdmin._elements[v].value = nmsData['config']['config'][v];
+		} else {
+			nmsAdmin._elements[v].value = JSON.stringify(nmsData['config']['config'][v]);
+		}
+	}
+}