[locationinfo] Reworked summary-panel to the new panel uuid stuff.

author: Jannik Schönartz 2017-11-30 12:59:49 +0100
committer: Jannik Schönartz 2017-11-30 12:59:49 +0100
commit: e88a313149cb39e187baf74a2fc18cc7c5d86d81 (patch)
tree: f2019cc85e1ff50d0708cb4828357b2d7e6f1d7a /modules-available/locationinfo/templates
parent: [inc/Database] Do EXPLAIN SELECT at shutdown so we don't interfere with SQL_C... (diff)
download: slx-admin-e88a313149cb39e187baf74a2fc18cc7c5d86d81.tar.gz
slx-admin-e88a313149cb39e187baf74a2fc18cc7c5d86d81.tar.xz
slx-admin-e88a313149cb39e187baf74a2fc18cc7c5d86d81.zip
2 files changed, 235 insertions, 16 deletions
diff --git a/modules-available/locationinfo/templates/frontend-summary.html b/modules-available/locationinfo/templates/frontend-summary.html
index dd5fc25d..e117cbcb 100644
--- a/modules-available/locationinfo/templates/frontend-summary.html
+++ b/modules-available/locationinfo/templates/frontend-summary.html
@@ -2,7 +2,8 @@
 <html lang="de">
 <meta name="viewport" content="width=device-width, initial-scale=1.0" charset="utf-8">
 <head>
-	<script type='text/javascript' src='../../../script/jquery.js'></script>
+	<script type='text/javascript' src='{{dirprefix}}script/jquery.js'></script>
+
 
 	<style type='text/css'>
 		body {
@@ -106,7 +107,7 @@
 		var rooms = {};
 		var startdate;
 		var roomidsString = "";
-
+		var config = {{{config}}};
 
 		$(document).ready(function () {
 			//temp
@@ -115,13 +116,17 @@
 		});
 
 		function init() {
-			var ids = getUrlParameter("id");
+			// var ids = getUrlParameter("id");
+
+			/*
 			$.getJSON("../../../api.php?do=locationinfo&action=locationtree&id=" + ids, function (result) {
 				generateLayout(result);
 
 				setTimeout(update, 1000);
 			});
-
+			*/
+			generateLayout(config.tree);
+			update();
 		}
 
 		function SetUpDate(d) {
@@ -140,7 +145,7 @@
 		}
 
 		/**
-		 * generates the divs, decidecs if parent or child
+		 * generates the divs, decides if parent or child
 		 * @param json Room tree json
 		 * @param myParent parent div
 		 * @param outermost if the object is a root node
@@ -183,13 +188,16 @@
 			var rommUpdateIds = "";
 			var count = 0;
 			var nextUpdate = 15000;
+			// TODO: Only query a few rooms is not possible with the new api stuff ...
 			for (var property in rooms) {
 				if (rooms[property].lastCalendarUpdate === null || rooms[property].lastCalendarUpdate + CALUPDATE_MS < MyDate().getTime()) {
+					// TODO: NOT NECESSARY ANYMORE?!
 					calendarUpdateIds = addIdToUpdateList(calendarUpdateIds, rooms[property].id);
 					count++;
 					rooms[property].lastCalendarUpdate = MyDate().getTime();
 				}
 				if (rooms[property].lastRoomUpdate === null || rooms[property].lastRoomUpdate + ROOMUPDATE_MS < MyDate().getTime()) {
+					// TODO: NOT NECESSARY ANYMORE?!
 					rommUpdateIds = addIdToUpdateList(rommUpdateIds, rooms[property].id);
 					count++;
 					rooms[property].lastRoomUpdate = MyDate().getTime();
@@ -197,11 +205,11 @@
 				if (count > 7) break;
 			}
 			if (calendarUpdateIds !== "") {
-				queryCalendars(calendarUpdateIds);
+				queryCalendars();
 				nextUpdate = 1000;
 			}
 			if (rommUpdateIds !== "") {
-				queryRooms(rommUpdateIds);
+				queryRooms();
 				nextUpdate = 1000;
 			}
 			for (var property in rooms) {
@@ -214,6 +222,9 @@
 		function UpdateTimeTables(json) {
 			var l = json.length;
 			for (var i = 0; i < l; i++) {
+				if (rooms[json[i].id] == null) {
+					continue;
+				}
 				rooms[json[i].id].timetable = json[i].calendar;
 				for (var property in rooms[json[i].id].timetable) {
 					rooms[json[i].id].timetable[property].start = new Date(rooms[json[i].id].timetable[property].start);
@@ -225,11 +236,11 @@
 
 		/**
 		 * Querys Pc states
-		 * @param ids Room ID's which should be queried. Format for e.g.: "20,5,6"
+		 * Room are queried with the {{uuid}} of the panel.
 		 */
-		function queryRooms(ids) {
+		function queryRooms() {
 			$.ajax({
-				url: "../../../api.php?do=locationinfo&action=pcstates&id=" + ids,
+				url: "{{dirprefix}}api.php?do=locationinfo&get=pcstates&uuid={{uuid}}",
 				dataType: 'json',
 				cache: false,
 				timeout: 30000,
@@ -241,6 +252,7 @@
 						return;
 					}
 					updatePcStates(result);
+
 				}, error: function () {
 
 				}
@@ -526,7 +538,7 @@
 		 * @param broken PC's that are broken
 		 */
 		function updateRoomUsage(id, idle, occupied, off, broken) {
-			if (idle == 0 && occupied == 0 && off == 0) {
+			if (idle == 0 && occupied == 0 && off == 0 && broken == 0) {
 				$('#parent_' + id).parent().hide();
 				return;
 			}
@@ -634,10 +646,11 @@
 
 		/**
 		 * querys the Calendar data
-		 * @param ids ID'S of rooms to query as string, for e.g.: "5,17,8" or "5"
+		 * Calender is queried with the {{uuid}} of the panel.
+		 * api.inc.php / page.inc.php is getting the ids with the panel uuid.
 		 */
-		function queryCalendars(ids) {
-			var url = "../../../api.php?do=locationinfo&action=calendar&id=" + ids;
+		function queryCalendars() {
+			var url = "{{dirprefix}}api.php?do=locationinfo&get=calendar&uuid={{uuid}}";
 
 			// Todo reimplement Frontend methode if needed
 			/*
@@ -652,8 +665,6 @@
 				timeout: 30000,
 				success: function (result) {
 					UpdateTimeTables(result);
-
-
 				}, error: function () {
 
 				}
diff --git a/modules-available/locationinfo/templates/page-config-panel-summary.html b/modules-available/locationinfo/templates/page-config-panel-summary.html
new file mode 100644
index 00000000..2a968fc2
--- /dev/null
+++ b/modules-available/locationinfo/templates/page-config-panel-summary.html
@@ -0,0 +1,208 @@
+<h2>
+	{{#new}}{{lang_createPanel}}{{/new}}
+	{{^new}}{{lang_editPanel}}{{/new}}
+</h2>
+
+<p>{{lang_editSummaryPanelHints}}</p>
+
+<form method="post" action="?do=locationinfo" id="config-form">
+	<input type="hidden" name="token" value="{{token}}">
+	<input type="hidden" name="action" value="writePanelConfig">
+	<input type="hidden" name="ptype" value="SUMMARY">
+	<input type="hidden" name="uuid" value="{{uuid}}">
+
+	<div class="row">
+
+		<div class="col-md-6">
+			<div class="modify-inputs panel panel-default">
+				<div class="panel-heading">{{lang_display}}</div>
+				<div class="panel-body">
+					<div class="list-group">
+
+						<div class="list-group-item">
+							<div class="row">
+								<div class="col-sm-3">
+									<label for="panel-title">{{lang_displayName}}</label>
+								</div>
+								<div class="col-sm-7">
+									<input class="form-control" name="name" id="panel-title" type="text" value="{{panelname}}">
+								</div>
+								<div class="col-sm-2">
+									<a class="btn btn-default helptext" title="{{lang_displayNameTooltip}}">
+										<span class="glyphicon glyphicon-question-sign"></span>
+									</a>
+								</div>
+							</div>
+						</div>
+
+						<div class="list-group-item">
+							<div class="row">
+								<div class="col-sm-3">
+									<label for="language">{{lang_language}}</label>
+								</div>
+								<div class="col-sm-7">
+									<select class="form-control" name="language" id="language">
+										{{#languages}}
+										<option value="{{cc}}" id="lang-{{cc}}" {{selected}}>{{name}}</option>
+										{{/languages}}
+									</select>
+								</div>
+								<div class="col-sm-2">
+									<a class="btn btn-default helptext" title="{{lang_languageTooltip}}">
+										<span class="glyphicon glyphicon-question-sign"></span>
+									</a>
+								</div>
+							</div>
+						</div>
+
+						<div class="list-group-item">
+							<div class="row">
+								<div class="col-sm-3">
+									<label for="input-eco">{{lang_ecoMode}}</label>
+								</div>
+								<div class="col-sm-7">
+									<input id="input-eco" type="checkbox" name="eco" {{eco_checked}}>
+								</div>
+								<div class="col-sm-2">
+									<a class="btn btn-default helptext" title="{{lang_ecoTooltip}}">
+										<span class="glyphicon glyphicon-question-sign"></span>
+									</a>
+								</div>
+							</div>
+						</div>
+<!--
+						<div class="list-group-item">
+							<div class="row">
+								<div class="col-sm-3">
+									<label for="input-prettytime">{{lang_prettytime}}</label>
+								</div>
+								<div class="col-sm-7">
+									<input id="input-prettytime" type="checkbox" name="prettytime" {{prettytime_checked}}>
+								</div>
+								<div class="col-sm-2">
+									<a class="btn btn-default helptext" title="{{lang_prettytimeTooltip}}">
+										<span class="glyphicon glyphicon-question-sign"></span>
+									</a>
+								</div>
+							</div>
+						</div>
+-->
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+
+	<div class="modify-inputs">
+		<div class="row">
+
+			<div class="col-md-6">
+				<div class="panel panel-default">
+					<div class="panel-heading">{{lang_locations}}</div>
+					<div class="panel-body">
+						<input type="hidden" name="locationids" value="{{locationids}}" id="locationids">
+						<p>{{lang_fourLocsHint}}</p>
+						<ul id="selected-locations" class="list-unstyled">
+
+						</ul>
+						<div class="dropdown pull-right">
+							<button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">
+								<span class="glyphicon glyphicon-plus"></span>
+							</button>
+							<ul class="dropdown-menu" id="location-list">
+								{{#locations}}
+								<li><a href="#" data-lid="{{locationid}}">{{locationpad}} <span class="name">{{locationname}}</span></a></li>
+								{{/locations}}
+							</ul>
+						</div>
+						<div class="clearfix"></div>
+					</div>
+				</div>
+			</div>
+
+		</div>
+	</div>
+	<button type="submit" class="btn btn-primary">{{lang_save}}</button>
+	<a href="?do=locationinfo&amp;show=panels" class="btn btn-default">{{lang_cancel}}</a>
+</form>
+
+<div class="modal fade" id="no-locations-message" tabindex="-1" role="dialog">
+	<div class="modal-dialog"> <!--style="min-width:600px;width:70%"-->
+
+		<div class="modal-content">
+			<div class="modal-header">{{lang_error}}</div>
+			<div class="modal-body">
+				{{lang_noLocationsWarning}}
+			</div>
+			<div class="modal-footer">
+				<a class="btn btn-primary pull-right" data-dismiss="modal">{{lang_close}}</a>
+				<div class="clearfix"></div>
+			</div>
+		</div>
+
+	</div>
+</div>
+
+<script type="text/javascript"><!--
+
+document.addEventListener("DOMContentLoaded", function () {
+	var $selLocs = $('#selected-locations');
+	var $locList = $('#location-list');
+	var $locInput = $('#locationids');
+
+	// Initialize fancy tooltips
+	$('a.helptext').tooltip();
+	// Add listener to range sliders so their label can be updated
+	$('input[type="range"]').change(function () {
+		$(this).siblings().find('.range-display').text($(this).val());
+	});
+	// Set state of input controls that aren't statically initialized server side
+	$('.modify-inputs input[type="checkbox"]')
+		.bootstrapSwitch({size: 'small'});
+
+	var lids = $locInput.val().split(',');
+	$selLocs.empty();
+	for (var i = 0; i < lids.length; ++i) {
+		var $name = $locList.find('a[data-lid="' + lids[i] + '"] .name');
+		if ($name.length === 0) continue;
+		addLocation(lids[i], $name.text());
+	}
+
+	// Adding/removing locations
+	$locList.find('a').click(function(ev) {
+		ev.preventDefault();
+		var $this = $(this);
+		var name = $this.find('.name').text();
+		var id = $this.data('lid');
+		addLocation(id, name);
+		serializeLocs();
+	});
+
+	$('#config-form').submit(function(ev) {
+		if ($locInput.val().length > 0)
+			return;
+		ev.preventDefault();
+		$('#no-locations-message').modal('show');
+	});
+
+	function addLocation(id, name) {
+		$selLocs.find('li[data-lid="' + id + '"]').remove();
+		var delButton = $('<button class="btn btn-danger btn-xs" type="button">').append($('<span class="glyphicon glyphicon-remove">')).click(delParent);
+		$selLocs.append($('<li>').attr('data-lid', id).text(name).prepend(delButton));
+	}
+
+	function delParent() {
+		$(this).parent().remove();
+		serializeLocs();
+	}
+
+	function serializeLocs() {
+		var res = $selLocs.find('li[data-lid]').map( function() {
+			return $(this).data('lid');
+		}).get().join(',');
+		$locInput.val(res);
+	}
+
+});
+
+//--></script>
author	Jannik Schönartz	2017-11-30 12:59:49 +0100
committer	Jannik Schönartz	2017-11-30 12:59:49 +0100
commit	e88a313149cb39e187baf74a2fc18cc7c5d86d81 (patch)
tree	f2019cc85e1ff50d0708cb4828357b2d7e6f1d7a /modules-available/locationinfo/templates
parent	[inc/Database] Do EXPLAIN SELECT at shutdown so we don't interfere with SQL_C... (diff)
download	slx-admin-e88a313149cb39e187baf74a2fc18cc7c5d86d81.tar.gz slx-admin-e88a313149cb39e187baf74a2fc18cc7c5d86d81.tar.xz slx-admin-e88a313149cb39e187baf74a2fc18cc7c5d86d81.zip