node-red-contrib-deconz
Version:
deCONZ connectivity nodes for node-red
239 lines (227 loc) • 9.74 kB
HTML
<script type="text/html" data-template-name="deconz-output">
<link rel="stylesheet" href="node-red-contrib-deconz/multiple-select/multiple-select.css" type="text/css">
<link rel="stylesheet" href="resources/node-red-contrib-deconz/css/common.css" type="text/css">
<div class="deconz-editor">
<!-- --- Tip Box --- -->
<div class="form-row" id="node-input-tip-box"></div>
<!--#region --- Main settings --- -->
<!-- --- Name --- -->
<div class="form-row">
<label for="node-input-name" class="l-width">
<i class="fa fa-tag"></i>
<span data-i18n="node-red:common.label.name"></span>
</label>
<input type="text" id="node-input-name" data-i18n="[placeholder]node-red:common.label.name">
</div>
<!-- --- Server --- -->
<div class="form-row">
<label for="node-input-server" class="l-width">
<i class="fa fa-globe"></i>
<span data-i18n="node-red-contrib-deconz/server:editor.inputs.server.label"></span>
</label>
<input type="text" id="node-input-server">
</div>
<!--#endregion -->
<!-- --- Status text --- -->
<div class="form-row deconz-node">
<label for="node-input-statustext" class="l-width">
<i class="fa fa-search"></i>
<span data-i18n="node-red-contrib-deconz/server:editor.inputs.statustext.label"></span>
</label>
<input type="text" id="node-input-statustext">
<input type="hidden" id="node-input-statustext_type">
</div>
<!--#endregion -->
<!--#region --- Section Device selection --- -->
<div class="separator" data-i18n="node-red-contrib-deconz/server:editor.inputs.separator.device"></div>
<!-- --- Query type (Device/Json/Jsonata --- -->
<div class="form-row deconz-node">
<label for="node-input-query" class="l-width">
<i class="fa fa-search"></i>
<span data-i18n="node-red-contrib-deconz/server:editor.inputs.device.query.label"></span>
</label>
<input type="text" id="node-input-query">
<input type="hidden" id="node-input-search_type">
</div>
<!-- --- Query result list --- -->
<div class="form-row deconz-query-selector">
<label for="node-input-query_result" class="l-width">
<i class="fa fa-crosshairs"></i>
<span data-i18n="node-red-contrib-deconz/server:editor.inputs.device.query_result.label"></span>
</label>
<select id="node-input-query_result"
class="s-width multiple-select"
data-i18n="[placeholder]node-red-contrib-deconz/server:editor.multiselect.none_selected"
multiple="multiple"
></select>
</div>
<!-- --- Refresh query result Button --- -->
<div class="form-row deconz-query-selector">
<label for="force-refresh-query-result" class="l-width">
<i class="fa fa-refresh"></i>
<span data-i18n="node-red-contrib-deconz/server:editor.inputs.device.refresh_query.label"></span>
</label>
<a class="red-ui-button s-width" id="force-refresh-query-result">
<span data-i18n="node-red-contrib-deconz/server:editor.inputs.device.refresh_query.button_text"></span>
</a>
</div>
<!-- --- Devices list --- -->
<div class="form-row deconz-device-selector">
<label for="node-input-device_list" class="l-width">
<i class="fa fa-crosshairs"></i>
<span data-i18n="node-red-contrib-deconz/server:editor.inputs.device.device.label"></span>
</label>
<select id="node-input-device_list"
class="s-width multiple-select"
data-i18n="[placeholder]node-red-contrib-deconz/server:editor.multiselect.none_selected"
multiple="multiple"
></select>
</div>
<!-- --- Refresh devices list Button --- -->
<div class="form-row deconz-device-selector">
<label for="force-refresh" class="l-width">
<i class="fa fa-refresh"></i>
<span data-i18n="node-red-contrib-deconz/server:editor.inputs.device.refresh.label"></span>
</label>
<a class="red-ui-button s-width" id="force-refresh">
<span data-i18n="node-red-contrib-deconz/server:editor.inputs.device.refresh.button_text"></span>
</a>
</div>
<!--#endregion -->
<!--#region --- Specific --- -->
<div id="specific-container"></div>
<!--#endregion -->
<!--#region --- Section Output --- -->
<div class="separator" data-i18n="node-red-contrib-deconz/server:editor.inputs.separator.commands"></div>
<!-- --- Output list --- -->
<div class="form-row node-input-output-container-row">
<ol id="node-input-output-container"></ol>
</div>
<!--#endregion -->
</div>
</script>
<script type='text/javascript'>
RED.nodes.registerType('deconz-output', {
category: 'deCONZ',
color: '#f7aa3f',
align: 'right',
defaults: {
name: {
value: ""
},
config_version: {
value: 2,
required: true
},
server: {
type: 'deconz-server',
required: true
},
statustext: {
value: "",
required: false
},
statustext_type: {
value: "default",
required: true
},
search_type: {
value: 'device',
required: true
},
device_list: {
value: [],
required: false
},
device_name: {
value: ""
},
query: {
value: "{}",
required: false
},
commands: {
value: [{
type: 'deconz_state',
domain: 'lights',
arg: {
on: { type: 'keep', value: "" },
alert: { type: 'str', value: "" },
effect: { type: 'str', value: "" },
colorloopspeed: { type: 'num', value: "" },
open: { type: 'keep', value: "" },
stop: { type: 'keep', value: "" },
lift: { type: 'num', value: "" },
tilt: { type: 'num', value: "" },
group: { type: 'num', value: "" },
scene: { type: 'num', value: "" },
target: { type: 'state', value: "" },
command: { type: 'str', value: "on" },
payload: { type: 'msg', value: "payload" },
delay: { type: 'num', value: "2000" },
transitiontime: { type: 'num', value: "" },
retryonerror: { type: 'num', value: "0" },
aftererror: { type: 'continue', value: "" },
bri: { direction: 'set', type: 'num', value: "" },
sat: { direction: 'set', type: 'num', value: "" },
hue: { direction: 'set', type: 'num', value: "" },
ct: { direction: 'set', type: 'num', value: "" },
xy: { direction: 'set', type: 'json', value: "[]" }
}
}]
},
specific: {
value: {
delay: { type: 'num', value: '50' },
result: { type: 'at_end', value: '' }
}
},
//#region All next options are for configuration migration from legacy
device: {},
command: {},
commandType: {},
payload: {},
payloadType: {},
transitionTime: {},
transitionTimeType: {},
//#endregion
},
inputLabels: 'event',
paletteLabel: 'out',
inputs: 1,
outputs: 1,
icon: "deconz.png",
label: function () {
let label = 'deconz-out';
if (this.name) {
label = this.name;
} else if (typeof (this.device_name) == 'string' && this.device_name.length) {
label = this.device_name;
} else if (typeof (this.device) == 'string' && this.device.length) {
label = this.device;
}
return label;
},
oneditprepare: function () {
(async () => {
let node = this;
node.nodeEditor = new DeconzMainEditor(node, {
have: {
commands: true,
specific: true
},
commands: {
button_title: 'node-red-contrib-deconz/server:editor.inputs.commands.rule_button.desc',
}
});
await node.nodeEditor.init();
})().then().catch((error) => {
console.error(error);
});
},
oneditsave: function () {
let node = this;
node.nodeEditor.oneditsave();
}
});
</script>