<div id="dialog-findlatlong" title="Find your Geo location">
    <form>
        <table class="display" id="latlongtable" border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td align="right" style="vertical-align:top"><label for="name">Address: </label></td>
          <td>
			<input type="text" id="address" style="width: 300px; padding: .2em;" class="text ui-widget-content ui-corner-all"><br>
			(Example: Streetname Number City Country)
          </td>
        </tr>
        <tr>
			<td></td>
			<td><button id="getlatlong">GetLatLong</button></td>
        </tr>
        <tr id="georow">
          <td align="right"><label for="latitude">Latitude: </label></td>
          <td>
			<input type="text" id="latitude" style="width: 90px; padding: .2em;" class="text ui-widget-content ui-corner-all">
			<img id="geodetect" src="images/location.png" class="lcursor unselected" height="24" width="24">
		  </td>
	    </tr>
        <tr>
          <td align="right"><label for="longitude">Longitude: </label></td>
          <td><input type="text" id="longitude" style="width: 90px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
		</tr>
		</table>
    </form>
</div>
<script>
    $('.mb-0').click(function() {
        $("i", this).toggleClass("fas fa-angle-down fas fa-angle-up");
    });
</script>

<div id="maindiv" class="container">
	<div id="settingscontent">
		<form id="settings">
			<div id="content">
				<ul id="tabs" class="nav nav-tabs sub-tabs" data-tabs="tabs">
					<li class="active"><a data-target="#tabsystem" data-toggle="tab" data-i18n="System">System</a></li>
					<li><a data-target="#tablog" data-toggle="tab" data-i18n="Log History"></a></li>
					<li><a data-target="#tabnotifications" data-toggle="tab" data-i18n="Notifications"></a></li>
					<li><a data-target="#tabemail" data-toggle="tab" data-i18n="Email">Email</a></li>
					<li><a data-target="#tabmeters" data-toggle="tab" data-i18n="Meters/Counters">Meters/Counters</a></li>
					<li><a data-target="#tabenergydashboard" data-toggle="tab" data-i18n="Energy Dashboard">Energy Dashboard</a></li>
					<li><a data-target="#tabfloorplan" data-toggle="tab" data-i18n="Floorplan"></a></li>
					<li><a data-target="#tabsecurity" data-toggle="tab" data-i18n="Security"></a></li>
					<li><a data-target="#tabother" data-toggle="tab" data-i18n="Other">Other</a></li>
					<li><a data-target="#tabbackuprestore" data-toggle="tab" data-i18n="Backup/Restore">Backup/Restore</a></li>
					<li class="pull-right"><a data-i18n="Apply Settings" class="btn-danger sub-tabs-apply" ng-click="StoreSettings()">Apply Settings</a></li>
				</ul>
				<div id="my-tab-content" class="tab-content">
					<div class="tab-pane active" id="tabsystem">
						<!-- System
						================================================== -->
						<section id="system">
							<div class="page-header-small">
								<h1 data-i18n="SystemSetup">System Setup</h1>
							</div>
							<div class="row-fluid">
								<div class="span6">
									<h2><span data-i18n="User Interface"></span>:</h2>
									<table class="display" id="languagetable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:120px"><label for="Language">Language: </label></td>
										<td>
											<select id="combolanguages" name="Language" style="width:200px" class="combobox ui-corner-all">
											</select>
										</td>
									</tr>
									<tr>
										<td align="right"><label for="Themes"><span data-i18n="Theme"></span>: </label></td>
										<td>
											<select id="combothemes" name="Themes" style="width:200px" class="combobox ui-corner-all">
											</select>
										</td>
									</tr>
									<tr>
										<td align="right"><label><span data-i18n="Dashboard"></span>: </label></td>
										<td><select id="combosdashtype" name="DashboardType" style="width:200px" class="combobox ui-corner-all">
											<option data-i18n="Normal" value="0">Normal</option>
											<option data-i18n="Compact" value="1">Compact</option>
											<option data-i18n="Mobile" value="2">Mobile</option>
											<option data-i18n="Floorplan" value="3">Floorplan</option>
										</select></td>
									</tr>
									<tr>
										<td></td>
										<td><input type="checkbox" id="AllowWidgetOrdering" name="AllowWidgetOrdering"> <label for="AllowWidgetOrdering" data-i18n="AllowWidgetOrdering">Allow Widget Re-Order</label></td>
									</tr>
									<tr>
										<td align="right"><label><span data-i18n="Mobile"></span>: </label></td>
										<td><select id="combosmobiletype" name="MobileType" style="width:200px" class="combobox ui-corner-all">
											<option data-i18n="Mobile" value="0">Mobile</option>
											<option data-i18n="Dashboard" value="1">Dashboard</option>
										</select></td>
									</tr>
									</table>
								</div>
								<div class="span6">
									<h2><span data-i18n="Location"></span>:</h2>
									<label id="sunriseset"></label>
									<table class="display" id="locationtable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:80px"><label for="Title"><span data-i18n="Name">Name</span>: </label></td>
										<td><input type="input" id="Title" name="Title" style="width: 200px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
									</tr>
									<tr>
										<td align="right"><label for="Latitude"><span data-i18n="Latitude"></span>: </label></td>
										<td><input type="text" id="Latitude" name="Latitude" style="width: 150px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
									</tr>
									<tr>
										<td align="right"><label for="Longitude"><span data-i18n="Longitude"></span>: </label></td>
										<td>
											<input type="text" id="Longitude" name="Longitude" style="width: 150px; padding: .2em;" class="text ui-widget-content ui-corner-all"><br>
											<span data-i18n="ToFindGeo"></span> <a class="norm-link" ng-click="GetGeoLocation();"><span class="norm-link" data-i18n="Here"></span></a>
										</td>
									</tr>
									<tr>
										<td align="right"><label><span data-i18n="Currency"></span>: </label></td>
										<td><select id="CurrencySymbol" name="CurrencySymbol" style="width:40px" class="combobox ui-corner-all">
											<option value="€" selected="selected">€</option>
											<option value="$">$</option>
											<option value="£">£</option>
											<option value="¥">¥</option>
											<option value="CHF">CHF</option>
											<option value="₹">₹</option>
											<option value="₽">₽</option>
											<option value="₩">₩</option>
											<option value="R">R</option>
											<option value="﷼">﷼</option>
											<option value="د.إ">د.إ</option>
											<option value="₪">₪</option>
											<option value="₺">₺</option>
											<option value="kr">kr</option>
											<option value="RM">RM</option>
											<option value="p">p</option>
											<option value="₦">₦</option>
											<option value="KSh">KSh</option>
											<option value="MKD">MKD</option>
										</select></td>
									</tr>
									</table>
								</div>
							</div>
							<br>
							<div class="row-fluid">
								<div class="span6">
									<div id="SoftwareUpdates" ng-show="config.UseUpdate">
										<h2><span data-i18n="SoftwareUpdates"></span>:</h2>
										<table class="display" id="autoupdatetable" border="0" cellpadding="0" cellspacing="0">
											<tr>
												<td colspan="2"><input type="checkbox" id="checkforupdates" name="checkforupdates"> <label for="checkforupdates" data-i18n="CheckForSoftwareUpdates"></label></td>
											</tr>
											<tr>
												<td align="right" style="width:130px"><label><span data-i18n="Release Channel">Release Channel</span>: </label></td>
												<td><select id="comboReleaseChannel" name="ReleaseChannel" style="width:140px" class="combobox ui-corner-all">
													<option data-i18n="Stable" value="0">Stable</option>
													<option data-i18n="Beta" value="1">Beta</option>
												</select></td>
											</tr>
										</table>
									</div>
									<br>
								</div>
								<div class="span6">
									<div id="AutoBackup">
										<h2><span data-i18n="AutoBackup"></span>:</h2>
										<table class="display" id="autobackuptable" border="0" cellpadding="0" cellspacing="0">
											<tr>
												<td colspan="2"><input type="checkbox" id="enableautobackup" name="enableautobackup"> <label for="enableautobackup" data-i18n="EnableAutoBackup"></label></td>
											</tr>
										</table>
									</div>
									<br>
								</div>
							</div>
							<div class="row-fluid">
								<div class="span6">
									<div id="NewHardware">
										<h2><span data-i18n="AcceptNewHardware">Hardware/Devices</span>:</h2>
										<table class="display" id="acceptnewhardwaretable" border="0" cellpadding="0" cellspacing="0">
											<tr>
												<td colspan="2">
													<input type="checkbox" id="AcceptNewHardware" name="AcceptNewHardware"> <label for="AcceptNewHardware" data-i18n="AcceptNewHardwareDevices">Accept new Hardware Devices</label> <button data-i18n="Allow for 5 Minutes" class="btn btn-danger" ng-click="AllowNewHardware(5)">Allow for 5 Minutes</button>
												</td>
											</tr>
											<tr>
												<td colspan="2"><input type="checkbox" id="HideDisabledHardwareSensors" name="HideDisabledHardwareSensors"> <label for="HideDisabledHardwareSensors" data-i18n="HideDisabledHardwareSensors">Hide Disabled Hardware Sensors</label></td>
											</tr>
											<tr>
												<td colspan="2"><input type="checkbox" id="ShowUpdateEffect" name="ShowUpdateEffect"> <label for="ShowUpdateEffect" data-i18n="Flash sensor when an update is received">Flash sensor when an update is received</label></td>
											</tr>
										</table>
									</div>
								</div>
							</div>
						</section>
					</div>
					<div class="tab-pane" id="tablog">
						<!-- Log History
						================================================== -->
						<section id="loghistory">
							<div class="page-header-small">
								<h1 data-i18n="Log History">Log History</h1>
							</div>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="Light/Switches"></span>:</h2>
									<table class="display" id="lightlogtable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:60px"><label><span data-i18n="Days"></span>: </label></td>
										<td><input type="text" id="LightHistoryDays" name="LightHistoryDays" style="width: 50px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
									</tr>
									</table>
								</div>
							</div>
							<br>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="Short Log Sensors"></span>:</h2>
									<table class="display" id="shortlogtable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:60px"><label><span data-i18n="Days"></span>: </label></td>
										<td><select id="comboshortlogdays" name="ShortLogDays" style="width:60px" class="combobox ui-corner-all">
											<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>&nbsp;&nbsp;<button data-i18n="Clear" class="btn btn-danger" ng-click="CleanupShortLog()">Clear</button></td>
									</tr>
									<tr>
                  <td><input type="checkbox" id="ShortLogAddOnlyNewValues" name="ShortLogAddOnlyNewValues"> <label for="ShortLogAddOnlyNewValues" data-i18n="ShortLogAddOnlyNewValues"></label></td>
                  </tr>
									</table>
								</div>
							</div>
						</section>
					</div>
                    <div class="tab-pane" id="tabnotifications">
						<!-- Notification system
						================================================== -->
						<section id="notifications">
							<div class="page-header-small">
								<h1 data-i18n="Notifications">Notifications</h1>
							</div>
                            <!--Accordion wrapper -->
                            <div class="accordion md-accordion" id="accordionEx" role="tablist" aria-multiselectable="true">
							<div class="row-fluid">
                                <!-- Accordion card Prowl -->
                                <div class="span6">
                                    <!-- Card header -->
                                    <div class="card-header" role="tab" id="headingProwl">                               
                                      <a data-toggle="collapse" data-parent="#accordionEx" data-target="#collapseOne1" aria-expanded="true"
                                        aria-controls="collapseOne1">
                                        <h2 class="mb-0"><i class="fas fa-angle-down" style="float:right"></i>
                                          <span data-i18n="Prowl (iPhone/iPad)"></span>
                                        </h2>
                                      </a>
                                    </div>
                                    <!-- Card body -->
                                    <div id="collapseOne1" class="collapse show" role="tabpanel" aria-labelledby="headingProwl"
                                      data-parent="#accordionEx">
                                        <div class="card-body">
                                            <table class="display" id="prowltable" border="0" cellpadding="0" cellspacing="0">
                                            <tr>
                                                <td align="right" style="width:80px"><span data-i18n="Enabled"></span>: </td>
                                                <td><input type="checkbox" id="ProwlEnabled" name="ProwlEnabled"><label for="ProwlEnabled"></label></td>
                                            </tr>
                                            <tr>
                                                <td align="right"><label for="ProwlAPI"><span data-i18n="API Key"></span>: </label></td>
                                                <td><input type="input" id="ProwlAPI" name="ProwlAPI" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all">  <button data-i18n="Test" class="btn btn-info" ng-click="TestNotification('prowl')">Test</button></td>
                                            </tr>
                                            </table>
                                        <span data-i18n="To get a free account/API key click"></span> <a href="https://www.prowlapp.com/" class="norm-link" target="_blank"><span class="norm-link" data-i18n="Here"></span></a><br>
                                        </div>
                                    </div>
                                </div>
                                <!-- Accordion card IFTTT -->
								<div class="span6">
                                    <!-- Card header -->
                                    <div class="card-header" role="tab" id="headingIFTTT">
                                      <a data-toggle="collapse" data-parent="#accordionEx" data-target="#collapseOne2" aria-expanded="true"
                                        aria-controls="collapseOne2">
                                        <h2 class="mb-0"><i class="fas fa-angle-down" style="float:right"></i>
                                          <span data-i18n="IFTTT">IFTTT</span>
                                        </h2>
                                      </a>
                                    </div>
                                    <!-- Card body -->
                                    <div id="collapseOne2" class="collapse show" role="tabpanel" aria-labelledby="headingIFTTT"
                                      data-parent="#accordionEx">
                                        <div class="card-body">
                                        <table class="display" id="ifttttable" border="0" cellpadding="0" cellspacing="0">
                                            <tr>
                                                <td align="right" style="width:80px"><span data-i18n="Enabled"></span>:</td>
                                                <td><input type="checkbox" id="IFTTTEnabled" name="IFTTTEnabled"><label for="IFTTTEnabled"></label></td>
                                            </tr>
                                            <tr>
                                                <td align="right"><label><span data-i18n="API Key">API Key</span>: </label></td>
                                                <td><input type="input" id="IFTTTAPI" name="IFTTTAPI" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
                                            </tr>
                                        </table>
                                        <span data-i18n="Create a Maker/Webhook">Create a Maker/Webhook</span> <a class="norm-link" href="https://ifttt.com/maker_webhooks" target="_blank"><span class="norm-link" data-i18n="Here"></span></a><br>
                                        </div>
                                    </div>
								</div>
                            </div>
							<div class="row-fluid">
                                <!-- Accordion card Pushbullet -->
								<div class="span6">
                                    <!-- Card header -->
                                    <div class="card-header" role="tab" id="headingPushbullet">
                                      <a data-toggle="collapse" data-parent="#accordionEx" data-target="#collapseOne3" aria-expanded="true"
                                        aria-controls="collapseOne3">
                                        <h2 class="mb-0"><i class="fas fa-angle-down" style="float:right"></i>
                                          <span data-i18n="Pushbullet (iOS/Android/Windows)"></span>
                                        </h2>
                                      </a>
                                    </div>
                                    <!-- Card body -->
                                    <div id="collapseOne3" class="collapse show" role="tabpanel" aria-labelledby="headingPushbullet"
                                      data-parent="#accordionEx">
                                        <div class="card-body">
                                        <table class="display" id="pushbullettable" border="0" cellpadding="0" cellspacing="0">
                                        <tr>
                                            <td align="right" style="width:80px"><span data-i18n="Enabled"></span>:</td>
                                            <td><input type="checkbox" id="PushbulletEnabled" name="PushbulletEnabled"><label for="PushbulletEnabled"></label></td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="PushbulletAPI"><span data-i18n="API Key"></span>: </label></td>
                                            <td><input type="input" id="PushbulletAPI" name="PushbulletAPI" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all">  <button data-i18n="Test" class="btn btn-info" ng-click="TestNotification('pushbullet')">Test</button></td>
                                        </tr>
                                        </table>
                                        <span data-i18n="To get a free account/API key click"></span> <a href="https://www.pushbullet.com/" class="norm-link" target="_blank"><span class="norm-link" data-i18n="Here"></span></a><br>
                                        <br>
                                        </div>
                                    </div>
                                </div>
                                <!-- Accordion card Pushsafer -->
								<div class="span6">
                                    <!-- Card header -->
                                    <div class="card-header" role="tab" id="headingPushsafer">
                                      <a data-toggle="collapse" data-parent="#accordionEx" data-target="#collapseOne4" aria-expanded="true"
                                        aria-controls="collapseOne4">
                                        <h2 class="mb-0"><i class="fas fa-angle-down" style="float:right"></i>
                                          <span data-i18n="Pushsafer (iOS/Android/Windows)"></span>
                                        </h2>
                                      </a>
                                    </div>
                                    <!-- Card body -->
                                    <div id="collapseOne4" class="collapse show" role="tabpanel" aria-labelledby="headingPushsafer"
                                      data-parent="#accordionEx">
                                        <div class="card-body">
                                        <table class="display" id="pushsafertable" border="0" cellpadding="0" cellspacing="0">
                                        <tr>
                                            <td align="right" style="width:80px"><span data-i18n="Enabled"></span>:</td>
                                            <td><input type="checkbox" id="PushsaferEnabled" name="PushsaferEnabled"><label for="PushsaferEnabled"></label></td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="PushsaferAPI"><span data-i18n="API Key"></span>: </label></td>
                                            <td><input type="input" id="PushsaferAPI" name="PushsaferAPI" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all">  <button data-i18n="Test" class="btn btn-info" ng-click="TestNotification('pushsafer')">Test</button></td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="PushsaferImage"><span data-i18n="ImageURL"></span>: </label></td>
                                            <td><input type="input" id="PushsaferImage" name="PushsaferImage" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
                                        </tr>
                                        </table>
                                        <span data-i18n="To get a free account/API key click"></span> <a href="https://www.pushsafer.com/" class="norm-link" target="_blank"><span class="norm-link" data-i18n="Here"></span></a><br>
									<br>
                                    </div>
                                </div>
                            </div>
                            </div>
							<div class="row-fluid">
								<!-- Accordion card Pushover -->
								<div class="span6">
                                    <!-- Card header -->
                                    <div class="card-header" role="tab" id="headingPushover">
                                      <a data-toggle="collapse" data-parent="#accordionEx" data-target="#collapseOne5" aria-expanded="true"
                                        aria-controls="collapseOne5">
                                        <h2 class="mb-0"><i class="fas fa-angle-down" style="float:right"></i>
                                          <span data-i18n="Pushover (Android/iOs)"></span>
                                        </h2>
                                      </a>
                                    </div>
                                    <!-- Card body -->
                                    <div id="collapseOne5" class="collapse show" role="tabpanel" aria-labelledby="headingPushover"
                                      data-parent="#accordionEx">
                                        <div class="card-body">
                                        <table class="display" id="pushovertable" border="0" cellpadding="0" cellspacing="0">
                                        <tr>
                                            <td align="right" style="width:80px"><span data-i18n="Enabled"></span>:</td>
                                            <td><input type="checkbox" id="PushoverEnabled" name="PushoverEnabled"><label for="PushoverEnabled"></label></td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="PushoverUser"><span data-i18n="USER KEY"></span>: </label></td>
                                            <td><input type="input" id="PushoverUser" name="PushoverUser" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all">  </td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="PushoverAPI"><span data-i18n="API Key"></span>: </label></td>
                                            <td><input type="input" id="PushoverAPI" name="PushoverAPI" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all">  <button data-i18n="Test" class="btn btn-info" ng-click="TestNotification('pushover')">Test</button></td>
                                        </tr>
                                        </table>
                                        <span data-i18n="To get a free account/API key click"></span> <a class="norm-link" href="https://pushover.net" target="_blank"><span class="norm-link" data-i18n="Here"></span></a><br>
                                        <br>
                                        </div>
                                    </div>
                                </div>
								<!-- Accordion card Pushalot -->
								<div class="span6">
                                    <!-- Card header -->
                                    <div class="card-header" role="tab" id="headingPushalot">
                                      <a data-toggle="collapse" data-parent="#accordionEx" data-target="#collapseOne6" aria-expanded="true"
                                        aria-controls="collapseOne6">
                                        <h2 class="mb-0"><i class="fas fa-angle-down" style="float:right"></i>
                                          <span data-i18n="Pushalot (Windows/Windows Phone)"></span>
                                        </h2>
                                      </a>
                                    </div>
                                    <!-- Card body -->
                                    <div id="collapseOne6" class="collapse show" role="tabpanel" aria-labelledby="headingPushalot"
                                      data-parent="#accordionEx">
                                        <div class="card-body">
                                        <table class="display" id="pushalottable" border="0" cellpadding="0" cellspacing="0">
                                        <tr>
                                            <td align="right" style="width:80px"><span data-i18n="Enabled"></span>:</td>
                                            <td><input type="checkbox" id="PushALotEnabled" name="PushALotEnabled"><label for="PushALotEnabled"></label></td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="PushALotAPI"><span data-i18n="API Key"></span>: </label></td>
                                            <td><input type="input" id="PushALotAPI" name="PushALotAPI" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all">  <button data-i18n="Test" class="btn btn-info" ng-click="TestNotification('pushalot')">Test</button></td>
                                        </tr>
                                        </table>
                                        <span data-i18n="To get a free account/API key click"></span> <a class="norm-link" href="https://pushalot.com/" target="_blank"><span class="norm-link" data-i18n="Here"></span></a><br>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row-fluid">
								<!-- Accordion card Clickatell -->
								<div class="span6">
                                    <!-- Card header -->
                                    <div class="card-header" role="tab" id="headingClickatell">
                                      <a data-toggle="collapse" data-parent="#accordionEx" data-target="#collapseOne7" aria-expanded="true"
                                        aria-controls="collapseOne7">
                                        <h2 class="mb-0"><i class="fas fa-angle-down" style="float:right"></i>
                                          <span data-i18n="Clickatell SMS">Clickatell SMS</span>
                                        </h2>
                                      </a>
                                    </div>
                                    <!-- Card body -->
                                    <div id="collapseOne7" class="collapse show" role="tabpanel" aria-labelledby="headingClickatell"
                                      data-parent="#accordionEx">
                                        <div class="card-body">
											<table class="display" id="smstable" border="0" cellpadding="0" cellspacing="0">
												<tr>
													<td align="right" style="width:80px"><span data-i18n="Enabled"></span>:</td>
													<td><input type="checkbox" id="ClickatellEnabled" name="ClickatellEnabled"><label for="ClickatellEnabled"></label></td>
												</tr>
												<tr>
													<td align="right"><label for="ClickatellAPI"><span data-i18n="API Key">API Key</span>: </label></td>
													<td><input type="input" id="ClickatellAPI" name="ClickatellAPI" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
												</tr>
												<tr>
													<td align="right"><label for="ClickatellTo"><span data-i18n="To"></span>: </label></td>
													<td><input type="input" id="ClickatellTo" name="ClickatellTo" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
												</tr>
												<tr>
													<td></td>
													<td><span data-i18n="(Separate by a semicolon, For Example"></span>: +3123456789;+44567890)</td>
												</tr>
												<tr>
													<td align="right"><label for="ClickatellFrom"><span data-i18n="From"></span>: </label></td>
													<td><input type="input" id="ClickatellFrom" name="ClickatellFrom" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all">  <button data-i18n="Test" class="btn btn-info" ng-click="TestNotification('clickatell')">Test</button></td>
												</tr>
												<tr>
													<td></td>
													<td><span data-i18n="(Optional - used in two way comunication"></span>: +3123456789)</td>
												</tr>

											</table>
                                        <span data-i18n="To get a free account/API key click"></span> <a class="norm-link" href="http://www.clickatell.com/" target="_blank"><span class="norm-link" data-i18n="Here"></span></a><br>
                                        <br>
                                        </div>
                                    </div>
                                </div>
                                <!-- Accordion card Telegram -->
								<div class="span6">
                                    <!-- Card header -->
                                    <div class="card-header" role="tab" id="headingTelegram">
                                      <a data-toggle="collapse" data-parent="#accordionEx" data-target="#collapseOne8" aria-expanded="true"
                                        aria-controls="collapseOne8">
                                        <h2 class="mb-0"><i class="fas fa-angle-down" style="float:right"></i>
                                          <span data-i18n="Telegram">Telegram</span>
                                        </h2>
                                      </a>
                                    </div>
                                    <!-- Card body -->
                                    <div id="collapseOne8" class="collapse show" role="tabpanel" aria-labelledby="headingTelegram"
                                      data-parent="#accordionEx">
                                        <div class="card-body">
                                        <table class="display" id="telegramtable" border="0" cellpadding="0" cellspacing="0">
                                        <tr>
                                            <td align="right" style="width:80px"><span data-i18n="Enabled"></span>:</td>
                                            <td><input type="checkbox" id="TelegramEnabled" name="TelegramEnabled"><label for="TelegramEnabled"></label></td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="TelegramAPI"><span data-i18n="API Key"></span>: </label></td>
                                            <td><input type="input" id="TelegramAPI" name="TelegramAPI" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all">  <button data-i18n="Test" class="btn btn-info" ng-click="TestNotification('telegram')">Test</button></td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="TelegramChat"><span data-i18n="Chat ID">Chat ID</span>: </label></td>
                                            <td><input type="input" id="TelegramChat" name="TelegramChat" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all"> </td>
                                        </tr>
                                        </table>
                                        <span data-i18n="To get a free account/API key click"></span> <a href="https://telegram.org/" class="norm-link" target="_blank"><span class="norm-link" data-i18n="Here"></span></a><br>
                                        <br>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row-fluid">
								<!-- Accordion card Custom HTTP -->
								<div class="span12">
                                    <!-- Card header -->
                                    <div class="card-header" role="tab" id="headingCustomhttp">
                                      <a data-toggle="collapse" data-parent="#accordionEx" data-target="#collapseOne9" aria-expanded="true"
                                        aria-controls="collapseOne9">
                                        <h2 class="mb-0"><i class="fas fa-angle-down" style="float:right"></i>
                                          <span data-i18n="Custom HTTP">Custom HTTP</span>/<span data-i18n="Action">Action</span>
                                        </h2>
                                      </a>
                                    </div>
                                    <!-- Card body -->
                                    <div id="collapseOne9" class="collapse show" role="tabpanel" aria-labelledby="headingCustomhttp"
                                      data-parent="#accordionEx">
                                        <div class="card-body">
                                        <table class="display" id="httptable" border="0" cellpadding="0" cellspacing="0">
                                        <tr>
                                            <td align="right" style="width:80px"><span data-i18n="Enabled"></span>:</td>
                                            <td><input type="checkbox" id="HTTPEnabled" name="HTTPEnabled"><label for="HTTPEnabled"></label></td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="HTTPField1">#FIELD1: </label></td>
                                            <td><input type="input" id="HTTPField1" name="HTTPField1" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="HTTPField2">#FIELD2: </label></td>
                                            <td><input type="input" id="HTTPField2" name="HTTPField2" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="HTTPField3">#FIELD3: </label></td>
                                            <td><input type="input" id="HTTPField3" name="HTTPField3" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="HTTPField4">#FIELD4: </label></td>
                                            <td><input type="input" id="HTTPField4" name="HTTPField4" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="HTTPTo">#TO: </label></td>
                                            <td><input type="input" id="HTTPTo" name="HTTPTo" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="HTTPURL"><span data-i18n="URL"></span>/<span data-i18n="Action"></span>: </label></td>
                                            <td>
                                                <textarea id="HTTPURL" name="HTTPURL" rows="4" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all"></textarea><br>
                                                <span data-i18n="(Should start with http:// or script://)">(Should start with http://, https:// or script://)</span><br>
                                                <span data-i18n="(Optional)">(Optional)</span> #SUBJECT, #MESSAGE, #PRIORITY
                                            </td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="HTTPPostData">POST Data: </label></td>
                                            <td>
                                                <textarea id="HTTPPostData" name="HTTPPostData" rows="4" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all"></textarea><br>
                                                <span data-i18n="(Optional)">(Optional)</span> #SUBJECT, #MESSAGE, #PRIORITY
                                            </td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="HTTPPostContentType">POST Content-Type: </label></td>
                                            <td>
                                                <input type="input" id="HTTPPostContentType" name="HTTPPostContentType" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all">  <button data-i18n="Test" class="btn btn-info" ng-click="TestNotification('http')">Test</button><br>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td align="right"><label for="HTTPPostHeaders">POST Headers: </label></td>
                                            <td>
                                                <textarea id="HTTPPostHeaders" name="HTTPPostHeaders" rows="4" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all"></textarea><br>
                                            </td>
                                        </tr>
                                        </table>
                                        <br>
                                        </div>
                                    </div>
                                </div>
                            </div>
							<div class="row-fluid">
								<!-- Accordion card Kodi -->
								<div class="span6">
                                    <!-- Card header -->
                                    <div class="card-header" role="tab" id="headingKodi">
                                      <a data-toggle="collapse" data-parent="#accordionEx" data-target="#collapseOne10" aria-expanded="true"
                                        aria-controls="collapseOne10">
                                        <h2 class="mb-0"><i class="fas fa-angle-down" style="float:right"></i>
                                          <span data-i18n="Kodi Media Player"></span>
                                        </h2>
                                      </a>
                                    </div>
                                    <!-- Card body -->
                                    <div id="collapseOne10" class="collapse show" role="tabpanel" aria-labelledby="headingKodi"
                                      data-parent="#accordionEx">
                                        <div class="card-body">
                                        <table class="display" id="koditable" border="0" cellpadding="0" cellspacing="0">
                                            <tr>
                                                <td align="right" style="width:80px"><span data-i18n="Enabled"></span>:</td>
                                                <td><input type="checkbox" id="KodiEnabled" name="KodiEnabled"><label for="KodiEnabled"></label></td>
                                            </tr>
                                            <tr>
                                                <td align="right"><label for="KodiIPAddress"><span data-i18n="IP Address"></span>: </label></td>
                                                <td>
                                                    <input type="input" id="KodiIPAddress" name="KodiIPAddress" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all">
                                                    <button data-i18n="Test" class="btn btn-info" ng-click="TestNotification('kodi')">Test</button>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td align="right" style="width:80px">
                                                    <label for="KodiPort"><span data-i18n="Port"></span>: </label>
                                                </td>
                                                <td>
                                                    <input type="input" id="KodiPort" name="KodiPort" style="width: 50px; padding: .2em;" class="text ui-widget-content ui-corner-all">
                                                </td>
                                            </tr>
                                            <tr>
                                                <td align="right" style="width:80px">
                                                    <label for="KodiTimeToLive"><span data-i18n="Hops"></span>: </label>
                                                </td>
                                                <td>
                                                    <input type="input" id="KodiTimeToLive" name="KodiTimeToLive" style="width: 50px; padding: .2em;" class="text ui-widget-content ui-corner-all">
                                                </td>
                                            </tr>
                                        </table>
                                        <span data-i18n="Test with default settings before changing. Learn about Kodi"></span> <a class="norm-link" href="http://kodi.tv/" target="_blank"><span class="norm-link" data-i18n="Here"></span></a><br>
                                        <span>(e.g 224.0.0.1, 192.168.1.100;192.168.1.101;...)</span><br>
                                        <br>
                                        </div>
                                    </div>
                                </div>
								<!-- Accordion card Logitech -->
								<div class="span6">
                                    <!-- Card header -->
                                    <div class="card-header" role="tab" id="headingLogitech">
                                      <a data-toggle="collapse" data-parent="#accordionEx" data-target="#collapseOne11" aria-expanded="true"
                                        aria-controls="collapseOne11">
                                        <h2 class="mb-0"><i class="fas fa-angle-down" style="float:right"></i>
                                          <span data-i18n="Logitech Media Server"></span>
                                        </h2>
                                      </a>
                                    </div>
                                    <!-- Card body -->
                                    <div id="collapseOne11" class="collapse show" role="tabpanel" aria-labelledby="headingLogitech"
                                      data-parent="#accordionEx">
                                        <div class="card-body">
                                        <table class="display" id="lmstable" border="0" cellpadding="0" cellspacing="0">
                                            <tr>
                                                <td align="right" style="width:80px"><span data-i18n="Enabled"></span>:</td>
                                                <td><input type="checkbox" id="LmsEnabled" name="LmsEnabled"><label for="LmsEnabled"></label></td>
                                            </tr>
                                            <tr>
                                                <td align="right">
                                                    <label for="LmsPlayerMac"><span data-i18n="Player"></span> <span data-i18n="Mac Address"></span>: </label>
                                                </td>
                                                <td>
                                                    <input type="input" id="LmsPlayerMac" name="LmsPlayerMac" style="width: 356px; padding: .2em;" class="text ui-widget-content ui-corner-all">
                                                    <button data-i18n="Test" class="btn btn-info" ng-click="TestNotification('lms')">Test</button>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td align="right" style="width:80px">
                                                    <label for="LmsDuration"><span data-i18n="Duration"></span>: </label>
                                                </td>
                                                <td>
                                                    <input type="input" id="LmsDuration" name="LmsDuration" style="width: 50px; padding: .2em;" class="text ui-widget-content ui-corner-all">
                                                </td>
                                            </tr>
                                        </table>
                                        <span style="color:red" data-i18n="This notifier only works when the Logitech Media Server hardware has been added/enabled"></span><br>
                                        <br>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row-fluid">
								<div class="span6">
									<h2><span data-i18n="Google Cloud Messaging"></span></h2>
									<table class="display" id="gcmtable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:80px"><span data-i18n="Enabled"></span>:</td>
										<td><input type="checkbox" id="FCMEnabled" name="FCMEnabled"><label for="FCMEnabled"></label></td>
										<td><button data-i18n="Test" class="btn btn-info" ng-click="TestNotification('fcm')">Test</button></td>
									</tr>
									</table>
									<br>
								</div>
                            </div>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="Notification Intervals"></span></h2>
									<table class="display" id="nitable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:60px"><label><span data-i18n="Sensors"></span>: </label></td>
										<td><select id="comboNotificationSensorInterval" name="NotificationSensorInterval" style="width:100px" class="combobox ui-corner-all">
											<option data-i18n="1 Minute" value="60">1 Minute</option>
											<option data-i18n="5 Minutes" value="300">5 Minutes</option>
											<option data-i18n="10 Minutes" value="600">10 Minutes</option>
											<option data-i18n="15 Minutes" value="900">15 Minutes</option>
											<option data-i18n="30 Minutes" value="1800">30 Minutes</option>
											<option data-i18n="1 Hour" value="3600">1 Hour</option>
											<option data-i18n="2 Hours" value="7200">2 Hours</option>
											<option data-i18n="3 Hours" value="10800">3 Hours</option>
											<option data-i18n="4 Hours" value="14400">4 Hours</option>
											<option data-i18n="5 Hours" value="18000">5 Hours</option>
											<option data-i18n="6 Hours" value="21600">6 Hours</option>
											<option data-i18n="7 Hours" value="25200">7 Hours</option>
											<option data-i18n="8 Hours" value="28800">8 Hours</option>
											<option data-i18n="9 Hours" value="32400">9 Hours</option>
											<option data-i18n="10 Hours" value="36000">10 Hours</option>
											<option data-i18n="11 Hours" value="39600">11 Hours</option>
											<option data-i18n="12 Hours" value="43200">12 Hours</option>
											<option data-i18n="13 Hours" value="46800">13 Hours</option>
											<option data-i18n="14 Hours" value="50400">14 Hours</option>
											<option data-i18n="15 Hours" value="54000">15 Hours</option>
											<option data-i18n="16 Hours" value="57600">16 Hours</option>
											<option data-i18n="17 Hours" value="61200">17 Hours</option>
											<option data-i18n="18 Hours" value="64800">18 Hours</option>
											<option data-i18n="19 Hours" value="68400">19 Hours</option>
											<option data-i18n="20 Hours" value="72000">20 Hours</option>
											<option data-i18n="21 Hours" value="75600">21 Hours</option>
											<option data-i18n="22 Hours" value="79200">22 Hours</option>
											<option data-i18n="23 Hours" value="82800">23 Hours</option>
											<option data-i18n="24 Hours" value="86400">24 Hours</option>
										</select></td>
									</tr>
									<tr>
										<td align="right" style="width:60px"><label><span data-i18n="Switches"></span>: </label></td>
										<td><select id="comboNotificationSwitchesInterval" name="NotificationSwitchInterval" style="width:120px" class="combobox ui-corner-all">
											<option data-i18n="Direct" value="0">Direct</option>
											<option data-i18n="1 Minute" value="60">1 Minute</option>
											<option data-i18n="5 Minutes" value="300">5 Minutes</option>
											<option data-i18n="10 Minutes" value="600">10 Minutes</option>
											<option data-i18n="15 Minutes" value="900">15 Minutes</option>
											<option data-i18n="30 Minutes" value="1800">30 Minutes</option>
											<option data-i18n="1 Hour" value="3600">1 Hour</option>
											<option data-i18n="2 Hours" value="7200">2 Hour</option>
											<option data-i18n="3 Hours" value="10800">3 Hour</option>
											<option data-i18n="4 Hours" value="14400">4 Hour</option>
											<option data-i18n="5 Hours" value="18000">5 Hour</option>
											<option data-i18n="6 Hours" value="21600">6 Hour</option>
											<option data-i18n="7 Hours" value="25200">7 Hour</option>
											<option data-i18n="8 Hours" value="28800">8 Hour</option>
											<option data-i18n="9 Hours" value="32400">9 Hour</option>
											<option data-i18n="10 Hours" value="36000">10 Hour</option>
											<option data-i18n="11 Hours" value="39600">11 Hour</option>
											<option data-i18n="12 Hours" value="43200">12 Hours</option>
											<option data-i18n="13 Hours" value="46800">13 Hours</option>
											<option data-i18n="14 Hours" value="50400">14 Hours</option>
											<option data-i18n="15 Hours" value="54000">15 Hours</option>
											<option data-i18n="16 Hours" value="57600">16 Hours</option>
											<option data-i18n="17 Hours" value="61200">17 Hours</option>
											<option data-i18n="18 Hours" value="64800">18 Hours</option>
											<option data-i18n="19 Hours" value="68400">19 Hours</option>
											<option data-i18n="20 Hours" value="72000">20 Hours</option>
											<option data-i18n="21 Hours" value="75600">21 Hours</option>
											<option data-i18n="22 Hours" value="79200">22 Hours</option>
											<option data-i18n="23 Hours" value="82800">23 Hours</option>
											<option data-i18n="24 Hours" value="86400">24 Hours</option>
										</select></td>
									</tr>
									</table>
								</div>
							</div>
                          </div>
						</section>
					</div>
					<div class="tab-pane" id="tabemail">
						<!-- Email Setup
						================================================== -->
						<section id="emailsetup">
							<div class="page-header-small">
								<h1 data-i18n="Email Setup">Email Setup</h1>
							</div>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="Email Setup"></span>:</h2>
									<table class="display" id="emailtable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:80px"><span data-i18n="Enabled"></span>: </td>
										<td><input type="checkbox" id="EmailEnabled" name="EmailEnabled"><label for="EmailEnabled"></label></td>
									</tr>
									<tr>
										<td align="right" style="width:60px"><label><span data-i18n="From"></span>: </label></td>
										<td><input type="email" id="EmailFrom" name="EmailFrom" style="width: 180px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
									</tr>
									<tr>
										<td align="right" style="width:60px"><label><span data-i18n="To"></span>: </label></td>
										<td><input type="input" id="EmailTo" name="EmailTo" style="width: 300px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
									</tr>
									<tr>
										<td></td>
										<td><span data-i18n="(Separate by a semicolon, For Example"></span>: user@mail.com;user2@mail.com)</td>
									</tr>
									<tr>
										<td align="right" style="width:60px"><label><span data-i18n="Server"></span>: </label></td>
										<td><input type="input" id="EmailServer" name="EmailServer" style="width: 200px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
									</tr>
									<tr>
										<td align="right" style="width:60px; vertical-align:top"><label><span data-i18n="Port"></span>: </label></td>
										<td><input type="input" id="EmailPort" name="EmailPort" style="width: 40px; padding: .2em;" class="text ui-widget-content ui-corner-all"><br><span data-i18n="(default 25, StartTLS Port 587, SSL Port 465)"></span></td>
									</tr>
									<tr>
										<td align="right" style="width:60px"><label><span data-i18n="Username"></span>: </label></td>
										<td><input type="input" id="EmailUsername" name="EmailUsername" style="width: 200px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
									</tr>
									<tr>
										<td align="right" style="width:60px"><label><span data-i18n="Password"></span>: </label></td>
										<td><input type="password" id="EmailPassword" name="EmailPassword" style="width: 200px; padding: .2em;" class="text ui-widget-content ui-corner-all">  <button data-i18n="Test" class="btn btn-info" ng-click="TestNotification('email')">Test</button></td>
									</tr>
									<tr>
										<td></td>
										<td><input type="checkbox" id="UseEmailInNotifications" name="UseEmailInNotifications"> <label for="UseEmailInNotifications"><span data-i18n="Send Email Notification Alerts"></span></label></td>
									</tr>
									<tr>
										<td></td>
										<td><input type="checkbox" id="EmailAsAttachment" name="EmailAsAttachment"> <label for="EmailAsAttachment"><span data-i18n="Send Camera snapshots as Attachment (Gmail)"></span></label></td>
									</tr>
									<tr>
										<td></td>
										<td><input type="checkbox" id="SendErrorsAsNotification" name="SendErrorsAsNotification"> <label for="SendErrorsAsNotification"><span data-i18n="Send Errors as Notification"></span></label></td>
									</tr>
									</table>
								</div>
							</div>
						</section>
					</div>
					<div class="tab-pane" id="tabmeters">
						<!-- Meter Settings
						================================================== -->
						<section id="metercounters">
							<div class="page-header-small">
								<h1 data-i18n="Meter/Counter Setup">Meter/Counter Setup</h1>
							</div>
							<div class="row-fluid">
								<div class="span4">
									<h2><span data-i18n="Temperature"></span>:</h2>
									<table class="display" id="temperaturetable" border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td align="right" style="width:240px"><label><span data-i18n="Display"></span>: </label></td>
											<td>
												<select id="comboTempUnit" name="TempUnit" style="width:120px" class="combobox ui-corner-all">
													<option value="0">Celsius</option>
													<option value="1">Fahrenheit</option>
												</select>
											</td>
										<tr>
										<tr>
											<td align="right"><label><span data-i18n="Degree Days"></span> (<span data-i18n="Base Temperature"></span>): </label></td>
											<td><input type="input" id="DegreeDaysBaseTemperature" name="DegreeDaysBaseTemperature" style="width: 80px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
										</tr>
									</table>
								</div>
								<div class="span4">
									<h2><span data-i18n="Wind Meter"></span>:</h2>
									<table class="display" id="windmetertable" border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td align="right" style="width:60px"><label><span data-i18n="Display"></span>: </label></td>
											<td><select id="comboWindUnit" name="WindUnit" style="width:120px" class="combobox ui-corner-all">
												<option value="0">m/s</option>
												<option value="1">km/h</option>
												<option value="2">mph</option>
												<option value="3">Knots</option>
												<option value="4">Beaufort</option>
											</select></td>
										</tr>
									</table>
								</div>
								<div class="span4">
									<h2><span data-i18n="Weight"></span>:</h2>
									<table class="display" id="weighttable" border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td align="right" style="width:60px"><label><span data-i18n="Display"></span>: </label></td>
											<td>
												<select id="comboWeightUnit" name="WeightUnit" style="width:120px" class="combobox ui-corner-all">
													<option value="0">Kilograms</option>
													<option value="1">Pounds</option>
												</select>
											</td>
										</tr>
									</table>
								</div>
							</div>
							<br>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="RFXMeter/Counter Dividers"></span>:</h2>
									<table class="display" id="rfxmetertable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:80px"><label><span data-i18n="Energy"></span>: </label></td>
										<td><input type="input" id="EnergyDivider" name="EnergyDivider" style="width: 80px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
										<td align="right" style="width:90px"><label><span data-i18n="Costs"></span> T1: </label></td>
										<td><input type="input" id="CostEnergy" name="CostEnergy" style="width: 60px; padding: .2em;" class="text ui-widget-content ui-corner-all"> / kWh</td>
										<td align="right" style="width:90px"><label><span data-i18n="Costs"></span> T2: </label></td>
										<td><input type="input" id="CostEnergyT2" name="CostEnergyT2" style="width: 60px; padding: .2em;" class="text ui-widget-content ui-corner-all"> / kWh</td>
									</tr>
									<tr>
										<td align="right" style="width:80px"><label><span data-i18n="Max Power"></span>: </label></td>
										<td><input type="input" id="MaxElectricPower" name="MaxElectricPower" style="width: 80px; padding: .2em;" class="text ui-widget-content ui-corner-all"> / Watt</td>
										<td align="right" style="width:90px"><label><span data-i18n="Costs"></span> R1: </label></td>
										<td><input type="input" id="CostEnergyR1" name="CostEnergyR1" style="width: 60px; padding: .2em;" class="text ui-widget-content ui-corner-all"> / kWh</td>
										<td align="right" style="width:90px"><label><span data-i18n="Costs"></span> R2: </label></td>
										<td><input type="input" id="CostEnergyR2" name="CostEnergyR2" style="width: 60px; padding: .2em;" class="text ui-widget-content ui-corner-all"> / kWh</td>
									</tr>
									<tr>
										<td align="right" style="width:80px"><label><span data-i18n="Gas"></span>: </label></td>
										<td><input type="input" id="GasDivider" name="GasDivider" style="width: 80px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
										<td align="right" style="width:60px"><label><span data-i18n="Costs"></span>: </label></td>
										<td><input type="input" id="CostGas" name="CostGas" style="width: 60px; padding: .2em;" class="text ui-widget-content ui-corner-all"> / m3</td>
									</tr>
									<tr>
										<td align="right" style="width:80px"><label><span data-i18n="Water"></span>: </label></td>
										<td><input type="input" id="WaterDivider" name="WaterDivider" style="width: 80px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
										<td align="right" style="width:60px"><label><span data-i18n="Costs"></span>: </label></td>
										<td><input type="input" id="CostWater" name="CostWater" style="width: 60px; padding: .2em;" class="text ui-widget-content ui-corner-all"> / m3</td>
									</tr>
									</table>
								</div>
							</div>
							<br>
							<div class="row-fluid">
								<div class="span12">
									<h2>OWL CM113/CM180i:</h2>
									<table class="display" id="owl113table" border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td align="right" style="width:60px"><label><span data-i18n="Voltage"></span>: </label></td>
											<td><input type="input" id="ElectricVoltage" name="ElectricVoltage" style="width: 40px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
										</tr>
										<tr>
											<td align="right" style="width:60px"><label><span data-i18n="Display"></span>: </label></td>
											<td><select id="comboscm113type" name="CM113DisplayType" style="width:120px" class="combobox ui-corner-all">
												<option value="0">Ampere</option>
												<option value="1">Watt</option>
											</select></td>
										</tr>
									</table>
								</div>
							</div>
							<br>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="(Dynamic) Price calculation"></span>:</h2>
									<table class="display" id="dpricetable" border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td align="right" style="width:200px"><label><span data-i18n="Electricity Price Device"></span>: </label></td>
											<td><select id="comboDPElectricity" name="HourIdxElectricityDevice" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Disabled" value="0">Disabled</option>
											</select></td>
										</tr>
										<tr>
											<td align="right"><label><span data-i18n="Gas Price Device"></span>: </label></td>
											<td><select id="comboDPGas" name="HourIdxGasDevice" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Disabled" value="0">Disabled</option>
											</select></td>
										</tr>
										<tr>
											<td align="right"><label><span data-i18n="P1 Electricity report display"></span>: </label></td>
											<td><select id="comboP1DisplayType" name="P1DisplayType" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Low/High Tariff" value="0"></option>
												<option data-i18n="Simple (Dynamic contract)" value="1"></option>
											</select></td>
										</tr>
									</table>
								</div>
							</div>
						</section>
					</div>
					<div class="tab-pane" id="tabenergydashboard">
						<!-- Energy Dashboard Settings
						================================================== -->
						<section id="metercounters">
							<div class="page-header-small">
								<h1 data-i18n="Energy Dashboard Setup">Energy Dashboard Setup</h1>
							</div>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="Device Assignment"></span>:</h2>
									<table class="display" id="dedevices" border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td align="right" style="width:250px"><label><span data-i18n="P1/Grid"></span>: </label></td>
											<td><select id="comboEP1" name="EP1" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Disabled" value="-1" selected="selected">Disabled</option>
											</select>&nbsp;kWh</td>
										</tr>
										<tr>
											<td align="right"><label><span data-i18n="Gas"></span>: </label></td>
											<td><select id="comboEGas" name="EGas" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Disabled" value="-1" selected="selected">Disabled</option>
											</select>&nbsp;m3</td>
										</tr>
										<tr>
											<td align="right"><label><span data-i18n="Water"></span>: </label></td>
											<td><select id="comboEWater" name="EWater" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Disabled" value="-1" selected="selected">Disabled</option>
											</select>&nbsp;m3/Liter/Gallons</td>
										</tr>
										<tr>
											<td align="right"><span data-i18n="Convert Water m3 To Liter"></span>:</td>
											<td><input type="checkbox" id="EConvertWaterM3ToLiter" name="EConvertWaterM3ToLiter"><label for="EConvertWaterM3ToLiter"></label></td>
										</tr>
										<tr>
											<td align="right"><label><span data-i18n="Solar"></span>: </label></td>
											<td><select id="comboESolar" name="ESolar" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Disabled" value="-1" selected="selected">Disabled</option>
											</select>&nbsp;Watt</td>
										</tr>
										<tr>
											<td align="right"><label><span data-i18n="Battery"></span>: </label></td>
											<td><select id="comboEBatteryWatt" name="EBatteryWatt" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Disabled" value="-1" selected="selected">Disabled</option>
											</select>&nbsp;Watt</td>
										</tr>
										<tr>
											<td align="right"><label><span data-i18n="Battery SOC"></span>: </label></td>
											<td><select id="comboEBatterySoc" name="EBatterySoc" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Disabled" value="-1" selected="selected">Disabled</option>
											</select>&nbsp;%</td>
										</tr>
										<tr>
											<td align="right" style="width:200px"><label><span data-i18n="Text Device"></span>: </label></td>
											<td><select id="comboETextSensor" name="ETextSensor" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Disabled" value="-1" selected="selected">Disabled</option>
											</select></td>
										</tr>
									</table>
								</div>
							</div>
							<div class="row-fluid">
								<div class="span12">
									<table class="display" id="dedevicesextra1" border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td align="right" style="width:250px"><label><span data-i18n="Custom Widget"></span>&nbsp;1: </label></td>
											<td><select id="comboEExtra1" name="EExtra1" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Disabled" value="-1" selected="selected">Disabled</option>
											</select></td>
										</tr>
										<tr>
											<td align="right"><label><span data-i18n="Field"></span>: </label></td>
											<td><select id="comboEExtra1Field" name="EExtra1Field" style="width:380px" class="combobox ui-corner-all">
												<option value="Data" selected="selected">Data</option>
												<option value="Usage">Usage</option>
												<option value="CounterToday">CounterToday</option>
												<option value="Counter">Counter</option>
											</select></td>
										</tr>
										<tr>
											<td align="right"><label><span data-i18n="Icon"></span>: </label></td>
											<td><select id="comboEExtra1Icon" name="EExtra1Icon" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Car" value="car" selected="selected">Car</option>
												<option data-i18n="Heater" value="heater">Heater</option>
												<option data-i18n="Power" value="power">power</option>
												<option data-i18n="Wave" value="wave">Wave</option>
												<option data-i18n="Other" value="other">Other</option>
											</select></td>
										</tr>
									</table>
								</div>
							</div>
							<div class="row-fluid">
								<div class="span12">
									<table class="display" id="dedevicesextra2" border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td align="right" style="width:250px"><label><span data-i18n="Custom Widget"></span>&nbsp;2: </label></td>
											<td><select id="comboEExtra2" name="EExtra2" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Disabled" value="-1" selected="selected">Disabled</option>
											</select></td>
										</tr>
										<tr>
											<td align="right"><label><span data-i18n="Field"></span>: </label></td>
											<td><select id="comboEExtra2Field" name="EExtra2Field" style="width:380px" class="combobox ui-corner-all">
												<option value="Data" selected="selected">Data</option>
												<option value="Usage">Usage</option>
												<option value="CounterToday">CounterToday</option>
												<option value="Counter">Counter</option>
											</select></td>
										</tr>
										<tr>
											<td align="right"><label><span data-i18n="Icon"></span>: </label></td>
											<td><select id="comboEExtra2Icon" name="EExtra2Icon" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Car" value="car">Car</option>
												<option data-i18n="Heater" value="heater">Heater</option>
												<option data-i18n="Power" value="power" selected="selected">power</option>
												<option data-i18n="Wave" value="wave">Wave</option>
												<option data-i18n="Other" value="other">Other</option>
											</select></td>
										</tr>
									</table>
								</div>
							</div>
							<div class="row-fluid">
								<div class="span12">
									<table class="display" id="dedevicesextra3" border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td align="right" style="width:250px"><label><span data-i18n="Custom Widget"></span>&nbsp;3: </label></td>
											<td><select id="comboEExtra3" name="EExtra3" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Disabled" value="-1" selected="selected">Disabled</option>
											</select></td>
										</tr>
										<tr>
											<td align="right"><label><span data-i18n="Field"></span>: </label></td>
											<td><select id="comboEExtra3Field" name="EExtra3Field" style="width:380px" class="combobox ui-corner-all">
												<option value="Data" selected="selected">Data</option>
												<option value="Usage">Usage</option>
												<option value="CounterToday">CounterToday</option>
												<option value="Counter">Counter</option>
											</select></td>
										</tr>
										<tr>
											<td align="right"><label><span data-i18n="Icon"></span>: </label></td>
											<td><select id="comboEExtra3Icon" name="EExtra3Icon" style="width:380px" class="combobox ui-corner-all">
												<option data-i18n="Car" value="car">Car</option>
												<option data-i18n="Heater" value="heater">Heater</option>
												<option data-i18n="Power" value="power">power</option>
												<option data-i18n="Wave" value="wave" selected="selected">Wave</option>
												<option data-i18n="Other" value="other">Other</option>
											</select></td>
										</tr>
									</table>
								</div>
							</div>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="Additional Settings"></span>:</h2>
									<table class="display" id="desettings" border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td align="right" style="width:250px"><span data-i18n="Display Server Time"></span>:</td>
											<td><input type="checkbox" id="EDisplayTime" name="EDisplayTime"><label for="EDisplayTime"></label></td>
										</tr>
										<tr>
											<td align="right"><span data-i18n="Display Flow with Lines"></span>:</td>
											<td><input type="checkbox" id="EDisplayFlowWithLines" name="EDisplayFlowWithLines" checked><label for="EDisplayFlowWithLines"></label></td>
										</tr>
										<tr>
											<td align="right"><span data-i18n="Custom Icons"></span>:</td>
											<td><input type="checkbox" id="EUseCustomIcons" name="EUseCustomIcons"><label for="EUseCustomIcons"></label></td>
										</tr>
									</table>
								</div>
							</div>
						</section>
					</div>
					<div class="tab-pane" id="tabfloorplan">
						<!-- Floorplans
						================================================== -->
						<section id="floorplans">
							<div class="page-header-small">
								<h1 data-i18n="Floorplan">Floorplan</h1>
							</div>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="General"></span>:</h2>
									<table class="display" id="floorplanoptionstable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:150px; vertical-align:top"><label><span data-i18n="Popup Activation Delay"></span>: </label></td>
										<td><input type="input" id="FloorplanPopupDelay" name="FloorplanPopupDelay" style="width: 50px; padding: .2em;" class="text ui-widget-content ui-corner-all"><br>
										(<span data-i18n="Milliseconds"></span>)</td>
									</tr>
									<tr>
										<td align="right" style="width:150px"><span data-i18n="Fullscreen Mode">Fullscreen Mode</span>:</td>
										<td><input type="checkbox" id="FloorplanFullscreenMode" name="FloorplanFullscreenMode"><label for="FloorplanFullscreenMode"></label></td>
									</tr>
									<tr>
										<td align="right" style="width:150px"><span data-i18n="Animate Transitions">Animate Transitions</span>:</td>
										<td><input type="checkbox" id="FloorplanAnimateZoom" name="FloorplanAnimateZoom"><label for="FloorplanAnimateZoom"></label></td>
									</tr>
									</table>
								</div>
							</div>
							<br>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="Display Values"></span>:</h2>
									<table class="display" id="floorplandisplaytable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:150px; vertical-align:top"><span data-i18n="Sensors"></span>:</td>
										<td><input type="checkbox" id="FloorplanShowSensorValues" name="FloorplanShowSensorValues"><label for="FloorplanShowSensorValues"></label></td>
									</tr>
									<tr>
										<td align="right" style="width:150px"><span data-i18n="Switches"></span>:</td>
										<td><input type="checkbox" id="FloorplanShowSwitchValues" name="FloorplanShowSwitchValues"><label for="FloorplanShowSwitchValues"></label></td>
									</tr>
									<tr>
										<td align="right" style="width:150px"><span data-i18n="Scenes"></span>:</td>
										<td><input type="checkbox" id="FloorplanShowSceneNames" name="FloorplanShowSceneNames"><label for="FloorplanShowSceneNames"></label></td>
									</tr>
									</table>
								</div>
							</div>
							<br>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="Colour Options"></span>:</h2>
									<table class="display" id="floorplancolourtable" border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td align="right" style="width:250px; vertical-align:top"><label><span data-i18n="Room Area Colour"></span>: </label></td>
											<td><input type="input" id="FloorplanRoomColour" name="FloorplanRoomColour" style="width: 120px; padding: .2em;" class="text ui-widget-content ui-corner-all"><br>
											<a href="http://www.december.com/html/spec/colorsvg.html" class="norm-link" target="HTML Colours"><span class="norm-link" data-i18n="Colour name or HEX value"></span></a></td>
										</tr>
										<tr>
											<td align="right" style="width:250px"><label><span data-i18n="Active Room Area Opacity"></span>: </label></td>
											<td><select id="FloorplanActiveOpacity" name="FloorplanActiveOpacity" style="width:70px" class="combobox ui-corner-all">
												<option value="0">0%</option>
												<option value="5">5%</option>
												<option value="10">10%</option>
												<option value="20">20%</option>
												<option value="25">25%</option>
												<option value="33">33%</option>
												<option value="50">50%</option>
												<option value="66">66%</option>
												<option value="75">75%</option>
												<option value="90">90%</option>
												<option value="100">100%</option>
											</select></td>
										</tr>
										<tr>
											<td align="right" style="width:250px"><label><span data-i18n="Inactive Room Area Opacity"></span>: </label></td>
											<td><select id="FloorplanInactiveOpacity" name="FloorplanInactiveOpacity" style="width:70px" class="combobox ui-corner-all">
												<option value="0">0%</option>
												<option value="5">5%</option>
												<option value="10">10%</option>
												<option value="20">20%</option>
												<option value="25">25%</option>
												<option value="33">33%</option>
												<option value="50">50%</option>
												<option value="66">66%</option>
												<option value="75">75%</option>
												<option value="90">90%</option>
												<option value="100">100%</option>
											</select></td>
										</tr>
									</table>
								</div>
							</div>
						</section>
					</div>
					<div class="tab-pane" id="tabsecurity">
						<!-- Security
						================================================== -->
						<section id="security">
							<div class="page-header-small">
								<h1><span data-i18n="SecuritySetup">Security Setup</span>&nbsp;<span><a class="norm-link" href="https://wiki.domoticz.com/Security" target="_blank"><i class="fa-regular fa-circle-info norm-link"></i></a></span></h1>
							</div>
							<div class="row-fluid">
								<div class="span6">
									<h2><span data-i18n="ApiProtection"></span>:</h2>
									<table class="display" id="webtable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td colspan="2"><input type="checkbox" id="AllowPlainBasicAuth" name="AllowPlainBasicAuth"> <label for="AllowPlainBasicAuth" data-i18n="AllowPlainBasicAuth"></label></td>
									</tr>
									</table>
								</div>
								<div class="span6">
									<h2><span data-i18n="RemoteSharedPortForDomoticzClients"></span>:</h2>
									<table class="display" id="remotesharedtable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:60px"><label><span data-i18n="Port"></span>: </label></td>
										<td><input type="input" id="RemoteSharedPort" name="RemoteSharedPort" style="width: 70px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
									</tr>
									</table>
								</div>
							</div>
							<div class="row-fluid">
								<div class="span6">
									<h2><span data-i18n="Light/Switch Protection">Light/Switch Protection</span>:</h2>
									<table class="display" id="protectiontable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:60px"><label><span data-i18n="Password"></span>: </label></td>
										<td><input type="password" id="ProtectionPassword" name="ProtectionPassword" style="width: 200px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
									</tr>
									</table>
								</div>
								<div class="span6">
									<h2><span data-i18n="SecurityPanel"></span>:</h2>
									<table class="display" id="sectable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:60px"><label><span data-i18n="Password"></span>: </label></td>
										<td><input type="password" id="SecPassword" name="SecPassword" style="width: 200px; padding: .2em;" class="text ui-widget-content ui-corner-all"></td>
									</tr>
									<tr>
										<td align="right" style="width:60px"><label><span data-i18n="Delay">Delay</span>: </label></td>
										<td>
											<input type="input" id="SecOnDelay" name="SecOnDelay" style="width: 70px; padding: .2em;" class="text ui-widget-content ui-corner-all"><br>
											<span data-i18n="(seconds, 0=no delay)"></span>
										</td>
									</tr>
									</table>
								</div>
							</div>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="LocalNetworks(no_username/password)"></span>:</h2>
									<table class="display" id="weblocaltable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:60px"><label><span data-i18n="Networks"></span>: </label></td>
										<td>
											<input type="input" id="WebLocalNetworks" name="WebLocalNetworks" style="width: 300px; padding: .2em;" class="text ui-widget-content ui-corner-all"><br>
											<span data-i18n="(Separate by a semicolon, For Example"></span>: 127.0.0.*;192.168.0.*)
										</td>
									</tr>
									</table>
								</div>
							</div>
							<div>
								<div class="span12">
									<a class="norm-link" href="https://wiki.domoticz.com/Security" target="_blank"><span class="norm-link" data-i18n="SecurityInfo"></span></a>
								</div>
							</div>
						</section>
					</div>
					<div class="tab-pane" id="tabother">
						<!-- Other Settings
						================================================== -->
						<section id="othersettings">
							<div class="page-header-small">
								<h1 data-i18n="Other Settings"></h1>
							</div>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="Random Timer"></span>:</h2>
									<table class="display" id="randomtable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:90px; vertical-align:top"><label><span data-i18n="Spread"></span>: </label></td>
										<td><input type="input" id="RandomSpread" name="RandomSpread" style="width: 50px; padding: .2em;" class="text ui-widget-content ui-corner-all"><br>
										<span data-i18n="(Minutes +/-)"></span></td>
									</tr>
									</table>
								</div>
							</div>
							<br>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="Sensor Timeout"></span>:</h2>
									<table class="display" id="timeouttable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:90px; vertical-align:top"><label><span data-i18n="Timeout"></span>: </label></td>
										<td><input type="input" id="SensorTimeout" name="SensorTimeout" style="width: 50px; padding: .2em;" class="text ui-widget-content ui-corner-all"><br>
										(<span data-i18n="Minutes"></span>)</td>
									</tr>
									</table>
								</div>
							</div>
							<br>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="Battery Low Level"></span>:</h2>
									<table class="display" id="batterytable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:90px; vertical-align:top"><label><span data-i18n="Level"></span>: </label></td>
										<td><input type="input" id="BatterLowLevel" name="BatterLowLevel" style="width: 50px; padding: .2em;" class="text ui-widget-content ui-corner-all"><br>
										(%, <span data-i18n="0 = Disabled"></span>)</td>
									</tr>
									</table>
								</div>
							</div>
							<br>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="Timer Plan">Timer Plan</span>:</h2>
									<table class="display" id="timerplantable" border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td align="right" style="width:90px"><label><span data-i18n="Plan">Plan</span>: </label></td>
											<td><select id="comboTimerplan" name="ActiveTimerPlan" style="width:220px" class="combobox ui-corner-all">
											</select></td>
										</tr>
									</table>
								</div>
							</div>
							<br>
							<!-- <br> -->
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="Doorbell Command"></span>:</h2>
									<table class="display" id="doorbelltable" border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td align="right" style="width:90px"><label><span data-i18n="Command"></span>: </label></td>
											<td><select id="comboDoorbellCommand" name="DoorbellCommand" style="width:120px" class="combobox ui-corner-all">
												<option data-i18n="Group On" value="0">Group On</option>
												<option data-i18n="On" value="1">On</option>
											</select></td>
										</tr>
									</table>
								</div>
							</div>
							<br>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="Raspberry Pi Camera Parameters"></span>:</h2>
									<table class="display" id="picamtable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:90px; vertical-align:top;"><label><span data-i18n="Params"></span>: </label></td>
										<td>
											<input type="input" id="RaspCamParams" name="RaspCamParams" style="width: 300px; padding: .2em;" class="text ui-widget-content ui-corner-all"><br>
											(<span data-i18n="default"></span>: -w 800 -h 600 -t 1)
										</td>
									</tr>
									</table>
								</div>
							</div>
							<br>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="UVC Parameters"></span>:</h2>
									<table class="display" id="uvctable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:90px; vertical-align:top;"><label><span data-i18n="Params"></span>: </label></td>
										<td>
											<input type="input" id="UVCParams" name="UVCParams" style="width: 300px; padding: .2em;" class="text ui-widget-content ui-corner-all"><br>
											(<span data-i18n="default"></span>: -S80 -B128 -C128 -G80 -x800 -y600 -q100)
										</td>
									</tr>
									</table>
								</div>
							</div>
							<br>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="EventSystem (Lua/Blockly/Scripts)"></span>:</h2>
									<table class="display" id="eventsystemtable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:90px"><span data-i18n="Enabled"></span>:</td>
										<td><input type="checkbox" id="EnableEventScriptSystem" name="EnableEventScriptSystem"><label for="EnableEventScriptSystem"></label></td>
									</tr>
									<tr>
										<td style="width:90px"></td>
										<td><input type="checkbox" id="LogEventScriptTrigger" name="LogEventScriptTrigger"><label for="LogEventScriptTrigger"><span data-i18n="Log 'event script triggers'">Log 'event script triggers'</span></label></td>
									</tr>
									<tr>
										<td style="width:90px"></td>
										<td><input type="checkbox" id="EventSystemLogFullURL" name="EventSystemLogFullURL"><label for="EventSystemLogFullURL"><span data-i18n="Log 'URL calls with full URL path'">Log 'URL calls with full URL path'</span></label></td>
									</tr>
									</table>
								</div>
							</div>
							<br>
							<div class="row-fluid">
								<div class="span12">
									<h2><span data-i18n="dzVents">dzVents</span>:</h2>
									<table class="display" id="dzventstable" border="0" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" style="width:90px"><span data-i18n="Enabled"></span>:</td>
										<td><input type="checkbox" id="DisableDzVentsSystem" name="DisableDzVentsSystem"><label for="DisableDzVentsSystem"></label></td>
									</tr>
									<tr>
										<td align="right"><label>Log Level:</label></td>
										<td>
											<select class="combobox ui-corner-all" id="comboDzVentsLogLevel" name="DzVentsLogLevel" style="width:300px">
												<option data-i18n="Errors" value="0">Errors</option>
												<option data-i18n="Status, Errors" value="1">Status, Errors</option>
												<option data-i18n="Info, Status, Errors" value="2">Info, Status, Errors</option>
												<option data-i18n="Info, Status, Errors, Execution Info" value="3">Info, Status, Errors, Execution Info</option>
												<option data-i18n="Debug (everything)" value="4">Debug (everything)</option>
											</select>
										</td>
									</tr>
									</table>
								</div>
							</div>
						</section>
					</div>
					<div class="tab-pane" id="tabbackuprestore">
						<!-- Restore Database
						================================================== -->
						<section id="restoredatabase">
						  <div class="page-header-small">
							<h1 data-i18n="Backup / Restore Database"></h1>
						</div>
							<div class="row-fluid">
								<div class="span12">
                                    <br>
									<center><a data-i18n="Backup Database" class="btn btn-primary" href="backupdatabase.php" download>Backup Database</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a data-i18n="Restore Database" class="btn btn-warning" href="javascript:SwitchLayout('RestoreDatabase')">Restore Database</a></center>
                                    <br>
								</div>
							</div>
						</section>
					</div>
				</div>
			</div>
		</form>
	</div>
</div>
