Toggle mode

This commit is contained in:
Omer
2019-11-25 01:08:08 +02:00
parent a0d180d538
commit 8e28ac8339
2 changed files with 29 additions and 4 deletions

View File

@@ -21,6 +21,7 @@ export default new Vuex.Store({
exposure: 0,
brightness: 0,
orientation: 0,
isColorPick: false,
hue: [0, 15],
saturation: [0, 15],
value: [0, 25],

View File

@@ -1,9 +1,17 @@
<template>
<div>
<CVrangeSlider v-model="value.hue" name="Hue" :min="0" :max="180" @input="handleData('hue')"/>
<div>
<CVswitch v-model="value.isColorPick" name="Colorpick Calibration"/>
<v-divider color="white"/>
<CVrangeSlider v-model="value.hue" name="Hue" :min="0" :max="180" @input="handleData('hue')" :disabled="isAutomaticHSV"/>
<CVrangeSlider v-model="value.saturation" name="Saturation" :min="0" :max="255"
@input="handleData('saturation')"/>
<CVrangeSlider v-model="value.value" name="Value" :min="0" :max="255" @input="handleData('value')"/>
<v-divider color="white"/>
<v-btn style="margin: 20px;" tile color="#4baf62" :disabled="isManualHSV">
<v-icon>C</v-icon>
Colorpick Calibration
</v-btn>
<v-divider color="white"/>
<CVswitch v-model="value.erode" name="Erode" @input="handleData('erode')"/>
<CVswitch v-model="value.dilate" name="Dilate" @input="handleData('dilate')"/>
</div>
@@ -23,9 +31,25 @@ import CVswitch from '../../components/cv-switch'
return {
}
},
computed:{
computed: {
isAutomaticHSV() {
if (typeof this.pipeline.isColorPick === "boolean") {
return this.pipeline.isColorPick;
}
},
pipeline: {
get() {
return this.$store.state.pipeline;
}
},
isManualHSV()
{
if (typeof this.pipeline.isColorPick === "boolean") {
return !this.pipeline.isColorPick;
}
},
},
methods:{
methods:{
handleData(val){
this.handleInput(val,this.value[val]);
this.$emit('update')