diff --git a/backend/app/classes/ChameleonCamera.py b/backend/app/classes/ChameleonCamera.py
new file mode 100644
index 000000000..daa3d8ba4
--- /dev/null
+++ b/backend/app/classes/ChameleonCamera.py
@@ -0,0 +1,11 @@
+from ChameleonPipeLine import ChameleonPipeline
+
+
+class ChameleonCamera:
+
+    def __init__(self, dic):
+        self.pipelines = []
+
+        for pipeline in dic["pipelines"]:
+            self.pipelines.append(ChameleonPipeline(pipeline))
+
diff --git a/backend/app/classes/ChameleonPipeLine.py b/backend/app/classes/ChameleonPipeLine.py
new file mode 100644
index 000000000..1412cdfd6
--- /dev/null
+++ b/backend/app/classes/ChameleonPipeLine.py
@@ -0,0 +1,8 @@
+
+
+class ChameleonPipeline:
+
+    def __init__(self, dic):
+        self.id = dic["id"]
+        self.exposure = dic["exposure"]
+        self.brightness = dic["brightness"]
\ No newline at end of file
diff --git a/backend/app/classes/__init__.py b/backend/app/classes/__init__.py
new file mode 100644
index 000000000..e69de29bb
diff --git a/backend/app/handlers/SocketHandler.py b/backend/app/handlers/SocketHandler.py
index cf54b3e00..39bb0349e 100644
--- a/backend/app/handlers/SocketHandler.py
+++ b/backend/app/handlers/SocketHandler.py
@@ -1,5 +1,6 @@
 import tornado.websocket
 import json
+from classes.ChameleonCamera import ChameleonCamera
 
 
 class ChameleonWebSocket(tornado.websocket.WebSocketHandler):
@@ -10,17 +11,40 @@ class ChameleonWebSocket(tornado.websocket.WebSocketHandler):
     def open(self):
         self.write_message(json.dumps(
             {
-                'cam1':{
-                    'pipeline': 1,
-                    'exposure': 12
+                'cam1': {
+                    'pipelines': [
+                        {"id": 1, "Exposure": 45}
+                    ]
                 }
             }
         ))
         print("WebSocket opened")
 
     def on_message(self, message):
-        print(json.loads(message))
-        # print(message)
+        # print(json.loads(message))
+
+        cams = []
+
+        dic = {
+                'cam1': {
+                    'pipelines': [
+                        {"id": 1, "exposure": 45, "brightness": 123123},
+                        {"id": 2, "exposure": 12, "brightness": 123},
+                        {"id": 3, "exposure": 23, "brightness": 12}
+                    ]
+                },
+                'cam2': {
+                    'pipelines': [
+                        {"id": 1, "exposure": 15, "brightness": 1233},
+                        {"id": 2, "exposure": 68, "brightness": 453}
+                    ]
+                }
+            }
+
+        for cam in dic:
+            cams.append(ChameleonCamera(dic[cam]))
+
+        print(message)
         self.write_message(message)
 
     def on_close(self):
diff --git a/chameleon-client/src/components/InputTab.vue b/chameleon-client/src/components/InputTab.vue
index b26c609f2..28e6dfe4a 100644
--- a/chameleon-client/src/components/InputTab.vue
+++ b/chameleon-client/src/components/InputTab.vue
@@ -1,10 +1,10 @@
 
 <template>
     <div id="InputTab">
-        <chslider class="spacing" title="exposure" v-model="expval" v-on:input="onChange(expval)"></chslider>
-        <chslider class="spacing" title="Brightness"></chslider>
-        <chselect class="spacing" title="Orientation" :list="['Normal','Inverted']" v-model="OrientationVal" v-on:input="onChange(OrientationVal)" ></chselect>
-        <chselect class="spacing" title="Resolution" :list="['idk']"></chselect>
+        <chslider class="spacing" title="exposure" :parentData="values.exposure" @input="values.exposure = $event"></chslider>
+        <chslider class="spacing" title="Brightness" :parentData="values.brightness" @input="values.brightness = $event"></chslider>
+        <chselect class="spacing" title="Orientation" :list="['Normal','Inverted']" :parentData="values.orientation" @input="values.orientation = $event" ></chselect>
+        <chselect class="spacing" title="Resolution" :list="['idk']" :parentData="values.resolution" @input="values.resolution = $event" ></chselect>
         </div>
 
 </template>
@@ -16,8 +16,12 @@ import chselect from './ch-select.vue'
         name: 'InputTab',
         data () {
             return{
-                expval,
-                OrientationVal
+                values:{
+                    exposure:0,
+                    brightness:0,
+                    orientation:0,
+                    resolution:0
+                }
             }
         },
         components: {
@@ -26,9 +30,7 @@ import chselect from './ch-select.vue'
         },
         methods: {
             onChange(i) {
-                // console.log(i);
-                this.$socket.send(JSON.stringify(i));
-                
+                console.log(i);
             }
         }
     }
diff --git a/chameleon-client/src/components/Vision.vue b/chameleon-client/src/components/Vision.vue
index 6c2d25216..6e1d4a6d7 100644
--- a/chameleon-client/src/components/Vision.vue
+++ b/chameleon-client/src/components/Vision.vue
@@ -33,7 +33,6 @@
         },
         data() {
             return {
-
             }
         },
         methods: {}
diff --git a/chameleon-client/src/components/ch-select.vue b/chameleon-client/src/components/ch-select.vue
index 5d9dce042..a005d168c 100644
--- a/chameleon-client/src/components/ch-select.vue
+++ b/chameleon-client/src/components/ch-select.vue
@@ -16,7 +16,8 @@
         name: 'ch-select',
         props:[
             'title',
-            'list'
+            'list',
+            'parentData'
         ],
         data() {
             return {
@@ -25,8 +26,12 @@
         },
         methods: {
             handleInput() {
-                this.$emit('input',{[this.title]:this.value});
+                this.$emit('input',this.value);
+                this.$socket.sendObj({[this.title]:this.value});
             }
+        },
+        beforeMount () {
+            this.value = this.parentData
         }
     }
 </script>
diff --git a/chameleon-client/src/components/ch-slider.vue b/chameleon-client/src/components/ch-slider.vue
index 05e318019..0540071d4 100644
--- a/chameleon-client/src/components/ch-slider.vue
+++ b/chameleon-client/src/components/ch-slider.vue
@@ -16,16 +16,20 @@
 <script>
     export default {
         name: 'ch-slider',
-        props:['title','value'],
+        props:['title','parentData'],
         data() {
             return {
-                content:this.value
+                value:0,
             }
         },
         methods: {
             handleInput() {
-                this.$emit('input',{[this.title]:this.value});
+                this.$emit('input',this.value);
+                this.$socket.sendObj({[this.title]:this.value});
             }
+        },
+        beforeMount () {
+            this.value = this.parentData
         }
     }
 </script>
diff --git a/chameleon-client/src/main.js b/chameleon-client/src/main.js
index c99f44797..ace124dd2 100644
--- a/chameleon-client/src/main.js
+++ b/chameleon-client/src/main.js
@@ -9,7 +9,7 @@ import locale from 'iview/dist/locale/en-US';
 
 Vue.use(VueRouter);
 Vue.use(iView , { locale });
-Vue.use(VueNativeSock,'ws://' + location.hostname + ':8888/websocket');
+Vue.use(VueNativeSock,'ws://'+location.hostname+':8888/websocket',{format:'JSON'});
 Vue.config.productionTip = false
 
 new Vue({