mirror of
https://github.com/hyperion-project/hyperion.ng.git
synced 2023-10-10 13:36:59 +02:00
1ff8528597
* Initial WebUI with sample functions * Changed folder structure * Light Reset Button and Translation fixing in Links * Indentation fixed * Reorganized menu and new function for setting effects * Styling fix
57 lines
1.5 KiB
HTML
57 lines
1.5 KiB
HTML
<script src="js/bootstrap-colorpicker.js"></script>
|
|
<link href="css/bootstrap-colorpicker.css" rel="stylesheet">
|
|
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<h1 class="page-header" lang="en">Light test</h1>
|
|
<div class="col-lg-1">
|
|
<span lang="en" data-lang-token="lighttesttoken">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="buttoncolorresettoken" type="button" class="btn btn-warning" id="reset_color">Reset Color</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
var webSocket = new WebSocket('ws://'+document.location.hostname+':19444');
|
|
|
|
webSocket.onerror = function(event) {
|
|
alert(event.data);
|
|
};
|
|
|
|
webSocket.onopen = function(event) {
|
|
$(function() {
|
|
$('#cp2').colorpicker({
|
|
format: 'rgb',
|
|
colorSelectors: {'default': '#777777'}
|
|
});
|
|
|
|
$('#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> |