node-red-contrib-knx-ultimate 6.3.6 → 6.3.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (18) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/nodes/hue-config.js +12 -2
  3. package/nodes/knxUltimateHueController.html +279 -31
  4. package/nodes/locales/de/knxUltimateHueController.html +8 -1
  5. package/nodes/locales/de/knxUltimateHueController.json +4 -1
  6. package/nodes/locales/en/knxUltimateHueController.html +8 -1
  7. package/nodes/locales/en/knxUltimateHueController.json +4 -1
  8. package/nodes/locales/es/knxUltimateHueController.html +8 -1
  9. package/nodes/locales/es/knxUltimateHueController.json +4 -1
  10. package/nodes/locales/fr/knxUltimateHueController.html +8 -1
  11. package/nodes/locales/fr/knxUltimateHueController.json +4 -1
  12. package/nodes/locales/it/knxUltimateHueController.html +8 -1
  13. package/nodes/locales/it/knxUltimateHueController.json +4 -1
  14. package/nodes/locales/zh-CN/knxUltimateHueController.html +8 -1
  15. package/nodes/locales/zh-CN/knxUltimateHueController.json +4 -1
  16. package/package.json +1 -1
  17. package/resources/hueControllerEditorSelection.js +32 -0
  18. package/resources/hueControllerProfiles.js +75 -29
package/resources/hueControllerProfiles.js CHANGED
@@ -510,17 +510,24 @@
510
510
  return resolveKnxServerValue() !== '';
511
511
  };
512
512
 
513
- const $tabs = $("#tabs");
513
+ // Scope the generic legacy ID to this Controller profile. Other
514
+ // Node-RED/config dialogs may contain their own #tabs element.
515
+ const $tabs = $('#hue-controller-profile-editor').find('#tabs');
514
516
  const $pinSectionRow = $("#node-input-enableNodePINS").closest('.form-row');
515
517
  const $pinSelect = $("#node-input-enableNodePINS");
516
518
  const $pinInfoRow = $pinSectionRow.next('.form-tips');
517
519
  const updateTabsVisibility = () => {
518
520
  const knxSelected = hasKnxServerSelected();
519
- const hueDeviceSelected = getHueDeviceValue() !== '';
520
- const shouldShowTabs = knxSelected && hueDeviceSelected;
521
+ // The unified wrapper owns device/profile visibility. Inside the
522
+ // mounted Light profile, only KNX selection controls its GA tabs.
523
+ const shouldShowTabs = knxSelected;
521
524
 
522
525
  if (shouldShowTabs) {
523
- $tabs.show();
526
+ // jQuery.show() restores a hidden div as display:block, which
527
+ // overrides the vertical tab widget's flex layout after the KNX
528
+ // gateway goes none -> selected. Restore the intended layout
529
+ // explicitly so the navigation remains beside its active panel.
530
+ $tabs.css('display', 'flex');
524
531
  try { $tabs.tabs('refresh'); } catch (error) { /* tabs may not be initialized yet */ }
525
532
  } else {
526
533
  $tabs.hide();
@@ -952,33 +959,47 @@
952
959
  // DPT Switch command
953
960
  // ########################
954
961
  const prefixes = Array.isArray(_dpt) ? _dpt : [_dpt];
955
- $(_destinationWidget).empty();
962
+ const $destination = $(_destinationWidget);
963
+ const fieldKey = String(_destinationWidget).replace(/^#node-input-/, '');
964
+ const currentValue = $destination.val();
965
+ const storedValue = node[fieldKey];
966
+ const valueToRestore = currentValue !== undefined && currentValue !== null && String(currentValue) !== ''
967
+ ? String(currentValue)
968
+ : (storedValue === undefined || storedValue === null ? '' : String(storedValue));
956
969
  if (!hasKnxServerSelected()) {
957
970
  return;
958
971
  }
959
972
  const serverId = resolveKnxServerValue();
960
973
  $.getJSON(`knxUltimateDpts?serverId=${serverId}&_=${Date.now()}`, (data) => {
974
+ // A late response from the previous gateway must not overwrite
975
+ // the mappings kept in the editor after selecting none or a
976
+ // different gateway.
977
+ if (resolveKnxServerValue() !== serverId) return;
978
+ $destination.empty();
961
979
  data.forEach((dpt) => {
962
980
  if (prefixes.some((prefix) => prefix === "" || dpt.value.startsWith(prefix))) {
963
981
  // Adjustment for HUE Temperature
964
982
  if (dpt.value.startsWith("7.600")) {
965
- $(_destinationWidget).append($("<option></option>").attr("value", dpt.value).text(dpt.text + " - KNX Kelvin range 2000-6535k (Homeassistant color_temperature_mode: absolute)"));
983
+ $destination.append($("<option></option>").attr("value", dpt.value).text(dpt.text + " - KNX Kelvin range 2000-6535k (Homeassistant color_temperature_mode: absolute)"));
966
984
  } else if (dpt.value.startsWith("9.002")) {
967
- $(_destinationWidget).append($("<option></option>").attr("value", dpt.value).text(dpt.text + " - HUE Kelvin range 2000-6535k (Homeassistant color_temperature_mode: absolute_float)"));
985
+ $destination.append($("<option></option>").attr("value", dpt.value).text(dpt.text + " - HUE Kelvin range 2000-6535k (Homeassistant color_temperature_mode: absolute_float)"));
968
986
  } else if (dpt.value.startsWith("5.001")) {
969
- $(_destinationWidget).append($("<option></option>").attr("value", dpt.value).text(dpt.text + " - Homeassistant color_temperature_mode: relative"));
987
+ $destination.append($("<option></option>").attr("value", dpt.value).text(dpt.text + " - Homeassistant color_temperature_mode: relative"));
970
988
  } else {
971
- $(_destinationWidget).append($("<option></option>").attr("value", dpt.value).text(dpt.text));
989
+ $destination.append($("<option></option>").attr("value", dpt.value).text(dpt.text));
972
990
  }
973
991
  }
974
992
  });
975
- // Eval
976
- const format = "node." + _destinationWidget.replace("#node-input-", "");
977
- try {
978
- if (format !== undefined) $(_destinationWidget).val(eval(format).toString());
979
- } catch (error) { }
993
+ if (valueToRestore !== '') {
994
+ const valueIsAvailable = $destination.find('option').toArray()
995
+ .some((option) => option.value === valueToRestore);
996
+ if (!valueIsAvailable) {
997
+ $destination.append($("<option></option>").attr("value", valueToRestore).text(valueToRestore));
998
+ }
999
+ $destination.val(valueToRestore);
1000
+ }
980
1001
  if (_destinationWidget === '#node-input-dptLightEffect') {
981
- $(_destinationWidget).trigger('change');
1002
+ $destination.trigger('change');
982
1003
  }
983
1004
  });
984
1005
  }
@@ -1119,10 +1140,32 @@
1119
1140
 
1120
1141
  updateTabsVisibility();
1121
1142
 
1122
- $knxServerInput.on('change.knxUltimateHueLight', () => {
1123
- refreshKnxBindings();
1124
- updateTabsVisibility();
1125
- });
1143
+ $(document)
1144
+ .off('change.knxUltimateHueLightGateway', '#node-input-server')
1145
+ .on('change.knxUltimateHueLightGateway', '#node-input-server', function (event) {
1146
+ const selectedValue = $(this).val();
1147
+ const normalizedValue = selectedValue === undefined || selectedValue === null
1148
+ ? ''
1149
+ : String(selectedValue).trim();
1150
+ const selectionApi = window.KNXUltimateHueControllerEditorSelection;
1151
+ const preserveStoredSelection = selectionApi && typeof selectionApi.shouldPreserveStoredSelection === 'function'
1152
+ ? selectionApi.shouldPreserveStoredSelection(event, selectedValue, node.server, KNX_EMPTY_VALUES)
1153
+ : ((!event || !event.originalEvent) && KNX_EMPTY_VALUES.has(normalizedValue.toLowerCase()) && resolveKnxServerValue() !== '');
1154
+ if (!preserveStoredSelection) {
1155
+ node.server = KNX_EMPTY_VALUES.has(normalizedValue.toLowerCase()) ? '' : normalizedValue;
1156
+ }
1157
+ // Selecting none is a visibility change only. Keep every GA,
1158
+ // DPT option and name mounted exactly as-is so selecting the
1159
+ // gateway again cannot expose a half-empty mapping editor.
1160
+ if (node.server !== '') {
1161
+ try {
1162
+ refreshKnxBindings();
1163
+ } catch (error) {
1164
+ notifyEditorError(error, 'KNX mappings');
1165
+ }
1166
+ }
1167
+ updateTabsVisibility();
1168
+ });
1126
1169
 
1127
1170
  $hueDeviceInput.on('change.knxUltimateHueLight input.knxUltimateHueLight', updateTabsVisibility);
1128
1171
 
@@ -1247,9 +1290,9 @@
1247
1290
  setAvailableEffects(effects);
1248
1291
  // Check if grouped, to hide/show the "Get current" buttons
1249
1292
  if (oLight.type === "grouped_light") {
1250
- $("#tabs").tabs("enable", "#tabs-4");
1251
- $("#tabs").tabs("enable", "#tabs-3");
1252
- $("#tabs").tabs("enable", "#tabs-2");
1293
+ $tabs.tabs("enable", "#tabs-4");
1294
+ $tabs.tabs("enable", "#tabs-3");
1295
+ $tabs.tabs("enable", "#tabs-2");
1253
1296
  $("#getColorAtSwitchOnDayTimeButton").show();
1254
1297
  $("#getColorAtSwitchOnNightTimeButton").show();
1255
1298
  $("#node-input-specifySwitchOnBrightness").empty().append(
@@ -1297,9 +1340,9 @@
1297
1340
  );
1298
1341
  }
1299
1342
 
1300
- $("#tabs").tabs("disable", "#tabs-4");
1301
- $("#tabs").tabs("disable", "#tabs-3");
1302
- $("#tabs").tabs("disable", "#tabs-2");
1343
+ $tabs.tabs("disable", "#tabs-4");
1344
+ $tabs.tabs("disable", "#tabs-3");
1345
+ $tabs.tabs("disable", "#tabs-2");
1303
1346
  $("#divColorsAtSwitchOn").hide();
1304
1347
  $("#divColorsAtSwitchOnNightTime").hide();
1305
1348
  $("#divTemperatureAtSwitchOn").hide();
@@ -1312,11 +1355,11 @@
1312
1355
 
1313
1356
  // Enable options/tabs one by one
1314
1357
  if (oLight.dimming !== undefined) {
1315
- $("#tabs").tabs("enable", "#tabs-2");
1358
+ $tabs.tabs("enable", "#tabs-2");
1316
1359
  $("#divBehaviourBrightness").show();
1317
1360
  }
1318
1361
  if (oLight.color !== undefined) {
1319
- $("#tabs").tabs("enable", "#tabs-4");
1362
+ $tabs.tabs("enable", "#tabs-4");
1320
1363
  $("#divColorsAtSwitchOn").show();
1321
1364
  $("#divColorsAtSwitchOnNightTime").show();
1322
1365
  $("#divColorCycle").show();
@@ -1333,7 +1376,7 @@
1333
1376
  }
1334
1377
  // Check temperature (if the light supports temperature, it support dimming as well)
1335
1378
  if (oLight.color_temperature !== undefined) {
1336
- $("#tabs").tabs("enable", "#tabs-3");
1379
+ $tabs.tabs("enable", "#tabs-3");
1337
1380
  //$("#tabs").tabs("enable", "#tabs-2");
1338
1381
  $("#node-input-specifySwitchOnBrightness").append(
1339
1382
  $("<option>")
@@ -1658,6 +1701,7 @@
1658
1701
  },
1659
1702
 
1660
1703
  oneditsave: function () {
1704
+ $(document).off('change.knxUltimateHueLightGateway', '#node-input-server');
1661
1705
  // Return to the info tab
1662
1706
  try {
1663
1707
  RED.sidebar.show("info");
@@ -1707,6 +1751,7 @@
1707
1751
  this.__locateSessionInfo = null;
1708
1752
  },
1709
1753
  oneditcancel: function () {
1754
+ $(document).off('change.knxUltimateHueLightGateway', '#node-input-server');
1710
1755
  // Return to the info tab
1711
1756
  try {
1712
1757
  RED.sidebar.show("info");
@@ -1731,6 +1776,7 @@
1731
1776
  }
1732
1777
  },
1733
1778
  oneditclose: function () {
1779
+ $(document).off('change.knxUltimateHueLightGateway', '#node-input-server');
1734
1780
  if (typeof this.__stopHueLocateSession === 'function') {
1735
1781
  try { this.__stopHueLocateSession(); } catch (error) { /* empty */ }
1736
1782
  }
@@ -9124,7 +9170,7 @@
9124
9170
  // Form fragments are mounted inside #hue-controller-profile-editor. The two
9125
9171
  // config-node fields remain owned by the outer Controller template.
9126
9172
  const PROFILE_TEMPLATES = {
9127
- "light": "<!-- Canonical private HUE Controller template: light. -->\n<div class=\"form-row hue-legacy-controller-notice\" role=\"note\" style=\"box-sizing:border-box; padding:10px 12px; margin-bottom:14px; border-left:4px solid #d79b00; background:#fff8df; color:#4d3a00;\">\n <i class=\"fa fa-exclamation-triangle\" aria-hidden=\"true\" style=\"color:#a15c00; margin-right:6px;\"></i>\n <span data-i18n=\"node-red-contrib-knx-ultimate/knxUltimateHueController:knxUltimateHueController.legacy_node_notice\"></span>\n </div>\n <div class=\"form-row\" style=\"margin-bottom:10px;\">\n <span style=\"color:#ff0000\"><i class=\"fa fa-youtube\"></i></span>&nbsp;<a target=\"_blank\" href=\"https://www.youtube.com/playlist?list=PL9Yh1bjbLAYrU8PsVhW4xzEug2WtVFv3E\"><b>KNX-Ultimate video tutorials (YouTube playlist)</b></a>\n </div>\n <div id=\"mainWindow\">\n <div class=\"form-row\">\n <b><span data-i18n=\"knxUltimateHueLight.title\"></span></b>&nbsp&nbsp<span style=\"color:red\" &nbsp &nbsp<i class=\"fa fa-youtube\"></i></span>&nbsp<a\n target=\"_blank\" href=\"https://youtu.be/jjEUI1J8bkA\"><u><span data-i18n=\"common.youtube_sample\"></span></u></a>\n <br />\n <br />\n <label for=\"node-input-server\">\n <img\n src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAKnRFWHRDcmVhdGlvbiBUaW1lAEZyIDYgQXVnIDIwMTAgMjE6NTI6MTkgKzAxMDD84aS8AAAAB3RJTUUH3gYYCicNV+4WIQAAAAlwSFlzAAALEgAACxIB0t1+/AAAAARnQU1BAACxjwv8YQUAAACUSURBVHjaY2CgFZg5c+Z/ZEyWAZ8+f/6/ZsWs/xoamqMGkGrA6Wla/1+fVARjEBuGsSoGmY4eZSCNL59d/g8DIDbIAHR14OgFGQByKjIGKX5+6/T///8gGMQGiV1+/B0Fg70GIkD+RMYgxf/O5/7//2MSmAZhkBi6OrgB6Bg5DGB4ajr3f2xqsYYLSDE2THJUDg0AAAqyDVd4tp4YAAAAAElFTkSuQmCC\"></img>\n <span data-i18n=\"common.knx_gw\"></span>\n </label>\n <input type=\"text\" id=\"node-input-server\" />\n </div>\n\n <div class=\"form-row\">\n <label for=\"node-input-serverHue\">\n <img\n src=\"data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAAEAAAAAA0VXHyAAABFUlEQVQ4EZWSsWoCQRCG1yiENEFEi6QSkjqWWoqFoBYJ+Br6JHkMn8Iibd4ihQpaJIhWNkry/ZtdGZY78Qa+m39nZ+dm9s4550awglNBluS/gVtAX6KgDclf68w2OThgfR9iT/jnoEv4TtByDThWTCDKW4SSZTf/zj9/eZbN+izTDuKGimu0vPF8B/YN8aC8LmcOj/AAn9CFTEs70Js/oGqy79C69bqJ5XbQI2kGO5N8QL9D08S8zBtBF5ZaVsznpCMoqJnVdjTpb1Db0fwIWmQV6BLXzFOYgA6/gDVfQN9bBWp2J2hdWDPoBV5FrKnAJutHikk/CHHR8i7x4iG7qQ720IYvu3GFbpHjx3pFrOFYkA354z/5bkK826phyAAAAABJRU5ErkJggg==\" />\n <span data-i18n=\"common.hue_bridge\"></span>\n </label>\n <input type=\"text\" id=\"node-input-serverHue\" />\n </div>\n\n <br />\n <p>\n <b><span data-i18n=\"common.philips_hue\"></span></b>\n </p>\n\n <div class=\"form-row\">\n <label for=\"node-input-name\">\n <i class=\"fa fa-play-circle\"></i> <span data-i18n=\"common.name\"></span>\n </label>\n <input type=\"text\" id=\"node-input-name\" placeholder=\"Enter your hue device name\"\n style=\"flex:1 1 240px; min-width:240px; max-width:240px;\" />\n <button type=\"button\" class=\"red-ui-button hue-refresh-devices\"\n style=\"margin-left:6px; color:#1b7d33; border-color:#1b7d33;\" title=\"Refresh Hue devices\">\n <i class=\"fa fa-sync\"></i>\n </button>\n <button type=\"button\" class=\"red-ui-button hue-locate-device\"\n style=\"margin-left:6px; color:#ff9800; border-color:#ff9800;\" title=\"Locate selected Hue device\">\n <i class=\"fa fa-play\"></i>\n </button>\n <span class=\"hue-devices-loading\" style=\"margin-left:6px; display:none; color:#1b7d33;\">\n <i class=\"fa fa-circle-notch fa-spin\"></i>\n </span>\n <input type=\"hidden\" id=\"node-input-hueDevice\" />\n </div>\n\n <br />\n\n <div id=\"tabs\" style=\"display:none; width: 900px;\">\n <ul>\n <li><a href=\"#tabs-1\"><i class=\"fa-solid fa-toggle-on\"></i> <span data-i18n=\"knxUltimateHueLight.tabs.switch\"></span></a></li>\n <li><a href=\"#tabs-2\"><i class=\"fa-solid fa-arrow-up-wide-short\"></i> <span data-i18n=\"knxUltimateHueLight.tabs.dim\"></span></a></li>\n <li><a href=\"#tabs-3\"><i class=\"fa-solid fa-temperature-quarter\"></i> <span data-i18n=\"knxUltimateHueLight.tabs.tunable_white\"></span></a></li>\n <li><a href=\"#tabs-4\"><i class=\"fa-solid fa-palette\"></i> <span data-i18n=\"knxUltimateHueLight.tabs.rgb_hsv\"></span></a></li>\n <li><a href=\"#tabs-5\"><i class=\"fa-solid fa-heart-circle-check\"></i> <span data-i18n=\"knxUltimateHueLight.tabs.effects\"></span></a></li>\n <li><a href=\"#tabs-6\"><i class=\"fa-solid fa-code-merge\"></i> <span data-i18n=\"knxUltimateHueLight.tabs.behaviour\"></span></a></li>\n </ul>\n <div id=\"tabs-1\">\n <p>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightSwitch\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> <span data-i18n=\"knxUltimateHueLight.control\"></span></label>\n\n <label for=\"node-input-GALightSwitch\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightSwitch\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightSwitch\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightSwitch\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightSwitch\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightSwitch\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightState\" style=\"width:110px;\"><i class=\"fa fa-question-circle\"></i> <span data-i18n=\"knxUltimateHueLight.status\"></span></label>\n\n <label for=\"node-input-GALightState\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightState\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightState\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightState\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightState\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightState\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n </p>\n </div>\n <div id=\"tabs-2\">\n <p>\n <img src=\"resources/node-red-contrib-knx-ultimate/dim.png\" style=\"width: 900px;\">\n <div class=\"form-row\">\n <label for=\"node-input-nameLightDIM\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control dim</label>\n\n <label for=\"node-input-GALightDIM\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightDIM\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightDIM\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightDIM\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightDIM\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightDIM\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightBrightness\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control\n %</label>\n\n <label for=\"node-input-GALightBrightness\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightBrightness\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightBrightness\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightBrightness\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightBrightness\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightBrightness\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n\n <div class=\"form-row\">\n <label for=\"node-input-nameLightBrightnessState\" style=\"width:110px;\"><i class=\"fa fa-question-circle\"></i> Status %</label>\n\n <label for=\"node-input-GALightBrightnessState\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightBrightnessState\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightBrightnessState\"\n style=\"width:40px; margin-left: 0px; text-align: right;\">DPT</label>\n <select id=\"node-input-dptLightBrightnessState\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightBrightnessState\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightBrightnessState\"\n style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-dimSpeed\" style=\"width:260px\">\n <i class=\"fa fa-bolt\"></i> Dim Speed (ms)\n </label>\n <input type=\"text\" id=\"node-input-dimSpeed\" placeholder='Default is 5000' style=\"width:210px\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-minDimLevelLight\" style=\"width:260px;\">\n <i class=\"fa fa-clone\"></i> Min Dim Brightness\n </label>\n <select id=\"node-input-minDimLevelLight\">\n <option value=\"useHueLightLevel\" data-i18n=\"knxUltimateHueLight.use_min_brightness\"></option>\n </select>\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-maxDimLevelLight\" style=\"width:260px;\">\n <i class=\"fa fa-clone\"></i> Max Dim Brightness\n </label>\n <select id=\"node-input-maxDimLevelLight\"></select>\n </div>\n </p>\n </div>\n <div id=\"tabs-3\">\n <p>\n <img src=\"resources/node-red-contrib-knx-ultimate/tunablewhite.png\" style=\"width: 900px;\">\n <div class=\"form-row\">\n <label for=\"node-input-nameLightKelvinDIM\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control dim</label>\n\n <label for=\"node-input-GALightKelvinDIM\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightKelvinDIM\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightKelvinDIM\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightKelvinDIM\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightKelvinDIM\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightKelvinDIM\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightKelvinPercentage\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control\n %</label>\n\n <label for=\"node-input-GALightKelvinPercentage\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightKelvinPercentage\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightKelvinPercentage\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightKelvinPercentage\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightKelvinPercentage\"\n style=\"width:50px; margin-left: 0px; text-align: right;\">Name</label>\n <input type=\"text\" id=\"node-input-nameLightKelvinPercentage\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightKelvinPercentageState\" style=\"width:110px;\"><i class=\"fa fa-question-circle\"></i> Status\n %</label>\n\n <label for=\"node-input-GALightKelvinPercentageState\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightKelvinPercentageState\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightKelvinPercentageState\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightKelvinPercentageState\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightKelvinPercentageState\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightKelvinPercentageState\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightKelvin\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control\n Kelvin</label>\n\n <label for=\"node-input-GALightKelvin\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightKelvin\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightKelvin\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightKelvin\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightKelvin\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightKelvin\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightKelvinState\" style=\"width:110px;\"><i class=\"fa fa-question-circle\"></i> Status\n Kelvin</label>\n <label for=\"node-input-GALightKelvinState\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightKelvinState\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightKelvinState\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightKelvinState\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightKelvinState\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightKelvinState\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label style=\"width:170px\" for=\"node-input-invertDimTunableWhiteDirection\">\n <i class=\"fa fa-shuffle\"></i> Invert dim direction\n </label>\n <input type=\"checkbox\" id=\"node-input-invertDimTunableWhiteDirection\"\n style=\"display:inline-block; width:auto; vertical-align:top;\" />\n </div>\n </p>\n </div>\n <div id=\"tabs-4\">\n <p>\n <img src=\"resources/node-red-contrib-knx-ultimate/rgb.png\" style=\"width: 900px;\">\n <p><b> RGB section</b></p>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightColor\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control rgb</label>\n\n <label for=\"node-input-GALightColor\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightColor\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightColor\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightColor\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightColor\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightColor\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightColorState\" style=\"width:110px;\"><i class=\"fa fa-question-circle\"></i> Status rgb</label>\n\n <label for=\"node-input-GALightColorState\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightColorState\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightColorState\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightColorState\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightColorState\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightColorState\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n\n <p><b> HSV section</b></p>\n <!-- // HSV Color change\n // nameLightHSV_H_DIM: { value: \"\" },\n // GALightHSV_H_DIM: { value: \"\" },\n // dptLightHSV_H_DIM: { value: \"\" }, -->\n <div class=\"form-row\">\n <label for=\"node-input-nameLightHSV_H_DIM\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control H dim</label>\n\n <label for=\"node-input-GALightHSV_H_DIM\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightHSV_H_DIM\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightHSV_H_DIM\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightHSV_H_DIM\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightHSV_H_DIM\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightHSV_H_DIM\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightHSV_H_State\" style=\"width:110px;\"><i class=\"fa fa-question-circle\"></i> Status H %</label>\n\n <label for=\"node-input-GALightHSV_H_State\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightHSV_H_State\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightHSV_H_State\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightHSV_H_State\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightHSV_H_State\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightHSV_H_State\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n\n <!-- // HSV Saturation change\n nameLightHSV_S_DIM: { value: \"\" },\n GALightHSV_S_DIM: { value: \"\" },\n dptLightHSV_S_DIM: { value: \"\" },\n nameLightHSV_S_State: { value: \"\" },\n GALightHSV_S_State: { value: \"\" },\n dptLightHSV_S_State: { value: \"\" }, -->\n <div class=\"form-row\">\n <label for=\"node-input-nameLightHSV_S_DIM\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control S dim</label>\n\n <label for=\"node-input-GALightHSV_S_DIM\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightHSV_S_DIM\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightHSV_S_DIM\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightHSV_S_DIM\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightHSV_S_DIM\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightHSV_S_DIM\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightHSV_S_State\" style=\"width:110px;\"><i class=\"fa fa-question-circle\"></i> Status S %</label>\n\n <label for=\"node-input-GALightHSV_S_State\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightHSV_S_State\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightHSV_S_State\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightHSV_S_State\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightHSV_S_State\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightHSV_S_State\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n\n <!-- // HSV V Brightness change\n nameLightHSV_V_DIM: { value: \"\" },\n GALightHSV_V_DIM: { value: \"\" },\n dptLightHSV_V_DIM: { value: \"\" },\n nameLightHSV_V_State: { value: \"\" },\n GALightHSV_V_State: { value: \"\" },\n dptLightHSV_V_State: { value: \"\" }, -->\n <div class=\"form-row\">\n <label for=\"node-input-HSVDimSpeed\" style=\"width:260px\">\n <i class=\"fa fa-bolt\"></i> Dim Speed (ms)\n </label>\n <input type=\"text\" id=\"node-input-HSVDimSpeed\" placeholder='Default is 5000' style=\"width:210px\">\n </div>\n\n </p>\n </div>\n <div id=\"tabs-5\">\n <p>\n <div class=\"form-tips\" style=\"margin-bottom:6px;\">\n <i class=\"fa fa-circle-info\" style=\"color:forestgreen; margin-right:4px;\"></i>\n <span data-i18n=\"knxUltimateHueLight.effect_base_label\"></span>\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightBlink\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Blink</label>\n\n <label for=\"node-input-GALightBlink\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightBlink\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightBlink\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightBlink\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightBlink\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightBlink\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n\n <div id=\"divColorCycle\">\n <div class=\"form-row\">\n <label for=\"node-input-nameLightColorCycle\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Color\n Cycle</label>\n\n <label for=\"node-input-GALightColorCycle\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightColorCycle\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightColorCycle\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightColorCycle\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightColorCycle\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightColorCycle\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n </div>\n\n <hr style=\"margin:12px 0;\">\n\n <div id=\"divHueEffectsContainer\">\n <div class=\"form-tips\" style=\"margin-bottom:6px;\">\n <i class=\"fa fa-circle-info\" style=\"color:forestgreen; margin-right:4px;\"></i>\n <span data-i18n=\"knxUltimateHueLight.effect_native_label\"></span>\n </div>\n <div id=\"divHueEffectsNoSupport\" class=\"form-tips\" data-i18n=\"knxUltimateHueLight.effect_not_supported\" style=\"display:none;\"></div>\n <div id=\"divHueEffectsContent\" style=\"display:none;\">\n <div class=\"form-row\">\n <label for=\"node-input-nameLightEffect\" style=\"width:110px;\"><i class=\"fa fa-wand-magic-sparkles\"></i> <span data-i18n=\"knxUltimateHueLight.effect_command\"></span></label>\n\n <label for=\"node-input-GALightEffect\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightEffect\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightEffect\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightEffect\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightEffect\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightEffect\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n\n <div class=\"form-row\">\n <label for=\"node-input-nameLightEffectStatus\" style=\"width:110px;\"><i class=\"fa fa-circle-info\"></i> <span data-i18n=\"knxUltimateHueLight.effect_status\"></span></label>\n\n <label for=\"node-input-GALightEffectStatus\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightEffectStatus\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightEffectStatus\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightEffectStatus\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightEffectStatus\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightEffectStatus\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n\n <div class=\"form-row\" id=\"divEffectMappings\">\n <label style=\"width:110px;\"><i class=\"fa fa-list-check\"></i> <span data-i18n=\"knxUltimateHueLight.effect_mapping\"></span></label>\n <div style=\"margin-left:5px; width: calc(100% - 120px);\">\n <input type=\"hidden\" id=\"node-input-effectRules\">\n <ol id=\"node-input-effect-rule-container\" style=\"margin:0; padding:0;\"></ol>\n <div style=\"margin-top:5px;\">\n <button type=\"button\" id=\"node-input-effect-autofill\" class=\"red-ui-button\"><span data-i18n=\"knxUltimateHueLight.effect_autofill\"></span></button>\n </div>\n <div class=\"form-tips\">\n <i class=\"fa fa-circle-info\" style=\"color:forestgreen; margin-right:4px;\"></i>\n <span data-i18n=\"knxUltimateHueLight.effect_tip\"></span>\n </div>\n <div class=\"form-tips\">\n <i class=\"fa fa-circle-info\" style=\"color:forestgreen; margin-right:4px;\"></i>\n <span data-i18n=\"knxUltimateHueLight.effect_tip_status\"></span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </p>\n </div>\n <div id=\"tabs-6\">\n <p>\n <div class=\"form-row\">\n <label style=\"width:260px;\" for=\"node-input-readStatusAtStartup\"><i class=\"fa fa-question-circle\"></i> <span data-i18n=\"knxUltimateHueLight.read_status_startup\"></span></label>\n <select id=\"node-input-readStatusAtStartup\">\n <option value=\"no\" data-i18n=\"knxUltimateHueLight.opt_no\"></option>\n <option value=\"yes\" data-i18n=\"knxUltimateHueLight.opt_yes_emit\"></option>\n </select>\n </div>\n <div class=\"form-row\" id=\"divUpdateKNXBrightnessStatusOnHUEOnOff\">\n <label style=\"width:260px;\" for=\"node-input-updateKNXBrightnessStatusOnHUEOnOff\">\n <i class=\"fa fa-tag\"></i> <span data-i18n=\"knxUltimateHueLight.knx_brightness_status\"></span>\n </label>\n <select id=\"node-input-updateKNXBrightnessStatusOnHUEOnOff\">\n <option value=\"onhueoff\" data-i18n=\"knxUltimateHueLight.knx_brightness_onhueoff\"></option>\n <option value=\"no\" data-i18n=\"knxUltimateHueLight.knx_brightness_no\"></option>\n </select>\n </div>\n <div class=\"form-row\">\n <label style=\"width:260px;\" for=\"node-input-updateLocalStateFromKNXWrite\">\n <i class=\"fa fa-database\"></i> <span data-i18n=\"knxUltimateHueLight.update_local_state_from_knx_write\"></span>\n </label>\n <input type=\"checkbox\" id=\"node-input-updateLocalStateFromKNXWrite\" style=\"display:inline-block; width:auto; vertical-align:top;\" />\n </div>\n <div class=\"form-tips\" style=\"margin-left:260px;\" data-i18n=\"knxUltimateHueLight.update_local_state_from_knx_write_hint\"></div><br/>\n <div id =\"divBehaviourBrightness\">\n <div class=\"form-row\">\n <label for=\"node-input-specifySwitchOnBrightness\" style=\"width:260px;\">\n <i class=\"fa fa-tag\"></i> <span data-i18n=\"knxUltimateHueLight.switch_on_behaviour\"></span>\n </label>\n <select id=\"node-input-specifySwitchOnBrightness\">\n <option value=\"no\" data-i18n=\"knxUltimateHueLight.none\"></option>\n <option value=\"temperature\" data-i18n=\"knxUltimateHueLight.select_temperature_brightness\"></option>\n <option value=\"yes\" data-i18n=\"knxUltimateHueLight.select_color\"></option>\n </select>\n </div>\n\n <div class=\"form-row\" id=\"divColorsAtSwitchOn\">\n <label for=\"node-input-colorAtSwitchOnDayTime\" style=\"width:260px\">\n </label>\n <input type=\"hidden\" id=\"node-input-colorAtSwitchOnDayTime\">\n <input type=\"color\" id=\"colorPickerDay\" style=\"width:260px\">\n <button id=\"getColorAtSwitchOnDayTimeButton\" type=\"button\" class=\"red-ui-button\"><span data-i18n=\"knxUltimateHueLight.get_current\"></span></button>\n </div>\n <div class=\"form-row\" id=\"divTemperatureAtSwitchOn\" hidden>\n <label for=\"node-input-colorAtSwitchOnDayTime\" style=\"width:260px\">\n </label>\n <select style=\"width:12%;\" id=\"comboTemperatureAtSwitchOn\"></select>\n <select style=\"width:25%;\" id=\"comboBrightnessAtSwitchOn\"></select>\n </div>\n\n <div id=\"divCCSBoxAtNightLighting\">\n <div class=\"form-row\">\n <label for=\"node-input-enableDayNightLighting\" style=\"width:260px;\">\n <i class=\"fa fa-clone\"></i> <span data-i18n=\"knxUltimateHueLight.night_lighting\"></span>\n </label>\n <select id=\"node-input-enableDayNightLighting\">\n <option value=\"no\" data-i18n=\"knxUltimateHueLight.no_night_lighting\"></option>\n <!-- <option value=\"temperature\">Select temperature and brightness</option>\n <option value=\"yes\">Select color</option> -->\n </select>\n </div>\n\n <div id=\"divEnableDayNightLighting\">\n\n <div class=\"form-row\" id=\"divColorsAtSwitchOnNightTime\">\n <label for=\"node-input-colorAtSwitchOnNightTime\" style=\"width:260px\"></label>\n <input type=\"hidden\" id=\"node-input-colorAtSwitchOnNightTime\">\n <input type=\"color\" id=\"colorPickerNight\" style=\"width:260px\">\n <button id=\"getColorAtSwitchOnNightTimeButton\" type=\"button\" class=\"red-ui-button\"><span data-i18n=\"knxUltimateHueLight.get_current\"></span></button>\n </div>\n <div class=\"form-row\" id=\"divTemperatureAtSwitchOnNightTime\" hidden>\n <label for=\"node-input-colorAtSwitchOnNightTime\" style=\"width:260px\"></label>\n <select style=\"width:25%;\" id=\"comboTemperatureAtSwitchOnNightTime\"></select>\n <select style=\"width:25%;\" id=\"comboBrightnessAtSwitchOnNightTime\"></select>\n </div>\n\n <div class=\"form-row\">\n <label for=\"node-input-nameDaylightSensor\" style=\"width:110px;\"><i class=\"fa fa-clock-o\"></i>\n <span data-i18n=\"knxUltimateHueLight.day_night\"></span></label>\n <label for=\"node-input-GADaylightSensor\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GADaylightSensor\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptDaylightSensor\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptDaylightSensor\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameDaylightSensor\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameDaylightSensor\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label style=\"width:170px\" for=\"node-input-invertDayNight\">\n <i class=\"fa fa-shuffle\"></i> <span data-i18n=\"knxUltimateHueLight.invert_day_night\"></span>\n </label>\n <input type=\"checkbox\" id=\"node-input-invertDayNight\"\n style=\"display:inline-block; width:auto; vertical-align:top;\" />\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-restoreDayMode\" style=\"width:260px;\">\n <i class=\"fa fa-circle\"></i> <span data-i18n=\"knxUltimateHueLight.override_night_mode\"></span>\n </label>\n <select id=\"node-input-restoreDayMode\">\n <option value=\"no\" data-i18n=\"knxUltimateHueLight.override_no\"></option>\n <option value=\"setDayByFastSwitchLightSingle\" data-i18n=\"knxUltimateHueLight.override_set_day_fast_this\"></option>\n <option value=\"setDayByFastSwitchLightALL\" data-i18n=\"knxUltimateHueLight.override_set_day_fast_all\"></option>\n </select>\n </div>\n </div>\n </div>\n <br/>\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-enableNodePINS\" style=\"width:260px;\">\n <i class=\"fa fa-circle\"></i> <span data-i18n=\"knxUltimateHueLight.node_pins\"></span>\n </label>\n <select id=\"node-input-enableNodePINS\">\n <option value=\"no\" data-i18n=\"knxUltimateHueLight.node_pins_hide\"></option>\n <option value=\"yes\" data-i18n=\"knxUltimateHueLight.node_pins_show\"></option>\n </select>\n </div>\n </p>\n </div>\n </div>\n </div>\n<br />",
9173
+ "light": "<!-- Canonical private HUE Controller template: light. -->\n<div class=\"form-row hue-legacy-controller-notice\" role=\"note\"\n style=\"box-sizing:border-box; padding:10px 12px; margin-bottom:14px; border-left:4px solid #d79b00; background:#fff8df; color:#4d3a00;\">\n <i class=\"fa fa-exclamation-triangle\" aria-hidden=\"true\" style=\"color:#a15c00; margin-right:6px;\"></i>\n <span\n data-i18n=\"node-red-contrib-knx-ultimate/knxUltimateHueController:knxUltimateHueController.legacy_node_notice\"></span>\n</div>\n<div class=\"form-row\" style=\"margin-bottom:10px;\">\n <span style=\"color:#ff0000\"><i class=\"fa fa-youtube\"></i></span>&nbsp;<a target=\"_blank\"\n href=\"https://www.youtube.com/playlist?list=PL9Yh1bjbLAYrU8PsVhW4xzEug2WtVFv3E\"><b>KNX-Ultimate video tutorials\n (YouTube playlist)</b></a>\n</div>\n<div id=\"mainWindow\">\n <div class=\"form-row\">\n <b><span data-i18n=\"knxUltimateHueLight.title\"></span></b>&nbsp&nbsp<span style=\"color:red\" &nbsp &nbsp<i\n class=\"fa fa-youtube\"></i></span>&nbsp<a target=\"_blank\" href=\"https://youtu.be/jjEUI1J8bkA\"><u><span\n data-i18n=\"common.youtube_sample\"></span></u></a>\n <br />\n <br />\n <label for=\"node-input-server\">\n <img\n src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAKnRFWHRDcmVhdGlvbiBUaW1lAEZyIDYgQXVnIDIwMTAgMjE6NTI6MTkgKzAxMDD84aS8AAAAB3RJTUUH3gYYCicNV+4WIQAAAAlwSFlzAAALEgAACxIB0t1+/AAAAARnQU1BAACxjwv8YQUAAACUSURBVHjaY2CgFZg5c+Z/ZEyWAZ8+f/6/ZsWs/xoamqMGkGrA6Wla/1+fVARjEBuGsSoGmY4eZSCNL59d/g8DIDbIAHR14OgFGQByKjIGKX5+6/T///8gGMQGiV1+/B0Fg70GIkD+RMYgxf/O5/7//2MSmAZhkBi6OrgB6Bg5DGB4ajr3f2xqsYYLSDE2THJUDg0AAAqyDVd4tp4YAAAAAElFTkSuQmCC\"></img>\n <span data-i18n=\"common.knx_gw\"></span>\n </label>\n <input type=\"text\" id=\"node-input-server\" />\n </div>\n\n <div class=\"form-row\">\n <label for=\"node-input-serverHue\">\n <img\n src=\"data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAAEAAAAAA0VXHyAAABFUlEQVQ4EZWSsWoCQRCG1yiENEFEi6QSkjqWWoqFoBYJ+Br6JHkMn8Iibd4ihQpaJIhWNkry/ZtdGZY78Qa+m39nZ+dm9s4550awglNBluS/gVtAX6KgDclf68w2OThgfR9iT/jnoEv4TtByDThWTCDKW4SSZTf/zj9/eZbN+izTDuKGimu0vPF8B/YN8aC8LmcOj/AAn9CFTEs70Js/oGqy79C69bqJ5XbQI2kGO5N8QL9D08S8zBtBF5ZaVsznpCMoqJnVdjTpb1Db0fwIWmQV6BLXzFOYgA6/gDVfQN9bBWp2J2hdWDPoBV5FrKnAJutHikk/CHHR8i7x4iG7qQ720IYvu3GFbpHjx3pFrOFYkA354z/5bkK826phyAAAAABJRU5ErkJggg==\" />\n <span data-i18n=\"common.hue_bridge\"></span>\n </label>\n <input type=\"text\" id=\"node-input-serverHue\" />\n </div>\n\n <div class=\"hue-controller-knx-flow-only-notice\" role=\"note\" style=\"display:none;\"></div>\n\n <div class=\"form-row\">\n <label for=\"node-input-name\">\n <i class=\"fa fa-play-circle\"></i> <span data-i18n=\"common.name\"></span>\n </label>\n <input type=\"text\" id=\"node-input-name\" placeholder=\"Enter your hue device name\"\n style=\"flex:1 1 240px; min-width:240px; max-width:240px;\" />\n <button type=\"button\" class=\"red-ui-button hue-refresh-devices\"\n style=\"margin-left:6px; color:#1b7d33; border-color:#1b7d33;\" title=\"Refresh Hue devices\">\n <i class=\"fa fa-sync\"></i>\n </button>\n <button type=\"button\" class=\"red-ui-button hue-locate-device\"\n style=\"margin-left:6px; color:#ff9800; border-color:#ff9800;\" title=\"Locate selected Hue device\">\n <i class=\"fa fa-play\"></i>\n </button>\n <span class=\"hue-devices-loading\" style=\"margin-left:6px; display:none; color:#1b7d33;\">\n <i class=\"fa fa-circle-notch fa-spin\"></i>\n </span>\n <input type=\"hidden\" id=\"node-input-hueDevice\" />\n </div>\n\n <div id=\"tabs\" style=\"display:none; width: 900px;\">\n <ul>\n <li><a href=\"#tabs-1\"><i class=\"fa-solid fa-toggle-on\"></i> <span\n data-i18n=\"knxUltimateHueLight.tabs.switch\"></span></a></li>\n <li><a href=\"#tabs-2\"><i class=\"fa-solid fa-arrow-up-wide-short\"></i> <span\n data-i18n=\"knxUltimateHueLight.tabs.dim\"></span></a></li>\n <li><a href=\"#tabs-3\"><i class=\"fa-solid fa-temperature-quarter\"></i> <span\n data-i18n=\"knxUltimateHueLight.tabs.tunable_white\"></span></a></li>\n <li><a href=\"#tabs-4\"><i class=\"fa-solid fa-palette\"></i> <span\n data-i18n=\"knxUltimateHueLight.tabs.rgb_hsv\"></span></a></li>\n <li><a href=\"#tabs-5\"><i class=\"fa-solid fa-heart-circle-check\"></i> <span\n data-i18n=\"knxUltimateHueLight.tabs.effects\"></span></a></li>\n <li><a href=\"#tabs-6\"><i class=\"fa-solid fa-code-merge\"></i> <span\n data-i18n=\"knxUltimateHueLight.tabs.behaviour\"></span></a></li>\n </ul>\n <div id=\"tabs-1\">\n <p>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightSwitch\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> <span\n data-i18n=\"knxUltimateHueLight.control\"></span></label>\n\n <label for=\"node-input-GALightSwitch\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightSwitch\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightSwitch\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightSwitch\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightSwitch\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightSwitch\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightState\" style=\"width:110px;\"><i class=\"fa fa-question-circle\"></i> <span\n data-i18n=\"knxUltimateHueLight.status\"></span></label>\n\n <label for=\"node-input-GALightState\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightState\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightState\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightState\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightState\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightState\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n </p>\n </div>\n <div id=\"tabs-2\">\n <p>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightDIM\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control\n dim</label>\n\n <label for=\"node-input-GALightDIM\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightDIM\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightDIM\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightDIM\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightDIM\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightDIM\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightBrightness\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control\n %</label>\n\n <label for=\"node-input-GALightBrightness\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightBrightness\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightBrightness\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightBrightness\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightBrightness\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightBrightness\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n\n <div class=\"form-row\">\n <label for=\"node-input-nameLightBrightnessState\" style=\"width:110px;\"><i class=\"fa fa-question-circle\"></i>\n Status %</label>\n\n <label for=\"node-input-GALightBrightnessState\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightBrightnessState\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightBrightnessState\"\n style=\"width:40px; margin-left: 0px; text-align: right;\">DPT</label>\n <select id=\"node-input-dptLightBrightnessState\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightBrightnessState\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightBrightnessState\"\n style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-dimSpeed\" style=\"width:260px\">\n <i class=\"fa fa-bolt\"></i> Dim Speed (ms)\n </label>\n <input type=\"text\" id=\"node-input-dimSpeed\" placeholder='Default is 5000' style=\"width:210px\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-minDimLevelLight\" style=\"width:260px;\">\n <i class=\"fa fa-clone\"></i> Min Dim Brightness\n </label>\n <select id=\"node-input-minDimLevelLight\">\n <option value=\"useHueLightLevel\" data-i18n=\"knxUltimateHueLight.use_min_brightness\"></option>\n </select>\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-maxDimLevelLight\" style=\"width:260px;\">\n <i class=\"fa fa-clone\"></i> Max Dim Brightness\n </label>\n <select id=\"node-input-maxDimLevelLight\"></select>\n </div>\n </p>\n </div>\n <div id=\"tabs-3\">\n <p>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightKelvinDIM\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control\n dim</label>\n\n <label for=\"node-input-GALightKelvinDIM\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightKelvinDIM\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightKelvinDIM\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightKelvinDIM\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightKelvinDIM\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightKelvinDIM\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightKelvinPercentage\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i>\n Control\n %</label>\n\n <label for=\"node-input-GALightKelvinPercentage\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightKelvinPercentage\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightKelvinPercentage\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightKelvinPercentage\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightKelvinPercentage\"\n style=\"width:50px; margin-left: 0px; text-align: right;\">Name</label>\n <input type=\"text\" id=\"node-input-nameLightKelvinPercentage\"\n style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightKelvinPercentageState\" style=\"width:110px;\"><i\n class=\"fa fa-question-circle\"></i> Status\n %</label>\n\n <label for=\"node-input-GALightKelvinPercentageState\" style=\"width:20px;\"><span\n data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightKelvinPercentageState\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightKelvinPercentageState\"\n style=\"width:40px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightKelvinPercentageState\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightKelvinPercentageState\"\n style=\"width:50px; margin-left: 0px; text-align: right;\"><span data-i18n=\"common.name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightKelvinPercentageState\"\n style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightKelvin\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control\n Kelvin</label>\n\n <label for=\"node-input-GALightKelvin\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightKelvin\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightKelvin\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightKelvin\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightKelvin\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightKelvin\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightKelvinState\" style=\"width:110px;\"><i class=\"fa fa-question-circle\"></i> Status\n Kelvin</label>\n <label for=\"node-input-GALightKelvinState\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightKelvinState\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightKelvinState\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightKelvinState\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightKelvinState\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightKelvinState\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label style=\"width:170px\" for=\"node-input-invertDimTunableWhiteDirection\">\n <i class=\"fa fa-shuffle\"></i> Invert dim direction\n </label>\n <input type=\"checkbox\" id=\"node-input-invertDimTunableWhiteDirection\"\n style=\"display:inline-block; width:auto; vertical-align:top;\" />\n </div>\n </p>\n </div>\n <div id=\"tabs-4\">\n <p>\n <p><b> RGB section</b></p>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightColor\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control\n rgb</label>\n\n <label for=\"node-input-GALightColor\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightColor\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightColor\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightColor\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightColor\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightColor\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightColorState\" style=\"width:110px;\"><i class=\"fa fa-question-circle\"></i> Status\n rgb</label>\n\n <label for=\"node-input-GALightColorState\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightColorState\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightColorState\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightColorState\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightColorState\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightColorState\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n\n <p><b> HSV section</b></p>\n <!-- // HSV Color change\n // nameLightHSV_H_DIM: { value: \"\" },\n // GALightHSV_H_DIM: { value: \"\" },\n // dptLightHSV_H_DIM: { value: \"\" }, -->\n <div class=\"form-row\">\n <label for=\"node-input-nameLightHSV_H_DIM\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control H\n dim</label>\n\n <label for=\"node-input-GALightHSV_H_DIM\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightHSV_H_DIM\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightHSV_H_DIM\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightHSV_H_DIM\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightHSV_H_DIM\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightHSV_H_DIM\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightHSV_H_State\" style=\"width:110px;\"><i class=\"fa fa-question-circle\"></i> Status H\n %</label>\n\n <label for=\"node-input-GALightHSV_H_State\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightHSV_H_State\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightHSV_H_State\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightHSV_H_State\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightHSV_H_State\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightHSV_H_State\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n\n <!-- // HSV Saturation change\n nameLightHSV_S_DIM: { value: \"\" },\n GALightHSV_S_DIM: { value: \"\" },\n dptLightHSV_S_DIM: { value: \"\" },\n nameLightHSV_S_State: { value: \"\" },\n GALightHSV_S_State: { value: \"\" },\n dptLightHSV_S_State: { value: \"\" }, -->\n <div class=\"form-row\">\n <label for=\"node-input-nameLightHSV_S_DIM\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Control S\n dim</label>\n\n <label for=\"node-input-GALightHSV_S_DIM\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightHSV_S_DIM\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightHSV_S_DIM\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightHSV_S_DIM\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightHSV_S_DIM\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightHSV_S_DIM\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightHSV_S_State\" style=\"width:110px;\"><i class=\"fa fa-question-circle\"></i> Status S\n %</label>\n\n <label for=\"node-input-GALightHSV_S_State\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightHSV_S_State\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightHSV_S_State\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightHSV_S_State\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightHSV_S_State\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightHSV_S_State\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n\n <!-- // HSV V Brightness change\n nameLightHSV_V_DIM: { value: \"\" },\n GALightHSV_V_DIM: { value: \"\" },\n dptLightHSV_V_DIM: { value: \"\" },\n nameLightHSV_V_State: { value: \"\" },\n GALightHSV_V_State: { value: \"\" },\n dptLightHSV_V_State: { value: \"\" }, -->\n <div class=\"form-row\">\n <label for=\"node-input-HSVDimSpeed\" style=\"width:260px\">\n <i class=\"fa fa-bolt\"></i> Dim Speed (ms)\n </label>\n <input type=\"text\" id=\"node-input-HSVDimSpeed\" placeholder='Default is 5000' style=\"width:210px\">\n </div>\n\n </p>\n </div>\n <div id=\"tabs-5\">\n <p>\n <div class=\"form-tips\" style=\"margin-bottom:6px;\">\n <i class=\"fa fa-circle-info\" style=\"color:forestgreen; margin-right:4px;\"></i>\n <span data-i18n=\"knxUltimateHueLight.effect_base_label\"></span>\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-nameLightBlink\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Blink</label>\n\n <label for=\"node-input-GALightBlink\" style=\"width:20px;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-GALightState\"></span></label>\n <input type=\"text\" id=\"node-input-GALightBlink\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightBlink\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightBlink\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightBlink\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightBlink\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n\n <div id=\"divColorCycle\">\n <div class=\"form-row\">\n <label for=\"node-input-nameLightColorCycle\" style=\"width:110px;\"><i class=\"fa fa-play-circle-o\"></i> Color\n Cycle</label>\n\n <label for=\"node-input-GALightColorCycle\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightColorCycle\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightColorCycle\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightColorCycle\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightColorCycle\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightColorCycle\"\n style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n </div>\n\n <hr style=\"margin:12px 0;\">\n\n <div id=\"divHueEffectsContainer\">\n <div class=\"form-tips\" style=\"margin-bottom:6px;\">\n <i class=\"fa fa-circle-info\" style=\"color:forestgreen; margin-right:4px;\"></i>\n <span data-i18n=\"knxUltimateHueLight.effect_native_label\"></span>\n </div>\n <div id=\"divHueEffectsNoSupport\" class=\"form-tips\" data-i18n=\"knxUltimateHueLight.effect_not_supported\"\n style=\"display:none;\"></div>\n <div id=\"divHueEffectsContent\" style=\"display:none;\">\n <div class=\"form-row\">\n <label for=\"node-input-nameLightEffect\" style=\"width:110px;\"><i class=\"fa fa-wand-magic-sparkles\"></i> <span\n data-i18n=\"knxUltimateHueLight.effect_command\"></span></label>\n\n <label for=\"node-input-GALightEffect\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightEffect\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightEffect\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightEffect\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightEffect\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightEffect\" style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n\n <div class=\"form-row\">\n <label for=\"node-input-nameLightEffectStatus\" style=\"width:110px;\"><i class=\"fa fa-circle-info\"></i> <span\n data-i18n=\"knxUltimateHueLight.effect_status\"></span></label>\n\n <label for=\"node-input-GALightEffectStatus\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GALightEffectStatus\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptLightEffectStatus\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptLightEffectStatus\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameLightEffectStatus\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameLightEffectStatus\"\n style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n\n <div class=\"form-row\" id=\"divEffectMappings\">\n <label style=\"width:110px;\"><i class=\"fa fa-list-check\"></i> <span\n data-i18n=\"knxUltimateHueLight.effect_mapping\"></span></label>\n <div style=\"margin-left:5px; width: calc(100% - 120px);\">\n <input type=\"hidden\" id=\"node-input-effectRules\">\n <ol id=\"node-input-effect-rule-container\" style=\"margin:0; padding:0;\"></ol>\n <div style=\"margin-top:5px;\">\n <button type=\"button\" id=\"node-input-effect-autofill\" class=\"red-ui-button\"><span\n data-i18n=\"knxUltimateHueLight.effect_autofill\"></span></button>\n </div>\n <div class=\"form-tips\">\n <i class=\"fa fa-circle-info\" style=\"color:forestgreen; margin-right:4px;\"></i>\n <span data-i18n=\"knxUltimateHueLight.effect_tip\"></span>\n </div>\n <div class=\"form-tips\">\n <i class=\"fa fa-circle-info\" style=\"color:forestgreen; margin-right:4px;\"></i>\n <span data-i18n=\"knxUltimateHueLight.effect_tip_status\"></span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </p>\n </div>\n <div id=\"tabs-6\">\n <p>\n <div class=\"form-row\">\n <label style=\"width:260px;\" for=\"node-input-readStatusAtStartup\"><i class=\"fa fa-question-circle\"></i> <span\n data-i18n=\"knxUltimateHueLight.read_status_startup\"></span></label>\n <select id=\"node-input-readStatusAtStartup\">\n <option value=\"no\" data-i18n=\"knxUltimateHueLight.opt_no\"></option>\n <option value=\"yes\" data-i18n=\"knxUltimateHueLight.opt_yes_emit\"></option>\n </select>\n </div>\n <div class=\"form-row\" id=\"divUpdateKNXBrightnessStatusOnHUEOnOff\">\n <label style=\"width:260px;\" for=\"node-input-updateKNXBrightnessStatusOnHUEOnOff\">\n <i class=\"fa fa-tag\"></i> <span data-i18n=\"knxUltimateHueLight.knx_brightness_status\"></span>\n </label>\n <select id=\"node-input-updateKNXBrightnessStatusOnHUEOnOff\">\n <option value=\"onhueoff\" data-i18n=\"knxUltimateHueLight.knx_brightness_onhueoff\"></option>\n <option value=\"no\" data-i18n=\"knxUltimateHueLight.knx_brightness_no\"></option>\n </select>\n </div>\n <div class=\"form-row\">\n <label style=\"width:260px;\" for=\"node-input-updateLocalStateFromKNXWrite\">\n <i class=\"fa fa-database\"></i> <span data-i18n=\"knxUltimateHueLight.update_local_state_from_knx_write\"></span>\n </label>\n <input type=\"checkbox\" id=\"node-input-updateLocalStateFromKNXWrite\"\n style=\"display:inline-block; width:auto; vertical-align:top;\" />\n </div>\n <div class=\"form-tips\" style=\"margin-left:260px;\"\n data-i18n=\"knxUltimateHueLight.update_local_state_from_knx_write_hint\"></div><br />\n <div id=\"divBehaviourBrightness\">\n <div class=\"form-row\">\n <label for=\"node-input-specifySwitchOnBrightness\" style=\"width:260px;\">\n <i class=\"fa fa-tag\"></i> <span data-i18n=\"knxUltimateHueLight.switch_on_behaviour\"></span>\n </label>\n <select id=\"node-input-specifySwitchOnBrightness\">\n <option value=\"no\" data-i18n=\"knxUltimateHueLight.none\"></option>\n <option value=\"temperature\" data-i18n=\"knxUltimateHueLight.select_temperature_brightness\"></option>\n <option value=\"yes\" data-i18n=\"knxUltimateHueLight.select_color\"></option>\n </select>\n </div>\n\n <div class=\"form-row\" id=\"divColorsAtSwitchOn\">\n <label for=\"node-input-colorAtSwitchOnDayTime\" style=\"width:260px\">\n </label>\n <input type=\"hidden\" id=\"node-input-colorAtSwitchOnDayTime\">\n <input type=\"color\" id=\"colorPickerDay\" style=\"width:260px\">\n <button id=\"getColorAtSwitchOnDayTimeButton\" type=\"button\" class=\"red-ui-button\"><span\n data-i18n=\"knxUltimateHueLight.get_current\"></span></button>\n </div>\n <div class=\"form-row\" id=\"divTemperatureAtSwitchOn\" hidden>\n <label for=\"node-input-colorAtSwitchOnDayTime\" style=\"width:260px\">\n </label>\n <select style=\"width:12%;\" id=\"comboTemperatureAtSwitchOn\"></select>\n <select style=\"width:25%;\" id=\"comboBrightnessAtSwitchOn\"></select>\n </div>\n\n <div id=\"divCCSBoxAtNightLighting\">\n <div class=\"form-row\">\n <label for=\"node-input-enableDayNightLighting\" style=\"width:260px;\">\n <i class=\"fa fa-clone\"></i> <span data-i18n=\"knxUltimateHueLight.night_lighting\"></span>\n </label>\n <select id=\"node-input-enableDayNightLighting\">\n <option value=\"no\" data-i18n=\"knxUltimateHueLight.no_night_lighting\"></option>\n <!-- <option value=\"temperature\">Select temperature and brightness</option>\n <option value=\"yes\">Select color</option> -->\n </select>\n </div>\n\n <div id=\"divEnableDayNightLighting\">\n\n <div class=\"form-row\" id=\"divColorsAtSwitchOnNightTime\">\n <label for=\"node-input-colorAtSwitchOnNightTime\" style=\"width:260px\"></label>\n <input type=\"hidden\" id=\"node-input-colorAtSwitchOnNightTime\">\n <input type=\"color\" id=\"colorPickerNight\" style=\"width:260px\">\n <button id=\"getColorAtSwitchOnNightTimeButton\" type=\"button\" class=\"red-ui-button\"><span\n data-i18n=\"knxUltimateHueLight.get_current\"></span></button>\n </div>\n <div class=\"form-row\" id=\"divTemperatureAtSwitchOnNightTime\" hidden>\n <label for=\"node-input-colorAtSwitchOnNightTime\" style=\"width:260px\"></label>\n <select style=\"width:25%;\" id=\"comboTemperatureAtSwitchOnNightTime\"></select>\n <select style=\"width:25%;\" id=\"comboBrightnessAtSwitchOnNightTime\"></select>\n </div>\n\n <div class=\"form-row\">\n <label for=\"node-input-nameDaylightSensor\" style=\"width:110px;\"><i class=\"fa fa-clock-o\"></i>\n <span data-i18n=\"knxUltimateHueLight.day_night\"></span></label>\n <label for=\"node-input-GADaylightSensor\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GADaylightSensor\" placeholder=\"Ex: 1/1/1\"\n style=\"width:70px;margin-left: 5px; text-align: left;\">\n\n <label for=\"node-input-dptDaylightSensor\" style=\"width:40px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptDaylightSensor\" style=\"width:140px;\"></select>\n\n <label for=\"node-input-nameDaylightSensor\" style=\"width:50px; margin-left: 0px; text-align: right;\"><span\n data-i18n=\"knxUltimateHueLight.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-nameDaylightSensor\"\n style=\"width:190px;margin-left: 5px; text-align: left;\">\n </div>\n <div class=\"form-row\">\n <label style=\"width:170px\" for=\"node-input-invertDayNight\">\n <i class=\"fa fa-shuffle\"></i> <span data-i18n=\"knxUltimateHueLight.invert_day_night\"></span>\n </label>\n <input type=\"checkbox\" id=\"node-input-invertDayNight\"\n style=\"display:inline-block; width:auto; vertical-align:top;\" />\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-restoreDayMode\" style=\"width:260px;\">\n <i class=\"fa fa-circle\"></i> <span data-i18n=\"knxUltimateHueLight.override_night_mode\"></span>\n </label>\n <select id=\"node-input-restoreDayMode\">\n <option value=\"no\" data-i18n=\"knxUltimateHueLight.override_no\"></option>\n <option value=\"setDayByFastSwitchLightSingle\"\n data-i18n=\"knxUltimateHueLight.override_set_day_fast_this\"></option>\n <option value=\"setDayByFastSwitchLightALL\" data-i18n=\"knxUltimateHueLight.override_set_day_fast_all\">\n </option>\n </select>\n </div>\n </div>\n </div>\n <br />\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-enableNodePINS\" style=\"width:260px;\">\n <i class=\"fa fa-circle\"></i> <span data-i18n=\"knxUltimateHueLight.node_pins\"></span>\n </label>\n <select id=\"node-input-enableNodePINS\">\n <option value=\"no\" data-i18n=\"knxUltimateHueLight.node_pins_hide\"></option>\n <option value=\"yes\" data-i18n=\"knxUltimateHueLight.node_pins_show\"></option>\n </select>\n </div>\n </p>\n </div>\n </div>\n</div>\n<br />",
9128
9174
  "plug": "<!-- Canonical private HUE Controller template: plug. -->\n<div class=\"form-row hue-legacy-controller-notice\" role=\"note\" style=\"box-sizing:border-box; padding:10px 12px; margin-bottom:14px; border-left:4px solid #d79b00; background:#fff8df; color:#4d3a00;\">\n <i class=\"fa fa-exclamation-triangle\" aria-hidden=\"true\" style=\"color:#a15c00; margin-right:6px;\"></i>\n <span data-i18n=\"node-red-contrib-knx-ultimate/knxUltimateHueController:knxUltimateHueController.legacy_node_notice\"></span>\n </div>\n <div class=\"form-row\" style=\"margin-bottom:10px;\">\n <span style=\"color:#ff0000\"><i class=\"fa fa-youtube\"></i></span>&nbsp;<a target=\"_blank\" href=\"https://www.youtube.com/playlist?list=PL9Yh1bjbLAYrU8PsVhW4xzEug2WtVFv3E\"><b>KNX-Ultimate video tutorials (YouTube playlist)</b></a>\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-server\">\n <img src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAKnRFWHRDcmVhdGlvbiBUaW1lAEZyIDYgQXVnIDIwMTAgMjE6NTI6MTkgKzAxMDD84aS8AAAAB3RJTUUH3gYYCicNV+4WIQAAAAlwSFlzAAALEgAACxIB0t1+/AAAAARnQU1BAACxjwv8YQUAAACUSURBVHjaY2CgFZg5c+Z/ZEyWAZ8+f/6/ZsWs/xoamqMGkGrA6Wla/1+fVARjEBuGsSoGmY4eZSCNL59d/g8DIDbIAHR14OgFGQByKjIGKX5+6/T///8gGMQGiV1+/B0Fg70GIkD+RMYgxf/O5/7//2MSmAZhkBi6OrgB6Bg5DGB4ajr3f2xqsYYLSDE2THJUDg0AAAqyDVd4tp4YAAAAAElFTkSuQmCC\" />\n <span data-i18n=\"common.knx_gw\"></span>\n </label>\n <input type=\"text\" id=\"node-input-server\">\n </div>\n\n <div class=\"form-row\">\n <label for=\"node-input-serverHue\">\n <img src=\"data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAAEAAAAAA0VXHyAAABFUlEQVQ4EZWSsWoCQRCG1yiENEFEi6QSkjqWWoqFoBYJ+Br6JHkMn8Iibd4ihQpaJIhWNkry/ZtdGZY78Qa+m39nZ+dm9s4550awglNBluS/gVtAX6KgDclf68w2OThgfR9iT/jnoEv4TtByDThWTCDKW4SSZTf/zj9/eZbN+izTDuKGimu0vPF8B/YN8aC8LmcOj/AAn9CFTEs70Js/oGqy79C69bqJ5XbQI2kGO5N8QL9D08S8zBtBF5ZaVsznpCMoqJnVdjTpb1Db0fwIWmQV6BLXzFOYgA6/gDVfQN9bBWp2J2hdWDPoBV5FrKnAJutHikk/CHHR8i7x4iG7qQ720IYvu3GFbpHjx3pFrOFYkA354z/5bkK826phyAAAAABJRU5ErkJggg==\"/>\n <span data-i18n=\"common.hue_bridge\"></span>\n </label>\n <input type=\"text\" id=\"node-input-serverHue\">\n </div>\n\n <div class=\"form-row hue-requires-bridge\">\n <label for=\"node-input-name\">\n <i class=\"fa fa-tag\"></i> <span data-i18n=\"common.name\"></span>\n </label>\n <input type=\"text\" id=\"node-input-name\" placeholder=\"Hue plug name\" style=\"flex:1 1 240px; min-width:240px; max-width:240px;\">\n <button type=\"button\" class=\"red-ui-button hue-refresh-devices\" style=\"margin-left:6px; color:#1b7d33; border-color:#1b7d33;\">\n <i class=\"fa fa-sync\"></i>\n </button>\n <span class=\"hue-devices-loading\" style=\"margin-left:6px; display:none; color:#1b7d33;\">\n <i class=\"fa fa-circle-notch fa-spin\"></i>\n </span>\n </div>\n\n <div id=\"tabs\">\n <ul>\n <li><a href=\"#tabs-1\"><i class=\"fa-solid fa-toggle-on\"></i> <span data-i18n=\"knxUltimateHuePlug.tabs.switch\"></span></a></li>\n <li><a href=\"#tabs-2\"><i class=\"fa-solid fa-gear\"></i> <span data-i18n=\"knxUltimateHuePlug.tabs.behaviour\"></span></a></li>\n </ul>\n\n <div id=\"tabs-1\">\n <div class=\"form-tips hue-form-tip hue-knx-section\">\n <i class=\"fa fa-circle-info\"></i>\n <span data-i18n=\"knxUltimateHuePlug.switch_info\"></span>\n </div>\n <div class=\"form-row hue-knx-section\">\n <label for=\"node-input-namePlugSwitch\" style=\"width:120px;\">\n <i class=\"fa fa-play-circle\"></i> <span data-i18n=\"knxUltimateHuePlug.switch_control\"></span>\n </label>\n <label for=\"node-input-GAPlugSwitch\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GAPlugSwitch\" placeholder=\"1/1/1\" style=\"width:80px; text-align:left;\">\n <label for=\"node-input-dptPlugSwitch\" style=\"width:40px; text-align:right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptPlugSwitch\" style=\"width:140px;\"></select>\n <label for=\"node-input-namePlugSwitch\" style=\"width:60px; text-align:right;\"><span data-i18n=\"knxUltimateHuePlug.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-namePlugSwitch\" style=\"width:200px; text-align:left;\">\n </div>\n\n <div class=\"form-row hue-knx-section\">\n <label for=\"node-input-namePlugState\" style=\"width:120px;\">\n <i class=\"fa fa-circle-info\"></i> <span data-i18n=\"knxUltimateHuePlug.switch_status\"></span>\n </label>\n <label for=\"node-input-GAPlugState\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GAPlugState\" placeholder=\"1/1/2\" style=\"width:80px; text-align:left;\">\n <label for=\"node-input-dptPlugState\" style=\"width:40px; text-align:right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptPlugState\" style=\"width:140px;\"></select>\n <label for=\"node-input-namePlugState\" style=\"width:60px; text-align:right;\"><span data-i18n=\"knxUltimateHuePlug.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-namePlugState\" style=\"width:200px; text-align:left;\">\n </div>\n\n <div class=\"form-tips hue-form-tip hue-knx-section\">\n <i class=\"fa fa-circle-info\"></i>\n <span data-i18n=\"knxUltimateHuePlug.power_state_info\"></span>\n </div>\n <div class=\"form-row hue-knx-section\">\n <label for=\"node-input-namePlugPowerState\" style=\"width:120px;\">\n <i class=\"fa fa-bolt\"></i> <span data-i18n=\"knxUltimateHuePlug.power_state\"></span>\n </label>\n <label for=\"node-input-GAPlugPowerState\" style=\"width:20px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GAPlugPowerState\" placeholder=\"1/1/3\" style=\"width:80px; text-align:left;\">\n <label for=\"node-input-dptPlugPowerState\" style=\"width:40px; text-align:right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptPlugPowerState\" style=\"width:140px;\"></select>\n <label for=\"node-input-namePlugPowerState\" style=\"width:60px; text-align:right;\"><span data-i18n=\"knxUltimateHuePlug.node-input-name\"></span></label>\n <input type=\"text\" id=\"node-input-namePlugPowerState\" style=\"width:200px; text-align:left;\">\n </div>\n </div>\n\n <div id=\"tabs-2\">\n <div class=\"form-row\">\n <label for=\"node-input-readStatusAtStartup\" style=\"width:220px;\">\n <i class=\"fa fa-question-circle\"></i> <span data-i18n=\"knxUltimateHuePlug.read_status_startup\"></span>\n </label>\n <select id=\"node-input-readStatusAtStartup\" style=\"width:120px;\">\n <option value=\"yes\" data-i18n=\"knxUltimateHuePlug.opt_yes_emit\"></option>\n <option value=\"no\" data-i18n=\"knxUltimateHuePlug.opt_no\"></option>\n </select>\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-enableNodePINS\" style=\"width:220px;\">\n <i class=\"fa fa-code\"></i> <span data-i18n=\"knxUltimateHuePlug.node_pins\"></span>\n </label>\n <select id=\"node-input-enableNodePINS\" style=\"width:120px;\">\n <option value=\"no\" data-i18n=\"knxUltimateHuePlug.node_pins_hide\"></option>\n <option value=\"yes\" data-i18n=\"knxUltimateHuePlug.node_pins_show\"></option>\n </select>\n <div class=\"form-tips hue-form-tip\" style=\"margin-left:4px; display:none;\">\n <i class=\"fa fa-circle-info\"></i>\n <span data-i18n=\"knxUltimateHuePlug.node_pins_help\"></span>\n </div>\n </div>\n </div>\n </div>\n\n <input type=\"hidden\" id=\"node-input-hueDevice\">",
9129
9175
  "button": "<!-- Canonical private HUE Controller template: button. -->\n<div class=\"form-row hue-legacy-controller-notice\" role=\"note\" style=\"box-sizing:border-box; padding:10px 12px; margin-bottom:14px; border-left:4px solid #d79b00; background:#fff8df; color:#4d3a00;\">\n <i class=\"fa fa-exclamation-triangle\" aria-hidden=\"true\" style=\"color:#a15c00; margin-right:6px;\"></i>\n <span data-i18n=\"node-red-contrib-knx-ultimate/knxUltimateHueController:knxUltimateHueController.legacy_node_notice\"></span>\n </div>\n <div class=\"form-row\" style=\"margin-bottom:10px;\">\n <span style=\"color:#ff0000\"><i class=\"fa fa-youtube\"></i></span>&nbsp;<a target=\"_blank\" href=\"https://www.youtube.com/playlist?list=PL9Yh1bjbLAYrU8PsVhW4xzEug2WtVFv3E\"><b>KNX-Ultimate video tutorials (YouTube playlist)</b></a>\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-server\">\n <img src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAKnRFWHRDcmVhdGlvbiBUaW1lAEZyIDYgQXVnIDIwMTAgMjE6NTI6MTkgKzAxMDD84aS8AAAAB3RJTUUH3gYYCicNV+4WIQAAAAlwSFlzAAALEgAACxIB0t1+/AAAAARnQU1BAACxjwv8YQUAAACUSURBVHjaY2CgFZg5c+Z/ZEyWAZ8+f/6/ZsWs/xoamqMGkGrA6Wla/1+fVARjEBuGsSoGmY4eZSCNL59d/g8DIDbIAHR14OgFGQByKjIGKX5+6/T///8gGMQGiV1+/B0Fg70GIkD+RMYgxf/O5/7//2MSmAZhkBi6OrgB6Bg5DGB4ajr3f2xqsYYLSDE2THJUDg0AAAqyDVd4tp4YAAAAAElFTkSuQmCC\" />\n <span data-i18n=\"common.knx_gw\"></span>\n </label>\n <input type=\"text\" id=\"node-input-server\">\n </div>\n\n <div class=\"form-row\">\n <label for=\"node-input-serverHue\">\n <img src=\"data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAAEAAAAAA0VXHyAAABFUlEQVQ4EZWSsWoCQRCG1yiENEFEi6QSkjqWWoqFoBYJ+Br6JHkMn8Iibd4ihQpaJIhWNkry/ZtdGZY78Qa+m39nZ+dm9s4550awglNBluS/gVtAX6KgDclf68w2OThgfR9iT/jnoEv4TtByDThWTCDKW4SSZTf/zj9/eZbN+izTDuKGimu0vPF8B/YN8aC8LmcOj/AAn9CFTEs70Js/oGqy79C69bqJ5XbQI2kGO5N8QL9D08S8zBtBF5ZaVsznpCMoqJnVdjTpb1Db0fwIWmQV6BLXzFOYgA6/gDVfQN9bBWp2J2hdWDPoBV5FrKnAJutHikk/CHHR8i7x4iG7qQ720IYvu3GFbpHjx3pFrOFYkA354z/5bkK826phyAAAAABJRU5ErkJggg==\"/>\n <span data-i18n=\"common.hue_bridge\"></span>\n </label>\n <input type=\"text\" id=\"node-input-serverHue\">\n </div>\n\n <div class=\"form-row hue-requires-bridge\">\n <label for=\"node-input-name\">\n <i class=\"fa fa-tag\"></i> <span data-i18n=\"knxUltimateHueButton.hue_sensor\"></span>\n </label>\n <input type=\"text\" id=\"node-input-name\" placeholder=\"Hue button\" style=\"flex:1 1 240px; min-width:240px; max-width:240px;\">\n <button type=\"button\" class=\"red-ui-button hue-refresh-devices\" style=\"margin-left:6px; color:#1b7d33; border-color:#1b7d33;\">\n <i class=\"fa fa-sync\"></i>\n </button>\n <span class=\"hue-devices-loading\" style=\"margin-left:6px; display:none; color:#1b7d33;\">\n <i class=\"fa fa-circle-notch fa-spin\"></i>\n </span>\n </div>\n\n <div id=\"hue-button-tabs\">\n <ul>\n <li><a href=\"#hue-button-tab-switch\"><i class=\"fa fa-toggle-on\"></i> <span data-i18n=\"knxUltimateHueButton.tabs.switch\"></span></a></li>\n <li><a href=\"#hue-button-tab-dim\"><i class=\"fa fa-sun\"></i> <span data-i18n=\"knxUltimateHueButton.tabs.dim\"></span></a></li>\n <li><a href=\"#hue-button-tab-behaviour\"><i class=\"fa fa-gear\"></i> <span data-i18n=\"knxUltimateHueButton.tabs.behaviour\"></span></a></li>\n </ul>\n\n <div id=\"hue-button-tab-switch\">\n <div class=\"form-tips hue-form-tip hue-knx-section\">\n <i class=\"fa fa-circle-info\"></i>\n <span data-i18n=\"knxUltimateHueButton.switch_info\"></span>\n </div>\n <div class=\"form-row hue-knx-section\">\n <label for=\"node-input-GAshort_release\" style=\"width:70px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GAshort_release\" style=\"width:80px; text-align:left;\" placeholder=\"1/1/1\">\n <label for=\"node-input-dptshort_release\" style=\"width:40px; text-align:right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptshort_release\" style=\"width:120px;\"></select>\n <label for=\"node-input-nameshort_release\" style=\"width:50px; text-align:right;\"><span data-i18n=\"common.name\"></span></label>\n <input type=\"text\" id=\"node-input-nameshort_release\" style=\"flex:1 1 140px; min-width:120px; text-align:left;\" placeholder=\"Switch action\">\n </div>\n <div class=\"form-row hue-knx-section hue-status-row\">\n <label for=\"node-input-GAshort_releaseStatus\" style=\"width:70px;\"><span data-i18n=\"knxUltimateHueButton.switch_status\"></span></label>\n <input type=\"text\" id=\"node-input-GAshort_releaseStatus\" style=\"width:80px; text-align:left;\" placeholder=\"1/1/2\">\n <label for=\"node-input-dptshort_releaseStatus\" style=\"width:40px; text-align:right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptshort_releaseStatus\" style=\"width:120px;\"></select>\n <label for=\"node-input-nameshort_releaseStatus\" style=\"width:50px; text-align:right;\"><span data-i18n=\"common.name\"></span></label>\n <input type=\"text\" id=\"node-input-nameshort_releaseStatus\" style=\"flex:1 1 140px; min-width:120px; text-align:left;\" placeholder=\"Switch status\">\n </div>\n </div>\n\n <div id=\"hue-button-tab-dim\">\n <div class=\"form-tips hue-form-tip hue-knx-section\">\n <i class=\"fa fa-circle-info\"></i>\n <span data-i18n=\"knxUltimateHueButton.dim_info\"></span>\n </div>\n <div class=\"form-row hue-knx-section\">\n <label for=\"node-input-GArepeat\" style=\"width:70px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GArepeat\" style=\"width:80px; text-align:left;\" placeholder=\"1/1/3\">\n <label for=\"node-input-dptrepeat\" style=\"width:40px; text-align:right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptrepeat\" style=\"width:120px;\"></select>\n <label for=\"node-input-nameDim\" style=\"width:50px; text-align:right;\"><span data-i18n=\"common.name\"></span></label>\n <input type=\"text\" id=\"node-input-nameDim\" style=\"flex:1 1 140px; min-width:120px; text-align:left;\" placeholder=\"Dim action\">\n </div>\n </div>\n\n <div id=\"hue-button-tab-behaviour\">\n <div class=\"form-tips hue-form-tip\">\n <i class=\"fa fa-circle-info\"></i>\n <span data-i18n=\"knxUltimateHueButton.behaviour_info\"></span>\n </div>\n <div class=\"form-row\">\n <input type=\"checkbox\" id=\"node-input-toggleValues\" style=\"width:auto;\">\n <label for=\"node-input-toggleValues\" style=\"flex:1 1 auto;\">\n <span data-i18n=\"knxUltimateHueButton.toggle_values\"></span>\n </label>\n </div>\n <div class=\"form-row hue-status-row\" style=\"margin-left:24px;\">\n <span data-i18n=\"knxUltimateHueButton.toggle_values_hint\"></span>\n </div>\n <div class=\"hue-fixed-values\" style=\"margin-top:8px;\">\n <div class=\"form-row\">\n <label for=\"node-input-switchSend\" style=\"width:130px;\"><span data-i18n=\"knxUltimateHueButton.switch_send\"></span></label>\n <input type=\"text\" id=\"node-input-switchSend\" style=\"width:160px;\">\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-dimSend\" style=\"width:130px;\"><span data-i18n=\"knxUltimateHueButton.dim_send\"></span></label>\n <input type=\"text\" id=\"node-input-dimSend\" style=\"width:160px;\">\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"form-tips hue-form-tip hue-output-info\" style=\"display:none;\">\n <i class=\"fa fa-circle-info\"></i>\n <span data-i18n=\"knxUltimateHueButton.output_info\"></span>\n </div>\n\n <input type=\"hidden\" id=\"node-input-hueDevice\">",
9130
9176
  "relative_rotary": "<!-- Canonical private HUE Controller template: relative_rotary. -->\n<div class=\"form-row hue-legacy-controller-notice\" role=\"note\" style=\"box-sizing:border-box; padding:10px 12px; margin-bottom:14px; border-left:4px solid #d79b00; background:#fff8df; color:#4d3a00;\">\n <i class=\"fa fa-exclamation-triangle\" aria-hidden=\"true\" style=\"color:#a15c00; margin-right:6px;\"></i>\n <span data-i18n=\"node-red-contrib-knx-ultimate/knxUltimateHueController:knxUltimateHueController.legacy_node_notice\"></span>\n </div>\n <div class=\"form-row\" style=\"margin-bottom:10px;\">\n <span style=\"color:#ff0000\"><i class=\"fa fa-youtube\"></i></span>&nbsp;<a target=\"_blank\" href=\"https://www.youtube.com/playlist?list=PL9Yh1bjbLAYrU8PsVhW4xzEug2WtVFv3E\"><b>KNX-Ultimate video tutorials (YouTube playlist)</b></a>\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-server\">\n <img src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAKnRFWHRDcmVhdGlvbiBUaW1lAEZyIDYgQXVnIDIwMTAgMjE6NTI6MTkgKzAxMDD84aS8AAAAB3RJTUUH3gYYCicNV+4WIQAAAAlwSFlzAAALEgAACxIB0t1+/AAAAARnQU1BAACxjwv8YQUAAACUSURBVHjaY2CgFZg5c+Z/ZEyWAZ8+f/6/ZsWs/xoamqMGkGrA6Wla/1+fVARjEBuGsSoGmY4eZSCNL59d/g8DIDbIAHR14OgFGQByKjIGKX5+6/T///8gGMQGiV1+/B0Fg70GIkD+RMYgxf/O5/7//2MSmAZhkBi6OrgB6Bg5DGB4ajr3f2xqsYYLSDE2THJUDg0AAAqyDVd4tp4YAAAAAElFTkSuQmCC\" />\n <span data-i18n=\"common.knx_gw\"></span>\n </label>\n <input type=\"text\" id=\"node-input-server\">\n </div>\n\n <div class=\"form-row\">\n <label for=\"node-input-serverHue\">\n <img src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAAEAAAAAA0VXHyAAABFUlEQVQ4EZWSsWoCQRCG1yiENEFEi6QSkjqWWoqFoBYJ+Br6JHkMn8Iibd4ihQpaJIhWNkry/ZtdGZY78Qa+m39nZ+dm9s4550awglNBluS/gVtAX6KgDclf68w2OThgfR9iT/jnoEv4TtByDThWTCDKW4SSZTf/zj9/eZbN+izTDuKGimu0vPF8B/YN8aC8LmcOj/AAn9CFTEs70Js/oGqy79C69bqJ5XbQI2kGO5N8QL9D08S8zBtBF5ZaVsznpCMoqJnVdjTpb1Db0fwIWmQV6BLXzFOYgA6/gDVfQN9bBWp2J2hdWDPoBV5FrKnAJutHikk/CHHR8i7x4iG7qQ720IYvu3GFbpHjx3pFrOFYkA354z/5bkK826phyAAAAABJRU5ErkJggg==\"/>\n <span data-i18n=\"common.hue_bridge\"></span>\n </label>\n <input type=\"text\" id=\"node-input-serverHue\">\n </div>\n\n <div class=\"form-row hue-requires-bridge\">\n <label for=\"node-input-name\">\n <i class=\"fa fa-rotate-right\"></i> <span data-i18n=\"knxUltimateHueTapDial.hue_device\"></span>\n </label>\n <input type=\"text\" id=\"node-input-name\" placeholder=\"Hue Tap dial\" style=\"flex:1 1 240px; min-width:240px; max-width:240px;\">\n <button type=\"button\" class=\"red-ui-button hue-refresh-devices\" style=\"margin-left:6px; color:#1b7d33; border-color:#1b7d33;\">\n <i class=\"fa fa-sync\"></i>\n </button>\n <span class=\"hue-devices-loading\" style=\"margin-left:6px; display:none; color:#1b7d33;\">\n <i class=\"fa fa-circle-notch fa-spin\"></i>\n </span>\n </div>\n\n <div id=\"hue-tapdial-tabs\">\n <ul>\n <li><a href=\"#hue-tapdial-tab-mapping\"><i class=\"fa fa-map\"></i> <span data-i18n=\"knxUltimateHueTapDial.tabs.mapping\"></span></a></li>\n <li><a href=\"#hue-tapdial-tab-behaviour\"><i class=\"fa fa-gear\"></i> <span data-i18n=\"knxUltimateHueTapDial.tabs.behaviour\"></span></a></li>\n </ul>\n\n <div id=\"hue-tapdial-tab-mapping\">\n <div class=\"form-tips hue-form-tip hue-knx-section\">\n <i class=\"fa fa-circle-info\"></i>\n <span data-i18n=\"knxUltimateHueTapDial.mapping_info\"></span>\n </div>\n <div class=\"form-row hue-knx-section\">\n <label for=\"node-input-GArepeat\" style=\"width:70px;\"><span data-i18n=\"common.ga\"></span></label>\n <input type=\"text\" id=\"node-input-GArepeat\" placeholder=\"1/1/1\" style=\"width:80px; text-align:left;\">\n <label for=\"node-input-dptrepeat\" style=\"width:40px; text-align:right;\"><span data-i18n=\"common.dpt\"></span></label>\n <select id=\"node-input-dptrepeat\" style=\"width:130px;\"></select>\n <label for=\"node-input-namerepeat\" style=\"width:50px; text-align:right;\"><span data-i18n=\"common.name\"></span></label>\n <input type=\"text\" id=\"node-input-namerepeat\" style=\"flex:1 1 140px; min-width:120px; text-align:left;\" placeholder=\"Rotation\">\n </div>\n </div>\n\n <div id=\"hue-tapdial-tab-behaviour\">\n <div class=\"form-tips hue-form-tip\">\n <i class=\"fa fa-circle-info\"></i>\n <span data-i18n=\"knxUltimateHueTapDial.behaviour_info\"></span>\n </div>\n <div class=\"form-row\">\n <label for=\"node-input-enableNodePINS\" style=\"width:220px;\">\n <i class=\"fa fa-code\"></i> <span data-i18n=\"knxUltimateHueTapDial.node_pins\"></span>\n </label>\n <select id=\"node-input-enableNodePINS\" style=\"width:200px;\">\n <option value=\"yes\" data-i18n=\"knxUltimateHueTapDial.node_pins_show\"></option>\n <option value=\"no\" data-i18n=\"knxUltimateHueTapDial.node_pins_hide\"></option>\n </select>\n </div>\n </div>\n </div>\n\n <div class=\"form-tips hue-form-tip hue-output-info\" style=\"display:none;\">\n <i class=\"fa fa-circle-info\"></i>\n <span data-i18n=\"knxUltimateHueTapDial.output_info\"></span>\n </div>\n\n <input type=\"hidden\" id=\"node-input-hueDevice\">",