29 lines
2 KiB
HTML
29 lines
2 KiB
HTML
<h4>Light {{LIGHT_NUMBER}}</h4>
|
|
<div class="pure-control-group">
|
|
<label for="power">
|
|
<strong>Power</strong>
|
|
</label>
|
|
<a id="on{{LIGHT_NUMBER_DEC}}_on" class="pure-button" href="#">ON</a>
|
|
<a id="on{{LIGHT_NUMBER_DEC}}_off" class="pure-button" href="#">OFF</a>
|
|
</div>
|
|
<div class="pure-control-group">
|
|
<label for="bri{{LIGHT_NUMBER_DEC}}">Target brightness</label>
|
|
<input id="bri{{LIGHT_NUMBER_DEC}}" onchange="sendSliderValue({{LIGHT_NUMBER}})" name="bri{{LIGHT_NUMBER_DEC}}" type="range" min="0" max="255" value="25">
|
|
|
|
<span id="bri{{LIGHT_NUMBER_DEC}}_val" name="bri{{LIGHT_NUMBER_DEC}}">9</span>
|
|
%
|
|
<br>
|
|
<label for="light{{LIGHT_NUMBER_DEC}}_pwm">Actual Bri.</label>
|
|
<input type="range" min="0" max="100" value="0" id="light{{LIGHT_NUMBER_DEC}}_pwm" disabled>
|
|
|
|
<span id="light{{LIGHT_NUMBER_DEC}}_pwm_txt"></span>
|
|
%
|
|
<script>
|
|
var slider{{LIGHT_NUMBER_DEC}} = document.getElementById("bri{{LIGHT_NUMBER_DEC}}");
|
|
var output{{LIGHT_NUMBER_DEC}} = document.getElementById("bri{{LIGHT_NUMBER_DEC}}_val");
|
|
output{{LIGHT_NUMBER_DEC}}.innerHTML = (Math.round((slider{{LIGHT_NUMBER_DEC}}.value * 100.0 / 255.0) * 100) / 100).toFixed(2);
|
|
slider{{LIGHT_NUMBER_DEC}}.oninput = function() {
|
|
output{{LIGHT_NUMBER_DEC}}.innerHTML = (Math.round((this.value * 100.0 / 255.0) * 100) / 100).toFixed(2);
|
|
}
|
|
</script>
|
|
</div>
|