diff options
Diffstat (limited to 'modules-available/locationinfo/templates/page-config-panel-default.html')
| -rw-r--r-- | modules-available/locationinfo/templates/page-config-panel-default.html | 486 |
1 files changed, 229 insertions, 257 deletions
diff --git a/modules-available/locationinfo/templates/page-config-panel-default.html b/modules-available/locationinfo/templates/page-config-panel-default.html index 9a68eee8..a289d26a 100644 --- a/modules-available/locationinfo/templates/page-config-panel-default.html +++ b/modules-available/locationinfo/templates/page-config-panel-default.html @@ -20,108 +20,117 @@ <div class="col-md-6"> <div class="panel panel-default"> <div class="panel-heading">{{lang_generalSettings}}</div> - <div class="panel-body"> - <div class="list-group"> + <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"> - <p class="btn btn-static helptext" title="{{lang_displayNameTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> - </div> + <div class="list-group-item"> + <div class="row"> + <div class="col-sm-4"> + <label for="panel-title">{{lang_displayName}}</label> + </div> + <div class="col-sm-8"> + <input class="form-control" name="name" id="panel-title" type="text" value="{{panelname}}"> + </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_displayNameTooltip}} </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"> - <p class="btn btn-static helptext" title="{{lang_languageTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> - </div> + <div class="list-group-item"> + <div class="row"> + <div class="col-sm-4"> + <label for="language">{{lang_language}}</label> + </div> + <div class="col-sm-8"> + <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-12 small text-muted spacebottop"> + {{lang_languageTooltip}} </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"> + <div class="list-group-item"> + <div class="row"> + <div class="col-sm-4"> + <label for="input-eco">{{lang_ecoMode}}</label> + </div> + <div class="col-sm-8"> + <div class="checkbox"> <input id="input-eco" type="checkbox" name="eco" {{eco_checked}}> - </div> - <div class="col-sm-2"> - <p class="btn btn-static helptext" title="{{lang_ecoTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> + <label></label> </div> </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_ecoTooltip}} + </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"> + <div class="list-group-item"> + <div class="row"> + <div class="col-sm-4"> + <label for="input-prettytime">{{lang_prettytime}}</label> + </div> + <div class="col-sm-8"> + <div class="checkbox"> <input id="input-prettytime" type="checkbox" name="prettytime" {{prettytime_checked}}> + <label></label> </div> - <div class="col-sm-2"> - <p class="btn btn-static helptext" title="{{lang_prettytimeTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> - </div> + </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_prettytimeTooltip}} </div> </div> + </div> - <div class="list-group-item"> - <div class="row"> - <div class="col-sm-3"> - <label for="input-calupdate">{{lang_calendarUpdate}}</label> - </div> - <div class="col-sm-7"> - <input class="form-control" name="calupdate" type="number" min="30" id="input-calupdate" - max="1440" value="{{calupdate}}" required> - </div> - <div class="col-sm-2"> - <p class="btn btn-static helptext" title="{{lang_calupdateTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> + <div class="list-group-item m1-s m2-h m3-s m4-s"> + <div class="row"> + <div class="col-sm-4"> + <label for="show-hostname">{{lang_showHostname}}</label> + </div> + <div class="col-sm-8"> + <div class="checkbox"> + <input id="show-hostname" class="btstrpCheckbox" type="checkbox" name="hostname" {{hostname_checked}}> + <label></label> </div> </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_hostnameTooltip}} + </div> </div> + </div> - <div class="list-group-item"> - <div class="row"> - <div class="col-sm-3"> - <label for="form-roomupdate">{{lang_roomUpdate}}</label> - </div> - <div class="col-sm-7"> - <input class="form-control" name="roomupdate" type="number" min="15" id="form-roomupdate" - max="86400" value="{{roomupdate}}" required> - </div> - <div class="col-sm-2"> - <p class="btn btn-static helptext" title="{{lang_roomupdateTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> - </div> + <div class="list-group-item"> + <div class="row"> + <div class="col-sm-4"> + <label for="input-calupdate">{{lang_calendarUpdate}}</label> + </div> + <div class="col-sm-8"> + <input class="form-control" name="calupdate" type="number" min="30" id="input-calupdate" + max="1440" value="{{calupdate}}" required> + </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_calupdateTooltip}} + </div> + </div> + </div> + + <div class="list-group-item"> + <div class="row"> + <div class="col-sm-4"> + <label for="form-roomupdate">{{lang_roomUpdate}}</label> + </div> + <div class="col-sm-8"> + <input class="form-control" name="roomupdate" type="number" min="15" id="form-roomupdate" + max="86400" value="{{roomupdate}}" required> + </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_roomupdateTooltip}} </div> </div> </div> @@ -132,181 +141,164 @@ <div class="col-md-6"> <div class="panel panel-default" id="extra-div"> <div class="panel-heading">{{lang_mode}}</div> - <div class="panel-body"> - <div class="list-group" id="overridableConfigs"> - <div class="list-group-item"> - <div class="row"> - <div class="col-sm-3"> - <label for="mode">{{lang_mode}}</label> - </div> - <div class="col-sm-7"> - <select class="form-control" name="mode" id="mode" onchange="modeChange(id)"> - <option value="1" id="mode1">{{lang_mode1}}</option> - <option value="2" id="mode2">{{lang_mode2}}</option> - <option value="3" id="mode3">{{lang_mode3}}</option> - <option value="4" id="mode4">{{lang_mode4}}</option> - </select> - </div> - <div class="col-sm-2"> - <p class="btn btn-static helptext" title="{{lang_modeTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> - </div> + <div class="list-group" id="overridableConfigs"> + <div class="list-group-item"> + <div class="row"> + <div class="col-sm-4"> + <label for="mode">{{lang_mode}}</label> + </div> + <div class="col-sm-8"> + <select class="form-control" name="mode" id="mode" onchange="modeChange(id)"> + <option value="1" id="mode1">{{lang_mode1}}</option> + <option value="2" id="mode2">{{lang_mode2}}</option> + <option value="3" id="mode3">{{lang_mode3}}</option> + <option value="4" id="mode4">{{lang_mode4}}</option> + </select> + </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_modeTooltip}} </div> </div> + </div> - <div class="list-group-item"> - <div class="row"> - <div class="col-sm-3"> - <label for="input-roomplanner">{{lang_useRoomplanner}}</label> - </div> - <div class="col-sm-7"> - <select class="form-control" name="roomplanner" id="input-roomplanner"> - <option value="0" id="roomplanner0">{{lang_countIp}}</option> - <option value="1" id="roomplanner1">{{lang_countRoomplan}}</option> - </select> - </div> - <div class="col-sm-2"> - <p class="btn btn-static helptext" title="{{lang_roomplannerTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> - </div> + <div class="list-group-item"> + <div class="row"> + <div class="col-sm-4"> + <label for="input-roomplanner">{{lang_useRoomplanner}}</label> + </div> + <div class="col-sm-8"> + <select class="form-control" name="roomplanner" id="input-roomplanner"> + <option value="0" id="roomplanner0">{{lang_countIp}}</option> + <option value="1" id="roomplanner1">{{lang_countRoomplan}}</option> + </select> + </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_roomplannerTooltip}} </div> </div> + </div> - <div class="list-group-item m1-s m2-h m3-h m4-h"> - <div class="row"> - <div class="col-sm-3"> - <label for="input-vertical">{{lang_vertical}}</label> - </div> - <div class="col-sm-7"> - <input id="input-vertical" class="btstrpCheckbox" type="checkbox" name="vertical" {{vertical_checked}}> - </div> - <div class="col-sm-2"> - <p class="btn btn-static helptext" title="{{lang_verticalTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> - </div> + <div class="list-group-item m1-s m2-h m3-h m4-h"> + <div class="row"> + <div class="col-sm-4"> + <label for="input-vertical">{{lang_vertical}}</label> + </div> + <div class="col-sm-8"> + <input id="input-vertical" class="btstrpCheckbox" type="checkbox" name="vertical" {{vertical_checked}}> + </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_verticalTooltip}} </div> </div> + </div> - <div class="list-group-item m1-s m2-s m3-h m4-s"> - <div class="row"> - <div class="col-sm-3"> - <label for="startday">{{lang_startDay}}</label> - </div> - <div class="col-sm-7"> - <select class="form-control" id="startday" name="startday"> - <option value="0">{{lang_currentDay}}</option> - <option value="1">{{lang_monday}}</option> - <option value="2">{{lang_thuesday}}</option> - <option value="3">{{lang_wednesday}}</option> - <option value="4">{{lang_thursday}}</option> - <option value="5">{{lang_friday}}</option> - <option value="6">{{lang_saturday}}</option> - <option value="7">{{lang_sunday}}</option> - </select> - </div> - <div class="col-sm-2"> - <p class="btn btn-static helptext" title="{{lang_startDayTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> - </div> + <div class="list-group-item m1-s m2-s m3-h m4-s"> + <div class="row"> + <div class="col-sm-4"> + <label for="startday">{{lang_startDay}}</label> + </div> + <div class="col-sm-8"> + <select class="form-control" id="startday" name="startday"> + <option value="0">{{lang_currentDay}}</option> + <option value="1">{{lang_monday}}</option> + <option value="2">{{lang_thuesday}}</option> + <option value="3">{{lang_wednesday}}</option> + <option value="4">{{lang_thursday}}</option> + <option value="5">{{lang_friday}}</option> + <option value="6">{{lang_saturday}}</option> + <option value="7">{{lang_sunday}}</option> + </select> + </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_startDayTooltip}} </div> </div> + </div> - <div class="list-group-item m1-s m2-s m3-h m4-s"> - <div class="row"> - <div class="col-sm-3"> - <label for="scaledaysauto">{{lang_autoScale}}</label> - </div> - <div class="col-sm-7"> + <div class="list-group-item m1-s m2-s m3-h m4-s"> + <div class="row"> + <div class="col-sm-4"> + <label for="scaledaysauto">{{lang_autoScale}}</label> + </div> + <div class="col-sm-8"> + <div class="checkbox"> <input id="scaledaysauto" class="btstrpCheckbox" type="checkbox" name="scaledaysauto" {{scaledaysauto_checked}}> + <label></label> </div> - <div class="col-sm-2"> - <p class="btn btn-static helptext" title="{{lang_autoscaleTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> - </div> + </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_autoscaleTooltip}} </div> </div> + </div> - <div class="list-group-item m1-s m2-s m3-h m4-s"> - <div class="row"> - <div class="col-sm-3"> - <label for="daystoshow">{{lang_daysToShow}}</label> - </div> - <div class="col-sm-7"> - <select class="form-control" id="daystoshow" name="daystoshow"> - <option value="1">1</option> - <option value="2">2</option> - <option value="3">3</option> - <option value="4">4</option> - <option value="5">5</option> - <option value="6">6</option> - <option value="7">7</option> - </select> - </div> - <div class="col-sm-2"> - <p class="btn btn-static helptext" title="{{lang_daysToShowTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> - </div> + <div class="list-group-item m1-s m2-s m3-h m4-s"> + <div class="row"> + <div class="col-sm-4"> + <label for="daystoshow">{{lang_daysToShow}}</label> + </div> + <div class="col-sm-8"> + <select class="form-control" id="daystoshow" name="daystoshow"> + <option value="1">1</option> + <option value="2">2</option> + <option value="3">3</option> + <option value="4">4</option> + <option value="5">5</option> + <option value="6">6</option> + <option value="7">7</option> + </select> + </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_daysToShowTooltip}} </div> </div> + </div> - <div class="list-group-item m1-s m2-h m3-s m4-s"> - <div class="row"> - <div class="col-sm-3"> - <label for="rotation">{{lang_rotation}}</label> - </div> - <div class="col-sm-7"> - <select class="form-control" id="rotation" name="rotation"> - <option value="0">{{lang_rotation0}}</option> - <option value="3">{{lang_rotation3}}</option> - <option value="2">{{lang_rotation2}}</option> - <option value="1">{{lang_rotation1}}</option> - </select> - </div> - <div class="col-sm-2"> - <p class="btn btn-static helptext" title="{{lang_rotationTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> - </div> + <div class="list-group-item m1-s m2-h m3-s m4-s"> + <div class="row"> + <div class="col-sm-4"> + <label for="rotation">{{lang_rotation}}</label> + </div> + <div class="col-sm-8"> + <select class="form-control" id="rotation" name="rotation"> + <option value="0">{{lang_rotation0}}</option> + <option value="3">{{lang_rotation3}}</option> + <option value="2">{{lang_rotation2}}</option> + <option value="1">{{lang_rotation1}}</option> + </select> + </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_rotationTooltip}} </div> </div> + </div> - <div class="list-group-item m1-s m2-h m3-h m4-h"> - <div class="row"> - <div class="col-sm-3"> - <label for="input-scale">{{lang_scale}}</label> - </div> - <div class="col-sm-7"> - <span><span class="range-display"></span> %</span> - <input id="input-scale" name="scale" type="range" step="1" min="10" max="90" value="{{scale}}"> - </div> - <div class="col-sm-2"> - <p class="btn btn-static helptext" title="{{lang_scaleTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> - </div> + <div class="list-group-item m1-s m2-h m3-h m4-h"> + <div class="row"> + <div class="col-sm-4"> + <label for="input-scale">{{lang_scale}}</label> + </div> + <div class="col-sm-8"> + <span><span class="range-display"></span> %</span> + <input id="input-scale" name="scale" type="range" step="1" min="10" max="90" value="{{scale}}"> + </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_scaleTooltip}} </div> </div> + </div> - <div class="list-group-item m1-h m2-h m3-h m4-s"> - <div class="row"> - <div class="col-sm-3"> - <label for="input-switchtime">{{lang_switchTime}}</label> - </div> - <div class="col-sm-7"> - <span><span class="range-display"></span> {{lang_sec}}</span> - <input id="input-switchtime" name="switchtime" type="range" step="1" min="1" max="120" value="{{switchtime}}"> - </div> - <div class="col-sm-2"> - <p class="btn btn-static helptext" title="{{lang_switchTimeTooltip}}"> - <span class="glyphicon glyphicon-question-sign"></span> - </p> - </div> + <div class="list-group-item m1-h m2-h m3-h m4-s"> + <div class="row"> + <div class="col-sm-4"> + <label for="input-switchtime">{{lang_switchTime}}</label> + </div> + <div class="col-sm-8"> + <span><span class="range-display"></span> {{lang_sec}}</span> + <input id="input-switchtime" name="switchtime" type="range" step="1" min="1" max="120" value="{{switchtime}}"> + </div> + <div class="col-sm-12 small text-muted spacebottop"> + {{lang_switchTimeTooltip}} </div> </div> </div> @@ -384,9 +376,6 @@ document.addEventListener("DOMContentLoaded", function () { var $owPanels = $('#overrideRoomConfigs'); var overrides = {{{overrides}}} - // Initialize fancy tooltips - $('p.helptext').tooltip(); - // Add listener to range sliders so their label can be updated var $range = $('input[type="range"]'); $range.change(function () { @@ -394,8 +383,7 @@ document.addEventListener("DOMContentLoaded", function () { }); // Set state of input controls that aren't statically initialized server side $('.modify-inputs input[type="checkbox"]') - .bootstrapSwitch({size: 'small'}) - .on('switchChange.bootstrapSwitch', function () { + .on('click', function () { if (this.name === 'scaledaysauto') { $('#daystoshow').prop('disabled', this.checked); } @@ -455,12 +443,12 @@ document.addEventListener("DOMContentLoaded", function () { // Add Panel for overwriting room specific config $owPanels.find('#overrideRoom' + id).remove(); $owPanels.append('<div class="col-md-6" id="overrideRoom' + id + '">' + - '<div class="panel panel-default">' + + '<div class="panel panel-default body-dest">' + '<div class="panel-heading clearfix">' + name + ' {{lang_configOverride}}' + '<div class="checkbox-inline pull-right">' + '<input type="checkbox" id="override' + id + '" name="override' + id + '"/>' + - '</div></div><div class="panel-body"></div></div></div>'); + '</div></div></div></div>'); // Load content into panel @@ -485,10 +473,6 @@ document.addEventListener("DOMContentLoaded", function () { var overVal = false; if (overrides !== null && overrides[locId] !== undefined) overVal = true; - // Make Bootstrap switches to normal checkboxes to be able to clone them correctly - var btstrpCheckboxes = $('.modify-inputs input[class="btstrpCheckbox"]'); - btstrpCheckboxes.bootstrapSwitch('destroy'); - // Clone needed content var $contentCopy = $('#overridableConfigs').clone(true); $contentCopy.closest('#overridableConfigs').prop('id', ''); @@ -526,20 +510,19 @@ document.addEventListener("DOMContentLoaded", function () { if ($( this ).attr('type') === 'range') $( this ).val(overVal ? overrides[locId][oldName] : $('#' + oldId).val()); else if ($( this ).attr('type') === 'checkbox') { $( this ) - .bootstrapSwitch({size: 'small'}) - .on('switchChange.bootstrapSwitch', function () { + .on('click', function () { var regex = RegExp('[a-b0-9]*scaledaysauto'); var substr = this.name.substring(0, this.name.length - 13); if (regex.test(this.name)) { $('#' + substr + 'daystoshow').prop('disabled', this.checked); } }); - $( this ).bootstrapSwitch('state', overVal ? overrides[locId][oldName] : $('#' + oldId).val()); + $( this ).prop('checked', overVal ? overrides[locId][oldName] : $('#' + oldId).prop('checked')); } }); // Append copied content to location specific <div> - var $panelBody = $('#overrideRoom' + locId).find('div.panel-body'); + var $panelBody = $('#overrideRoom' + locId).find('div.body-dest'); $panelBody.append($contentCopy); // Specific extra stuff needed @@ -550,17 +533,6 @@ document.addEventListener("DOMContentLoaded", function () { // Call modeChange once to correctly show/hide fields modeChange('override'+ locId + 'mode'); - // Recreate Bootstrap switches from checkboxes - btstrpCheckboxes - .bootstrapSwitch({size: 'small'}) - .on('switchChange.bootstrapSwitch', function () { - var regex = RegExp('[a-b0-9]*scaledaysauto'); - var substr = this.name.substring(0, this.name.length - 13); - if (regex.test(this.name)) { - $('#' + substr + 'daystoshow').prop('disabled', this.checked); - } - }); - // Add listener to range inputs for updating value text var range = $('input[type="range"]'); range.change(function () { @@ -570,7 +542,7 @@ document.addEventListener("DOMContentLoaded", function () { } function unloadOverrideContent(id) { - var $panelBody = $('#overrideRoom' + id).find('div.panel-body'); + var $panelBody = $('#overrideRoom' + id).find('div.body-dest'); $panelBody.find('div.list-group').remove(); if (overrides !== null && overrides[id] !== undefined) delete overrides[id] } |