From 56773fdfad60f4c336b4b8ba56f019e7ba2edc08 Mon Sep 17 00:00:00 2001 From: Patrick Balsiger Date: Mon, 17 Sep 2018 10:18:53 +0200 Subject: [PATCH] select input component --- data/index.html | 28 +-- data/script.js | 178 +++++++++++++----- data/styles.css | 24 ++- data/{matrix.html => test-controls.html} | 39 ++-- src/app/components/ParamSelect.js | 23 +++ src/app/components/base/Select/Select.html | 6 + src/app/components/base/Select/Select.js | 21 +++ src/app/components/exports.js | 2 + src/pages/index.html | 28 +-- src/pages/{matrix.html => test-controls.html} | 39 ++-- src/styles/form/color.less | 4 +- src/styles/form/input.less | 4 +- src/styles/form/select.less | 17 ++ src/styles/main.less | 1 + 14 files changed, 287 insertions(+), 127 deletions(-) rename data/{matrix.html => test-controls.html} (79%) create mode 100644 src/app/components/ParamSelect.js create mode 100644 src/app/components/base/Select/Select.html create mode 100644 src/app/components/base/Select/Select.js rename src/pages/{matrix.html => test-controls.html} (79%) create mode 100644 src/styles/form/select.less diff --git a/data/index.html b/data/index.html index 959dfce..ccd046c 100644 --- a/data/index.html +++ b/data/index.html @@ -39,28 +39,12 @@ data-mode="2" data-name="color2" data-label="Color 2"> - -
  • -
  • -
  • -
  • -
  • -
  • + +
  • diff --git a/data/script.js b/data/script.js index e5c2fdc..754e569 100644 --- a/data/script.js +++ b/data/script.js @@ -60,7 +60,7 @@ /******/ __webpack_require__.p = ""; /******/ /******/ // Load entry module and return exports -/******/ return __webpack_require__(__webpack_require__.s = 8); +/******/ return __webpack_require__(__webpack_require__.s = 9); /******/ }) /************************************************************************/ /******/ ([ @@ -10442,8 +10442,8 @@ return jQuery; /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery__ = __webpack_require__(0); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_jquery__); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__Mediator__ = __webpack_require__(5); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__DataStore__ = __webpack_require__(16); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__StoreAction__ = __webpack_require__(17); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__DataStore__ = __webpack_require__(17); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__StoreAction__ = __webpack_require__(18); @@ -10490,11 +10490,11 @@ class RestStore extends __WEBPACK_IMPORTED_MODULE_2__DataStore__["a" /* default /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_mustache__ = __webpack_require__(12); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_mustache__ = __webpack_require__(13); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_mustache___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_mustache__); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_jquery__ = __webpack_require__(0); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_jquery___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_1_jquery__); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__data_DataField__ = __webpack_require__(13); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__data_DataField__ = __webpack_require__(14); @@ -10547,7 +10547,7 @@ class Component { /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery__ = __webpack_require__(0); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_jquery__); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__core_Component__ = __webpack_require__(2); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__TextInput_html__ = __webpack_require__(15); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__TextInput_html__ = __webpack_require__(16); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__TextInput_html___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_2__TextInput_html__); @@ -10585,7 +10585,7 @@ class TextInput extends __WEBPACK_IMPORTED_MODULE_1__core_Component__["a" /* def /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery__ = __webpack_require__(0); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_jquery__); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__core_Component__ = __webpack_require__(2); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__Switch_html__ = __webpack_require__(18); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__Switch_html__ = __webpack_require__(19); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__Switch_html___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_2__Switch_html__); @@ -10657,7 +10657,7 @@ class Mediator { /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery__ = __webpack_require__(0); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_jquery__); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__core_Component__ = __webpack_require__(2); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__Slider_html__ = __webpack_require__(19); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__Slider_html__ = __webpack_require__(20); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__Slider_html___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_2__Slider_html__); @@ -10695,7 +10695,41 @@ class Slider extends __WEBPACK_IMPORTED_MODULE_1__core_Component__["a" /* defaul /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery__ = __webpack_require__(0); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_jquery__); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__core_Component__ = __webpack_require__(2); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__ColorPicker_html__ = __webpack_require__(20); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__Select_html__ = __webpack_require__(21); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__Select_html___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_2__Select_html__); + + + + + +class Select extends __WEBPACK_IMPORTED_MODULE_1__core_Component__["a" /* default */] { + + constructor(ctx, node, template) { + super(ctx, node, template || __WEBPACK_IMPORTED_MODULE_2__Select_html___default.a); + this.render(this.config); + } + + onChange(evt) { + console.log(evt.target.value); + } + + subscribe() { + this.node.delegate('select', 'change', this.onChange.bind(this)); + } + +} +/* harmony export (immutable) */ __webpack_exports__["a"] = Select; + + +/***/ }), +/* 8 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { + +"use strict"; +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_jquery__); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__core_Component__ = __webpack_require__(2); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__ColorPicker_html__ = __webpack_require__(22); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__ColorPicker_html___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_2__ColorPicker_html__); @@ -10735,15 +10769,15 @@ class ColorPicker extends __WEBPACK_IMPORTED_MODULE_1__core_Component__["a" /* d /***/ }), -/* 8 */ +/* 9 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery__ = __webpack_require__(0); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_jquery__); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__core_App__ = __webpack_require__(9); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__components_exports__ = __webpack_require__(10); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__core_App__ = __webpack_require__(10); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__components_exports__ = __webpack_require__(11); @@ -10843,7 +10877,7 @@ Sui.ready(() => { }); */ /***/ }), -/* 9 */ +/* 10 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -10936,33 +10970,39 @@ class App { /***/ }), -/* 10 */ +/* 11 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__base_Form_Form__ = __webpack_require__(11); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__base_Form_Form__ = __webpack_require__(12); /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "Form", function() { return __WEBPACK_IMPORTED_MODULE_0__base_Form_Form__["a"]; }); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__base_Switch_Switch__ = __webpack_require__(4); /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "Switch", function() { return __WEBPACK_IMPORTED_MODULE_1__base_Switch_Switch__["a"]; }); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__base_Slider_Slider__ = __webpack_require__(6); /* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "Slider", function() { return __WEBPACK_IMPORTED_MODULE_2__base_Slider_Slider__["a"]; }); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__base_TextInput_TextInput__ = __webpack_require__(3); -/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "TextInput", function() { return __WEBPACK_IMPORTED_MODULE_3__base_TextInput_TextInput__["a"]; }); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__base_ColorPicker_ColorPicker__ = __webpack_require__(7); -/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "ColorPicker", function() { return __WEBPACK_IMPORTED_MODULE_4__base_ColorPicker_ColorPicker__["a"]; }); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__PresetSwitch__ = __webpack_require__(21); -/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "PresetSwitch", function() { return __WEBPACK_IMPORTED_MODULE_5__PresetSwitch__["a"]; }); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__ParamSlider__ = __webpack_require__(22); -/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "ParamSlider", function() { return __WEBPACK_IMPORTED_MODULE_6__ParamSlider__["a"]; }); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__ParamText__ = __webpack_require__(23); -/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "ParamText", function() { return __WEBPACK_IMPORTED_MODULE_7__ParamText__["a"]; }); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_8__ParamColor__ = __webpack_require__(24); -/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "ParamColor", function() { return __WEBPACK_IMPORTED_MODULE_8__ParamColor__["a"]; }); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_9__ParamWs__ = __webpack_require__(25); -/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "ParamWs", function() { return __WEBPACK_IMPORTED_MODULE_9__ParamWs__["a"]; }); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_10__LedStripPatternSwitch__ = __webpack_require__(26); -/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "LedStripPatternSwitch", function() { return __WEBPACK_IMPORTED_MODULE_10__LedStripPatternSwitch__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__base_Select_Select__ = __webpack_require__(7); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "Select", function() { return __WEBPACK_IMPORTED_MODULE_3__base_Select_Select__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__base_TextInput_TextInput__ = __webpack_require__(3); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "TextInput", function() { return __WEBPACK_IMPORTED_MODULE_4__base_TextInput_TextInput__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__base_ColorPicker_ColorPicker__ = __webpack_require__(8); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "ColorPicker", function() { return __WEBPACK_IMPORTED_MODULE_5__base_ColorPicker_ColorPicker__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__PresetSwitch__ = __webpack_require__(23); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "PresetSwitch", function() { return __WEBPACK_IMPORTED_MODULE_6__PresetSwitch__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__ParamSlider__ = __webpack_require__(24); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "ParamSlider", function() { return __WEBPACK_IMPORTED_MODULE_7__ParamSlider__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_8__ParamText__ = __webpack_require__(25); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "ParamText", function() { return __WEBPACK_IMPORTED_MODULE_8__ParamText__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_9__ParamColor__ = __webpack_require__(26); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "ParamColor", function() { return __WEBPACK_IMPORTED_MODULE_9__ParamColor__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_10__ParamWs__ = __webpack_require__(27); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "ParamWs", function() { return __WEBPACK_IMPORTED_MODULE_10__ParamWs__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_11__ParamSelect__ = __webpack_require__(28); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "ParamSelect", function() { return __WEBPACK_IMPORTED_MODULE_11__ParamSelect__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_12__LedStripPatternSwitch__ = __webpack_require__(29); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "LedStripPatternSwitch", function() { return __WEBPACK_IMPORTED_MODULE_12__LedStripPatternSwitch__["a"]; }); + + @@ -10977,7 +11017,7 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); /***/ }), -/* 11 */ +/* 12 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -11033,7 +11073,7 @@ class Form extends __WEBPACK_IMPORTED_MODULE_1__core_Component__["a" /* default /***/ }), -/* 12 */ +/* 13 */ /***/ (function(module, exports, __webpack_require__) { var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*! @@ -11672,11 +11712,11 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_ /***/ }), -/* 13 */ +/* 14 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__DataBinding__ = __webpack_require__(14); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__DataBinding__ = __webpack_require__(15); class DataField { @@ -11704,7 +11744,7 @@ class DataField { /***/ }), -/* 14 */ +/* 15 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -11742,13 +11782,13 @@ class DataBinding { /***/ }), -/* 15 */ +/* 16 */ /***/ (function(module, exports) { module.exports = "\n" /***/ }), -/* 16 */ +/* 17 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -11766,7 +11806,7 @@ class DataStore { /***/ }), -/* 17 */ +/* 18 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -11779,25 +11819,31 @@ class DataStore { /***/ }), -/* 18 */ +/* 19 */ /***/ (function(module, exports) { module.exports = "\n" /***/ }), -/* 19 */ +/* 20 */ /***/ (function(module, exports) { module.exports = "\n" /***/ }), -/* 20 */ +/* 21 */ +/***/ (function(module, exports) { + +module.exports = "\n" + +/***/ }), +/* 22 */ /***/ (function(module, exports) { module.exports = "\n" /***/ }), -/* 21 */ +/* 23 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -11844,7 +11890,7 @@ class PresetSwitch extends __WEBPACK_IMPORTED_MODULE_1__base_Switch_Switch__["a" /***/ }), -/* 22 */ +/* 24 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -11875,7 +11921,7 @@ class ParamSlider extends __WEBPACK_IMPORTED_MODULE_1__base_Slider_Slider__["a" /***/ }), -/* 23 */ +/* 25 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -11906,13 +11952,13 @@ class ParamText extends __WEBPACK_IMPORTED_MODULE_1__base_TextInput_TextInput__[ /***/ }), -/* 24 */ +/* 26 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery__ = __webpack_require__(0); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_jquery__); -/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__base_ColorPicker_ColorPicker__ = __webpack_require__(7); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__base_ColorPicker_ColorPicker__ = __webpack_require__(8); /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__core_store_RestStore__ = __webpack_require__(1); @@ -11949,7 +11995,7 @@ class ParamColor extends __WEBPACK_IMPORTED_MODULE_1__base_ColorPicker_ColorPick /***/ }), -/* 25 */ +/* 27 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; @@ -11998,7 +12044,41 @@ class ParamWs extends __WEBPACK_IMPORTED_MODULE_1__base_TextInput_TextInput__["a /***/ }), -/* 26 */ +/* 28 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { + +"use strict"; +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_jquery___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_jquery__); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__base_Select_Select__ = __webpack_require__(7); + + + + +class ParamSelect extends __WEBPACK_IMPORTED_MODULE_1__base_Select_Select__["a" /* default */] { + + constructor(ctx, node) { + super(ctx, node); + this.render({ + label: this.config.label, + name: this.config.name, + entries: this.config.entries + }); + } + + onChange(evt) { + let obj = {}; + obj[this.config.name] = evt.target.value; + this.ctx.ws.send(JSON.stringify(obj)); + + } + +} +/* harmony export (immutable) */ __webpack_exports__["a"] = ParamSelect; + + +/***/ }), +/* 29 */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; diff --git a/data/styles.css b/data/styles.css index 34fb1aa..fe033af 100644 --- a/data/styles.css +++ b/data/styles.css @@ -252,14 +252,14 @@ form .form-row input[type="checkbox"] { background: transparent; border: none; color: #eeeeee; + border-bottom: solid 1px #097479; } .sui input[type="text"]:focus, .sui input[type="password"]:focus, .sui input[type="text"]:hover, .sui input[type="password"]:hover { outline: none; - border-bottom: solid 1px #097479; - box-shadow: 3px #097479; + border-bottom: 1px solid #0eb8c0; } .sui input[type="checkbox"] { transform: scale(2); @@ -268,6 +268,22 @@ form .form-row input[type="checkbox"] { flex: none !important; background-color: transparent; border: 0; - height: 50px; - width: 75px; + height: 42px; + width: 42px; +} +.sui select { + padding: .5em; + color: #eeeeee; + background: none; + border: none; + border-bottom: solid 1px #097479; +} +.sui select:focus, +.sui select:hover { + outline: none; + border: none; + border-bottom: solid 1px #0eb8c0 !important; +} +.sui select option { + background: #333333; } diff --git a/data/matrix.html b/data/test-controls.html similarity index 79% rename from data/matrix.html rename to data/test-controls.html index 176114d..974e650 100644 --- a/data/matrix.html +++ b/data/test-controls.html @@ -12,7 +12,7 @@
    -
    + Strip
    • + data-label="Color">
    • +
    • +
    • +
    • -
    • -
    • + data-label="Rainbow">
    • + data-id="2" + data-mode="3"> +
    • +
    @@ -59,6 +71,7 @@
    WiFi Settings
    + Strip
    • + data-label="Color">
    • +
    • +
    • +
    • -
    • -
    • + data-label="Rainbow">
    • + data-id="2" + data-mode="3"> +
    • +
    @@ -59,6 +71,7 @@
    WiFi Settings
    +