[locations] Avoid potentially duplicate ids in ajax fragments

1 files changed, 52 insertions, 52 deletions

diff --git a/modules-available/locations/templates/ajax-opening-location.html b/modules-available/locations/templates/ajax-opening-location.html
index 3b2ea7ae..3207fcd7 100644
--- a/modules-available/locations/templates/ajax-opening-location.html
+++ b/modules-available/locations/templates/ajax-opening-location.html
@@ -1,8 +1,7 @@
-<input type="hidden" name="locationid" value="{{id}}">
-<div id="settings-outer">
+<div>
 	<h3>{{lang_openingTime}}</h3>
 	{{^expertMode}}
-	<div id="simple-mode">
+	<div class="simple-mode">
 
 		<div align="right" style="margin-bottom: 10px;">
 			<a href="#" class="btn btn-default btn-sm" id="btn-show-expert">{{lang_expertMode}}</a>
@@ -22,7 +21,7 @@
 						<span class="input-group-addon">
 							<span class="glyphicon glyphicon-time"></span>
 						</span>
-						<input type="text" class="form-control timepicker2" id="week-open" pattern="[0-9]{1,2}:[0-9]{2}">
+						<input type="text" class="form-control timepicker2 week-open" pattern="[0-9]{1,2}:[0-9]{2}">
 					</div>
 				</td>
 				<td>
@@ -30,7 +29,7 @@
 						<span class="input-group-addon">
 							<span class="glyphicon glyphicon-time"></span>
 						</span>
-						<input type="text" class="form-control timepicker2" id="week-close" pattern="[0-9]{1,2}:[0-9]{2}">
+						<input type="text" class="form-control timepicker2 week-close" pattern="[0-9]{1,2}:[0-9]{2}">
 					</div>
 				</td>
 			</tr>
@@ -41,7 +40,7 @@
 						<span class="input-group-addon">
 							<span class="glyphicon glyphicon-time"></span>
 						</span>
-						<input type="text" class="form-control timepicker2" id="saturday-open" pattern="[0-9]{1,2}:[0-9]{2}">
+						<input type="text" class="form-control timepicker2 saturday-open" pattern="[0-9]{1,2}:[0-9]{2}">
 					</div>
 				</td>
 				<td>
@@ -49,7 +48,7 @@
 						<span class="input-group-addon">
 							<span class="glyphicon glyphicon-time"></span>
 						</span>
-						<input type="text" class="form-control timepicker2" id="saturday-close" pattern="[0-9]{1,2}:[0-9]{2}">
+						<input type="text" class="form-control timepicker2 saturday-close" pattern="[0-9]{1,2}:[0-9]{2}">
 					</div>
 				</td>
 			</tr>
@@ -60,7 +59,7 @@
 						<span class="input-group-addon">
 							<span class="glyphicon glyphicon-time"></span>
 						</span>
-						<input type="text" class="form-control timepicker2" id="sunday-open" pattern="[0-9]{1,2}:[0-9]{2}">
+						<input type="text" class="form-control timepicker2 sunday-open" pattern="[0-9]{1,2}:[0-9]{2}">
 					</div>
 				</td>
 				<td>
@@ -68,7 +67,7 @@
 						<span class="input-group-addon">
 							<span class="glyphicon glyphicon-time"></span>
 						</span>
-						<input type="text" class="form-control timepicker2" id="sunday-close" pattern="[0-9]{1,2}:[0-9]{2}">
+						<input type="text" class="form-control timepicker2 sunday-close" pattern="[0-9]{1,2}:[0-9]{2}">
 					</div>
 				</td>
 			</tr>
@@ -76,9 +75,9 @@
 	</div>
 	{{/expertMode}}
 
-	<div id="expert-mode" style="{{^expertMode}}display:none{{/expertMode}}">
+	<div class="expert-mode" style="{{^expertMode}}display:none{{/expertMode}}">
 		<div class="clearfix"></div>
-		<div id="expert-table">
+		<div class="expert-table">
 			<div class="row">
 				<div class="col-sm-6">{{lang_openingTime}}</div>
 				<div class="col-sm-4">{{lang_closingTime}}</div>
@@ -87,7 +86,7 @@
 		</div>
 		<hr>
 		<div style="text-align: center;">
-			<a class="btn btn-success btn-sm" id="new-openingtime">
+			<a class="btn btn-success btn-sm" class="new-openingtime">
 				<span class="glyphicon glyphicon-plus-sign"></span>
 				{{lang_openingTime}}
 			</a>
@@ -96,7 +95,7 @@
 	</div>
 </div>
 
-<div class="hidden" id="expert-template">
+<div class="hidden" class="expert-template">
 	<div class="row expert-row">
 		<hr>
 		<div class="col-xs-12 days-box">
@@ -126,48 +125,49 @@
 
 {{#rebootcontrol}}
 <hr>
-<div class="row">
+<div class="row wol">
 	<div class="col-sm-4">
 		<div class="checkbox checkbox-inline">
-			<input id="wol" name="wol" class="wol" type="checkbox">
-			<label for="wol">{{lang_wakeonlan}}</label>
+			<input id="wol-check-{{id}}" name="wol" type="checkbox" {{#wol}}checked{{/wol}}>
+			<label for="wol-check-{{id}}">{{lang_wakeonlan}}</label>
 		</div>
 	</div>
 	<div class="col-sm-8">
-		<input disabled type="number" id="wol-offset" name="wol-offset" class="wol-offset" value="{{wol-options.wol-offset}}" placeholder="0" min="0" max="15">
-		<label for="wol-offset">{{lang_offsetEarly}}</label>
+		<input disabled type="number" id="wol-offset-{{id}}" name="wol-offset"
+				 value="{{wol-options.wol-offset}}" placeholder="0" min="0" max="15">
+		<label for="wol-offset-{{id}}">{{lang_offsetEarly}}</label>
 	</div>
+</div>
+<div class="row shutdown">
 	<div class="col-sm-4">
 		<div class="checkbox checkbox-inline">
-			<input id="sd" name="sd" class="sd" type="checkbox">
-			<label for="sd">{{lang_shutdown}}</label>
+			<input id="sd-check-{{id}}" name="sd" type="checkbox" {{#sd}}checked{{/sd}}>
+			<label for="sd-check-{{id}}">{{lang_shutdown}}</label>
 		</div>
 	</div>
 	<div class="col-sm-8">
-		<input disabled type="number" id="sd-offset" name="sd-offset" class="sd-offset" value="{{sd-options.sd-offset}}" placeholder="0" min="0" max="15">
-		<label for="sd-offset">{{lang_offsetLate}}</label>
+		<input disabled type="number" id="sd-offset-{{id}}" name="sd-offset"
+				 value="{{sd-options.sd-offset}}" placeholder="0" min="0" max="15">
+		<label for="sd-offset-{{id}}">{{lang_offsetLate}}</label>
 	</div>
 </div>
 {{/rebootcontrol}}
 
-<script type="application/javascript"><!--
-	let wol = $('#wol');
-	let sd = $('#sd');
-
-	wol.attr('checked',{{wol}});
-	sd.attr('checked',{{sd}});
-	$('#wol-offset').attr('disabled', !$('#wol').is(':checked'));
-	$('#sd-offset').attr('disabled', !$('#sd').is(':checked'));
+<script type="application/javascript">
+	(function() {
 
-	wol.on('click', function(){
-		$('#wol-offset').attr('disabled', !$(this).is(':checked'));
-	});
+		var $loc = $('#openingTimesModal{{id}}');
+		var $wol = $loc.find('.wol');
+		var $sd = $loc.find('.shutdown');
 
-	sd.on('click', function(){
-		$('#sd-offset').attr('disabled', !$(this).is(':checked'));
-	});
-
-	(function() {
+		var sync = function($div) {
+			$div.find('input[type="number"]').prop('disabled',
+				!$div.find('input[type="checkbox"]').is(':checked'));
+		};
+		sync($wol);
+		sync($sd);
+		$wol.find('input[type="checkbox"]').on('change', function() { sync($wol); });
+		$sd.find('input[type="checkbox"]').on('change', function() { sync($sd); });
 
 		var scheduleData = {{{schedule_data}}};
 
@@ -179,36 +179,36 @@
 		{{^expertMode}}
 			for (var i = 0; i < scheduleData.length; ++i) {
 				if (scheduleData[i].days.length === 5) {
-					$('#week-open').val(scheduleData[i]['openingtime']);
-					$('#week-close').val(scheduleData[i]['closingtime']);
+					$loc.find('.week-open').val(scheduleData[i]['openingtime']);
+					$loc.find('.week-close').val(scheduleData[i]['closingtime']);
 				} else if (scheduleData[i].days.length === 1 && scheduleData[i].days[0] === 'Saturday') {
-					$('#saturday-open').val(scheduleData[i]['openingtime']);
-					$('#saturday-close').val(scheduleData[i]['closingtime']);
+					$loc.find('.saturday-open').val(scheduleData[i]['openingtime']);
+					$loc.find('.saturday-close').val(scheduleData[i]['closingtime']);
 				} else if (scheduleData[i].days.length === 1 && scheduleData[i].days[0] === 'Sunday') {
-					$('#sunday-open').val(scheduleData[i]['openingtime']);
-					$('#sunday-close').val(scheduleData[i]['closingtime']);
+					$loc.find('.sunday-open').val(scheduleData[i]['openingtime']);
+					$loc.find('.sunday-close').val(scheduleData[i]['closingtime']);
 				}
 			}
 		{{/expertMode}}
 
-		setTimepicker($('#settings-outer').find('.timepicker2'));
-
-		$('p.helptext').tooltip();
+		setTimepicker($loc.find('.timepicker2'));
 
-		$('#new-openingtime').click(function (e) {
+		$loc.find('.new-openingtime').click(function (e) {
 			e.preventDefault();
 			setTimepicker(newOpeningTime({}).find('.timepicker2'));
 		});
 
-		$('#btn-show-expert').click(function (e) {
+		$loc.find('.btn-show-expert').click(function (e) {
 			e.preventDefault();
 			scheduleData = simpleToExpert();
 			for (var i = 0; i < scheduleData.length; ++i) {
 				setTimepicker(newOpeningTime(scheduleData[i]).find('.timepicker2'));
 			}
-			$('#simple-mode').remove();
-			$('#expert-mode').show();
+			$loc.find('.simple-mode').remove();
+			$loc.find('.expert-mode').show();
 		});
+
+		$loc.find('form').submit(validateOpeningTimes);
 	})();
 
-//--></script>
+</script>