[roomplanner] Add permissions

5 files changed, 440 insertions, 369 deletions

diff --git a/modules-available/roomplanner/templates/footer.html b/modules-available/roomplanner/templates/footer.html
new file mode 100644
index 00000000..6e4e0783
--- /dev/null
+++ b/modules-available/roomplanner/templates/footer.html
@@ -0,0 +1,59 @@
+<div class="pull-left">
+	<div class="input-group" style="width:1px">
+		<div class="input-group-addon">{{lang_managerIp}}</div>
+		<input class="form-control" type="text" id="manager-ip" value="{{managerip}}" placeholder="1.2.3.4"
+				 style="width:120px" {{edit_disabled}}>
+		<div class="input-group-addon checkbox">
+			<input id="dedi-mgr" type="checkbox" {{dediMgrChecked}} {{edit_disabled}}>
+			<label for="dedi-mgr">{{lang_dedicatedManager}}</label>
+		</div>
+	</div>
+</div>
+<div class="pull-right">
+	<button class="btn btn-default" onclick="triggerCancel()">{{lang_cancel}}</button>
+	<button id="saveBtn" class="btn btn-primary" {{edit_disabled}}>{{lang_save}}</button>
+</div>
+<div class="clearfix"></div>
+
+
+<script type="application/javascript"><!--
+var locationId = '{{locationid}}';
+var subnetMachines, roomConfiguration;
+var plannerLoadState = 'invalid';
+const PLANNER_READ_ONLY = '{{edit_disabled}}'.length !== 0;
+document.addEventListener("DOMContentLoaded", function () {
+
+	subnetMachines = makeCombinedField({{{subnetMachines}}});
+	roomConfiguration = {{{roomConfiguration}}};
+
+	$.when(
+		$.getScript("modules/roomplanner/js/lib/jquery-collision.js"),
+		$.getScript("modules/roomplanner/js/lib/jquery-ui-draggable-collision.js"),
+		$.getScript("modules/roomplanner/js/grid.js"),
+		$.Deferred(function( deferred ){
+			$( deferred.resolve );
+		})
+	).done(function() {
+		$.getScript("modules/roomplanner/js/init.js", function() {
+			initRoomplanner();
+			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>
diff --git a/modules-available/roomplanner/templates/header.html b/modules-available/roomplanner/templates/header.html
new file mode 100644
index 00000000..5706c970
--- /dev/null
+++ b/modules-available/roomplanner/templates/header.html
@@ -0,0 +1,49 @@
+<!-- Modal -->
+<div class="modal fade" id="selectMachineModal" role="dialog">
+	<div class="modal-dialog">
+
+		<!-- Modal content-->
+		<div class="modal-content">
+			<div class="modal-header">
+				<button type="button" class="close" data-dismiss="modal">&times;</button>
+				<h4>{{lang_titleAddMachine}}</h4>
+			</div>
+			<div class="modal-body">
+				<ul class="nav nav-tabs">
+					<li class="active"><a data-toggle="tab" href="#subnet">{{lang_titleBySubnet}}</a></li>
+					<li><a data-toggle="tab" href="#search">{{lang_titleBySearch}}</a></li>
+				</ul>
+				<div class="tab-content">
+					<div id="subnet" class="tab-pane fade in active">
+						<br/>
+						<p>
+							{{lang_descriptionBySubnet}}
+						</p>
+						<label for="subnetBox">{{lang_labelBySubnet}}</label>
+						<input id="subnetBox" class="form-control"/>
+					</div>
+					<div id="search" class="tab-pane fade">
+						<br/>
+						<p> {{lang_descriptionBySearch}}</p>
+						<label for="machineSearchBox">{{lang_labelBySearch}}</label>
+						<input id="machineSearchBox" class="form-control"/>
+					</div>
+
+				</div>
+
+
+			</div>
+			<div class="modal-footer">
+				<button class="btn btn-default pull-left" data-dismiss="modal">{{lang_cancel}}</button>
+				<button class="btn btn-primary" id="selectMachineButton" {{edit_disabled}}>{{lang_select}}</button>
+			</div>
+		</div>
+	</div>
+</div>
+
+<!--  berryous raumplaner -->
+<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>
\ No newline at end of file
diff --git a/modules-available/roomplanner/templates/item-selector.html b/modules-available/roomplanner/templates/item-selector.html
new file mode 100644
index 00000000..72607e7c
--- /dev/null
+++ b/modules-available/roomplanner/templates/item-selector.html
@@ -0,0 +1,314 @@
+<div id="toolpanel" class="panel panel-default" style="z-index:200;">
+	<div class="panel-body">
+		<ul role="tablist" class="nav nav-tabs">
+			<li role="presentation" class="active"><a href="#computers"
+																	aria-controls="computers" role="tab"
+																	data-toggle="tab">{{lang_catComputers}}</a></li>
+			<li role="presentation"><a href="#walls"
+												aria-controls="walls" role="tab" data-toggle="tab">{{lang_catWalls}}</a></li>
+			<li role="presentation"><a href="#electricaldevices"
+												aria-controls="electricaldevices" role="tab"
+												data-toggle="tab">{{lang_catElectricalDevices}}</a></li>
+			<li role="presentation"><a href="#tables"
+												aria-controls="tables" role="tab" data-toggle="tab">{{lang_catTables}}</a></li>
+			<li role="presentation"><a href="#chairs"
+												aria-controls="chairs" role="tab" data-toggle="tab">{{lang_catChairs}}</a></li>
+			<li role="presentation"><a href="#furniture"
+												aria-controls="furniture" role="tab" data-toggle="tab">{{lang_catFurniture}}</a>
+			</li>
+			<li role="presentation"><a href="#officesupply"
+												aria-controls="officesupply" role="tab"
+												data-toggle="tab">{{lang_catOfficeSupply}}</a></li>
+			<li role="presentation"><a href="#plants"
+												aria-controls="plants" role="tab" data-toggle="tab">{{lang_catPlants}}</a></li>
+			<li role="presentation"><a href="#misc"
+												aria-controls="misc" role="tab" data-toggle="tab">{{lang_catMisc}}</a></li>
+		</ul>
+		<div class="tab-content">
+			<div role="tabpanel" class="tab-pane" id="walls">
+				<ul class="toollist">
+					<li>
+						<div itemtype="furniture" scalable="h" itemlook="wall-horizontal" class="draggable"
+							  style="width:100px; height:25px;" data-height="25" data-width="100"
+							  title="Wand (horizontal)"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" scalable="v" itemlook="wall-vertical" class="draggable"
+							  style="width:25px; height:100px;" data-height="100" data-width="25" title="Wand (vertial)"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" scalable="h" itemlook="window-horizontal" class="draggable"
+							  style="width:50px; height:25px;" data-height="25" data-width="50" title="Fenster"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" scalable="v" itemlook="window-vertical" class="draggable"
+							  style="width:25px; height:50px;" data-height="50" data-width="25" title="Fenster"></div>
+					</li>
+
+
+					<li>
+						<div itemtype="furniture" itemlook="door-nw" class="draggable" style="width:50px; height:100px;"
+							  data-height="100" data-width="50" title="{{lang_door}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="door-ne" class="draggable" style="width:50px; height:100px;"
+							  data-height="100" data-width="50" title="{{lang_door}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="door-sw" class="draggable" style="width:50px; height:100px;"
+							  data-height="100" data-width="50" title="{{lang_door}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="door-se" class="draggable" style="width:50px; height:100px;"
+							  data-height="100" data-width="50" title="{{lang_door}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="door-wn" class="draggable" style="width:100px; height:50px;"
+							  data-height="50" data-width="100" title="{{lang_door}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="door-ws" class="draggable" style="width:100px; height:50px;"
+							  data-height="50" data-width="100" title="{{lang_door}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="door-en" class="draggable" style="width:100px; height:50px;"
+							  data-height="50" data-width="100" title="{{lang_door}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="door-es" class="draggable" style="width:100px; height:50px;"
+							  data-height="50" data-width="100" title="{{lang_door}}"></div>
+					</li>
+
+				</ul>
+			</div>
+
+
+			<div role="tabpanel" class="tab-pane active" id="computers">
+				<ul class="toollist">
+					<li>
+						<div itemtype="pc" itemlook="pc-south" class="draggable" 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" 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" 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" style="width:100px; height:100px;"
+							  data-height="100" data-width="100" title="{{lang_telephone}}" noresize=1></div>
+					</li>
+				</ul>
+			</div>
+
+			<div role="tabpanel" class="tab-pane" id="electricaldevices">
+				<ul class="toollist">
+					<li>
+						<div itemtype="furniture" itemlook="flatscreen" class="draggable" style="width:75px; height:100px;"
+							  data-height="100" data-width="75" title="{{lang_flatscreen}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="lamp" class="draggable" style="width:125px; height:50px;"
+							  data-height="50" data-width="125" title="{{lang_deskLamp}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="tvcamera" class="draggable" style="width:125px; height:50px;"
+							  data-height="50" data-width="125" title="{{lang_projector}}"></div>
+					</li>
+				</ul>
+			</div>
+
+			<div role="tabpanel" class="tab-pane" id="tables">
+				<ul class="toollist">
+					<li>
+						<div itemtype="furniture" itemlook="4chairs1squaretable" class="draggable"
+							  style="width:100px; height:100px;" data-height="100" data-width="100"
+							  title="{{lang_4chairs1squaretable}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="6chairs1table-horizontal" class="draggable"
+							  style="width:100px; height:75px;" data-height="75" data-width="100"
+							  title="{{lang_6chairs1table}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="8chairs1conferencetable-horizontal" class="draggable"
+							  style="width:175px; height:100px;" data-height="100" data-width="175"
+							  title="{{lang_8chairs1conferencetable}}"></div>
+					</li>
+
+					<li>
+						<div itemtype="furniture" itemlook="classroomdesk-north" class="draggable"
+							  style="width:275px; height:100px;" data-height="100" data-width="275"
+							  title="{{lang_classroomdesk}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="classroomdeskchair-north" class="draggable"
+							  style="width:175px; height:100px;" data-height="100" data-width="175"
+							  title="{{lang_classroomdeskchair}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="classroomtable-east" class="draggable"
+							  style="width:75px; height:100px;" data-height="100" data-width="75"
+							  title="{{lang_classroomtable}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="classroomtablechair-north" class="draggable"
+							  style="width:75px; height:100px;" data-height="100" data-width="75"
+							  title="{{lang_classroomdeskchair}}"></div>
+					</li>
+
+					<li>
+						<div itemtype="furniture" itemlook="conferencetable-horizontal" class="draggable"
+							  style="width:200px; height:100px;" data-height="100" data-width="200"
+							  title="{{lang_conferencetable}}"></div>
+					</li>
+
+
+					<li>
+						<div itemtype="furniture" itemlook="podium-north" class="draggable" style="width:200px; height:100px;"
+							  data-height="100" data-width="200" title="{{lang_podium}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="roundeddesk-east" class="draggable"
+							  style="width:75px; height:100px;" data-height="100" data-width="75"
+							  title="{{lang_roundeddesk}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="roundtable" class="draggable" style="width:100px; height:100px;"
+							  data-height="100" data-width="100" title="{{lang_roundtable}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="semicirculartable-north" class="draggable"
+							  style="width:200px; height:100px;" data-height="100" data-width="200"
+							  title="{{lang_semicirculartable}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="squaretable" class="draggable" style="width:100px; height:100px;"
+							  data-height="100" data-width="100" title="{{lang_squaretable}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="studentdesk-north" class="draggable"
+							  style="width:150px; height:100px;" data-height="100" data-width="150"
+							  title="{{lang_studentdesk}}"></div>
+					</li>
+
+
+				</ul>
+
+			</div>
+
+			<div role="tabpanel" class="tab-pane" id="chairs">
+				<ul class="toollist">
+					<li>
+						<div itemtype="furniture" itemlook="armchair-south" class="draggable"
+							  style="width:100px; height:100px;" data-height="100" data-width="100"
+							  title="{{lang_armchair}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="chair-south" class="draggable" style="width:125px; height:100px;"
+							  data-height="100" data-width="125" title="{{lang_chair}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="chair2-south" class="draggable" style="width:100px; height:100px;"
+							  data-height="100" data-width="100" title="{{lang_chair}}"></div>
+					</li>
+
+
+					<li>
+						<div itemtype="furniture" itemlook="couch-south" class="draggable" style="width:100px; height:100px;"
+							  data-height="100" data-width="100" title="{{lang_couch}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="greenchair-south" class="draggable"
+							  style="width:125px; height:100px;" data-height="100" data-width="125"
+							  title="{{lang_greenchair}}"></div>
+					</li>
+
+					<li>
+						<div itemtype="furniture" itemlook="studentdeskchair-north" class="draggable"
+							  style="width:100px; height:100px;" data-height="100" data-width="100"
+							  title="{{lang_studentdeskchair}}"></div>
+					</li>
+				</ul>
+			</div>
+
+			<div role="tabpanel" class="tab-pane" id="furniture">
+				<ul class="toollist">
+					<li>
+						<div itemtype="furniture" itemlook="locker-east" class="draggable" style="width:100px; height:75px;"
+							  data-height="75" data-width="100" title="{{lang_locker}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="locker-north" class="draggable" style="width:75px; height:100px;"
+							  data-height="100" data-width="75" title="{{lang_locker}}"></div>
+					</li>
+
+					<li>
+						<div itemtype="furniture" itemlook="coatrack-east" class="draggable" style="width:25px; height:150px;"
+							  data-height="150" data-width="25" title="{{lang_coatrack}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="coatrack-north" class="draggable"
+							  style="width:150px; height:25px;" data-height="25" data-width="150"
+							  title="{{lang_coatrack}}"></div>
+					</li>
+
+
+					<li>
+						<div itemtype="furniture" itemlook="lecturetheaterrow" class="draggable"
+							  style="width:725px; height:100px;" data-height="100" data-width="725"
+							  title="{{lang_lecturetheaterrow}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="lecturetheaterrowseats" class="draggable"
+							  style="width:725px; height:50px;" data-height="50" data-width="725"
+							  title="{{lang_lecturetheaterrow}}"></div>
+					</li>
+
+				</ul>
+			</div>
+
+			<div role="tabpanel" class="tab-pane" id="officesupply">
+				<ul class="toollist">
+					<li>
+						<div itemtype="furniture" itemlook="papertray" class="draggable" style="width:25px; height:50px;"
+							  data-height="50" data-width="25" title="{{lang_papertray}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="wastecan" class="draggable" style="width:50px; height:50px;"
+							  data-height="50" data-width="50" title="{{lang_wastecan}}"></div>
+					</li>
+
+				</ul>
+			</div>
+			<div role="tabpanel" class="tab-pane" id="plants">
+				<ul class="toollist">
+					<li>
+						<div itemtype="furniture" itemlook="plant" class="draggable" style="width:75px; height:75px;"
+							  data-height="75" data-width="75" title="{{lang_plant}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="plant2" class="draggable" style="width:75px; height:75px;"
+							  data-height="75" data-width="75" title="{{lang_plant}}"></div>
+					</li>
+					<li>
+						<div itemtype="furniture" itemlook="plant3" class="draggable" style="width:75px; height:75px;"
+							  data-height="75" data-width="75" title="{{lang_plant}}"></div>
+					</li>
+				</ul>
+			</div>
+			<div role="tabpanel" class="tab-pane" id="misc">
+				<ul class="toollist">
+					<li>
+						<div itemtype="furniture" itemlook="projectionscreen" class="draggable"
+							  style="width:525px; height:25px;" data-height="25" data-width="525" title="{{lang_plant}}"></div>
+					</li>
+				</ul>
+			</div>
+
+		</div>
+	</div>
+</div>
\ No newline at end of file
diff --git a/modules-available/roomplanner/templates/main-roomplan.html b/modules-available/roomplanner/templates/main-roomplan.html
new file mode 100644
index 00000000..1fc49bea
--- /dev/null
+++ b/modules-available/roomplanner/templates/main-roomplan.html
@@ -0,0 +1,18 @@
+<div class="panel panel-default" id="drawpanel">
+	<div class="panel-heading">
+		<h3 class="panel-title">{{lang_roomplan}}</h3>
+	</div>
+	<div class="panel-body">
+		<div id="drawarea" style="top:0px; left:0px;">
+			<div id="draw-element-area" style="width:100%; height:100%;"></div>
+		</div>
+		<div id="scaleContainer">
+			<span id="zoom-fit" class="glyphicon glyphicon-move" aria-hidden="true"></span>
+			<div>
+				<div id="scaleslider"></div>
+				<span id="zoom-out" class="glyphicon glyphicon-zoom-out" aria-hidden="true"></span>
+				<span id="zoom-in" class="glyphicon glyphicon-zoom-in" aria-hidden="true"></span>
+			</div>
+		</div>
+	</div>
+</div>
\ No newline at end of file
diff --git a/modules-available/roomplanner/templates/page.html b/modules-available/roomplanner/templates/page.html
deleted file mode 100644
index e8544ce8..00000000
--- a/modules-available/roomplanner/templates/page.html
+++ /dev/null
@@ -1,369 +0,0 @@
-<!-- Modal -->
-<div class="modal fade" id="selectMachineModal" role="dialog">
-	<div class="modal-dialog">
-
-		<!-- Modal content-->
-		<div class="modal-content">
-			<div class="modal-header">
-				<button type="button" class="close" data-dismiss="modal">&times;</button>
-				<h4>{{lang_titleAddMachine}}</h4>
-			</div>
-			<div class="modal-body">
-				<ul class="nav nav-tabs">
-					<li class="active"><a data-toggle="tab" href="#subnet">{{lang_titleBySubnet}}</a></li>
-					<li><a data-toggle="tab" href="#search">{{lang_titleBySearch}}</a></li>
-				</ul>
-				<div class="tab-content">
-					<div id="subnet" class="tab-pane fade in active">
-						<br/>
-						<p>
-							{{lang_descriptionBySubnet}}
-						</p>
-						<label for="subnetBox">{{lang_labelBySubnet}}</label>
-						<input id="subnetBox" class="form-control"/>
-					</div>
-					<div id="search" class="tab-pane fade">
-						<br/>
-						<p> {{lang_descriptionBySearch}}</p>
-							<label for="machineSearchBox">{{lang_labelBySearch}}</label>
-							<input id="machineSearchBox" class="form-control" />
-					</div>
-
-				</div>
-
-
-			</div>
-			<div class="modal-footer">
-				<button class="btn btn-default pull-left" data-dismiss="modal" >{{lang_cancel}}</button>
-				<button class="btn btn-primary" id="selectMachineButton">{{lang_select}}</button>
-			</div>
-		</div>
-	</div>
-</div> 
-
-<!--  berryous raumplaner -->
-<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">
-			<ul role="tablist" class="nav nav-tabs">
-				<li role="presentation" class="active"><a href="#computers"
-											  aria-controls="computers" role="tab" data-toggle="tab">{{lang_catComputers}}</a></li>	
-				<li role="presentation"><a href="#walls"
-							   aria-controls="walls" role="tab" data-toggle="tab">{{lang_catWalls}}</a></li>
-				<li role="presentation"><a href="#electricaldevices"
-							   aria-controls="electricaldevices" role="tab" data-toggle="tab">{{lang_catElectricalDevices}}</a></li>
-				<li role="presentation"><a href="#tables"
-							   aria-controls="tables" role="tab" data-toggle="tab">{{lang_catTables}}</a></li>
-				<li role="presentation"><a href="#chairs"
-							   aria-controls="chairs" role="tab" data-toggle="tab">{{lang_catChairs}}</a></li>
-				<li role="presentation"><a href="#furniture"
-							   aria-controls="furniture" role="tab" data-toggle="tab">{{lang_catFurniture}}</a></li>
-				<li role="presentation"><a href="#officesupply"
-							   aria-controls="officesupply" role="tab" data-toggle="tab">{{lang_catOfficeSupply}}</a></li>
-				<li role="presentation"><a href="#plants"
-							   aria-controls="plants" role="tab" data-toggle="tab">{{lang_catPlants}}</a></li>
-				<li role="presentation"><a href="#misc"
-							   aria-controls="misc" role="tab" data-toggle="tab">{{lang_catMisc}}</a></li>
-			</ul>
-			<div class="tab-content">
-				<div role="tabpanel" class="tab-pane" id="walls">
-					<ul class="toollist">
-						<li>
-							<div itemtype="furniture" scalable="h" itemlook="wall-horizontal" class="draggable"  style="width:100px; height:25px;" data-height="25" data-width="100" title="Wand (horizontal)"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" scalable="v" itemlook="wall-vertical" class="draggable"  style="width:25px; height:100px;" data-height="100" data-width="25" title="Wand (vertial)"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" scalable="h" itemlook="window-horizontal" class="draggable"  style="width:50px; height:25px;" data-height="25" data-width="50" title="Fenster"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" scalable="v" itemlook="window-vertical" class="draggable"  style="width:25px; height:50px;" data-height="50" data-width="25" title="Fenster"></div>
-						</li>
-						
-						 
-						<li>
-							<div itemtype="furniture" itemlook="door-nw" class="draggable"  style="width:50px; height:100px;" data-height="100" data-width="50" title="{{lang_door}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="door-ne" class="draggable"  style="width:50px; height:100px;" data-height="100" data-width="50" title="{{lang_door}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="door-sw" class="draggable"  style="width:50px; height:100px;" data-height="100" data-width="50" title="{{lang_door}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="door-se" class="draggable"  style="width:50px; height:100px;" data-height="100" data-width="50" title="{{lang_door}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="door-wn" class="draggable"  style="width:100px; height:50px;" data-height="50" data-width="100" title="{{lang_door}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="door-ws" class="draggable"  style="width:100px; height:50px;" data-height="50" data-width="100" title="{{lang_door}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="door-en" class="draggable"  style="width:100px; height:50px;" data-height="50" data-width="100" title="{{lang_door}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="door-es" class="draggable"  style="width:100px; height:50px;" data-height="50" data-width="100" title="{{lang_door}}"></div>
-						</li>
-						 
-					</ul>
-				</div>
-				
-				
-				<div role="tabpanel" class="tab-pane active" id="computers">
-					<ul class="toollist">
-						<li>
-							<div itemtype="pc" itemlook="pc-south" class="draggable"  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"  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"  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"  style="width:100px; height:100px;" data-height="100" data-width="100" title="{{lang_telephone}}" noresize=1></div>
-						</li>
-					</ul>
-				</div>
-				
-				<div role="tabpanel" class="tab-pane" id="electricaldevices">
-					<ul class="toollist">
-						<li>
-							<div itemtype="furniture" itemlook="flatscreen" class="draggable"  style="width:75px; height:100px;" data-height="100" data-width="75" title="{{lang_flatscreen}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="lamp" class="draggable"  style="width:125px; height:50px;" data-height="50" data-width="125" title="{{lang_deskLamp}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="tvcamera" class="draggable"  style="width:125px; height:50px;" data-height="50" data-width="125" title="{{lang_projector}}"></div>
-						</li>
-					</ul>
-				</div>
-				
-				<div role="tabpanel" class="tab-pane" id="tables">
-					<ul class="toollist">
-						<li>
-							<div itemtype="furniture" itemlook="4chairs1squaretable" class="draggable"  style="width:100px; height:100px;" data-height="100" data-width="100" title="{{lang_4chairs1squaretable}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="6chairs1table-horizontal" class="draggable"  style="width:100px; height:75px;" data-height="75" data-width="100" title="{{lang_6chairs1table}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="8chairs1conferencetable-horizontal" class="draggable"  style="width:175px; height:100px;" data-height="100" data-width="175" title="{{lang_8chairs1conferencetable}}"></div>
-						</li>
-						
-						<li>
-							<div itemtype="furniture" itemlook="classroomdesk-north" class="draggable"  style="width:275px; height:100px;" data-height="100" data-width="275" title="{{lang_classroomdesk}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="classroomdeskchair-north" class="draggable"  style="width:175px; height:100px;" data-height="100" data-width="175" title="{{lang_classroomdeskchair}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="classroomtable-east" class="draggable"  style="width:75px; height:100px;" data-height="100" data-width="75" title="{{lang_classroomtable}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="classroomtablechair-north" class="draggable"  style="width:75px; height:100px;" data-height="100" data-width="75" title="{{lang_classroomdeskchair}}"></div>
-						</li>
-						
-						<li>
-							<div itemtype="furniture" itemlook="conferencetable-horizontal" class="draggable"  style="width:200px; height:100px;" data-height="100" data-width="200" title="{{lang_conferencetable}}"></div>
-						</li>
-												
-
-						<li>
-							<div itemtype="furniture" itemlook="podium-north" class="draggable"  style="width:200px; height:100px;" data-height="100" data-width="200" title="{{lang_podium}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="roundeddesk-east" class="draggable"  style="width:75px; height:100px;" data-height="100" data-width="75" title="{{lang_roundeddesk}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="roundtable" class="draggable"  style="width:100px; height:100px;" data-height="100" data-width="100" title="{{lang_roundtable}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="semicirculartable-north" class="draggable"  style="width:200px; height:100px;" data-height="100" data-width="200" title="{{lang_semicirculartable}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="squaretable" class="draggable"  style="width:100px; height:100px;" data-height="100" data-width="100" title="{{lang_squaretable}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="studentdesk-north" class="draggable"  style="width:150px; height:100px;" data-height="100" data-width="150" title="{{lang_studentdesk}}"></div>
-						</li>
-																
-						
-					</ul>
-				
-				</div>
-				
-				<div role="tabpanel" class="tab-pane" id="chairs">
-					<ul class="toollist">
-						<li>
-							<div itemtype="furniture" itemlook="armchair-south" class="draggable"  style="width:100px; height:100px;" data-height="100" data-width="100" title="{{lang_armchair}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="chair-south" class="draggable"  style="width:125px; height:100px;" data-height="100" data-width="125" title="{{lang_chair}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="chair2-south" class="draggable"  style="width:100px; height:100px;" data-height="100" data-width="100" title="{{lang_chair}}"></div>
-						</li>
-					
-					
-						<li>
-							<div itemtype="furniture" itemlook="couch-south" class="draggable"  style="width:100px; height:100px;" data-height="100" data-width="100" title="{{lang_couch}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="greenchair-south" class="draggable"  style="width:125px; height:100px;" data-height="100" data-width="125" title="{{lang_greenchair}}"></div>
-						</li>
-					
-						<li>
-							<div itemtype="furniture" itemlook="studentdeskchair-north" class="draggable"  style="width:100px; height:100px;" data-height="100" data-width="100" title="{{lang_studentdeskchair}}"></div>
-						</li>
-					</ul>
-				</div>
-				
-				<div role="tabpanel" class="tab-pane" id="furniture">
-					<ul class="toollist">
-						<li>
-							<div itemtype="furniture" itemlook="locker-east" class="draggable"  style="width:100px; height:75px;" data-height="75" data-width="100" title="{{lang_locker}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="locker-north" class="draggable"  style="width:75px; height:100px;" data-height="100" data-width="75" title="{{lang_locker}}"></div>
-						</li>
-						
-						<li>
-							<div itemtype="furniture" itemlook="coatrack-east" class="draggable"  style="width:25px; height:150px;" data-height="150" data-width="25" title="{{lang_coatrack}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="coatrack-north" class="draggable"  style="width:150px; height:25px;" data-height="25" data-width="150" title="{{lang_coatrack}}"></div>
-						</li>
-						
-						
-						<li>
-							<div itemtype="furniture" itemlook="lecturetheaterrow" class="draggable"  style="width:725px; height:100px;" data-height="100" data-width="725" title="{{lang_lecturetheaterrow}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="lecturetheaterrowseats" class="draggable"  style="width:725px; height:50px;" data-height="50" data-width="725" title="{{lang_lecturetheaterrow}}"></div>
-						</li>
-						
-					</ul>
-				</div>
-				
-				<div role="tabpanel" class="tab-pane" id="officesupply">
-					<ul class="toollist">
-						<li>
-							<div itemtype="furniture" itemlook="papertray" class="draggable"  style="width:25px; height:50px;" data-height="50" data-width="25" title="{{lang_papertray}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="wastecan" class="draggable"  style="width:50px; height:50px;" data-height="50" data-width="50" title="{{lang_wastecan}}"></div>
-						</li>
-						
-					</ul>
-				</div>
-				<div role="tabpanel" class="tab-pane" id="plants">
-					<ul class="toollist">
-						<li>
-							<div itemtype="furniture" itemlook="plant" class="draggable"  style="width:75px; height:75px;" data-height="75" data-width="75" title="{{lang_plant}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="plant2" class="draggable"  style="width:75px; height:75px;" data-height="75" data-width="75" title="{{lang_plant}}"></div>
-						</li>
-						<li>
-							<div itemtype="furniture" itemlook="plant3" class="draggable"  style="width:75px; height:75px;" data-height="75" data-width="75" title="{{lang_plant}}"></div>
-						</li>
-					</ul>
-				</div>				
-				<div role="tabpanel" class="tab-pane" id="misc">
-					<ul class="toollist">
-						<li>
-							<div itemtype="furniture" itemlook="projectionscreen" class="draggable"  style="width:525px; height:25px;" data-height="25" data-width="525" title="{{lang_plant}}"></div>
-						</li>
-					</ul>
-				</div>
-				
-			</div>
-		</div>
-	</div>
-
-
-
-	<div class="panel panel-default" id="drawpanel">
-		<div class="panel-heading">
-			<h3 class="panel-title">{{lang_roomplan}}</h3>
-		</div>
-		<div class="panel-body">
-			<div id="drawarea" style="top:0px; left:0px;">
-				<div id="draw-element-area" style="width:100%; height:100%;"></div>
-			</div>
-			<div id="scaleContainer">
-				<span id="zoom-fit" class="glyphicon glyphicon-move" aria-hidden="true"></span>
-				<div>
-				<div id="scaleslider"></div>
-				<span id="zoom-out" class="glyphicon glyphicon-zoom-out" aria-hidden="true"></span>
-				<span id="zoom-in" class="glyphicon glyphicon-zoom-in" aria-hidden="true"></span>
-				</div>
-			</div>
-		</div>
-
-
-	</div>
-
-<div class="pull-left">
-	<div class="input-group" style="width:1px">
-		<div class="input-group-addon">{{lang_managerIp}}</div>
-		<input class="form-control" type="text" id="manager-ip" value="{{managerip}}" placeholder="1.2.3.4" style="width:120px">
-		<div class="input-group-addon checkbox"><input id="dedi-mgr" type="checkbox" {{dediMgrChecked}}> <label for="dedi-mgr">{{lang_dedicatedManager}}</label></div>
-	</div>
-</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 = makeCombinedField({{{subnetMachines}}});
-	roomConfiguration = {{{roomConfiguration}}};
-
-	$.when(
-		$.getScript("modules/roomplanner/js/lib/jquery-collision.js"),
-		$.getScript("modules/roomplanner/js/lib/jquery-ui-draggable-collision.js"),
-		$.getScript("modules/roomplanner/js/grid.js"),
-		$.Deferred(function( deferred ){
-			$( deferred.resolve );
-		})
-	).done(function() {
-		$.getScript("modules/roomplanner/js/init.js", function() {
-			initRoomplanner();
-			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>