[roomplanner] Sanity checks/fixups when saving computers, more user feedback, smaller grid

6 files changed, 76 insertions, 11 deletions

diff --git a/modules-available/roomplanner/js/grid.js b/modules-available/roomplanner/js/grid.js
index 2ba1c7a1..2cca26cd 100644
--- a/modules-available/roomplanner/js/grid.js
+++ b/modules-available/roomplanner/js/grid.js
@@ -19,8 +19,8 @@ if (!roomplanner) var roomplanner = {
 			cellsep: 4,
 			scale: 100,
 			room: {
-				width: 1000,
-				height: 1000
+				width: 33,
+				height: 33
 			}
 		},
 		selectFromServer: selectMachine,
@@ -412,7 +412,7 @@ $(document).ready(function(){
 	roomplanner.slider = $('#scaleslider').slider({
 		orientation: "horizontal",
 		range: "min",
-		min: 50,
+		min: 40,
 		max: 150,
 		value: 100,
 		change: update,
diff --git a/modules-available/roomplanner/js/init.js b/modules-available/roomplanner/js/init.js
index 2ff45cee..67090cc2 100644
--- a/modules-available/roomplanner/js/init.js
+++ b/modules-available/roomplanner/js/init.js
@@ -2,8 +2,6 @@
 
 function initRoomplanner() {
 	
-	console.log('initRoomplanner');
-
 	$('#drawarea').css('top',(-roomplanner.settings.scale*10)+'px');
 	$('#drawarea').css('left',(-roomplanner.settings.scale*10)+'px');
 	
@@ -23,16 +21,27 @@ function initRoomplanner() {
 	});
 
 	$("#saveBtn").click(function() {
+		$('#saveBtn').prop('disabled', true);
+		$('#error-msg').hide();
+		$('#success-msg').hide();
+		$('#saving-msg').show();
+		var serializedCurrent = roomplanner.serialize();
 		$.post('?do=roomplanner&locationid=' + locationId,
-			{ token: TOKEN, action: 'save', serializedRoom: roomplanner.serialize() }
+			{ token: TOKEN, action: 'save', serializedRoom: serializedCurrent }
 		).done(function ( data ) {
 			if (data.indexOf('SUCCESS') !== -1) {
 				window.close();
+				// If window.close() failed, we give some feedback and remember the state as saved
+				$('#success-msg').show();
+				plannerLoadState = serializedCurrent;
 				return;
 			}
 			$('#error-msg').text('Error: ' + data).show();
 		}).fail(function () {
 			$('#error-msg').text('AJAX save call failed').show();
+		}).always(function() {
+			$('#saveBtn').prop('disabled', false);
+			$('#saving-msg').hide();
 		});
 	});
 	
diff --git a/modules-available/roomplanner/lang/de/template-tags.json b/modules-available/roomplanner/lang/de/template-tags.json
index bd7b3ce2..42da4a56 100644
--- a/modules-available/roomplanner/lang/de/template-tags.json
+++ b/modules-available/roomplanner/lang/de/template-tags.json
@@ -18,6 +18,7 @@
     "lang_classroomtable": "Klassenzimmertisch",
     "lang_coatrack": "Garderobe",
     "lang_conferencetable": "Konferenztisch",
+    "lang_confirmDiscardChanges": "Wollen Sie alle \u00c4nderungen verwerfen?",
     "lang_couch": "Couch",
     "lang_descriptionBySearch": "Hier k\u00f6nnen aus der Liste aller bekannter Rechner suchen.",
     "lang_descriptionBySubnet": "Hier sehen Sie Computer, die sich in den zum Raum geh\u00f6renden Subnetzen befinden.",
@@ -31,6 +32,8 @@
     "lang_locker": "Schlie\u00dffach",
     "lang_papertray": "Papierkorb",
     "lang_photocopier": "Kopierer",
+    "lang_planBeingSaved": "Der Raumplan wird gespeichert...",
+    "lang_planSuccessfullySaved": "Plan erfolgreich gespeichert!",
     "lang_plant": "Pflanze",
     "lang_podium": "Podium",
     "lang_printer": "Drucker",
diff --git a/modules-available/roomplanner/lang/en/template-tags.json b/modules-available/roomplanner/lang/en/template-tags.json
index 5dac56a8..5022ad06 100644
--- a/modules-available/roomplanner/lang/en/template-tags.json
+++ b/modules-available/roomplanner/lang/en/template-tags.json
@@ -18,6 +18,7 @@
     "lang_classroomtable": "classroom table",
     "lang_coatrack": "coatrack",
     "lang_conferencetable": "conference table",
+    "lang_confirmDiscardChanges": "Do you want to discard all changes?",
     "lang_couch": "couch",
     "lang_descriptionBySearch": "Select a computer from a list of all known computers here.",
     "lang_descriptionBySubnet": "Select a computer from a related subnet.",
@@ -31,6 +32,8 @@
     "lang_locker": "locker",
     "lang_papertray": "papertray",
     "lang_photocopier": "photocopier",
+    "lang_planBeingSaved": "Saving room layout",
+    "lang_planSuccessfullySaved": "Layout successfully saved!",
     "lang_plant": "plant",
     "lang_podium": "podium",
     "lang_printer": "printer",
diff --git a/modules-available/roomplanner/page.inc.php b/modules-available/roomplanner/page.inc.php
index 9064b848..7043f054 100644
--- a/modules-available/roomplanner/page.inc.php
+++ b/modules-available/roomplanner/page.inc.php
@@ -42,7 +42,7 @@ class Page_Roomplanner extends Page
 			Util::redirect('?do=locations');
 		}
 		if ($this->location === false) {
-			Message::addError('invalid-locationid');
+			Message::addError('locations.invalid-location-id', $this->locationid);
 			Util::redirect('?do=locations');
 		}
 
@@ -135,6 +135,15 @@ class Page_Roomplanner extends Page
 		$this->saveComputerConfig($config['computers'], $machinesOnPlan);
 	}
 
+	private function sanitizeNumber(&$number, $lower, $upper)
+	{
+		if (!is_numeric($number) || $number < $lower) {
+			$number = $lower;
+		} elseif ($number > $upper) {
+			$number = $upper;
+		}
+	}
+
 	protected function saveComputerConfig($computers, $oldComputers)
 	{
 
@@ -148,6 +157,22 @@ class Page_Roomplanner extends Page
 		foreach ($computers as $computer) {
 			$newUuids[] = $computer['muuid'];
 
+			// Fix/sanitize properties
+			// TODO: The list of items, computers, etc. in general is copied and pasted in multiple places. We need a central definition with generators for the various formats we need it in
+			if (!isset($computer['itemlook']) || !in_array($computer['itemlook'], ['pc-north', 'pc-south', 'pc-west', 'pc-east', 'copier', 'telephone'])) {
+				$computer['itemlook'] = 'pc-north';
+			}
+			if (!isset($computer['gridRow'])) {
+				$computer['gridRow'] = 0;
+			} else {
+				$this->sanitizeNumber($computer['gridRow'], 0, 32 * 4);
+			}
+			if (!isset($computer['gridCol'])) {
+				$computer['gridCol'] = 0;
+			} else {
+				$this->sanitizeNumber($computer['gridCol'], 0, 32 * 4);
+			}
+
 			$position = json_encode(['gridRow' => $computer['gridRow'],
 				'gridCol' => $computer['gridCol'],
 				'itemlook' => $computer['itemlook']]);
diff --git a/modules-available/roomplanner/templates/page.html b/modules-available/roomplanner/templates/page.html
index 47146875..f4487ad2 100644
--- a/modules-available/roomplanner/templates/page.html
+++ b/modules-available/roomplanner/templates/page.html
@@ -45,6 +45,8 @@
 <h1>{{lang_roomplanner}} – {{location.locationname}}</h1>
 
 <div class="alert alert-danger" style="display:none" id="error-msg"></div>
+<div class="alert alert-success" style="display:none" id="success-msg">{{lang_planSuccessfullySaved}}</div>
+<div class="alert alert-info" style="display:none" id="saving-msg">{{lang_planBeingSaved}}</div>
 
 	<div id="toolpanel" class="panel panel-default" style="z-index:200;">
 		<div class="panel-body">
@@ -120,13 +122,13 @@
 							<div itemtype="pc" itemlook="pc-south" class="draggable" obstacle=true style="width:100px; height:100px;" data-height="100" data-width="100" title="PC" noresize=1></div>
 						</li>
 						<li>
-							<div itemtype="pc" itemlook="copier" class="draggable" obstacle=true style="width:200px; height:100px;" data-height="100" data-width="200" title="{{lang_photocopier}}" noresize=1></div>
+							<div itemtype="pc" itemlook="copier" class="draggable" obstacle=true style="width:100px; height:100px;" data-height="100" data-width="100" title="{{lang_photocopier}}" noresize=1></div>
 						</li>
 						<li>
 							<div itemtype="pc" itemlook="printer" class="draggable" obstacle=true style="width:100px; height:100px;" data-height="100" data-width="100" title="{{lang_printer}}" noresize=1></div>
 						</li>
 						<li>
-							<div itemtype="pc" itemlook="telephone" class="draggable" obstacle=true style="width:50px; height:50px;" data-height="50" data-width="50" title="{{lang_telephone}}" noresize=1></div>
+							<div itemtype="pc" itemlook="telephone" class="draggable" obstacle=true style="width:100px; height:100px;" data-height="100" data-width="100" title="{{lang_telephone}}" noresize=1></div>
 						</li>
 					</ul>
 				</div>
@@ -308,12 +310,20 @@
 
 	</div>
 
-	<button id="saveBtn" class="btn btn-success">Save</button>
+<div class="pull-left">
+
+</div>
+<div class="pull-right">
+	<button class="btn btn-default" onclick="triggerCancel()">{{lang_cancel}}</button>
+	<button id="saveBtn" class="btn btn-primary">{{lang_save}}</button>
+</div>
+<div class="clearfix"></div>
 
 
 <script type="application/javascript"><!--
 var locationId = '{{locationid}}';
 var subnetMachines, roomConfiguration;
+var plannerLoadState = 'invalid';
 document.addEventListener("DOMContentLoaded", function () {
 
 	subnetMachines = {{{subnetMachines}}};
@@ -329,9 +339,24 @@ document.addEventListener("DOMContentLoaded", function () {
 	).done(function() {
 		$.getScript("modules/roomplanner/js/init.js", function() {
 			initRoomplanner();
-			roomplanner.load(roomConfiguration); // TODO: Filter invalid PCs, they're currently invisible and cannot be removed
+			loadRoom();
 		});
 	});
 });
 
+function loadRoom() {
+	roomplanner.load(roomConfiguration); // TODO: Filter invalid PCs, they're currently invisible and cannot be removed
+	plannerLoadState = roomplanner.serialize();
+}
+
+function triggerCancel() {
+	if (roomplanner.serialize() !== plannerLoadState) {
+		if (!confirm('{{lang_confirmDiscardChanges}}'))
+			return;
+	}
+	window.close();
+	// In case this page wasn't opened via JS, it will not close on modern browsers, so let's reset
+	loadRoom();
+}
+
 // --></script>