iobroker.shuttercontrol
Version:
Automatic control for shutters
1,120 lines • 88.8 kB
HTML
<html>
<head>
<!-- Load ioBroker scripts and styles-->
<link rel="stylesheet" type="text/css" href="../../lib/css/fancytree/ui.fancytree.min.css" />
<link rel="stylesheet" type="text/css" href="../../css/adapter.css" />
<link rel="stylesheet" type="text/css" href="../../lib/css/materialize.css">
<script type="text/javascript" src="../../lib/js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="../../socket.io/socket.io.js"></script>
<script type="text/javascript" src="../../lib/js/materialize.js"></script>
<script type="text/javascript" src="../../lib/js/jquery-ui.min.js"></script>
<script type="text/javascript" src="../../lib/js/jquery.fancytree-all.min.js"></script>
<script type="text/javascript" src="../../js/translate.js"></script>
<script type="text/javascript" src="../../lib/js/selectID.js"></script>
<script type="text/javascript" src="../../js/adapter-settings.js"></script>
<!---
<script type="text/javascript" src="actions.js"></script>
-->
<!-- Load our own files -->
<script type="text/javascript" src="words.js"></script>
<script type="text/javascript" src="index_m.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div class="m adapter-container">
<div id="header-area" class="row" >
<div id="header-logo-title" class="col s10 l6" >
<img class="logo" src="shuttercontrol.png" >
<p>
<span class="translate h-title">Shuttercontrol</span><br />
<span class="translate h-sub-title">Controlling your Shutter…</span>
</p>
</div>
</div>
<div class="row">
<div class="col s12" id="tab-area">
<ul class="tabs" width="4%">
<li class="tab col s6 l4"><a href="#tab-settings" class="translate active">main settings</a></li>
<li class="tab col s6 l4 tab-time"><a href="#tab-time" class="translate">Time Settings</a></li>
<li class="tab col s6 l4 tab-extra"><a href="#tab-extra" class="translate">Extra Settings</a></li>
</ul>
</div>
<div class="row" id="mainSettings">
<!-- main settings -->
<div id="tab-settings" class="col s12 page">
<div class="row">
<div class="col s12">
<h6 class="translate title" style="background-color:#174475;">Shutter config</h6>
</div>
</div>
<div class="row">
<div class="col s12" id="events">
<div class="row">
<div class="col s2 m1 l1 left">
<a id="responseOIDDialog" class="btn-floating waves-effect waves-light blue table-button-add"><i class="material-icons">add</i></a>
</div>
<div class="col s10 m4 l3 right">
<a class="right" title="PayPal.Me" href="https://paypal.me/mk1676" target="_blank">
<img class="material-icons right" src="https://img.shields.io/badge/paypal-donate%20%7C%20spenden-blue.svg">
</a>
<a class="right" style="padding-right: 0.3rem;"" title="GitHub Sponsors" href="https://github.com/sponsors/simatec" target="_blank">
<img class="material-icons right" src="https://img.shields.io/static/v1?label=Sponsor&message=%E2%9D%A4&logo=GitHub&color=%23fe8e86">
</a>
</div>
</div>
<div class="table-values-div">
<table class="table-values">
<thead>
<tr>
<th data-name="_index" id="events_col_0" style="background: #174475; text-align: center" data-style="text-align: center">Nr</th>
<th data-name="enabled" id="events_col_1" style="background: #174475" data-style="width: 70px" data-label="active" data-type="checkbox" class="translate">active</th>
<th data-name="shutterName" id="events_col_2" data-type="text" style="background: #174475" data-label="Name" class="translate">Name</th>
<th data-name="name" id="events_col_3" data-type="text" style="background: #174475" data-label="Object-ID shutter" class="translate">Object-ID shutter</th>
<th data-buttons="edit2" id="events_col_4" style="background: #174475; height: 40px" data-style="width: 150px; text-align: left"></th>
<th data-buttons="edit copy up down delete" style="background: #174475"></th>
<!-- ********************** only for temp states ********************** -->
<th data-name="triggerID" id="events_col_5" data-type="text" style="width: 25%; background: #174475" class="translate">Trigger ID</th>
<th data-name="typeUp" id="events_col_6" data-type="text" style="width: 20%; background: #174475" class="translate">type up</th>
<th data-name="typeDown" id="events_col_7" data-type="text" style="width: 20%; background: #174475" class="translate">type down</th>
<th data-name="type" id="events_col_8" data-type="text" style="width: 25%; background: #174475" class="translate">Type of control</th>
<th data-name="heightDownSun" id="events_col_9" data-type="number" style="width: 0px" class="translate"></th>
<th data-name="direction" id="events_col_10" data-type="number" style="width: 0px" class="translate"></th>
<th data-name="directionRange" id="events_col_11" data-type="number" style="width: 0px" class="translate"></th>
<th data-name="tempInside" id="events_col_12" data-type="number" style="width: 0px" class="translate"></th>
<th data-name="tempSensor" id="events_col_13" data-type="text" style="width: 25%; background: #174475" class="translate">Temp sensor Inside</th>
<th data-name="outsideTempSensor" id="events_col_14" data-type="text" style="width: 25%; background: #174475" class="translate">Temp sensor Outside</th>
<th data-name="tempOutside" id="events_col_15" data-type="number" style="width: 0px" class="translate"></th>
<th data-name="lightSensor" id="events_col_16" data-type="text" style="width: 25%; background: #174475" class="translate">Light Sensor</th>
<th data-name="valueLight" id="events_col_17" data-type="number" style="width: 0px" class="translate"></th>
<th data-name="heightUp" id="events_col_18" data-type="number" style="width: 0px" class="translate">height up</th>
<th data-name="heightDown" id="events_col_19" data-type="number" style="width: 0px" class="translate">height down</th>
<th data-name="triggerState" id="events_col_20" style="width: 0px" data-style="width: 0px" data-type="text" class="translate">State from Trigger</th>
<th data-name="triggerStateTilted" id="events_col_20" style="width: 0px" data-style="width: 0px" data-type="text" class="translate">State from TriggerTilted</th>
<th data-name="triggerDrive" id="events_col_21" data-type="number" style="width: 0px" class="translate">height for trigger</th>
<th data-name="triggerDriveTildet" id="events_col_21" data-type="number" style="width: 0px" class="translate">height for trigger tildet</th>
<th data-name="triggerChange" id="events_col_22" style="width: 0px" data-style="width: 0px" data-type="text" class="translate">Drive by Trigger </th>
<th data-name="elevation" id="events_col_23" data-type="number" style="width: 0px" class="translate">Elevation</th>
<th data-name="autoDrive" id="events_col_24" style="width: 0px" data-style="width: 0px" data-type="text" class="translate">auto Drive Shutter</th>
<th data-name="hysteresisOutside" id="events_col_25" data-type="number" style="width: 0px" class="translate">hysteresisOutside</th>
<th data-name="hysteresisInside" id="events_col_26" data-type="number" style="width: 0px" class="translate">hysteresisInside</th>
<th data-name="hysteresisLight" id="events_col_27" data-type="number" style="width: 0px" class="translate">hysteresisLight</th>
<th data-name="currentAction" id="events_col_28" style="width: 0px" data-style="width: 0px" data-type="text" class="translate">current Action</th>
<th data-name="currentHeight" id="events_col_29" data-type="number" style="width: 0px" class="translate"></th>
<th data-name="oldHeight" id="events_col_30" data-type="number" style="width: 0px" class="translate"></th>
<th data-name="firstCompleteUp" id="events_col_31" data-type="number" style="width: 0px" class="translate"></th>
<th data-name="triggerHeight" id="events_col_32" data-type="number" style="width: 0px" class="translate"></th>
<th data-name="LateDown" id="events_col_33" style="width: 0px" data-style="width: 0px" data-type="checkbox" class="translate">LateDown</th>
<th data-name="inSummerNotDown" id="events_col_34" style="width: 0px" data-style="width: 0px" data-type="checkbox" class="translate">inSummerNotDown</th>
<th data-name="KeepSunProtect" id="events_col_35" style="width: 0px" data-style="width: 0px" data-type="checkbox" class="translate">KeepSunProtect</th>
<th data-name="triggerAction" id="events_col_36" style="width: 0px" data-style="width: 0px" data-type="text" class="translate"></th>
<th data-name="driveAfterClose" id="events_col_37" style="width: 0px" data-style="width: 0px" data-type="checkbox" class="translate">DriveAfterClose</th>
<th data-name="useXmasLevel" id="events_col_38" style="width: 0px" data-style="width: 0px" data-type="checkbox" class="translate">useXmasLevel</th>
<th data-name="XmasLevel" id="events_col_39" style="width: 0px" data-style="width: 0px" data-type="number" class="translate">XmasLevel</th>
<th data-name="betweenPosition" id="events_col_40" style="width: 0px" data-style="width: 0px" data-type="checkbox" class="translate">betweenPosition</th>
<th data-name="betweenPositionLevel" id="events_col_41" style="width: 0px" data-style="width: 0px" data-type="number" class="translate">betweenPositionLevel</th>
<th data-name="trigDelyUp" id="events_col_40" style="width: 0px" data-style="width: 0px" data-type="number" class="translate">trigDelyUp</th>
<th data-name="trigDelyDown" id="events_col_41" style="width: 0px" data-style="width: 0px" data-type="number" class="translate">trigDelyDown</th>
<th data-name="sunProtectEndDely" id="events_col_42" style="width: 0px" data-style="width: 0px" data-type="number" class="translate">sunProtectEndDely</th>
<th data-name="sunProtectEndtimerid" id="events_col_43" style="width: 0px" data-style="width: 0px" data-type="number" class="translate"></th>
<th data-name="enableAlarmWind1" id="events_col_44" style="width: 0px" data-style="width: 0px" data-type="checkbox" class="translate">enableAlarmWind1</th>
<th data-name="enableAlarmWind2" id="events_col_45" style="width: 0px" data-style="width: 0px" data-type="checkbox" class="translate">enableAlarmWind2</th>
<th data-name="enableAlarmRain" id="events_col_46" style="width: 0px" data-style="width: 0px" data-type="checkbox" class="translate">enableAlarmRain</th>
<th data-name="enableAlarmFrost" id="events_col_47" style="width: 0px" data-style="width: 0px" data-type="checkbox" class="translate">enableAlarmFrost</th>
<th data-name="enableAlarmFire" id="events_col_48" style="width: 0px" data-style="width: 0px" data-type="checkbox" class="translate">enableAlarmFire</th>
<th data-name="alarmTriggerAction" id="events_col_54" style="width: 0px" data-style="width: 0px" data-type="text" class="translate"></th>
<th data-name="alarmTriggerLevel" id="events_col_55" data-type="number" style="width: 0px" class="translate"></th>
<th data-name="lastAutoAction" id="events_col_56" style="width: 0px" data-style="width: 0px" data-type="text" class="translate">lastAutoAction</th>
<th data-name="tempHeatProtection" id="events_col_57" style="width: 0px" data-style="width: 0px" data-type="number" class="translate">tempHeatProtection</th>
<th data-name="heatProtection" id="events_col_58" style="width: 0px" data-style="width: 0px" data-type="checkbox" class="translate">heatProtection</th>
<th data-name="ignoreTriggerAutoState" id="events_col_59" style="width: 0px" data-style="width: 0px" data-type="checkbox" class="translate">ignoreTriggerAutoState</th>
<!-- ****************************************************************** -->
</tr>
</thead>
</table>
</div>
</div>
</div>
</div>
<!-- time settings -->
<div id="tab-time" class="col s12 page">
<div class="row">
<div class="col s12">
<h6 class="translate title" style="background-color:#174475;">Time Settings</h6>
</div>
</div>
<ul class="collapsible">
<!-- Settings for Livingarea -->
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">Settings for Livingarea</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="input-field col s12 m4">
<select class="value" id="livingAutomatic">
<option value="livingTime" class="translate">only living area time</option>
<option value="livingSunriseSunset" class="translate">automatic living area time with sunrise and sunset</option>
<option value="livingGoldenHour" class="translate">automatic living area time with Golden hour</option>
</select>
<label for="livingAutomatic" class="translate"></label>
<span class="translate">Automatic for living area</span>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="text" class="timepicker value" id="W_shutterDownLiving" />
<label for="W_shutterDownLiving" class="translate"></label>
<span class="translate">Shut down on the week</span>
</div>
<div class="col s12 l2 input-field">
<input type="text" class="timepicker value" id="W_shutterUpLivingMin" />
<label for="W_shutterUpLivingMin" class="translate"></label>
<span class="translate">Min Time for Driving up on the week</span>
</div>
<div class="col s12 l2 input-field">
<input type="text" class="timepicker value" id="W_shutterUpLivingMax" />
<label for="W_shutterUpLivingMax" class="translate"></label>
<span class="translate">Max Time for Driving up on the week</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" class="value" id="driveDelayUpLiving" />
<label for="driveDelayUpLiving" class="translate"></label>
<span class="translate">Time delay for driving the shutters (seconds)</span>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="text" class="timepicker value" id="WE_shutterDownLiving" />
<label for="WE_shutterDownLiving" class="translate"></label>
<span class="translate">Shut down on the weekend</span>
</div>
<div class="col s12 l2 input-field col-WE_shutterUpLivingMin">
<input type="text" class="timepicker value" id="WE_shutterUpLivingMin" />
<label for="WE_shutterUpLivingMin" class="translate"></label>
<span class="translate">Min Time for Driving up on the weekend</span>
</div>
<div class="col s12 l2 input-field">
<input type="text" class="timepicker value" id="WE_shutterUpLivingMax" />
<label for="WE_shutterUpLivingMax" class="translate"></label>
<span class="translate">Max Time for Driving up on the weekend</span>
</div>
</div>
</div>
</li>
<!-- Settings for Sleeparea -->
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">Settings for Sleeparea</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="input-field col s12 m4">
<select class="value" id="sleepAutomatic">
<option value="sleepTime" class="translate">only sleep area time</option>
<option value="sleepSunriseSunset" class="translate">automatic sleep area time with sunrise and sunset</option>
<option value="sleepGoldenHour" class="translate">automatic sleep area time with Golden hour</option>
</select>
<label for="sleepAutomatic" class="translate"></label>
<span class="translate">Automatic for sleep area</span>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="text" class="timepicker value" id="W_shutterDownSleep" />
<label for="W_shutterDownSleep" class="translate"></label>
<span class="translate">Shut down on the week</span>
</div>
<div class="col s12 l2 input-field col-W_shutterUpSleepMin">
<input type="text" class="timepicker value" id="W_shutterUpSleepMin" />
<label for="W_shutterUpSleepMin" class="translate"></label>
<span class="translate">Min Time for Driving up on the week</span>
</div>
<div class="col s12 l2 input-field">
<input type="text" class="timepicker value" id="W_shutterUpSleepMax" />
<label for="W_shutterUpSleepMax" class="translate"></label>
<span class="translate">Max Time for Driving up on the week</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" class="value" id="driveDelayUpSleep" />
<label for="driveDelayUpSleep" class="translate"></label>
<span class="translate">Time delay for driving the shutters (seconds)</span>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="text" class="timepicker value" id="WE_shutterDownSleep" />
<label for="WE_shutterDownSleep" class="translate"></label>
<span class="translate">Shut down on the weekend</span>
</div>
<div class="col s12 l2 input-field col-WE_shutterUpSleepMin">
<input type="text" class="timepicker value" id="WE_shutterUpSleepMin" />
<label for="WE_shutterUpSleepMin" class="translate"></label>
<span class="translate">Min Time for Driving up on the weekend</span>
</div>
<div class="col s12 l2 input-field">
<input type="text" class="timepicker value" id="WE_shutterUpSleepMax" />
<label for="WE_shutterUpSleepMax" class="translate"></label>
<span class="translate">Max Time for Driving up on the weekend</span>
</div>
</div>
</div>
</li>
<!-- Settings for Childrenarea -->
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">Settings for Childrenarea</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="input-field col s12 m4">
<select class="value" id="childrenAutomatic">
<option value="childrenTime" class="translate">only children area time</option>
<option value="childrenSunriseSunset" class="translate">automatic children area time with sunrise and sunset</option>
<option value="childrenGoldenHour" class="translate">automatic children area time with Golden hour</option>
</select>
<label for="childrenAutomatic" class="translate"></label>
<span class="translate">Automatic for children area</span>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="text" class="timepicker value" id="W_shutterDownChildren" />
<label for="W_shutterDownChildren" class="translate"></label>
<span class="translate">Shut down on the week</span>
</div>
<div class="col s12 l2 input-field col-W_shutterUpChildrenMin">
<input type="text" class="timepicker value" id="W_shutterUpChildrenMin" />
<label for="W_shutterUpChildrenMin" class="translate"></label>
<span class="translate">Min Time for Driving up on the week</span>
</div>
<div class="col s12 l2 input-field">
<input type="text" class="timepicker value" id="W_shutterUpChildrenMax" />
<label for="W_shutterUpChildrenMax" class="translate"></label>
<span class="translate">Max Time for Driving up on the week</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" class="value" id="driveDelayUpChildren" />
<label for="driveDelayUpChildren" class="translate"></label>
<span class="translate">Time delay for driving the shutters (seconds)</span>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="text" class="timepicker value" id="WE_shutterDownChildren" />
<label for="WE_shutterDownChildren" class="translate"></label>
<span class="translate">Shut down on the weekend</span>
</div>
<div class="col s12 l2 input-field col-WE_shutterUpChildrenMin">
<input type="text" class="timepicker value" id="WE_shutterUpChildrenMin" />
<label for="WE_shutterUpChildrenMin" class="translate"></label>
<span class="translate">Min Time for Driving up on the weekend</span>
</div>
<div class="col s12 l2 input-field">
<input type="text" class="timepicker value" id="WE_shutterUpChildrenMax" />
<label for="WE_shutterUpChildrenMax" class="translate"></label>
<span class="translate">Max Time for Driving up on the weekend</span>
</div>
</div>
</div>
</li>
</ul>
</div>
<!-- Tab Extra -->
<div id="tab-extra" class="col s12 page">
<div class="row">
<div class="col s12">
<h6 class="translate title" style="background-color:#174475;">Extra Settings</h6>
</div>
</div>
<ul class="collapsible">
<!-- Settings for Astro -->
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">Astro settings</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 l2 input-field">
<input type="text" class="value" id="latitude" />
<label for="latitude" class="translate"></label>
<span class="translate">latitude</span>
</div>
<div class="col s12 l2 input-field">
<input type="text" class="value" id="longitude" />
<label for="longitude" class="translate"></label>
<span class="translate">longitude</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" id="sunProtEndElevation" class="value" min="-50.0" max="100.0" step="0.1" />
<label for="sunProtEndElevation" class="translate"></label>
<span class="translate">Sun Protect End with Elevation</span>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="number" class="value" id="astroDelayUp" />
<label for="astroDelayUp" class="translate"></label>
<span class="translate">Time delay for Driving up (minutes)</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" class="value" id="astroDelayDown" />
<label for="astroDelayDown" class="translate"></label>
<span class="translate">Time delay for Driving down (minutes)</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" class="value" id="driveDelayUpAstro" />
<label for="driveDelayUpAstro" class="translate"></label>
<span class="translate">Time delay for driving the shutters (seconds)</span>
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">summer settings</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 l2 input-field">
<input type="text" class="value" id="SummerStart" />
<label for="SummerStart" class="translate"></label>
<span class="translate">SummerStart</span>
</div>
<div class="col s12 l2 input-field">
<input type="text" class="value" id="SummerEnd" />
<label for="SummerEnd" class="translate"></label>
<span class="translate">SummerEnd</span>
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">xmas settings</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 l2 input-field">
<input type="text" class="value" id="XMasStart" />
<label for="XMasStart" class="translate"></label>
<span class="translate">XMasStart</span>
</div>
<div class="col s12 l2 input-field">
<input type="text" class="value" id="XMasEnd" />
<label for="XMasEnd" class="translate"></label>
<span class="translate">XMasEnd</span>
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">holiday settings</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 l12 input-field">
<input type="checkbox" class="value" id="publicHolidays" />
<span for="publicHolidays" class="translate">Use public holidays</span>
</div>
</div>
<div class="row">
<div class="input-field col s12 m6 l2 publicHol">
<select id="publicHolInstance" class="value"></select>
<label for="publicHolInstance" class="translate"></label>
<span class="translate">public holidays Instance</span>
</div>
</div>
<div class="row">
<div class="col s12 l3 input-field">
<input type="text" class="value" id="HolidayDP" />
<label for="HolidayDP" class="translate"></label>
<span class="translate">Object ID for holiday today</span>
</div>
<div class="col s1 m2 l1">
<a id="HolidayDPPopUp" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">lightsensor settings</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 l2 input-field">
<input type="number" class="value" id="lightsensorDown" />
<label for="lightsensorDown" class="translate"></label>
<span class="translate">Brightness value for down with lightsensor</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" class="value" id="lightsensorUp" />
<label for="lightsensorUp" class="translate"></label>
<span class="translate">Brightness value for up with lightsensor</span>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="text" class="timepicker value" id="lightsensorUpTime" />
<label for="lightsensorUpTime" class="translate"></label>
<span class="translate">earliest time for opening with light sensor</span>
</div>
<div class="col s12 l2 input-field ">
<input type="text" class="timepicker value" id="lightsensorDownTime" />
<label for="lightsensorDownTime" class="translate"></label>
<span class="translate">earliest time for closing with light sensor</span>
</div>
</div>
<div class="row">
<div class="col s12 l3 input-field">
<input type="text" class="value" id="lightsensorUpDown" />
<label for="lightsensorUpDown" class="translate"></label>
<span class="translate">Object ID for Lightsensor</span>
</div>
<div class="col s1 m2 l1">
<a id="LightsensorUpDownPopUp" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">schoolfree settings</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 l2 input-field">
<input type="checkbox" class="value" id="schoolfree" />
<span for="schoolfree" class="translate">Use the Schoolfree adapter</span>
</div>
<div class="input-field col s12 m6 l2 schoolf">
<select id="schoolfreeInstance" class="value"></select>
<label for="schoolfreeInstance" class="translate"></label>
<span class="translate">schoolfree Instance</span>
</div>
<div class="col s12 l3 input-field schoolf_off">
<input type="text" class="value" id="schoolfreeDP" />
<label for="schoolfreeDP" class="translate"></label>
<span class="translate">Object ID to activate / deactivate the school holidays</span>
</div>
<div class="col s1 m2 l1 schoolf_off">
<a id="schoolfreeDPPopUp" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="checkbox" class="value" id="schoolfreeChildrenArea" />
<span for="schoolfreeChildrenArea" class="translate">Use schoolfree for Children Area</span>
</div>
<div class="col s12 l2 input-field">
<input type="checkbox" class="value" id="schoolfreeSleepArea" />
<span for="schoolfreeSleepArea" class="translate">Use schoolfree for Sleep Area</span>
</div>
<div class="col s12 l2 input-field">
<input type="checkbox" class="value" id="schoolfreeLivingArea" />
<span for="schoolfreeLivingArea" class="translate">Use schoolfree for Living Area</span>
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">Special times</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 l12 input-field">
<input type="checkbox" class="value" id="LateAllDown" />
<span for="LateAllDown" class="translate">close certain shutters later (the individual shutters must be activated in the shutter settings)</span>
</div>
</div>
<div class="row">
<div class="col s12 m6 l4 input-field LateAllDownTime">
<input type="text" class="timepicker value" id="LateAllDownTime" />
<label for="LateAllDownTime" class="translate"></label>
<span class="translate">Time at which the roller shutters configured for this should close late</span>
</div>
<div class="col s12 m6 l4 input-field">
<input type="text" class="timepicker value" id="betweenPositionTime" />
<label for="betweenPositionTime" class="translate"></label>
<span class="translate">Time to completely close the shutters from the intermediate position</span>
</div>
<div class="col s12 m6 l4 input-field">
<input type="number" class="value" id="noGoTime" />
<label for="noGoTime" class="translate"></label>
<span class="translate">Time left to detect second sleep (minutes)</span>
</div>
</div>
<div class="row">
<div class="col s12 m6 l4 input-field">
<input type="checkbox" class="value" id="satIsWeek" />
<span for="satIsWeek" class="translate">Saturday is working week</span>
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">Extra Settings</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 m6 l4 input-field">
<input type="checkbox" class="value" id="currentShutterState" />
<span for="currentShutterState" class="translate">check current Shutter State</span>
</div>
<div class="col s12 m6 l4 input-field checkShutterState">
<input type="number" class="value" id="currentShutterStateTime" />
<label for="currentShutterStateTime" class="translate"></label>
<span class="translate">Waiting time for checking the shutter status (seconds)</span>
</div>
</div>
<div class="row">
<div class="col s12 m6 l4 input-field">
<input type="checkbox" class="value" id="blockManuMode" />
<span for="blockManuMode" class="translate">Blocking the Manu mode for known shutter heights</span>
</div>
</div>
<div class="row">
<div class="input-field col s12 m4">
<select class="value" id="shutterStateRound">
<option value=1 class="translate">off</option>
<option value=5 class="translate">on 5s rounds</option>
<option value=10 class="translate">on 10s rounds</option>
</select>
<label for="shutterStateRound" class="translate"></label>
<span class="translate">Rounding up or down the current shutter heights</span>
</div>
</div>
<div class="row">
<div class="col s12 l3 input-field">
<input type="text" class="value" id="triggerAutoSleep" />
<label for="triggerAutoSleep" class="translate"></label>
<span class="translate">Object ID of trigger for Auto Sleep</span>
</div>
<div class="col s1 m2 l1">
<a id="triggerAutoSleepDialog" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
<div class="col s12 l3 input-field">
<input type="text" class="value" id="triggerAutoLiving" />
<label for="triggerAutoLiving" class="translate"></label>
<span class="translate">Object ID of trigger for Auto Living</span>
</div>
<div class="col s1 m2 l1">
<a id="triggerAutoLivingDialog" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
<div class="col s12 l3 input-field">
<input type="text" class="value" id="triggerAutoChildren" />
<label for="triggerAutoChildren" class="translate"></label>
<span class="translate">Object ID of trigger for Auto Children</span>
</div>
<div class="col s1 m2 l1">
<a id="triggerAutoChildrenDialog" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">Alarm Settings</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 l2 input-field">
<input type="number" class="value" id="alarmWind1Level" />
<label for="alarmWind1Level" class="translate"></label>
<span class="translate">Alarm Wind 1 Level</span>
</div>
<div class="col s12 l3 input-field">
<input type="text" class="value" id="alarmWind1" />
<label for="alarmWind1" class="translate"></label>
<span class="translate">Object ID of alarm wind 1</span>
</div>
<div class="col s1 m2 l1">
<a id="alarmWind1PopUp" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="number" class="value" id="alarmWind2Level" />
<label for="alarmWind2Level" class="translate"></label>
<span class="translate">Alarm Wind 2 Level</span>
</div>
<div class="col s12 l3 input-field">
<input type="text" class="value" id="alarmWind2" />
<label for="alarmWind2" class="translate"></label>
<span class="translate">Object ID of alarm wind 2</span>
</div>
<div class="col s1 m2 l1">
<a id="alarmWind2PopUp" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="number" class="value" id="alarmRainLevel" />
<label for="alarmRainLevel" class="translate"></label>
<span class="translate">Alarm Rain Level</span>
</div>
<div class="col s12 l3 input-field">
<input type="text" class="value" id="alarmRain" />
<label for="alarmRain" class="translate"></label>
<span class="translate">Object ID of alarm Rain</span>
</div>
<div class="col s1 m2 l1">
<a id="alarmRainPopUp" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="number" class="value" id="alarmFrostLevel" />
<label for="alarmFrostLevel" class="translate"></label>
<span class="translate">Alarm Frost Level</span>
</div>
<div class="col s12 l3 input-field">
<input type="text" class="value" id="alarmFrost" />
<label for="alarmFrost" class="translate"></label>
<span class="translate">Object ID of alarm Frost</span>
</div>
<div class="col s1 m2 l1">
<a id="alarmFrostPopUp" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="number" class="value" id="alarmFireLevel" />
<label for="alarmFireLevel" class="translate"></label>
<span class="translate">Alarm Fire Level</span>
</div>
<div class="col s12 l3 input-field">
<input type="text" class="value" id="alarmFire" />
<label for="alarmFire" class="translate"></label>
<span class="translate">Object ID of alarm Fire</span>
</div>
<div class="col s1 m2 l1">
<a id="alarmFirePopUp" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="m material-dialogs">
<div id="dialog-select-member" class="modal modal-fixed-footer">
<div class="modal-content">
<div class="row">
<div class="col s12 title"></div>
</div>
<div class="row">
<div class="col s12 dialog-content">
</div>
</div>
</div>
<div class="modal-footer">
<a class="modal-action modal-close waves-effect waves-green btn btn-set"><i class="large material-icons left">check</i><span class="translate">Select</span></a>
<a class="modal-action modal-close waves-effect waves-green btn btn-close"><i class="large material-icons left ">close</i><span class="translate">Cancel</span></a>
</div>
</div>
<div id="dialog-shutter-edit" class="modal modal-fixed-footer">
<div class="row">
<div class="modal-content">
<div class="row">
<div class="col s12">
<h6 class="title" style="background-color:#174475;"><span class="translate">Edit Device:</span> <span id="dialogDeviceEditShutter"></span></h6>
</div>
</div>
<div class="col s12 m12 l12 modalTab">
<ul class="tabs">
<li class="tab col s12 m6 l4"><a href="#tab-settingsPopUp" class="translate active">main settings</a></li>
<li class="tab col s12 m6 l4 tab-sunPopUp"><a href="#tab-sunPopUp" class="translate">sun protection settings</a></li>
<li class="tab col s12 m6 l4 tab-extraPopUp"><a href="#tab-extraPopUp" class="translate">Extra Settings</a></li>
</ul>
</div>
<div id="tab-sunPopUp" class="col s12 page">
<div class="row">
<div class="col s12 l2 input-field">
<input type="number" class="value" id="heightDownSun" min=0 max=100 />
<label for="heightDownSun" class="translate"></label>
<span class="translate">height down</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" class="value" id="direction" min=0 max=400 />
<label for="direction" class="translate"></label>
<span class="translate">direction</span>
</div>
<div class="input-field col s12 m6 l6">
<select class="value" id="type">
<option value="off" class="translate">off</option>
<option value="in- & outside temperature" class="translate">in and outside temperature</option>
<option value="only direction" class="translate">only direction</option>
<option value="in- & outside temperature and direction" class="translate">in and outside temperature and direction</option>
<option value="outside temperature and direction" class="translate">outside temperature and direction</option>
<option value="only outside temperature" class="translate">only outside temperature</option>
<option value="only inside temperature" class="translate">only inside temperature</option>
</select>
<label for="type" class="translate"></label>
<span class="translate">Type of control</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" class="value" id="directionRange" min=0 max=400 />
<label for="directionRange" class="translate"></label>
<span class="translate">+/- range direction</span>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="number" id="setpointValue" class="form-control" min="0.0" max="40.0" placeholder="0.0-40.0 °C" step="0.1" />
<label for="setpointValue" class="translate"></label>
<span class="translate">setpoint of the sun protection temperature</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" id="hysteresisOutside" class="form-control" min="0.0" max="100.0" placeholder="0.0-100.0 %" step="0.1" />
<label for="hysteresisOutside" class="translate"></label>
<span class="translate">hysteresis Outsidetemperature (percent)</span>
</div>
<div class="col s12 m6 l6 input-field">
<input type="text" class="value" id="actualValueTemp" />
<label for="actualValueTemp" class="translate"></label>
<span class="translate">Object ID Actual value of the sun protection temperature</span>
</div>
<div class="col s1 m2 l1">
<a id="actualValueTempDialogPopUp" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="number" id="setpointValueLight" class="form-control" min="0" max="20000" placeholder="0-20000 Lux" step="1" />
<label for="setpointValueLight" class="translate"></label>
<span class="translate">setpoint of the sun protection Lightsensor</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" id="hysteresisLight" class="form-control" min="0.0" max="100.0" placeholder="0.0-100.0 %" step="0.1" />
<label for="hysteresisLight" class="translate"></label>
<span class="translate">hysteresis Lightsensor (percent)</span>
</div>
<div class="col s12 m6 l6 input-field">
<input type="text" class="value" id="actualValueLight" />
<label for="actualValueLight" class="translate"></label>
<span class="translate">Object ID of the sun protection Lightsensor</span>
</div>
<div class="col s1 m2 l1">
<a id="actualValueLightDialogPopUp" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="number" id="tempInside" class="form-control" min="0.0" max="40.0" placeholder="0.0-40.0 °C" step="0.1" />
<label for="tempInside" class="translate"></label>
<span class="translate">Temp Inside</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" id="hysteresisInside" class="form-control" min="0.0" max="100.0" placeholder="0.0-100.0 %" step="0.1" />
<label for="hysteresisInside" class="translate"></label>
<span class="translate">hysteresis Insidetemperature (percent)</span>
</div>
<div class="col s12 m6 l6 input-field">
<input type="text" class="value" id="actualValueTempInside" />
<label for="actualValueTempInside" class="translate"></label>
<span class="translate">Object ID of the Inside Temperature</span>
</div>
<div class="col s1 m2 l1">
<a id="actualValueTempInsideDialogPopUp" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
</div>
</div>
<div id="tab-settingsPopUp" class="col s12 page">
<div class="row">
<div class="input-field col s12 l3">
<select class="value" id="typeDown">
<option value="off" class="translate">off</option>
<option value="living" class="translate">living</option>
<option value="living-auto" class="translate">living-auto</option>
<option value="sleep" class="translate">sleep</option>
<option value="sleep-auto" class="translate">sleep-auto</option>
<option value="children" class="translate">children</option>
<option value="children-auto" class="translate">children-auto</option>
<option value="sunset" class="translate">sunset</option>
<option value="elevation" class="translate">elevation</option>
<option value="goldenhour" class="translate">goldenhour</option>
<option value="lightsensor" class="translate">lightsensor</option>
<option value="manual-only" class="translate">manual-only</option>
</select>
<label for="typedown" class="translate"></label>
<span class="translate">type down</span>
</div>
<div class="input-field col s12 l3">
<select class="value" id="typeUp">
<option value="off" class="translate">off</option>
<option value="living" class="translate">living</option>
<option value="living-auto" class="translate">living-auto</option>
<option value="sleep" class="translate">sleep</option>
<option value="sleep-auto" class="translate">sleep-auto</option>
<option value="children" class="translate">children</option>
<option value="children-auto" class="translate">children-auto</option>
<option value="sunrise" class="translate">sunrise</option>
<option value="goldenhour End" class="translate">goldenhour End</option>
<option value="lightsensor" class="translate">lightsensor</option>
<option value="manual-only" class="translate">manual-only</option>
</select>
<label for="typeUp" class="translate"></label>
<span class="translate">type up</span>
</div>
</div>
<div class="row">
<div class="input-field col s12 l2">
<select class="value" id="triggerStateShutter">
<option value="none" class="translate">unavailable</option>
<option value="true" class="translate">true</option>
<option value="false" class="translate">false</option>
<option value="0" class="translate">0</option>
<option value="1" class="translate">1</option>
<option value="2" class="translate">2</option>
</select>
<label for="triggerStateShutter" class="translate"></label>
<span class="translate">State from Trigger</span>
</div>
<div class="input-field col s12 l2">
<select class="value" id="triggerStateTiltedShutter">
<option value="none" class="translate">unavailable</option>
<option value="true" class="translate">true</option>
<option value="false" class="translate">false</option>
<option value="0" class="translate">0</option>
<option value="1" class="translate">1</option>
<option value="2" class="translate">2</option>
</select>
<label for="triggerStateTiltedShutter" class="translate"></label>
<span class="translate">State from Trigger Tilted</span>
</div>
<div class="input-field col s12 l2">
<select class="value" id="triggerChangeShutter">
<option value="off" class="translate">off</option>
<option value="onlyUp" class="translate">only up</option>
<option value="onlyDown" class="translate">only Down</option>
<option value="upDown" class="translate">up and down</option>
</select>
<label for="triggerChangeShutter" class="translate"></label>
<span class="translate">Drive by Trigger</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" class="value" id="triggerDriveShutter" min=0 max=100 />
<label for="triggerDriveShutter" class="translate"></label>
<span class="translate">height for trigger</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" class="value" id="triggerDriveTildetShutter" min=0 max=100 />
<label for="triggerDriveTildetShutter" class="translate"></label>
<span class="translate">height for trigger tildet</span>
</div>
<div class="input-field col s12 l2">
<select class="value" id="autoDriveShutter">
<option value="off" class="translate">off</option>
<option value="onlyUp" class="translate">only up</option>
<option value="onlyDown" class="translate">only Down</option>
<option value="upDown" class="translate">up and down</option>
</select>
<label for="autoDriveShutter" class="translate"></label>
<span class="translate">Automatic operation when trigger deviation</span>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="number" class="value" id="heightDownShutter" min=0 max=100 />
<label for="heightDownShutter" class="translate"></label>
<span class="translate">height down</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" class="value" id="heightUpShutter" min=0 max=100 />
<label for="heightUpShutter" class="translate"></label>
<span class="translate">height up</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" id="elevationShutter" class="form-control" min="-50.0" max="100.0" placeholder="-100.0-100.0" step="0.1" />
<label for="elevationShutter" class="translate"></label>
<span class="translate">Elevation</span>
</div>
</div>
<div class="row">
<div class="col s12 m6 l6 input-field">
<input type="text" class="value" id="triggerID" />
<label for="triggerID" class="translate"></label>
<span class="translate">Trigger ID</span>
</div>
<div class="col s1 m2 l1">
<a id="triggerIDPopUp" class="btn-floating waves-effect waves-light blue table-button-add trigger-add"><i class="material-icons">add</i></a>
</div>
</div>
</div>
<div id="tab-extraPopUp" class="col s12 page">
<ul class="collapsible">
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">Shutter config</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 m6 l6 input-field">
<input type="checkbox" id="LateDown" class="value" />
<label for="LateDown" class="translate">late_down</label>
</div>
<div class="col s12 m6 l6 input-field">
<input type="checkbox" id="inSummerNotDown" class="value" />
<label for="inSummerNotDown" class="translate">inSummerNotDown</label>
</div>
<div class="col s12 m6 l6 input-field">
<input type="checkbox" id="driveAfterClose" class="value" />
<label for="driveAfterClose" class="translate">DriveAfterClose</label>
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">xmas settings</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 m6 l6 input-field">
<input type="checkbox" id="useXmasLevel" class="value" />
<label for="useXmasLevel" class="translate">useXmasLevel</label>
</div>
<div class="col s12 m6 l6 input-field col-XmasLevel">
<input type="number" class="value" id="XmasLevel" min=0 max=100 />
<label for="XmasLevel" class="translate"></label>
<span class="translate">XmasLevel</span>
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">sun protection settings</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 m6 l6 input-field">
<input type="checkbox" id="KeepSunProtect" class="value" />
<label for="KeepSunProtect" class="translate">KeepSunProtect</label>
</div>
<div class="col s12 m6 l6 input-field">
<input type="checkbox" id="heatProtection" class="value" />
<label for="heatProtection" class="translate">Heat protection (completely close the roller shutter in the heat)</label>
</div>
</div>
<div class="row">
<div class="col s12 m6 l6 input-field">
<input type="number" class="value" id="sunProtectEndDely" min=0 max=999 />
<label for="sunProtectEndDely" class="translate"></label>
<span class="translate">sunProtectEndDely</span>
</div>
<div class="col s12 m6 l6 input-field col-heatProtect">
<input type="number" id="tempHeatProtection" class="form-control" min="0.0" max="40.0" placeholder="0.0-40.0 °C" step="0.1" />
<label for="tempHeatProtection" class="translate"></label>
<span class="translate">Outdoor temperature upper limit for activating thermal protection</span>
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">Extra Settings</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 m6 l6 input-field">
<input type="checkbox" id="ignoreTriggerAutoState" class="value" />
<label for="ignoreTriggerAutoState" class="translate">Ignore the status of autoUp and autoDown when opening the window</label>
</div>
</div>
<div class="row">
<div class="col s12 m6 l6 input-field">
<input type="checkbox" id="betweenPosition" class="value" />
<label for="betweenPosition" class="translate">First move to an intermediate position and close later</label>
</div>
<div class="col s12 m6 l6 input-field col-betweenPosition">
<input type="number" class="value" id="betweenPositionLevel" min=0 max=100 />
<label for="betweenPositionLevel" class="translate"></label>
<span class="translate">shutter height in the intermediate position</span>
</div>
</div>
<div class="row">
<div class="col s12 l2 input-field">
<input type="number" class="value" id="trigDelyUp" min=0 max=999 />
<label for="trigDelyUp" class="translate"></label>
<span class="translate">trigDelyUp</span>
</div>
<div class="col s12 l2 input-field">
<input type="number" class="value" id="trigDelyDown" min=0 max=999 />
<label for="trigDelyDown" class="translate"></label>
<span class="translate">trigDelyDown</span>
</div>
</div>
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">expand_more</i><h6 class="translate">Alarm Settings</h6>
</div>
<div class="collapsible-body">
<div class="row">
<div class="col s12 m6 l6 input-field">
<input type="checkbox" id="enableAlarmWind1" class="value" />
<label for="enableAlarmWind1" class="translate">enableAlarmWind1</label>
</div>
<div class="col s12 m6 l6 input-field">
<input type="checkbox" id="enableAlarmWind2" class="value" />
<label for="enableAlarmWind2" class="translate">enableAlarmWind2</label>
</div>
<div class="col s12 m6 l6 input-field">
<input type="checkbox" id="enableAlarmRain" class="value" />
<label for="enableAlarmRain" class="translate">enableAlarmRain</label>
</div>
<div class="col s12 m6 l6 input-field">
<input type="checkbox" id="enableAlarmFrost" class="value" />
<label for="enableAlarmFrost" class="translate">enableAlarmFrost</label>
</div>
<div class="col s12 m6 l6 input-field">
<input type="checkbox" id="enableAlarmFire" class="value" />
<label for="enableAlarmFire" class="translate">enableAlarmFire</label>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="modal-footer">
<a class="modal-action modal-close waves-effect waves-green btn btn-set"><i class="large material-icons left">check</i><span class="translate">Ok</span></a>
<a class="modal-action modal-close waves-effect waves-green btn btn-close"><i class="large material-icons left">close</i><span class="translate">Cancel</span></a>
</div>
</div>
</div>
</div>
</body>
</html>