adapt message

src/app/components/ParamColor.js

@@ -1,31 +1,19 @@
 import $ from 'jquery';
 import ColorPicker from './base/ColorPicker/ColorPicker';
-import Store from '../core/store/RestStore';
 
 export default class ParamColor extends ColorPicker {
 
     constructor(ctx, node) {
         super(ctx, node);
-        //this.store = new Store(this.config.endpoint);
-        /* this.ws = new WebSocket(this.config.endpoint.indexOf('/') === 0 ? "ws://" + window.location.host + this.config.endpoint : this.config.endpoint );
-        this.ws.onopen = (event) => {
-            console.log('open ' + this.config.endpoint);
-        };
-        this.ws.onmessage = (event) => {
-            console.log(event.data);
-         }; */
     }
 
     onChange(evt) {
-        /*this.store.save({
-            rgb: parseInt(this.value.replace('#', '0x'))
-        });*/
-        //let cmd = this.config.id + parseInt(this.value.replace('#', '0x'));
-        console.log(parseInt(this.value.replace('#', '0x')));
-        this.ctx.ws.send(JSON.stringify({
-            mode: this.config.mode,
-            value: parseInt(this.value.replace('#', '0x'))
-        }));
+        let obj = {
+            topic: this.config.topic,
+            payload: parseInt(this.value.replace('#', '0x'))
+        };
+        this.ctx.ws.send(JSON.stringify(obj));
+        console.log(obj);
     }
 
 }

src/app/components/ParamSelect.js

@@ -14,10 +14,11 @@ export default class ParamSelect extends Select {
     }
 
     onChange(evt) {
-        let obj = {};
-        obj[this.config.name] = evt.target.value;
+        let obj = {
+            topic: this.config.topic,
+            payload: evt.target.value
+        };
         this.ctx.ws.send(JSON.stringify(obj));
-        
     }
 
 }

src/pages/index.html

@@ -33,16 +33,19 @@
           <li class="form-row ParamColor" 
             data-mode="2"
             data-name="color" 
+            data-topic="pixels/color"
             data-label="Color">
           </li>
           <li class="form-row ParamColor" 
             data-mode="2"
-            data-name="color2" 
+            data-name="color" 
+            data-topic="pixels/color2"
             data-label="Color 2">
           </li>    
           <li class="form-row ParamSelect"
             data-label="Pattern"
             data-name="pattern"
+            data-topic="pixels/pattern"
             data-entries='[{"text": "None", "value": "0"}, {"text": "Rainbow", "value": "1"}, {"text": "TheaterChase", "value": "2"}]'
             ></li>      
         </ul>