node-red-contrib-webthingsio
Version:
Set/get properties, execute actions and inject on events of your WebThings
297 lines (292 loc) • 16.2 kB
HTML
<script type="text/javascript">
RED.nodes.registerType('webthingsio-inject', {
category: 'Web Things IO',
color: '#5d9bc7',
defaults: {
/* eslint-disable no-undefined */
name: {value: ''},
gateway: {value: '', type: 'webthingsio-gateway', required: true},
injectOn: {value: undefined, required: true},
thing: {
value: undefined,
validate: function(v) {
return v ||
[
'thing added',
'thing modified',
'thing removed',
].includes(this.injectOn);
},
},
property: {
value: undefined,
validate: function(v) {
return v ||
this.injectOn !== 'property changed' ||
this.thing === '*';
},
},
event: {
value: undefined,
validate: function(v) {
return v ||
this.injectOn !== 'event raised' ||
this.thing === '*';
},
},
action: {
value: undefined,
validate: function(v) {
return v ||
this.injectOn !== 'action executed' ||
this.thing === '*';
},
},
},
inputs: 0,
outputs: 1,
icon: 'webthingsio.svg',
label: function() {
if (this.name) {
return this.name;
}
if (this.gateway && this.thing && this.injectOn) {
const decodedThing = decodeURIComponent(this.thing);
switch (this.injectOn) {
case 'property changed':
if (this.thing === '*') {
if (RED.settings.webthingsioGatewayShorterLabels) {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.shortLabelAnyAnyPropertyChanged');
} else {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.longLabelAnyAnyPropertyChanged');
}
} else if (this.property === '*') {
if (RED.settings.webthingsioGatewayShorterLabels) {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.shortLabelAnyPropertyChanged')
.replace('%thing', decodedThing);
} else {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.longLabelAnyPropertyChanged')
.replace('%thing', decodedThing);
}
} else {
// eslint-disable-next-line no-lonely-if
if (RED.settings.webthingsioGatewayShorterLabels) {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.shortLabelPropertyChanged')
.replace('%property', this.property)
.replace('%thing', decodedThing);
} else {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.longLabelPropertyChanged')
.replace('%property', this.property)
.replace('%thing', decodedThing);
}
}
case 'event raised':
if (this.thing === '*') {
if (RED.settings.webthingsioGatewayShorterLabels) {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.shortLabelAnyAnyEventRaised');
} else {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.longLabelAnyAnyEventRaised');
}
} else if (this.event === '*') {
if (RED.settings.webthingsioGatewayShorterLabels) {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.shortLabelAnyEventRaised')
.replace('%thing', decodedThing);
} else {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.longLabelAnyEventRaised')
.replace('%thing', decodedThing);
}
} else {
// eslint-disable-next-line no-lonely-if
if (RED.settings.webthingsioGatewayShorterLabels) {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.shortLabelEventRaised')
.replace('%event', this.event)
.replace('%thing', decodedThing);
} else {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.longLabelEventRaised')
.replace('%event', this.event)
.replace('%thing', decodedThing);
}
}
case 'action executed':
if (this.thing === '*') {
if (RED.settings.webthingsioGatewayShorterLabels) {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.shortLabelAnyAnyActionExecuted');
} else {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.longLabelAnyAnyActionExecuted');
}
} else if (this.action === '*') {
if (RED.settings.webthingsioGatewayShorterLabels) {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.shortLabelAnyActionExecuted')
.replace('%thing', decodedThing);
} else {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.longLabelAnyActionExecuted')
.replace('%thing', decodedThing);
}
} else {
// eslint-disable-next-line no-lonely-if
if (RED.settings.webthingsioGatewayShorterLabels) {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.shortLabelActionExecuted')
.replace('%action', this.action)
.replace('%thing', decodedThing);
} else {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.longLabelActionExecuted')
.replace('%action', this.action)
.replace('%thing', decodedThing);
}
}
case 'connect state changed':
if (this.thing === '*') {
if (RED.settings.webthingsioGatewayShorterLabels) {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.shortLabelAnyConnectStateChanged');
} else {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.longLabelAnyConnectStateChanged');
}
} else {
// eslint-disable-next-line no-lonely-if
if (RED.settings.webthingsioGatewayShorterLabels) {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.shortLabelConnectStateChanged')
.replace('%thing', decodedThing);
} else {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.longLabelConnectStateChanged')
.replace('%thing', decodedThing);
}
}
case 'thing added':
if (RED.settings.webthingsioGatewayShorterLabels) {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.shortLabelThingAdded');
} else {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.longLabelThingAdded');
}
case 'thing modified':
if (RED.settings.webthingsioGatewayShorterLabels) {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.shortLabelThingModified');
} else {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.longLabelThingModified');
}
case 'thing removed':
if (RED.settings.webthingsioGatewayShorterLabels) {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.shortLabelThingRemoved');
} else {
// eslint-disable-next-line max-len
return this._('webthingsio-inject.longLabelThingRemoved');
}
}
}
return this._('webthingsio-inject.defaultLabel');
},
paletteLabel: 'Inject',
oneditprepare: async function() {
async function initializeInputs(node) {
if (
$('#node-input-gateway')[0].options.length > 1 &&
!node.gateway
) {
$('#node-input-gateway')[0].selectedIndex = 0;
$('#node-input-gateway').removeClass('input-error');
}
$('#node-input--injectOn').prop('value', node.injectOn);
await webthingsio.updateThing(false, true);
$('#node-input--thing').prop('value', node.thing);
await webthingsio.updateProperty(false, true, true);
$('#node-input--property').prop('value', node.property);
await webthingsio.updateEvent(true);
$('#node-input--event').prop('value', node.event);
await webthingsio.updateAction(false, true);
$('#node-input--action').prop('value', node.action);
webthingsio.updateInjectVisibility();
}
function addListeners() {
$('#node-input-gateway')[0].addEventListener('change', async () => {
await webthingsio.updateThing(true, true);
webthingsio.updateInjectVisibility();
});
$('#node-input--injectOn')[0].addEventListener(
'change',
(_ev) => webthingsio.updateInjectVisibility(),
);
$('#node-input--thing')[0].addEventListener('change', async () => {
await webthingsio.updateProperty(true, true, true);
await webthingsio.updateEvent(true);
await webthingsio.updateAction(true, true);
webthingsio.updateInjectVisibility();
});
}
await initializeInputs(this);
addListeners();
},
oneditsave: function() {
webthingsio.saveInjectOn(this);
webthingsio.saveThing(this);
webthingsio.saveProperty(this);
webthingsio.saveEvent(this);
webthingsio.saveAction(this);
},
});
</script>
<script type="text/html" data-template-name="webthingsio-inject">
<div class="form-row" id="node-errorGatewayConnect" data-i18n="webthingsio-inject.errorGatewayConnect" style="display: none; color: red;">
</div>
<div class="form-row">
<label for="node-input-name" data-i18n="webthingsio-inject.labelName"><i class="fa fa-tag"></i></label>
<input type="text" id="node-input-name" data-i18n="[placeholder]webthingsio-inject.placeholderName">
</div>
<div class="form-row">
<label for="node-input-gateway" data-i18n="webthingsio-inject.labelGateway"><i class="fa fa-tag"></i></label>
<input type="text" id="node-input-gateway">
</div>
<div class="form-row" id="injectOn-row">
<label for="node-input--injectOn" data-i18n="webthingsio-inject.labelInjectOn"><i class="fa fa-tag"></i></label>
<select id="node-input--injectOn" style="width: 70%;">
<option value="property changed" data-i18n="webthingsio-inject.optionPropertyChanged"></option>
<option value="event raised" data-i18n="webthingsio-inject.optionEventRaised"></option>
<option value="action executed" data-i18n="webthingsio-inject.optionActionExecuted"></option>
<option value="connect state changed" data-i18n="webthingsio-inject.optionConnectStateChanged"></option>
<option value="thing added" data-i18n="webthingsio-inject.optionThingAdded"></option>
<option value="thing modified" data-i18n="webthingsio-inject.optionThingModified"></option>
<option value="thing removed" data-i18n="webthingsio-inject.optionThingRemoved"></option>
</select>
</div>
<div class="form-row" id="thing-row" style="display: none;">
<label for="node-input--thing" data-i18n="webthingsio-inject.labelThing"><i class="fa fa-tag"></i></label>
<select id="node-input--thing" style="width: 70%;"></select>
</div>
<div class="form-row" id="property-row" style="display: none;">
<label for="node-input--property" data-i18n="webthingsio-inject.labelProperty"><i class="fa fa-tag"></i></label>
<select id="node-input--property" style="width: 70%;"></select>
</div>
<div class="form-row" id="event-row" style="display: none;">
<label for="node-input--event" data-i18n="webthingsio-inject.labelEvent"><i class="fa fa-tag"></i></label>
<select id="node-input--event" style="width: 70%;"></select>
</div>
<div class="form-row" id="action-row" style="display: none;">
<label for="node-input--action" data-i18n="webthingsio-inject.labelAction"><i class="fa fa-tag"></i></label>
<select id="node-input--action" style="width: 70%;"></select>
</div>
</script>