$(document).ready(function() { performTranslation(); var oldEffects = []; var cpcolor = '#B500FF'; var mappingList = serverSchema.properties.color.properties.imageToLedMappingType.enum; var duration = 0; var rgb = {r:255,g:0,b:0}; //create html createTable('ssthead', 'sstbody', 'sstcont'); $('.ssthead').html(createTableRow([$.i18n('remote_input_origin'), $.i18n('remote_input_owner'), $.i18n('remote_input_priority'), $.i18n('remote_input_status')], true, true)); createTable('crthead', 'crtbody', 'adjust_content', true); //create introduction if(showOptHelp) { createHint("intro", $.i18n('remote_color_intro', $.i18n('remote_losthint')), "color_intro"); createHint("intro", $.i18n('remote_input_intro', $.i18n('remote_losthint')), "sstcont"); createHint("intro", $.i18n('remote_adjustment_intro', $.i18n('remote_losthint')), "adjust_content"); createHint("intro", $.i18n('remote_components_intro', $.i18n('remote_losthint')), "comp_intro"); createHint("intro", $.i18n('remote_maptype_intro', $.i18n('remote_losthint')), "maptype_intro"); } //color adjustment var sColor = sortProperties(serverSchema.properties.color.properties.channelAdjustment.items.properties) var values = serverInfo.adjustment[0] for(key in sColor) { if(sColor[key].key != "id" && sColor[key].key != "leds") { var title = ''; var property; var value = values[sColor[key].key] if(sColor[key].type == "array") { property = '
'; $('.crtbody').append(createTableRow([title, property], false, true)); createCP('cr_'+sColor[key].key, value, function(rgb,hex,e){ requestAdjustment(e.target.id.substr(e.target.id.indexOf("_") + 1), '['+rgb.r+','+rgb.g+','+rgb.b+']'); }); } else if(sColor[key].type == "boolean") { property = '
'; $('.crtbody').append(createTableRow([title, property], false, true)); $('#cr_'+sColor[key].key).off().on('change', function(e){ requestAdjustment(e.target.id.substr(e.target.id.indexOf("_") + 1), e.currentTarget.checked); }); } else { if(sColor[key].key == "brightness" || sColor[key].key == "brightnessCompensation" || sColor[key].key == "backlightThreshold") property = '
'+$.i18n("edt_append_percent")+'
'; else property = ''; $('.crtbody').append(createTableRow([title, property], false, true)); $('#cr_'+sColor[key].key).off().on('change', function(e){ valValue(this.id,this.value,this.min,this.max); requestAdjustment(e.target.id.substr(e.target.id.indexOf("_") + 1), e.currentTarget.value); }); } } } function sendEffect() { efx = $("#effect_select").val(); if(efx != "__none__") { requestPriorityClear(); $(hyperion).one("cmd-clear", function(event) { setTimeout(function() {requestPlayEffect(efx,duration)}, 100); }); } } function sendColor() { requestSetColor(rgb.r, rgb.g, rgb.b,duration); } function updateRemote() { if ($('#componentsbutton').length == 0) { $(hyperion).off("cmd-serverinfo",updateRemote); } else { updateInputSelect(); updateLedMapping(); updateComponents(); updateEffectlist(); } } function updateInputSelect() { $('.sstbody').html(""); var data = ""; var prios = serverInfo.priorities var i; var clearAll = false; for(i = 0; i < prios.length; i++) { var origin = prios[i].origin ? prios[i].origin : "System"; origin = origin.split("@"); var ip = origin[1]; origin = origin[0]; var owner = prios[i].owner; var active = prios[i].active; var visible = prios[i].visible; var priority = prios[i].priority; var compId = prios[i].componentId; var duration = prios[i].duration_ms/1000; var btn_type = "default"; var btn_text = $.i18n('remote_input_setsource_btn'); var btn_state = "enabled"; if (active) btn_type = "primary"; if(priority > 254) continue; if(priority < 254 && (compId == "EFFECT" || compId == "COLOR") ) clearAll = true; if (visible) { btn_state = "disabled"; btn_type = "success"; btn_text = $.i18n('remote_input_sourceactiv_btn'); } if(ip) origin += '
'+$.i18n('remote_input_ip')+' '+ip+''; switch (compId) { case "EFFECT": owner = $.i18n('remote_effects_label_effects')+' '+owner; break; case "COLOR": owner = $.i18n('remote_color_label_color')+' '+'
'; break; case "GRABBER": owner = $.i18n('general_comp_GRABBER')+': ('+owner+')'; break; case "V4L": owner = $.i18n('general_comp_V4L')+': ('+owner+')'; break; case "BOBLIGHTSERVER": owner = $.i18n('general_comp_BOBLIGHTSERVER'); break; case "UDPLISTENER": owner = $.i18n('general_comp_UDPLISTENER'); break; } if(duration && compId != "GRABBER" && compId != "PROTOSERVER") owner += '
'+$.i18n('remote_input_duration')+' '+duration.toFixed(0)+$.i18n('edt_append_s')+''; var btn = ''; if((compId == "EFFECT" || compId == "COLOR") && priority < 254) btn += ''; if(btn_type != 'default') $('.sstbody').append(createTableRow([origin, owner, priority, btn], false, true)); } var btn_auto_color = (serverInfo.priorities_autoselect? "btn-success" : "btn-danger"); var btn_auto_state = (serverInfo.priorities_autoselect? "disabled" : "enabled"); var btn_auto_text = (serverInfo.priorities_autoselect? $.i18n('general_btn_on') : $.i18n('general_btn_off')); var btn_call_state = (clearAll? "enabled" : "disabled"); $('#auto_btn').html(''); $('#auto_btn').append(''); var max_width=100; $('.btn_input_selection').each(function() { if ($(this).innerWidth() > max_width) max_width = $(this).innerWidth(); }); $('.btn_input_selection').css("min-width",max_width+"px"); } function updateLedMapping() { mapping = serverInfo.ledMAppingType; $('#mappingsbutton').html(""); for(var ix = 0; ix < mappingList.length; ix++) { if(mapping == mappingList[ix]) btn_style = 'btn-success'; else btn_style = 'btn-primary'; $('#mappingsbutton').append('
'); } } function updateComponents() { components = serverInfo.components; // create buttons $('#componentsbutton').html(""); for ( idx=0; idx '+$.i18n('general_comp_'+components[idx].name)+''; $('#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)+')').attr(comp_goff); } } } function updateEffectlist() { var newEffects = serverInfo.effects; if (newEffects.length != oldEffects.length) { $('#effect_select').html(''); var usrEffArr = []; var sysEffArr = []; for(i = 0; i < newEffects.length; i++) { var effectName = newEffects[i].name; if(!/^\:/.test(newEffects[i].file)){ usrEffArr.push(effectName); } else{ sysEffArr.push(effectName); } } $('#effect_select').append(createSel(usrEffArr, $.i18n('remote_optgroup_usreffets'))); $('#effect_select').append(createSel(sysEffArr, $.i18n('remote_optgroup_syseffets'))); oldEffects = newEffects; } } // colorpicker and effect if (getStorage('rmcpcolor') != null) { cpcolor = getStorage('rmcpcolor'); rgb = hexToRgb(cpcolor); } if (getStorage('rmduration') != null) { $("#remote_duration").val(getStorage('rmduration')); duration = getStorage('rmduration'); } createCP('cp2', cpcolor, function(rgbT,hex){ rgb = rgbT; sendColor() setStorage('rmcpcolor', hex); }); $("#reset_color").off().on("click", function(){ requestPriorityClear(); $("#effect_select").val("__none__"); }); $("#remote_duration").off().on("change", function(){ duration = valValue(this.id,this.value,this.min,this.max); setStorage('rmduration', duration); }); $("#effect_select").off().on("change", function(event) { sendEffect(); }); $("#remote_input_reseff, #remote_input_rescol").off().on("click", function(){ if(this.id == "remote_input_rescol") sendColor(); else sendEffect(); }); $("#remote_input_img").change(function(){ readImg(this, function(src,width,height){ console.log(src,width,height) requestSetImage(src,width,height,duration) }); }); //force first update updateRemote(); // interval updates $(hyperion).on("cmd-serverinfo",updateRemote); removeOverlay(); });