Merge pull request #30 from Chameleon-Vision/pipeline-popup

Pipeline popup for renaming and creating

chameleon-client/src/views/Camera.vue

@@ -21,14 +21,13 @@
                     </div>
                 </v-col>
                 <v-col :cols="3" class="colsClass">
-                    <CVselect v-if="isPipelineEdit === false" name="Pipeline"
+                    <CVselect name="Pipeline"
                               :list="['Driver Mode'].concat(pipelineList)"
                               v-model="currentPipelineIndex"
                               @input="handleInput('currentPipeline',currentPipelineIndex - 1)"/>
-                    <CVinput v-else name="Pipeline" v-model="newPipelineName" @Enter="savePipelineNameChange"/>
                 </v-col>
                 <v-col :cols="1" class="colsClass" md="3" v-if="currentPipelineIndex !== 0">
-                    <v-menu v-if="isPipelineEdit === false" offset-y dark auto>
+                    <v-menu offset-y dark auto>
                         <template v-slot:activator="{ on }">
                             <v-icon color="white" v-on="on">menu</v-icon>
                         </template>
@@ -38,7 +37,7 @@
                                     <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 @click="toCreatePipeline">
                                 <v-list-item-title>
                                     <CVicon color="#c5c5c5" :right="true" text="add" tooltip="Add new pipeline"/>
                                 </v-list-item-title>
@@ -57,12 +56,6 @@
                             </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 color="error" style="display: inline-block;" hover text="close"
-                                @click="discardPipelineNameChange" tooltip="Discard Changes"/>
-                    </div>
                 </v-col>
 
                 <v-btn style="position: absolute; top:5px;right: 0;" tile color="#4baf62"
@@ -125,8 +118,26 @@
                 </v-divider>
                 <v-card-actions>
                     <v-spacer/>
-                    <v-btn color="#4baf62" outlined @click="duplicatePipeline">Duplicate</v-btn>
+                    <v-btn color="#4baf62" @click="duplicatePipeline">Duplicate</v-btn>
-                    <v-btn color="error" outlined @click="closeDuplicateDialog">Cancel</v-btn>
+                    <v-btn color="error" @click="closeDuplicateDialog">Cancel</v-btn>
+                </v-card-actions>
+            </v-card>
+        </v-dialog>
+        <!--pipeline naming dialog-->
+        <v-dialog dark v-model="namingDialog" width="500" height="357">
+            <v-card dark>
+                <v-card-title class="headline" primary-title>Pipeline Name</v-card-title>
+                <v-card-text>
+                    <CVinput name="Pipeline" :error-message="checkPipelineName" v-model="newPipelineName"
+                             @Enter="savePipelineNameChange"/>
+                </v-card-text>
+                <v-divider>
+                </v-divider>
+                <v-card-actions>
+                    <v-spacer/>
+                    <v-btn color="#4baf62" @click="savePipelineNameChange" :disabled="checkPipelineName !==''">Save
+                    </v-btn>
+                    <v-btn color="error" @click="discardPipelineNameChange">Cancel</v-btn>
                 </v-card-actions>
             </v-card>
         </v-dialog>
@@ -169,7 +180,7 @@
                 this.isCameraNameEdit = true;
             },
             saveCameraNameChange() {
-                if (this.cameraNameError === "") {
+                if (this.checkCameraName === "") {
                     this.handleInput("changeCameraName", this.newCameraName);
                     this.discardCameraNameChange();
                 }
@@ -179,15 +190,28 @@
                 this.newCameraName = "";
             },
             toPipelineNameChange() {
-                this.newPipelineName = this.pipelineList[this.currentPipelineIndex];
+                this.newPipelineName = this.pipelineList[this.currentPipelineIndex - 1];
-                this.isPipelineEdit = true;
+                this.isPipelineNameEdit = true;
+                this.namingDialog = true;
+            },
+            toCreatePipeline() {
+                this.newPipelineName = "New Pipeline";
+                this.isPipelineNameEdit = false;
+                this.namingDialog = true;
             },
             savePipelineNameChange() {
-                this.handleInput("changePipelineName", this.newPipelineName);
+                if (this.checkPipelineName === "") {
-                this.discardPipelineNameChange();
+                    if (this.isPipelineNameEdit) {
+                        this.handleInput("changePipelineName", this.newPipelineName);
+                    } else {
+                        this.handleInput("addNewPipeline", this.newPipelineName);
+                    }
+                    this.discardPipelineNameChange();
+                }
             },
             discardPipelineNameChange() {
-                this.isPipelineEdit = false;
+                this.namingDialog = false;
+                this.isPipelineNameEdit = false;
                 this.newPipelineName = "";
             },
             duplicatePipeline() {
@@ -227,7 +251,8 @@
                 newCameraName: "",
                 cameraNameError: "",
                 // pipeline edit variables
-                isPipelineEdit: false,
+                isPipelineNameEdit: false,
+                namingDialog: false,
                 newPipelineName: "",
                 duplicateDialog: false,
                 anotherCamera: false,
@@ -241,11 +266,32 @@
         },
         computed: {
             checkCameraName() {
+                let re = new RegExp('^[A-Za-z0-9 _]*[A-Za-z0-9][A-Za-z0-9 _]*$');
                 if (this.newCameraName !== this.cameraList[this.currentCameraIndex]) {
-                    for (let cam in this.cameraList) {
+                    if (re.test(this.newCameraName)) {
-                        if (this.newCameraName === this.cameraList[cam]) {
+                        for (let cam in this.cameraList) {
-                            return "Camera by that name already Exists"
+                            if (this.newCameraName === this.cameraList[cam]) {
+                                return "Camera by that name already Exists"
+                            }
                         }
+                    } else {
+                        return "Camera name can only contain letters, numbers and spaces"
+                    }
+                }
+                return ""
+            },
+            checkPipelineName() {
+                let re = new RegExp('^[A-Za-z0-9 _]*[A-Za-z0-9][A-Za-z0-9 _]*$');
+                if (this.newPipelineName !== this.pipelineList[this.currentPipelineIndex - 1] || this.isPipelineNameEdit === false) {
+                    if (re.test(this.newPipelineName)) {
+                        for (let pipe in this.pipelineList) {
+                            if (this.newPipelineName === this.pipelineList[pipe]) {
+                                return "A pipeline with this name already exists"
+                            }
+                        }
+
+                    } else {
+                        return "Pipeline name can only contain letters, numbers, and spaces"
                     }
                 }
                 return ""

chameleon-client/src/views/CameraViewes/ThresholdTab.vue

@@ -5,15 +5,15 @@
                        @input="handleData('saturation')"/>
         <CVrangeSlider v-model="value.value" name="Value" :min="0" :max="255" @input="handleData('value')"/>
         <v-divider color="darkgray " style="margin-top: 5px"/>
-        <v-btn style="margin: 20px;" tile color="#4baf62" @click="setFunction(1)" small>
+        <v-btn style="margin: 20px;" color="#4baf62" @click="setFunction(1)" small>
             <v-icon>colorize</v-icon>
             Eye drop
         </v-btn>
-        <v-btn style="margin: 20px;" tile color="#4baf62" @click="setFunction(2)" small>
+        <v-btn style="margin: 20px;" color="#4baf62" @click="setFunction(2)" small>
             <v-icon>add</v-icon>
             Expand Selection
         </v-btn>
-        <v-btn style="margin: 20px;" tile color="#4baf62" @click="setFunction(3)" small>
+        <v-btn style="margin: 20px;" color="#4baf62" @click="setFunction(3)" small>
             <v-icon>remove</v-icon>
             Shrink Selection
         </v-btn>

chameleon-server/src/main/java/com/chameleonvision/vision/pipeline/PipelineManager.java

@@ -163,13 +163,14 @@ public class PipelineManager {
         savePipelineConfig(pipeline.settings);
     }
 
-    public void addNewPipeline(boolean is3D) {
+    public void addNewPipeline(boolean is3D, String piplineName) {
         CVPipeline newPipeline;
         if (!is3D) {
             newPipeline = new CVPipeline2d();
         } else {
             newPipeline = new CVPipeline3d();
         }
+        newPipeline.settings.nickname = piplineName;
         newPipeline.settings.index = pipelines.size();
         addPipeline(newPipeline);
     }

chameleon-server/src/main/java/com/chameleonvision/web/SocketHandler.java

@@ -103,15 +103,18 @@ public class SocketHandler {
                         sendFullSettings();
                         break;
                     }
+                    case "addNewPipeline": {
+//                        HashMap<String, Object> data = (HashMap<String, Object>) entry.getValue();
+                        String pipeName = (String) entry.getValue();
+                        // TODO: add to UI selection for new 2d/3d
+                        boolean is3d = false;
+                        currentProcess.pipelineManager.addNewPipeline(is3d, pipeName);
+                        sendFullSettings();
+                        VisionManager.saveCurrentCameraPipelines();
+                        break;
+                    }
                     case "command": {
                         switch ((String) entry.getValue()) {
-                            case "addNewPipeline":
-                                // TODO: add to UI selection for new 2d/3d
-                                boolean is3d = false;
-                                currentProcess.pipelineManager.addNewPipeline(is3d);
-                                sendFullSettings();
-                                VisionManager.saveCurrentCameraPipelines();
-                                break;
                             case "deleteCurrentPipeline":
                                 currentProcess.pipelineManager.deleteCurrentPipeline();
                                 sendFullSettings();
@@ -141,10 +144,10 @@ public class SocketHandler {
                         switch (entry.getKey()) {//Pre field value set
                             case "rotationMode": {//Create new CaptureStaticProperties with new width and height, reset crosshair calib
                                 ImageRotationMode oldRot = currentPipeline.settings.rotationMode;
-                                ImageRotationMode newRot = ImageRotationMode.class.getEnumConstants()[(Integer)entry.getValue()];
+                                ImageRotationMode newRot = ImageRotationMode.class.getEnumConstants()[(Integer) entry.getValue()];
                                 CaptureStaticProperties prop = currentCamera.getProperties().getStaticProperties();
                                 int width, height;
-                                if(oldRot.isRotated()!=newRot.isRotated()){
+                                if (oldRot.isRotated() != newRot.isRotated()) {
                                     width = prop.mode.height;
                                     height = prop.mode.width;
                                     //Creates new video mode with new width and height to create new CaptureStaticProperties and applies it