diff --git a/Main/src/main/java/com/chameleonvision/web/ServerHandler.java b/Main/src/main/java/com/chameleonvision/web/ServerHandler.java
index f50188d34..1d024e278 100644
--- a/Main/src/main/java/com/chameleonvision/web/ServerHandler.java
+++ b/Main/src/main/java/com/chameleonvision/web/ServerHandler.java
@@ -53,6 +53,7 @@ public class ServerHandler {
                             setField(SettingsManager.GeneralSettings, e.getKey(), e.getValue());
                         }
                         SettingsManager.saveSettings();
+                        sendFullSettings();
                         break;
                     }
                     case "cameraSettings": {
@@ -61,6 +62,7 @@ public class ServerHandler {
                         CameraManager.getCurrentCamera().setStreamDivisor((Integer) camSettings.get("streamDivisor"));
                         CameraManager.getCurrentCamera().setCamVideoMode((Integer) camSettings.get("resolution"), true);
                         SettingsManager.saveSettings();
+                        sendFullSettings();
                         break;
                     }
                     case "changeCameraName": {
@@ -118,9 +120,7 @@ public class ServerHandler {
                     case "currentPipeline": {
                         var cam = CameraManager.getCurrentCamera();
                         cam.setCurrentPipelineIndex((Integer) entry.getValue());
-                        HashMap<String, Object> tmp = new HashMap<>();
-                        tmp.put("pipeline", getOrdinalPipeline());
-                        broadcastMessage(tmp);
+                        sendFullSettings();
                         try {
                             cam.setBrightness(cam.getCurrentPipeline().brightness);
                             cam.setExposure(cam.getCurrentPipeline().exposure);
diff --git a/chameleon-client/src/store.js b/chameleon-client/src/store.js
index 6a382b0ed..85e05e73b 100644
--- a/chameleon-client/src/store.js
+++ b/chameleon-client/src/store.js
@@ -33,7 +33,8 @@ export default new Vuex.Store({
       targetGrouping:0,
       targetIntersection:0,
       sortMode:0,
-      isBinary:0
+      isBinary:0,
+      calibrationMode:0
     },
     cameraSettings:{},
     resolutionList:[],
@@ -54,7 +55,12 @@ export default new Vuex.Store({
     currentPipelineIndex: set('currentPipelineIndex'),
     cameraList: set('cameraList'),
     pipelineList: set('pipelineList'),
-    point:set('point')
+    point:set('point'),
+    setPipeValues(state,obj){
+      for(let i in obj){
+        Vue.set(state.pipeline,i,obj[i]);
+      }
+    }
   },
   actions: {
     settings: state => state.settings,
@@ -67,10 +73,5 @@ export default new Vuex.Store({
     cameraList: state =>state.cameraList,
     pipelineList: state =>state.pipelineList,
     point: state =>state.point,
-    setPipeValues(state,obj){
-      for(let i in obj){
-        Vue.set(state.pipeline,i,obj[i]);
-      }
-    }
   }
 })
diff --git a/chameleon-client/src/views/Camera.vue b/chameleon-client/src/views/Camera.vue
index 917bc92f1..3a2fabd9d 100644
--- a/chameleon-client/src/views/Camera.vue
+++ b/chameleon-client/src/views/Camera.vue
@@ -4,52 +4,63 @@
             <v-row align="center">
                 <v-col :cols="3" class="colsClass">
                     <div style="padding-left:30px">
-                        <CVselect v-if="isCameraNameEdit == false" name="Camera" v-model="currentCameraIndex" :list="cameraList" @input="handleInput('currentCamera',currentCameraIndex)"></CVselect>
-                        <CVinput v-else name="Camera" v-model="newCameraName" @Enter="saveCameraNameChange" :errorMessage="checkCameraName"></CVinput>
+                        <CVselect v-if="isCameraNameEdit === false" name="Camera" v-model="currentCameraIndex"
+                                  :list="cameraList" @input="handleInput('currentCamera',currentCameraIndex)"/>
+                        <CVinput v-else name="Camera" v-model="newCameraName" @Enter="saveCameraNameChange"
+                                 :errorMessage="checkCameraName"/>
                     </div>
                 </v-col>
                 <v-col :cols="1">
-                    <CVicon color="#c5c5c5" v-if="isCameraNameEdit == false" hover text="edit" @click="toCameraNameChange" tooltip="Edit camera name"></CVicon>
+                    <CVicon color="#c5c5c5" v-if="isCameraNameEdit === false" hover text="edit"
+                            @click="toCameraNameChange" tooltip="Edit camera name"/>
                     <div v-else>
-                        <CVicon color="#c5c5c5" style="display: inline-block;"  hover text="save" @click="saveCameraNameChange" tooltip="Save Camera Name"></CVicon>
-                        <CVicon color="error" style="display: inline-block;"  hover text="close" @click="discardCameraNameChange" tooltip="Discard Changes"></CVicon>
+                        <CVicon color="#c5c5c5" style="display: inline-block;" hover text="save"
+                                @click="saveCameraNameChange" tooltip="Save Camera Name"/>
+                        <CVicon color="error" style="display: inline-block;" hover text="close"
+                                @click="discardCameraNameChange" tooltip="Discard Changes"/>
                     </div>
                 </v-col>
                 <v-col :cols="3" class="colsClass">
-                    <CVselect v-if="isPipelineEdit == false" name="Pipeline" :list="pipelineList" v-model="currentPipelineIndex" @input="handleInput('currentPipeline',currentPipelineIndex)"></CVselect>
-                    <CVinput v-else name="Pipeline" v-model="newPipelineName" @Enter="savePipelineNameChange"></CVinput>
+                    <CVselect v-if="isPipelineEdit === false" name="Pipeline" :list="pipelineList"
+                              v-model="currentPipelineIndex"
+                              @input="handleInput('currentPipeline',currentPipelineIndex)"/>
+                    <CVinput v-else name="Pipeline" v-model="newPipelineName" @Enter="savePipelineNameChange"/>
                 </v-col>
                  <v-col :cols="1" class="colsClass">
-                        <v-menu v-if="isPipelineEdit == false" offset-y dark auto>
+                        <v-menu v-if="isPipelineEdit === false" offset-y dark auto>
                             <template v-slot:activator="{ on }">
                                 <v-icon color="white" v-on="on">menu</v-icon>
                             </template>
                             <v-list dense>
                                 <v-list-item @click="toPipelineNameChange">
                                     <v-list-item-title>
-                                        <CVicon color="#c5c5c5" :right="true" text="edit" tooltip="Edit pipeline name"></CVicon>
+                                        <CVicon color="#c5c5c5" :right="true" text="edit" tooltip="Edit pipeline name"/>
                                     </v-list-item-title>
                                 </v-list-item>
                                       <v-list-item @click="handleInput('command','addNewPipeline')">
                                     <v-list-item-title>
-                                        <CVicon color="#c5c5c5" :right="true" text="add" tooltip="Add new pipeline"></CVicon>
+                                        <CVicon color="#c5c5c5" :right="true" text="add" tooltip="Add new pipeline"/>
                                     </v-list-item-title>
                                 </v-list-item>
                                 <v-list-item @click="deleteCurrentPipeline">
                                     <v-list-item-title>
-                                        <CVicon color="red darken-2" :right="true" text="delete" tooltip="Delete pipeline"></CVicon>
+                                        <CVicon color="red darken-2" :right="true" text="delete"
+                                                tooltip="Delete pipeline"/>
                                     </v-list-item-title>
                                 </v-list-item>
                                 <v-list-item @click="openDuplicateDialog">
                                     <v-list-item-title>
-                                        <CVicon color="#c5c5c5" :right="true" text="mdi-content-copy" tooltip="Duplicate pipeline"></CVicon>
+                                        <CVicon color="#c5c5c5" :right="true" text="mdi-content-copy"
+                                                tooltip="Duplicate pipeline"/>
                                     </v-list-item-title>
                                 </v-list-item>
                             </v-list>
                         </v-menu>
                         <div v-else>
-                            <CVicon color="#c5c5c5" style="display: inline-block;"  hover text="save" @click="savePipelineNameChange" tooltip="Save Pipeline Name"></CVicon>
-                            <CVicon color="error" style="display: inline-block;"  hover text="close" @click="discardPipelineNameChange" tooltip="Discard Changes"></CVicon>
+                            <CVicon color="#c5c5c5" style="display: inline-block;" hover text="save"
+                                    @click="savePipelineNameChange" tooltip="Save Pipeline Name"/>
+                            <CVicon color="error" style="display: inline-block;" hover text="close"
+                                    @click="discardPipelineNameChange" tooltip="Discard Changes"/>
                         </div>
                 </v-col>
                 
@@ -66,7 +77,7 @@
                 </v-tabs>
                 <div style="padding-left:30px">
                     <!-- vision component -->
-                    <component v-model="pipeline" :is="selectedComponent"></component>
+                    <component v-model="pipeline" :is="selectedComponent"/>
                 </div>
             </v-col>
             <v-col cols="6" class="colsClass">
@@ -78,7 +89,7 @@
                     </v-tabs>
                     <!-- camera image stream -->
                     <div class="videoClass">
-                        <img v-if="cameraList.length > 0" :src="steamAdress">
+                        <img v-if="cameraList.length > 0" :src="streamAddress">
                         <span v-else>No Cameras Are connected</span>
                         <h5 id="Point">{{point}}</h5>
                     </div>
@@ -90,14 +101,15 @@
         <v-card dark>
             <v-card-title class="headline" primary-title>Duplicate Pipeline</v-card-title>
                 <v-card-text>
-                    <CVselect name="Pipeline" :list="pipelineList" v-model="pipelineDuplicate.pipeline"></CVselect>
-                    <v-checkbox v-if="cameraList.length > 1" dark :label="'To another camera'" v-model="anotherCamera"></v-checkbox>
-                    <CVselect v-if="anotherCamera === true" name="Camera" v-model="pipelineDuplicate.camera" :list="cameraList"></CVselect>
+                    <CVselect name="Pipeline" :list="pipelineList" v-model="pipelineDuplicate.pipeline"/>
+                    <v-checkbox v-if="cameraList.length > 1" dark :label="'To another camera'" v-model="anotherCamera"/>
+                    <CVselect v-if="anotherCamera === true" name="Camera" v-model="pipelineDuplicate.camera"
+                              :list="cameraList"/>
                 </v-card-text>
                 <v-divider>
                 </v-divider>
                 <v-card-actions>
-                    <v-spacer></v-spacer>
+                    <v-spacer/>
                     <v-btn color="#4baf62" text @click="duplicatePipeline">Duplicate</v-btn>
                     <v-btn color="error" text @click="closeDuplicateDialog">Cancels</v-btn>
                 </v-card-actions>
@@ -213,7 +225,7 @@ import CVinput from '../components/cv-input'
             checkCameraName(){
                 if(this.newCameraName !== this.cameraList[this.currentCameraIndex]){
                     for(let cam in this.cameraList){
-                        if(this.newCameraName == this.cameraList[cam]){
+                        if(this.newCameraName === this.cameraList[cam]){
                             return "Camera by that name already Exists"
                         }
                     }
@@ -285,7 +297,7 @@ import CVinput from '../components/cv-input'
                     return this.$store.state.pipeline;
                 }
             },
-            steamAdress: {
+            streamAddress: {
                 get: function(){
                     return "http://"+location.hostname + ":"+ this.$store.state.port +"/stream.mjpg";
                 }
diff --git a/chameleon-client/src/views/CameraViewes/OutputTab.vue b/chameleon-client/src/views/CameraViewes/OutputTab.vue
index 822c87947..9a983acfd 100644
--- a/chameleon-client/src/views/CameraViewes/OutputTab.vue
+++ b/chameleon-client/src/views/CameraViewes/OutputTab.vue
@@ -1,19 +1,13 @@
 <template>
     <div>
-        <CVselect name="SortMode" v-model="value.sortMode" :list="['Largest','Smallest','Highest','Lowest','Rightmost','Leftmost','Closest']" @input="handleInput('sortMode',value.sortMode)"></CVselect>
-        <span>Calibrate:</span><v-divider dark color="white"></v-divider>
-        <v-row align="center" justify="start">
-            <v-col style="padding-right:0px" :cols="3"> 
-                <v-btn small color="#4baf62" @click="takePointA">Take Point A</v-btn>
-            </v-col>
-            <v-col style="margin-left:0px" :cols="3">
-                <v-btn small color="#4baf62" @click="takePointB">Take Point B</v-btn>
-            </v-col>
-            <v-col>
-                <v-btn small @click="clearSlope" color="yellow darken-3">Clear All Points</v-btn>
-            </v-col>
-            
-        </v-row>
+        <CVselect name="SortMode" v-model="value.sortMode"
+                  :list="['Largest','Smallest','Highest','Lowest','Rightmost','Leftmost','Closest']"
+                  @input="handleInput('sortMode',value.sortMode)"/>
+        <span>Calibrate:</span>
+        <v-divider dark color="white"/>
+        <CVselect name="Calibration Mode" v-model="value.calibrationMode" :list="['Single point','Dual point']"
+                  @input="handleInput('calibrationMode',value.calibrationMode)"/>
+        <component :raw-point="rawPoint" :is="selectedComponent"/>
         <v-snackbar :timeout="3000" v-model="snackbar" top color="error">
             <span style="color:#000">Points are too close</span>
             <v-btn color="black" text @click="snackbar = false">Close</v-btn>
@@ -23,54 +17,37 @@
 
 <script>
 import CVselect from '../../components/cv-select'
+import DualCalibration from "./OutputViewes/DualCalibration";
+import SingleCalibration from "./OutputViewes/SingleCalibration";
     export default {
         name: 'Output',
         props:['value'],
         components:{
-            CVselect
+            CVselect,
+            SingleCalibration,
+            DualCalibration,
+
         },
         methods:{
-            takePointA(){
-                this.pointA = this.rawPoint;
-                this.calcSlope();
-            },
-            takePointB(){
-                this.pointB = this.rawPoint;
-                this.calcSlope();
-            },
-            calcSlope(){
-                if(this.pointA !== undefined && this.pointB !== undefined){
-                    let m = (this.pointB[1] - this.pointA[1]) / (this.pointB[0] - this.pointA[0]);
-                    let b = this.pointA[1] - (m * this.pointA[0]);
-                    if(isNaN(m) === false && isNaN(b) === false){
-                        this.sendSlope(m,b,true);
-                    } else {
-                         this.snackbar = true;
-                    }
-                    this.pointA = undefined;
-                    this.pointB = undefined;
-                }
-            },
-            sendSlope(m,b,valid){
-                this.handleInput('m',m);
-                this.handleInput('b',b);
-                this.handleInput('isCalibrated',valid);
-            },
-            clearSlope(){
-                this.sendSlope(1,0,false);
-                this.pointA = undefined;
-                this.pointB = undefined;
-            }
         },
 
         data() {
             return {
                 snackbar: false,
-                pointA: undefined,
-                pointB: undefined 
             }
         },
         computed:{
+            selectedComponent:{
+                get(){
+                    switch (this.value.calibrationMode) {
+                        case 0:
+                            return "SingleCalibration";
+                        case 1:
+                            return "DualCalibration"
+                    }
+                    return ""
+                }
+            },
             rawPoint:{
                 get(){
                     return this.$store.state.point.rawPoint;
diff --git a/chameleon-client/src/views/CameraViewes/OutputViewes/DualCalibration.vue b/chameleon-client/src/views/CameraViewes/OutputViewes/DualCalibration.vue
new file mode 100644
index 000000000..44e70bcac
--- /dev/null
+++ b/chameleon-client/src/views/CameraViewes/OutputViewes/DualCalibration.vue
@@ -0,0 +1,65 @@
+<template>
+    <div>
+        <v-row align="center" justify="start">
+            <v-col style="padding-right:0" :cols="3">
+                <v-btn small color="#4baf62" @click="takePointA">Take Point A</v-btn>
+            </v-col>
+            <v-col style="margin-left:0" :cols="3">
+                <v-btn small color="#4baf62" @click="takePointB">Take Point B</v-btn>
+            </v-col>
+            <v-col>
+                <v-btn small @click="clearSlope" color="yellow darken-3">Clear All Points</v-btn>
+            </v-col>
+        </v-row>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: "DualCalibration",
+        props: ['rawPoint'],
+        data() {
+            return {
+                pointA: undefined,
+                pointB: undefined
+            }
+        },
+        methods: {
+            takePointA() {
+                this.pointA = this.rawPoint;
+                this.calcSlope();
+            },
+            takePointB() {
+                this.pointB = this.rawPoint;
+                this.calcSlope();
+            },
+            calcSlope() {
+                if (this.pointA !== undefined && this.pointB !== undefined) {
+                    let m = (this.pointB[1] - this.pointA[1]) / (this.pointB[0] - this.pointA[0]);
+                    let b = this.pointA[1] - (m * this.pointA[0]);
+                    if (isNaN(m) === false && isNaN(b) === false) {
+                        this.sendSlope(m, b, true);
+                    } else {
+                        this.$emit('snackbar');
+                    }
+                    this.pointA = undefined;
+                    this.pointB = undefined;
+                }
+            },
+            sendSlope(m, b, valid) {
+                this.handleInput('m', m);
+                this.handleInput('b', b);
+                this.handleInput('isCalibrated', valid);
+            },
+            clearSlope() {
+                this.sendSlope(1, 0, false);
+                this.pointA = undefined;
+                this.pointB = undefined;
+            }
+        }
+    }
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/chameleon-client/src/views/CameraViewes/OutputViewes/SingleCalibration.vue b/chameleon-client/src/views/CameraViewes/OutputViewes/SingleCalibration.vue
new file mode 100644
index 000000000..06adde264
--- /dev/null
+++ b/chameleon-client/src/views/CameraViewes/OutputViewes/SingleCalibration.vue
@@ -0,0 +1,30 @@
+<template>
+    <div>
+        <v-row align="center" justify="start">
+            <v-col style="padding-right:0" :cols="3">
+                <v-btn small color="#4baf62" @click="takePoint">Take Point</v-btn>
+            </v-col>
+            <v-col>
+                <v-btn small @click="clearPoint" color="yellow darken-3">Clear Point</v-btn>
+            </v-col>
+        </v-row>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: "SingleCalibration",
+        methods:{
+            clearPoint(){
+
+            },
+            takePoint(){
+
+            }
+        }
+    }
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file