frodovdr/hyperion.ng
1
0
Fork 0
mirror of https://github.com/hyperion-project/hyperion.ng.git synced 2025-03-01 10:33:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

Webui: extend led hardware config + connection lost page (#226)

Browse Source 
* split content and js
tune leds config

* implement connection lost page

* split js/html in huebridge

* add js action for connection lost

* extend led config
make connection loss nicer

* tune led code
add menu entry for grabber

* more tuning of webui

* switch back to botstrap textarea
add v4l to components

* add icon

* extend schema for jsoneditor

* implement ledcolors streaming with 4fps

* implement component state
This commit is contained in:
redPanther
2016-09-07 20:10:37 +02:00
committed by GitHub
parent 4c6a4a1f93
commit 2beccb0912
35 changed files with 675 additions and 279 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
assets/webconfig/content/connection_lost.html
View File

@@ -1,16 +1,39 @@
<div id="wrapper">
<div class="container-fluid">
connection lost: <a href="/">reconnect</a>
<nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom:0">
<div class="navbar-header">
<a class="navbar-brand" href="/"><img src="img/hyperion/hyperionlogo.png" alt="Redefine ambient light!" height="55"></a>
</div>
</nav>
<div class="container" style="margin-top:50px">
<div class="panel panel-danger" style="box-shadow: 10px 10px 5px #BBBBBB;">
<div class="panel-heading"><i class="fa fa-exclamation-triangle"></i> Connection to Hyperion Service lost!</div>
<div class="panel-body"><a href="/">reconnect</a></div>
</div>
</div>
</div>
<!-- ************************************ -->
<script>
var connectionLost = false;
var connectionTimer;
function tryReconnect()
{
$.ajax({ url: "/" }).done(function(data) {
window.clearInterval(connectionTimer);
window.location.href ="/";
});
}
function connectionLostAction()
{
// demo code to see if this works
$("#wrapper").css("margin","auto");
$("#wrapper").css("background-color","#BBBBBB");
connectionLost = true;
connectionTimer = window.setInterval(tryReconnect, 5000);
}
</script>

14
assets/webconfig/content/dashboard.html
View File

@@ -52,19 +52,7 @@
<th>Status</th>
</tr>
</thead>
<tbody>
<tr>
<td>Kodi Watch</td>
<td><i class="fa fa-circle component-on"></i></td>
</tr>
<tr>
<td>Blackborder</td>
<td><i class="fa fa-circle component-off"></i></td>
</tr>
<tr>
<td>Booteffect</td>
<td><i class="fa fa-circle component-off"></i></td>
</tr>
<tbody id="tab_components">
</tbody>
</table>
</div>

93
assets/webconfig/content/generalconf.html
View File

@@ -7,7 +7,7 @@
</div>
<hr>
<div class="col-lg-12">
<form id="generalConfForm"></form>
<!-- <form id="generalConfForm"></form>-->
<div id='editor_holder'></div>
<button id='submit'>Submit (console.log)</button>
</div>
@@ -16,93 +16,4 @@
</div>
<script>
/*
function removeAdvanced(obj,searchStack)
{
searchStack = [];
$.each(obj, function(key, val) {
if ( typeof(val) == 'object' )
{
searchStack.push(key);
if (! removeAdvanced(val,searchStack) )
searchStack.pop();
}
else if ( key == "advanced" && val == true )
{
console.log(searchStack);
return true;
}
});
return false;
}
*/
$(hyperion).on("cmd-config-getschema", function(event) {
parsedConfSchemaJSON = event.response.result;
// remove all "advanced" options from schema
//removeAdvanced(parsedConfSchemaJSON, []); // not working atm
//console.log(JSON.stringify(parsedConfSchemaJSON));
schema = parsedConfSchemaJSON.properties;
schema_blackborderdetector = schema.blackborderdetector;
schema_color = schema.color,
schema_device = schema.device,
schema_effects = schema.effects,
schema_forwarder = schema.forwarder,
schema_framegrabber = schema.framegrabber,
//schema_grabber-v4l2 = schema.grabber-v4l2,
schema_initialEffect = schema.initialEffect,
schema_kodiVideoChecker = schema.kodiVideoChecker,
schema_smoothing = schema.smoothing,
schema_logger = schema.logger,
schema_jsonServer = schema.jsonServer,
schema_protoServer = schema.protoServer,
schema_boblightServer = schema.boblightServer,
schema_udpListener = schema.udpListener,
schema_webConfig = schema.webConfig
var element = document.getElementById('editor_holder');
//JSONEditor.defaults.options.theme = 'bootstrap3';
var general_conf_editor = new JSONEditor(element,{
theme: 'bootstrap3',
disable_collapse: 'true',
form_name_root: 'sa',
disable_edit_json: 'true',
disable_properties: 'true',
no_additional_properties: 'true',
schema: {
title:' ',
properties: {
schema_blackborderdetector,
schema_color,
schema_device,
schema_effects,
schema_forwarder,
schema_framegrabber,
//schema_grabber-v4l2,
schema_initialEffect,
schema_kodiVideoChecker,
schema_smoothing,
schema_logger,
schema_jsonServer,
schema_protoServer,
schema_boblightServer,
schema_udpListener,
schema_webConfig
}
}
});
});
$(document).ready( function() {
requestServerConfigSchema();
document.getElementById('submit').addEventListener('click',function() {
// Get the value from the editor
//console.log(general_conf_editor.getValue());
});
// $("[type='checkbox']").bootstrapSwitch();
});
</script>
<script src="/js/content_generalconf.js"></script>

20
assets/webconfig/content/grabber.html Normal file
View File

@@ -0,0 +1,20 @@
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<h1 class="page-header" lang="en" data-lang-token="main_menu_grabber_conf_token">Capturing Hardware</h1>
<div class="introd">
<h4 lang="en" data-lang-token="remote_general_conf_intro">You can edit the general configuration here.</h4>
</div>
<hr>
<div class="col-lg-12">
<!-- <form id="grabberConfForm"></form>-->
<div id='editor_container'/>
<button id='submit'>Submit (console.log)</button>
</div>
</div>
</div>
</div>
<script src="/js/content_grabber.js"></script>

110
assets/webconfig/content/leds.html
View File

@@ -5,24 +5,36 @@
vertical-align:middle; padding:4px; border-radius:2px;}
.led_num {display:none; position:relative; color:black; background-color: white;
border-radius:2px; padding:1px; vertical-align:middle; text-align:center; font-size:0.8em;}
#leds_controls {white-space:nowrap; margin-top:530px;}
#leds_controls {white-space:nowrap; margin-top:500px;}
</style>
<h1 class="page-header" lang="en" data-lang-token="main_menu_leds_conf_token">Led Configuration</h1>
<div class="container-fluid">
<h1 class="page-header" lang="en" data-lang-token="main_menu_leds_conf_token">LED Hardware</h1>
<!-- <div class="introd">
<h4 lang="en" data-lang-token="remote_effects_intro"></h4>
</div>-->
<ul id="leds_cfg_nav" class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#menu_display">Display LEDs</a></li>
<li><a data-toggle="tab" href="#menu_gencfg">Generate Config</a></li>
<li><a data-toggle="tab" href="#menu_customcfg">Custom Config</a></li>
<li class="active"><a data-toggle="tab" href="#menu_controller">LED Controller</a></li>
<li><a data-toggle="tab" href="#menu_gencfg">Generate LED Config</a></li>
<li><a data-toggle="tab" href="#menu_display">LED Testing</a></li>
</ul>
<div class="tab-content">
<div id="menu_display" class="tab-pane fade in active">
<div id="menu_controller" class="tab-pane fade in active" style="padding-top:10px">
<div class="panel panel-primary">
<div class="panel-heading form-group" style="font-size:90%;white-space:nowrap;">
<label for="leddevices">Controller Type</label>
<select id="leddevices" class="form-control" style="color:black;width:auto;margin-left:10px;display:inline-block" />
</div>
<div class="panel-body">
... device specific options ... we need some cpp code extension to get schema for all leds
</div>
</div>
</div>
<div id="menu_display" class="tab-pane fade" style="padding-top:10px">
<div class="container-fluid">
<div id="leds_canvas"/>
@@ -34,24 +46,80 @@
</div>
</div>
<div id="menu_gencfg" class="tab-pane fade">
<h3>coming soon</h3>
<p>led config generator ...</p>
</div>
<div id="menu_gencfg" class="tab-pane fade" style="padding-top:10px">
<div id="menu_customcfg" class="tab-pane fade">
<p>
<div class="form-group">
<div style="margin-bottom:5px">
<button lang="en" type="button" class="btn btn-success" id="leds_custom_check">check config</button>
<button lang="en" type="button" class="btn btn-success" id="leds_custom_save">save config</button>
</div>
<textarea rows="20" id="ledconfig" style="width:90%"></textarea>
</div>
</p>
<div class="row">
<div class="col-sm-6">
<div class="panel-group" id="accordion">
<div class="panel panel-primary">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapse1"><i class="fa fa-television fa-fw"></i>Frame Configuration (ambient light)</a>
</h4>
</div>
<div id="collapse1" class="panel-collapse collapse in">
<div class="panel-body">
just a reminder ... this are the needed form elements:
<pre>
led count horizontal:
led count vertical:
cabling: zick zack/snake
order: horizontal/vertical
led 0 position: top-left / top-right / bottom-left / bottom-right
</pre>
</div>
</div>
</div>
<div class="panel panel-primary">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapse2"><i class="fa fa-th fa-fw"></i>Matrix Configuration (LED wall)</a>
</h4>
</div>
<div id="collapse2" class="panel-collapse collapse">
<div class="panel-body">
just a reminder ... this are the needed form elements:
<pre>
led count links
led count rechts
led count oben
led count unten rechts
led count unten links
start
</pre>
</div>
</div>
</div>
</div> <!-- accordion -->
</div>
<div class="col-sm-6">
<div class="panel panel-primary" style="margin-bottom:5px">
<div class="panel-heading">
<h4 class="panel-title"><i class="fa fa-wrench fa-fw"></i>Generated Configuration</h4>
</div>
<div class="panel-body">
<div class="form-group">
<button lang="en" type="button" class="btn btn-success" id="leds_custom_check">check config</button>
<button lang="en" type="button" class="btn btn-success" id="leds_custom_save">save config</button>
</div>
<textarea rows="25" id="ledconfig" class="form-control"></textarea>
</div>
</div>
</div> <!-- left pane -->
</div> <!-- row layout -->
</div>
</div>
</div> <!-- tab content -->
</div>
<script src="/js/content_leds.js"></script>

49
assets/webconfig/content/remote_components.html
View File

@@ -6,14 +6,17 @@
<h4 lang="en" data-lang-token="remote_components_intro">The components remote enables you to disable and enable certain components of Hyperion during runtime. Keep in mind this persist just until the next reboot! To enable/disable components permament, use the configuration section.</h4>
</div>
<hr>
<div class="col-lg-12" id="componentsbutton">
<div class="col-lg-12">
<div id="componentsbutton">
</div>
</div>
</div>
</div>
</div>
<script>
new Enum('SMOOTHING', 'BLACKBORDER', 'KODICHECKER', 'FORWARDER', 'UDPLISTENER', 'BOBLIGHT_SERVER','GRABBER');
/*
new Enum('SMOOTHING', 'BLACKBORDER', 'KODICHECKER', 'FORWARDER', 'UDPLISTENER', 'BOBLIGHT_SERVER','GRABBER', 'V4L');
function Enum() {
for (var i in arguments)
@@ -23,4 +26,46 @@ function Enum() {
$('#componentsbutton').append('<button type="button" class="btn btn-danger" onclick="requestSetComponentState(\''+arguments[i]+'\',false)"><i class="fa fa-play"></i></button> '+arguments[i]+'<br />');
}
}
*/
function updateComponents(event) {
if ($('#componentsbutton').length == 0)
{
$(hyperion).off("cmd-serverinfo",updateComponents);
}
else
{
components = event.response.info.components;
// create buttons
for ( idx=0; idx<components.length;idx++)
{
//components_html += '<tr><td>'+(components[idx].title)+'</td><td><i class="fa fa-circle component-'+(components[idx].enabled?"on":"off")+'"></i></td></tr>';
enable_style = (components[idx].enabled? "btn-success" : "btn-danger");
enable_icon = (components[idx].enabled? "fa-play" : "fa-stop");
comp_name = components[idx].name;
comp_btn_id = "comp_btn_"+comp_name;
// create btn if not there
if ($("#"+comp_btn_id).length == 0)
{
d='<p><button type="button" id="'+comp_btn_id+'" class="btn '+enable_style
+'" onclick="requestSetComponentState(\''+comp_name+'\','+(!components[idx].enabled)
+')"><i id="'+comp_btn_id+'_icon" class="fa '+enable_icon+'"></i></button> '+components[idx].title+'</p>';
$('#componentsbutton').append(d);
}
else // already create, update state
{
setClassByBool( $('#'+comp_btn_id) , components[idx].enabled, "btn-danger", "btn-success" );
setClassByBool( $('#'+comp_btn_id+"_icon"), components[idx].enabled, "fa-stop" , "fa-play" );
$('#'+comp_btn_id).attr("onclick",'requestSetComponentState(\''+comp_name+'\','+(!components[idx].enabled)+')');
}
}
}
};
$(document).ready(function() {
$(hyperion).on("cmd-serverinfo",updateComponents);
});
</script>

2
assets/webconfig/css/hyperion.css
View File

@@ -13,7 +13,7 @@ body{font-family:Roboto,"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:15
table.borderless td,table.borderless th{border: none !important;}
/*Header*/
.navbar-brand{padding: 5px;height:90px;}
.navbar-brand{padding: 5px;padding-left:20px;height:60px;}
.sidebar{margin-top:91px;}
.dropdown{font-size:18px;}
@media (max-width: 767px) {.sidebar{margin-top:0px;}}

11
assets/webconfig/index.html
View File

@@ -92,7 +92,7 @@
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/"><img src="img/hyperion/hyperionlogo.png" alt="Redefine ambient light!"></a>
<a class="navbar-brand" href="/"><img src="img/hyperion/hyperionlogo.png" alt="Redefine ambient light!" height="55"></a>
</div>
<!-- /.navbar-header -->
@@ -202,9 +202,10 @@
<li>
<a class="inactive"><i class="fa fa-cog fa-fw"></i><span lang="en" data-lang-token="main_menu_configuration_token">Configuration</span><span class="fa arrow"></span></a>
<ul class="nav nav-second-level">
<li> <a class="inactive" id="load_confGeneral"><i class="fa fa-play-circle-o fa-fw"></i><span lang="en" data-lang-token="main_menu_general_conf_token">General</span></a> </li>
<li> <a class="inactive" id="load_confKodi"><i class="fa fa-play-circle-o fa-fw"></i><span lang="en" data-lang-token="main_menu_kodiwatch_token">Kodi Watch</span></a> </li>
<li> <a class="inactive" id="load_confLeds"><i class="fa fa-lightbulb-o fa-fw"></i><span lang="en" data-lang-token="main_menu_leds_conf_token">LEDs</span></a> </li>
<li> <a class="inactive" id="load_confGeneral"><i class="fa fa-wrench fa-fw"></i><span lang="en" data-lang-token="main_menu_general_conf_token">General</span></a> </li>
<li> <a class="inactive" id="load_confGrabber"><i class="fa fa-camera fa-fw"></i><span lang="en" data-lang-token="main_menu_grabber_conf_token">Capturing Hardware</span></a> </li>
<li> <a class="inactive" id="load_confLeds"><i class="fa fa-lightbulb-o fa-fw"></i><span lang="en" data-lang-token="main_menu_leds_conf_token">LED Hardware</span></a> </li>
<li> <a class="inactive" id="load_confKodi"><i class="fa fa-play-circle-o fa-fw"></i><span lang="en" data-lang-token="main_menu_kodiwatch_token">KODI Connector</span></a> </li>
<li> <a class="inactive" id="load_huebridge"><i class="fa fa-cog fa-fw"></i><span lang="en" data-lang-token="main_menu_huebridge_token">Hue Bridge</span></a> </li>
</ul>
</li>
@@ -237,7 +238,7 @@
</div>
<!-- /#wrapper -->
<div id="container_connection_lost" style="display:none" />
<div id="container_connection_lost" style="display:none"></div>
<div id="error_dialog" class="modal fade" role="dialog">
<div class="modal-dialog">

83
assets/webconfig/js/content_generalconf.js Normal file
View File

@@ -0,0 +1,83 @@
/*
function removeAdvanced(obj,searchStack)
{
searchStack = [];
$.each(obj, function(key, val) {
if ( typeof(val) == 'object' )
{
searchStack.push(key);
if (! removeAdvanced(val,searchStack) )
searchStack.pop();
}
else if ( key == "advanced" && val == true )
{
console.log(searchStack);
return true;
}
});
return false;
}
*/
$(hyperion).one("cmd-config-getschema", function(event) {
parsedConfSchemaJSON = event.response.result;
// remove all "advanced" options from schema
//removeAdvanced(parsedConfSchemaJSON, []); // not working atm
//console.log(JSON.stringify(parsedConfSchemaJSON));
schema = parsedConfSchemaJSON.properties;
schema_blackborderdetector = schema.blackborderdetector;
schema_color = schema.color;
schema_effects = schema.effects;
schema_forwarder = schema.forwarder;
schema_initialEffect = schema.initialEffect;
schema_kodiVideoChecker = schema.kodiVideoChecker;
schema_smoothing = schema.smoothing;
schema_logger = schema.logger;
schema_jsonServer = schema.jsonServer;
schema_protoServer = schema.protoServer;
schema_boblightServer = schema.boblightServer;
schema_udpListener = schema.udpListener;
schema_webConfig = schema.webConfig;
var element = document.getElementById('editor_holder');
//JSONEditor.defaults.options.theme = 'bootstrap3';
var general_conf_editor = new JSONEditor(element,{
theme: 'bootstrap3',
disable_collapse: 'true',
form_name_root: 'sa',
disable_edit_json: 'true',
disable_properties: 'true',
no_additional_properties: 'true',
schema: {
title:' ',
properties: {
schema_blackborderdetector,
schema_color,
schema_effects,
schema_forwarder,
schema_initialEffect,
schema_kodiVideoChecker,
schema_smoothing,
schema_logger,
schema_jsonServer,
schema_protoServer,
schema_boblightServer,
schema_udpListener,
schema_webConfig
}
}
});
});
$(document).ready( function() {
requestServerConfigSchema();
document.getElementById('submit').addEventListener('click',function() {
// Get the value from the editor
//console.log(general_conf_editor.getValue());
});
// $("[type='checkbox']").bootstrapSwitch();
});

58
assets/webconfig/js/content_grabber.js Normal file
View File

@@ -0,0 +1,58 @@
/*
function removeAdvanced(obj,searchStack)
{
searchStack = [];
$.each(obj, function(key, val) {
if ( typeof(val) == 'object' )
{
searchStack.push(key);
if (! removeAdvanced(val,searchStack) )
searchStack.pop();
}
else if ( key == "advanced" && val == true )
{
console.log(searchStack);
return true;
}
});
return false;
}
*/
$(hyperion).one("cmd-config-getschema", function(event) {
parsedConfSchemaJSON = event.response.result;
schema = parsedConfSchemaJSON.properties;
schema_framegrabber = schema.framegrabber;
schema_grabberv4l2 = schema["grabber-v4l2"];
var element = document.getElementById('editor_container');
var grabber_conf_editor = new JSONEditor(element,{
theme: 'bootstrap3',
disable_collapse: 'true',
form_name_root: 'sa',
disable_edit_json: 'true',
disable_properties: 'true',
no_additional_properties: 'true',
schema: {
title:' ',
properties: {
schema_framegrabber,
schema_grabberv4l2,
}
}
});
});
$(document).ready( function() {
requestServerConfigSchema();
document.getElementById('submit').addEventListener('click',function() {
// Get the value from the editor
//console.log(general_conf_editor.getValue());
});
// $("[type='checkbox']").bootstrapSwitch();
});

10
assets/webconfig/js/content_index.js
View File

@@ -12,6 +12,8 @@ $(document).ready( function() {
bindNavToContent("#load_update","update",false);
bindNavToContent("#load_confGeneral","generalconf",false);
bindNavToContent("#load_confLeds","leds",false);
bindNavToContent("#load_confGrabber","grabber",false);
//Change all Checkboxes to Switches
$("[type='checkbox']").bootstrapSwitch();
@@ -31,6 +33,14 @@ $(document).ready( function() {
var hostname = parsedServerInfoJSON.info.hostname;
$('#dash_systeminfo').html(hostname+':'+hyperionport);
var components = parsedServerInfoJSON.info.components;
components_html = "";
for ( idx=0; idx<components.length;idx++)
{
components_html += '<tr><td>'+(components[idx].title)+'</td><td><i class="fa fa-circle component-'+(components[idx].enabled?"on":"off")+'"></i></td></tr>';
}
$("#tab_components").html(components_html);
$.get( "https://raw.githubusercontent.com/hyperion-project/hyperion.ng/master/version.json", function( data ) {
parsedUpdateJSON = JSON.parse(data);
latestVersion = parsedUpdateJSON[0].versionnr;

82
assets/webconfig/js/content_leds.js
View File

@@ -1,51 +1,48 @@
var ledsCustomCfgInitialized = false;
function updateLedColors()
{
if($("#leds_canvas").length > 0 && ledStreamActive)
{
requestLedColorsStart();
}
else
{
ledStreamActivate(false);
}
}
function ledStreamActivate(enable)
{
$(hyperion).off("cron", updateLedColors );
if ( enable && ! ledStreamActive )
{
$(hyperion).on("cron", updateLedColors );
}
ledStreamActive=enable;
}
$(document).ready(function() {
// ------------------------------------------------------------------
$(hyperion).on("cmd-ledcolors",function(event){
ledColors = (event.response.result);
for(var idx=0; idx<ledColors.length; idx++)
$(hyperion).on("cmd-ledcolors-ledstream-update",function(event){
if ($("#leddevices").length == 0)
{
led = ledColors[idx]
$("#led_"+led.index).css("background","rgb("+led.red+","+led.green+","+led.blue+")");
requestLedColorsStop();
}
else
{
ledColors = (event.response.result);
for(var idx=0; idx<ledColors.length; idx++)
{
led = ledColors[idx]
$("#led_"+led.index).css("background","rgb("+led.red+","+led.green+","+led.blue+")");
}
}
});
// ------------------------------------------------------------------
$(hyperion).on("cmd-ledcolors-ledstream-update",function(event){
ledColors = (event.response.result);
for(var idx=0; idx<ledColors.length; idx++)
$(hyperion).on("cmd-ledcolors-ledstream-stop",function(event){
led_count = $(".led").length;
for(var idx=0; idx<led_count; idx++)
{
led = ledColors[idx]
$("#led_"+led.index).css("background","rgb("+led.red+","+led.green+","+led.blue+")");
$('#led_'+idx).css("background-color","hsl("+(idx*360/led_count)+",100%,50%)");
}
});
// ------------------------------------------------------------------
$(hyperion).one("cmd-serverinfo",function(event){
server = event.response;
ledDevices = server.info.ledDevices.available
ledDevicesHtml = "";
for (idx=0; idx<ledDevices.length; idx++)
{
ledDevicesHtml += '<option value="'+ledDevices[idx]+'">'+ledDevices[idx]+'</option>';
}
$("#leddevices").html(ledDevicesHtml);
$("#leddevices").val(server.info.ledDevices.active);
});
// ------------------------------------------------------------------
$(hyperion).on("cmd-config-getconfig",function(event){
parsedConfJSON = event.response.result;
@@ -68,7 +65,6 @@ $(document).ready(function() {
}
$('#leds_canvas').html(leds_html);
$('#led_0').css("border","2px dotted red");
ledStreamActivate(false);
});
// ------------------------------------------------------------------
@@ -88,23 +84,18 @@ $(document).ready(function() {
setClassByBool('#leds_toggle_live',ledStreamActive,"btn-success","btn-danger");
if ( ledStreamActive )
{
ledStreamActivate(false);
led_count = $(".led").length;
for(var idx=0; idx<led_count; idx++)
{
$('#led_'+idx).css("background-color","hsl("+(idx*360/led_count)+",100%,50%)");
}
requestLedColorsStop();
}
else
{
ledStreamActivate(true);
requestLedColorsStart();
}
});
// ------------------------------------------------------------------
$("#leds_custom_check").on("click", function() {
e = isJsonString($("#ledconfig").val());
if (e.length == 0)
showErrorDialog("Validation success", "Your config is valid!");
else
@@ -118,10 +109,13 @@ $(document).ready(function() {
$('#leds_cfg_nav a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
var target = $(e.target).attr("href") // activated tab
if (target == "#menu_customcfg" && !ledsCustomCfgInitialized)
if (target == "#menu_gencfg" && !ledsCustomCfgInitialized)
{
ledsCustomCfgInitialized = true;
$("#ledconfig").linedtextarea();
// $("#ledconfig").linedtextarea();
// $(window).resize(function(){
// $("#ledconfig").trigger("resize");
// });
}
});

14
assets/webconfig/js/hyperion.js
View File

@@ -36,12 +36,12 @@ var hyperion = {};
var wsTan = 1;
var cronId = 0;
var ledStreamActive=false;
var watchdog = true;
var watchdog = 0;
//
function cron()
{
if ( ! watchdog )
if ( watchdog > 3)
{
var interval_id = window.setInterval("", 9999); // Get a reference to the last
for (var i = 1; i < interval_id; i++)
@@ -69,7 +69,7 @@ function initWebSocket()
$(hyperion).trigger({type:"open"});
$(hyperion).on("cmd-serverinfo", function(event) {
watchdog = true;
watchdog = 0;
});
cronId = window.setInterval(cron,2000);
};
@@ -143,7 +143,7 @@ function initWebSocket()
// also used for watchdog
function requestServerInfo() {
watchdog = false;
watchdog++;
websocket.send('{"command":"serverinfo", "tan":'+wsTan+'}');
}
@@ -156,11 +156,13 @@ function requestServerConfig() {
}
function requestLedColorsStart() {
websocket.send('{"command":"ledcolors", "tan":'+wsTan+',"subcommand":"ledstream_start"}');
ledStreamActive=true;
websocket.send('{"command":"ledcolors", "tan":'+wsTan+',"subcommand":"ledstream-start"}');
}
function requestLedColorsStop() {
websocket.send('{"command":"ledcolors", "tan":'+wsTan+',"subcommand":"ledstream_stop"}');
ledStreamActive=false;
websocket.send('{"command":"ledcolors", "tan":'+wsTan+',"subcommand":"ledstream-stop"}');
}
function requestPriorityClear() {