var ledsCustomCfgInitialized = false; var finalLedArray = []; var conf_editor = null; function round(number) { var factor = Math.pow(10, 4); var tempNumber = number * factor; var roundedTempNumber = Math.round(tempNumber); return roundedTempNumber / factor; }; function createLedPreview(leds, origin){ if (origin == "classic"){ $('#previewcreator').html($.i18n('conf_leds_layout_preview_originCL')); $('#leds_preview').css("padding-top", "56.25%"); } else if(origin == "text"){ $('#previewcreator').html($.i18n('conf_leds_layout_preview_originTEXT')); $('#leds_preview').css("padding-top", "56.25%"); } else if(origin == "matrix"){ $('#previewcreator').html($.i18n('conf_leds_layout_preview_originMA')); $('#leds_preview').css("padding-top", "100%"); } $('#previewledcount').html($.i18n('conf_leds_layout_preview_totalleds', leds.length)); $('#previewledpower').html($.i18n('conf_leds_layout_preview_ledpower', ((leds.length * 0.06)*1.1).toFixed(1))); $('.st_helper').css("border", "8px solid grey"); canvas_height = $('#leds_preview').innerHeight(); canvas_width = $('#leds_preview').innerWidth(); leds_html = ""; for(var idx=0; idx'+led.index+''; } $('#leds_preview').html(leds_html); $('#ledc_0').css({"background-color":"black","z-index":"12"}); $('#ledc_1').css({"background-color":"grey","z-index":"11"}); $('#ledc_2').css({"background-color":"#A9A9A9","z-index":"10"}); if($('#leds_prev_toggle_num').hasClass('btn-success')) $('.led_prev_num').css("display", "inline"); } function createClassicLeds(){ //get values var ledstop = parseInt($("#ip_cl_top").val()); var ledsbottom = parseInt($("#ip_cl_bottom").val()); var ledsleft = parseInt($("#ip_cl_left").val()); var ledsright = parseInt($("#ip_cl_right").val()); var ledsglength = parseInt($("#ip_cl_glength").val()); var ledsgpos = parseInt($("#ip_cl_gpos").val()); var position = parseInt($("#ip_cl_position").val()); var reverse = $("#ip_cl_reverse").is(":checked"); //advanced values var ledsVDepth = parseInt($("#ip_cl_vdepth").val())/100; var ledsHDepth = parseInt($("#ip_cl_hdepth").val())/100; var edgeVGap = parseInt($("#ip_cl_edgegap").val())/100/2; //var cornerVGap = parseInt($("#ip_cl_cornergap").val())/100/2; var overlap = $("#ip_cl_overlap").val()/4000; //helper var edgeHGap = edgeVGap/(16/9); //var cornerHGap = cornerVGap/(16/9); var Vmin = 0.0 + edgeVGap; var Vmax = 1.0 - edgeVGap; var Hmin = 0.0 + edgeHGap; var Hmax = 1.0 - edgeHGap; var Hdiff = Hmax-Hmin; var Vdiff = Vmax-Vmin; var ledArray = []; function createFinalArray(array){ finalLedArray = []; for(var i = 0; i 0){ while( times-- ){ array.push(array.shift()) } return array; } else { while( times++ ){ array.unshift(array.pop()) } return array; } } function valScan(val) { if(val > 1) return val = 1; if(val < 0) return val = 0; return val; } function ovl(scan,val) { if(scan == "+") return valScan(val += overlap); else return valScan(val -= overlap); } function createLedArray(hmin, hmax, vmin, vmax){ hmin = round(hmin); hmax = round(hmax); vmin = round(vmin); vmax = round(vmax); ledArray.push( { "hscan" : { "minimum" : hmin, "maximum" : hmax }, "vscan": { "minimum": vmin, "maximum": vmax }} ); } function createTopLeds(){ step=(Hmax-Hmin)/ledstop; //if(cornerVGap != '0') // step=(Hmax-Hmin-(cornerHGap*2))/ledstop; vmin=Vmin; vmax=vmin+ledsHDepth; for (var i = 0; i-1; --i){ vmin = ovl("-",(Vdiff/ledsleft*[i])+edgeVGap); vmax = ovl("+",(Vdiff/ledsleft*[i])+step+edgeVGap); createLedArray(hmin, hmax, vmin, vmax); } } function createRightLeds(){ step=(Vmax-Vmin)/ledsright; //if(cornerVGap != '0') // step=(Vmax-Vmin-(cornerVGap*2))/ledsright; hmax=Hmax; hmin=hmax-ledsVDepth; for (var i = 0; i-1; i--){ hmin = ovl("-",(Hdiff/ledsbottom*[i])+edgeHGap); hmax = ovl("+",(Hdiff/ledsbottom*[i])+step+edgeHGap); createLedArray(hmin, hmax, vmin, vmax); } } createLeftLeds(createBottomLeds(createRightLeds(createTopLeds()))); //check led gap pos if (ledsgpos+ledsglength > ledArray.length) { var mpos = Math.max(0,ledArray.length-ledsglength); $('#ip_cl_ledsgpos').val(mpos); ledsgpos = mpos; } //check led gap length if(ledsglength >= ledArray.length) { $('#ip_cl_ledsglength').val(ledArray.length-1); ledsglength = ledArray.length-ledsglength-1; } if(ledsglength != 0){ ledArray.splice(ledsgpos, ledsglength); } if (position != 0){ rotateArray(ledArray, position); } if (reverse) ledArray.reverse(); createFinalArray(ledArray); } function createMatrixLeds(){ // Big thank you to RanzQ (Juha Rantanen) from Github for this script // https://raw.githubusercontent.com/RanzQ/hyperion-audio-effects/master/matrix-config.js //get values var ledshoriz = parseInt($("#ip_ma_ledshoriz").val()); var ledsvert = parseInt($("#ip_ma_ledsvert").val()); var cabling = $("#ip_ma_cabling").val(); //var order = $("#ip_ma_order").val(); var start = $("#ip_ma_start").val(); var parallel = false var index = 0 var leds = [] var hblock = 1.0 / ledshoriz var vblock = 1.0 / ledsvert if (cabling == "parallel"){ parallel = true } /** * Adds led to the hyperion config led array * @param {Number} index Index of the led * @param {Number} x Horizontal position in matrix * @param {Number} y Vertical position in matrix */ function addLed (index, x, y) { var hscanMin = x * hblock var hscanMax = (x + 1) * hblock var vscanMin = y * vblock var vscanMax = (y + 1) * vblock hscanMin = round(hscanMin); hscanMax = round(hscanMax); vscanMin = round(vscanMin); vscanMax = round(vscanMax); leds.push({ index: index, hscan: { minimum: hscanMin, maximum: hscanMax }, vscan: { minimum: vscanMin, maximum: vscanMax } }) } var startYX = start.split('-') var startX = startYX[1] === 'right' ? ledshoriz - 1 : 0 var startY = startYX[0] === 'bottom' ? ledsvert - 1 : 0 var endX = startX === 0 ? ledshoriz - 1 : 0 var endY = startY === 0 ? ledsvert - 1 : 0 var forward = startX < endX var downward = startY < endY var x, y for (y = startY; downward && y <= endY || !downward && y >= endY; y += downward ? 1 : -1) { for (x = startX; forward && x <= endX || !forward && x >= endX; x += forward ? 1 : -1) { addLed(index, x, y) index++ } if (!parallel) { forward = !forward var tmp = startX startX = endX endX = tmp } } finalLedArray =[]; finalLedArray = leds createLedPreview(leds, 'matrix'); } $(document).ready(function() { // translate performTranslation(); //add intros if(showOptHelp) { createHintH("intro", $.i18n('conf_leds_device_intro'), "leddevice_intro"); createHintH("intro", $.i18n('conf_leds_layout_intro'), "layout_intro"); $('#led_vis_help').html('
'+$.i18n('conf_leds_layout_preview_l1')+'
'+$.i18n('conf_leds_layout_preview_l2')+'
'); } var slConfig = serverConfig.ledConfig; //restore ledConfig for(key in slConfig) { if(typeof(slConfig[key]) === "boolean") $('#ip_cl_'+key).prop('checked', slConfig[key]); else $('#ip_cl_'+key).val(slConfig[key]); } function saveValues() { var ledConfig = {}; for(key in slConfig) { if(typeof(slConfig[key]) === "boolean") ledConfig[key] = $('#ip_cl_'+key).is(':checked'); else if(Number.isInteger(slConfig[key])) ledConfig[key] = parseInt($('#ip_cl_'+key).val()); else ledConfig[key] = $('#ip_cl_'+key).val(); } setTimeout(requestWriteConfig, 100, {ledConfig}); } // check access level and adjust ui if(storedAccess == "default") { $('#btn_ma_generate').toggle(false); $('#btn_cl_generate').toggle(false); $('#texfield_panel').toggle(false); $('#previewcreator').toggle(false); } else { $('#btn_ma_save').toggle(false); $('#btn_cl_save').toggle(false); } //Wiki link $('#leds_wl').append('

'+$.i18n('general_wiki_moreto',$.i18n('conf_leds_nav_label_ledlayout'))+buildWL("user/moretopics/ledarea","Wiki")+'

'); // bind change event to all inputs $('.ledCLconstr').bind("change", function() { valValue(this.id,this.value,this.min,this.max); createClassicLeds(); }); $('.ledMAconstr').bind("change", function() { valValue(this.id,this.value,this.min,this.max); createMatrixLeds(); }); // v4 of json schema with diff required assignment - remove when hyperion schema moved to v4 var ledschema = {"items":{"additionalProperties":false,"required":["hscan","vscan","index"],"properties":{"clone":{"type":"integer"},"colorOrder":{"enum":["rgb","bgr","rbg","brg","gbr","grb"],"type":"string"},"hscan":{"additionalProperties":false,"properties":{"maximum":{"maximum":1,"minimum":0,"type":"number"},"minimum":{"maximum":1,"minimum":0,"type":"number"}},"type":"object"},"index":{"type":"integer"},"vscan":{"additionalProperties":false,"properties":{"maximum":{"maximum":1,"minimum":0,"type":"number"},"minimum":{"maximum":1,"minimum":0,"type":"number"}},"type":"object"}},"type":"object"},"type":"array"} //create jsonace editor var aceEdt = new JSONACEEditor(document.getElementById("aceedit"),{ mode: 'code', schema: ledschema, onChange: function(){ var success = true; try{ aceEdt.get(); } catch(err) { success = false; } if(success) { $('#leds_custom_updsim').attr("disabled", false); $('#leds_custom_save').attr("disabled", false); } else { $('#leds_custom_updsim').attr("disabled", true); $('#leds_custom_save').attr("disabled", true); } } }, serverConfig.leds); //TODO: HACK! No callback for schema validation - Add it! setInterval(function(){ if($('#aceedit table').hasClass('jsoneditor-text-errors')) { $('#leds_custom_updsim').attr("disabled", true); $('#leds_custom_save').attr("disabled", true); } },1000) $('.jsoneditor-menu').toggle(); // leds to finalLedArray finalLedArray = serverConfig.leds; // cl/ma leds push to textfield $('#btn_cl_generate, #btn_ma_generate').off().on("click", function(e) { if(e.currentTarget.id == "btn_cl_generate") $('#collapse1').collapse('hide'); else $('#collapse2').collapse('hide'); aceEdt.set(finalLedArray); $('#collapse4').collapse('show'); }); // create and update editor $("#leddevices").off().on("change", function() { generalOptions = serverSchema.properties.device; specificOptions = serverSchema.properties.alldevices[$(this).val()]; conf_editor = createJsonEditor('editor_container', { generalOptions : generalOptions, specificOptions : specificOptions, }); values_general = {}; values_specific = {}; isCurrentDevice = (serverInfo.ledDevices.active == $(this).val()); for(var key in serverConfig.device){ if (key != "type" && key in generalOptions.properties) values_general[key] = serverConfig.device[key]; }; conf_editor.getEditor("root.generalOptions").setValue( values_general ); if (isCurrentDevice) { specificOptions_val = conf_editor.getEditor("root.specificOptions").getValue() for(var key in specificOptions_val){ values_specific[key] = (key in serverConfig.device) ? serverConfig.device[key] : specificOptions_val[key]; }; conf_editor.getEditor("root.specificOptions").setValue( values_specific ); }; // change save button state based on validation result conf_editor.validate().length ? $('#btn_submit_controller').attr('disabled', true) : $('#btn_submit_controller').attr('disabled', false); // led controller sepecific wizards if($(this).val() == "philipshue") { createHint("wizard", $.i18n('wiz_hue_title'), "btn_wiz_holder","btn_led_device_wiz"); $('#btn_led_device_wiz').off().on('click',startWizardPhilipsHue); } else { $('#btn_wiz_holder').html("") $('#btn_led_device_wiz').off(); } }); // create led device selection ledDevices = serverInfo.ledDevices.available devRPiSPI = ['apa102', 'apa104', 'ws2801', 'lpd6803', 'lpd8806', 'p9813', 'sk6812spi', 'sk6822spi', 'ws2812spi']; devRPiPWM = ['ws281x']; devRPiGPIO = ['piblaster']; devNET = ['atmoorb', 'fadecandy', 'philipshue', 'tinkerforge', 'tpm2net', 'udpe131', 'udpartnet', 'udph801', 'udpraw']; devUSB = ['adalight', 'dmx', 'atmo', 'hyperionusbasp', 'lightpack', 'multilightpack', 'paintpack', 'rawhid', 'sedu', 'tpm2', 'karate']; var optArr = [[]]; optArr[1]=[]; optArr[2]=[]; optArr[3]=[]; optArr[4]=[]; optArr[5]=[]; for (idx=0; idx