hyperion.ng/assets/webconfig/lighttest.html
brindosch 0603fadd21 Web: Centralize websocket, add json port changer and led schemas (#209)
* add comp test

* update web

* .

* typo

[skip ci]
2016-08-30 23:25:27 +02:00

67 lines
1.6 KiB
HTML

<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<h1 class="page-header" lang="en" data-lang-token="main_menu_colors_token">Colors</h1>
<div class="col-lg-1">
<span lang="en" data-lang-token="remote_colors_label_color">Set color: </span>
</div>
<div class="col-lg-3">
<div id="cp2" class="input-group colorpicker-component">
<input type="text" value="#00AABB" class="form-control" />
<span class="input-group-addon"><i></i></span>
</div>
</div>
<div class="col-lg-8">
<button lang="en" data-lang-token="remote_colors_button_reset" type="button" class="btn btn-warning" id="reset_color">Reset Color</button>
</div>
</div>
</div>
</div>
<script>
$(function() {
$('#cp2').colorpicker({
format: 'rgb',
colorSelectors: {'default': '#777777',
'primary': '#337ab7',
'success': '#5cb85c',
'info': '#5bc0de',
'warning': '#f0ad4e',
'danger': '#d9534f'
},
customClass: 'colorpicker-2x',
sliders: {
saturation: {
maxLeft: 200,
maxTop: 200
},
hue: {
maxTop: 200
},
alpha: {
maxTop: 200
},
}
});
$('#cp2').colorpicker().on('changeColor', function(e) {
//console.log(e.color.toRGB());
webSocket.send('{"command":"color", "color":['+e.color.toRGB().r+','+e.color.toRGB().g+','+e.color.toRGB().b+'], "priority":1}');
});
});
$("#reset_color").on("click", function() {
webSocket.send('{"command":"clear", "priority":1}');
});
webSocket.onmessage = function(event){
console.log(event.data);
}
</script>