frodovdr/hyperion.ng
1
0
Fork 0
mirror of https://github.com/hyperion-project/hyperion.ng.git synced 2023-10-10 13:36:59 +02:00
Code Issues Releases Wiki Activity

Update WebUI (#295)

Browse Source 
* update

* lang

* show dialog on delete action

* proper regexp if effect name contains ":"

[skip ci]
This commit is contained in:
brindosch 2016-11-21 22:16:57 +01:00 committed by redPanther
parent 7cb6517c01
commit 98cb922c74
5 changed files with 97 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -183,6 +183,13 @@
<div class="input-group-addon">%</div>
</div>
</div>
<div class="form-group">
<label class="col-form-label col-md-6" style="width:190px;max-width:200px" lang="en" data-lang-token="conf_leds_layout_cl_edgegap">Edge Gap</label>
<div class=" input-group">
<input class="form-control ledCLconstr" id="ip_cl_ledsedgegap" type="number" value="0" min="0" max="30" step="1"></input>
<div class="input-group-addon">%</div>
</div>
</div>
</div>
</div>
</div>
@ -220,8 +227,8 @@
<label class="col-form-label col-md-6" style="width:170px;max-width:200px" lang="en" data-lang-token="conf_leds_layout_ma_cabling">Cabling</label>
<div class=" input-group">
<select class="form-control ledMAconstr" id="ip_ma_cabling">
<option value="snake" lang="en" data-lang-attribute="conf_leds_layout_ma_optsnake">Snake</option>
<option value="parallel" lang="en" data-lang-attribute="conf_leds_layout_ma_optparallel">Parallel</option>
<option value="snake" lang="en" data-lang-token="conf_leds_layout_ma_optsnake">Snake</option>
<option value="parallel" lang="en" data-lang-token="conf_leds_layout_ma_optparallel">Parallel</option>
</select>
</div>
</div>
@ -229,8 +236,8 @@
<label class="col-form-label col-md-6" style="width:170px;max-width:200px" lang="en" data-lang-token="conf_leds_layout_ma_order">Order</label>
<div class=" input-group">
<select class="form-control ledMAconstr" id="ip_ma_order">
<option value="horizontal" lang="en" data-lang-attribute="conf_leds_layout_ma_opthoriz">Horizontal</option>
<option value="vertical" lang="en" data-lang-attribute="conf_leds_layout_ma_optvert">Vertical</option>
<option value="horizontal" lang="en" data-lang-token="conf_leds_layout_ma_opthoriz">Horizontal</option>
<option value="vertical" lang="en" data-lang-token="conf_leds_layout_ma_optvert">Vertical</option>
</select>
</div>
</div>
@ -239,10 +246,10 @@
<label class="col-form-label col-md-6" style="width:170px;max-width:200px" lang="en" data-lang-token="conf_leds_layout_ma_position">Input</label>
<div class=" input-group">
<select class="form-control ledMAconstr" id="ip_ma_start">
<option value="top-left" lang="en" data-lang-attribute="conf_leds_layout_ma_opttopleft">Top left</option>
<option value="top-right" lang="en" data-lang-attribute="conf_leds_layout_ma_opttopright">Top right</option>
<option value="bottom-left" lang="en" data-lang-attribute="conf_leds_layout_ma_optbottomleft">Bottom left</option>
<option value="bottom-right" lang="en" data-lang-attribute="conf_leds_layout_ma_optbottomright">Bottom right</option>
<option value="top-left" lang="en" data-lang-token="conf_leds_layout_ma_opttopleft">Top left</option>
<option value="top-right" lang="en" data-lang-token="conf_leds_layout_ma_opttopright">Top right</option>
<option value="bottom-left" lang="en" data-lang-token="conf_leds_layout_ma_optbottomleft">Bottom left</option>
<option value="bottom-right" lang="en" data-lang-token="conf_leds_layout_ma_optbottomright">Bottom right</option>
</select>
</div>
</div>

36
assets/webconfig/js/content_effectsconfigurator.js
View File

@ -47,6 +47,25 @@
});
var oldDelList = [];
function updateDelEffectlist(event){
var newDelList = event.response.info.effects
if(newDelList.length != oldDelList.length)
{
var EffectHtml = null;
for(var idx=0; idx<newDelList.length; idx++)
{
if(!/^\:/.test(newDelList[idx].file))
{
EffectHtml += '<option value="'+newDelList[idx].name+'">'+newDelList[idx].name+'</option>';
}
}
$("#effectsdellist").html(EffectHtml);
oldDelList = newDelList;
}
}
$(hyperion).one("cmd-config-getschema", function(event) {
effects = parsedConfSchemaJSON.properties.effectSchemas.internal
EffectsHtml = "";
@ -114,7 +133,7 @@ $(hyperion).one("cmd-config-getschema", function(event) {
if(validateEditor() && validateName())
{
requestWriteEffect(effectName,effectPy,JSON.stringify(effects_editor.getValue()));
showInfoDialog('success','SUCCESS!','Your effect has been created successfully!');
showInfoDialog('success','SUCCESS!','Your effect "'+effectName+'" has been created successfully!');
}
});
@ -133,24 +152,13 @@ $(hyperion).one("cmd-config-getschema", function(event) {
toggleClass('#btn_cont_test', "btn-success", "btn-danger");
});
// Delete effect
delList=parsedServerInfoJSON.info.effects
var EffectHtml
for(var idx=0; idx<delList.length; idx++)
{
if(!/:/.test(delList[idx].file))
{
EffectHtml += '<option value="'+delList[idx].name+'">'+delList[idx].name+'</option>';
}
}
$("#effectsdellist").html(EffectHtml);
$('#btn_delete').off().on('click',function() {
var name = $("#effectsdellist").val();
requestDeleteEffect(name);
showInfoDialog('success','Effect deleted!', 'The effect "'+name+'" has been deleted successfully!');
});
$(document).ready( function() {
requestServerConfigSchema();
$(hyperion).on("cmd-serverinfo",updateDelEffectlist);
});

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

@ -77,15 +77,16 @@ function createClassicLeds(){
var ledsGPos = parseInt($("#ip_cl_ledsgpos").val());
var position = parseInt($("#ip_cl_position").val());
var reverse = $("#ip_cl_reverse").is(":checked");
var edgeGap = 0.1
//advanced values
var rawledsVDepth = parseInt($("#ip_cl_ledsvdepth").val());
var rawledsHDepth = parseInt($("#ip_cl_ledshdepth").val());
var rawedgeGap = parseInt($("#ip_cl_ledsedgegap").val());
//helper
var ledsVDepth = rawledsVDepth / 100;
var ledsHDepth = rawledsHDepth / 100;
var edgeGap = rawedgeGap / 100 /2;
var min = 0.0 + edgeGap;
var max = 1.0 - edgeGap;
var ledArray = [];
@ -102,11 +103,12 @@ function createClassicLeds(){
if (reverse)
ledArray.reverse();
createLedPreview(ledArray, 'classic');
createFinalArray(ledArray);
function createFinalArray(array){
finalLedArray = [];
for(var i = 0; i<array.length; i++){
hmin = array[i].hscan.minimum;
hmax = array[i].hscan.maximum;
@ -145,52 +147,54 @@ function createClassicLeds(){
}
function createTopLeds(){
vmin=0.0;
step=(max-min)/ledsTop;
vmin=min
vmax=vmin+ledsHDepth;
hmin=min
hmax=min+step
for (var i = 0; i<ledsTop; i++){
//step=(max-min)/ledsTop
//i/ledsTop*(max-min)
step = 1/ledsTop;
factor = i/ledsTop;
hmin=factor;
hmax=factor+step;
createLedArray(hmin, hmax, vmin, vmax);
hmin += step
hmax += step
}
}
function createLeftLeds(){
hmin=0.0;
hmax=ledsVDepth;
step=(max-min)/ledsLeft;
hmin=min;
hmax=min+ledsVDepth;
vmin=max-step
vmax=max
for (var i = ledsLeft; i>0; i--){
step = 1/ledsLeft;
factor = i/ledsLeft;
vmin=factor-step;
vmax=factor;
createLedArray(hmin, hmax, vmin, vmax);
vmin -= step
vmax -= step
}
}
function createRightLeds(){
hmax=1.0;
step=(max-min)/ledsRight;
hmax=max;
hmin=hmax-ledsVDepth;
vmin=min
vmax=min+step
for (var i = 0; i<ledsRight; i++){
step = 1/ledsRight;
factor = i/ledsRight;
vmin=factor;
vmax=factor+step;
createLedArray(hmin, hmax, vmin, vmax);
createLedArray(hmin, hmax, vmin, vmax);
vmin += step
vmax += step
}
}
function createBottomLeds(){
vmax=1.0;
step=(max-min)/ledsBottom;
vmax=max;
vmin=vmax-ledsHDepth;
hmin=max-step
hmax=max
for (var i = ledsBottom; i>0; i--){
step = 1/ledsBottom;
factor = i/ledsBottom;
hmin=factor-step;
hmax=factor;
createLedArray(hmin, hmax, vmin, vmax);
hmin -= step
hmax -= step
}
}
}
@ -264,7 +268,7 @@ function createMatrixLeds(){
endX = tmp
}
}
finalLedArray =[];
finalLedArray = leds
createLedPreview(leds, 'matrix');
}
@ -395,7 +399,14 @@ $(document).ready(function() {
// ------------------------------------------------------------------
$("#leds_custom_save").off().on("click", function() {
function createLedConfig(){
var string = '{"leds" :';
string += $("#ledconfig").val();
string += "}";
return string
}
if (validateText())
requestWriteConfig(JSON.parse(createLedConfig()));
});
// -------------------------------------------------------------

35
assets/webconfig/js/content_remote.js
View File

@ -61,9 +61,23 @@
}
}
}
}
var oldEffects = [];
function updateEffectlist(event){
var newEffects = event.response.info.effects;
if (newEffects.length != oldEffects.length)
{
effects_html = '<option value="__none__"></option>';
for(i = 0; i < newEffects.length; i++) {
effectName = newEffects[i].name;
effects_html += '<option value="'+effectName+'">'+effectName+'</option>';
}
$('#effect_select').html(effects_html);
oldEffects = newEffects;
}
}
$(document).ready(function() {
// color
@ -93,7 +107,6 @@ $(document).ready(function() {
},
}
});
$('#cp2').colorpicker().on('changeColor', function(e) {
color = e.color.toRGB();
$("#effect_select").val("__none__");
@ -113,18 +126,10 @@ $(document).ready(function() {
});
}
});
// effects
effects_html = '<option value="__none__"></option>';
for(i = 0; i < parsedServerInfoJSON.info.effects.length; i++) {
//console.log(parsedServerInfoJSON.info.effects[i].name);
effectName = parsedServerInfoJSON.info.effects[i].name;
effects_html += '<option value="'+effectName+'">'+effectName+'</option>';
}
$('#effect_select').html(effects_html);
// components
// components
$(hyperion).on("cmd-serverinfo",updateComponents);
// effects
$(hyperion).on("cmd-serverinfo",updateEffectlist);
});

1
assets/webconfig/lang/de.json
View File

@ -74,6 +74,7 @@
"conf_leds_layout_cl_hleddepth" : "Horizontale LED Tiefe",
"conf_leds_layout_cl_vleddepth" : "Vertikale LED Tiefe",
"conf_leds_layout_cl_generate" : "Generiere Konfiguartion",
"conf_leds_layout_cl_edgegap" : "Rahmenabstand",
"conf_leds_layout_ma_horiz" : "Horizontal",
"conf_leds_layout_ma_vert" : "Vertical",
"conf_leds_layout_ma_cabling" : "Verkabelung",