added message pack dependency

This commit is contained in:
ori agranat
2019-10-10 22:40:51 +03:00
parent 8748dd2503
commit 5421bb09f7
7 changed files with 74 additions and 49 deletions

View File

@@ -2,7 +2,7 @@
<div>
<v-tooltip :right="right" :bottom="!right" nudge-right="10">
<template v-slot:activator="{ on }">
<v-icon @click="handleClick" v-on="on" :color="color">{{text}}</v-icon>
<v-icon :class="hoverClass" @click="handleClick" v-on="on" :color="color">{{text}}</v-icon>
</template>
<span>{{tooltip}}</span>
</v-tooltip>
@@ -12,7 +12,7 @@
<script>
export default {
name: 'Icon',
props:['color','tooltip','text','right'],
props:['color','tooltip','text','right','hover'],
data() {
return {
@@ -22,10 +22,20 @@
handleClick(){
this.$emit('click');
}
}
},
computed:{
hoverClass(){
if(this.hover !== undefined){
return "hover";
}
}
},
}
</script>
<style lang="" scoped>
<style scoped>
.hover:hover{
color: white !important;
}
</style>

View File

@@ -4,9 +4,12 @@ import router from './router'
import store from './store'
import vuetify from './plugins/vuetify';
import VueNativeSock from 'vue-native-websocket';
import msgPack from 'msgpack5';
Vue.config.productionTip = false;
// Vue.use(VueNativeSock,'ws://' + location.host + '/websocket',{format: 'json'});
Vue.use(VueNativeSock,'ws://'+location.hostname+':8888/websocket',{format:'JSON'});
Vue.prototype.$msgPack = msgPack;
new Vue({
router,
store,

View File

@@ -8,7 +8,7 @@
</div>
</v-col>
<v-col :cols="1">
<CVicon color="white" text="edit" tooltip="Edit camera name"></CVicon>
<CVicon color="#c5c5c5" hover text="edit" @click="test" tooltip="Edit camera name"></CVicon>
</v-col>
<v-col :cols="3" class="colsClass">
<CVselect name="Pipeline" :list="pipelineList" v-model="currentPipelineIndex"></CVselect>
@@ -21,12 +21,12 @@
<v-list dense>
<v-list-item @click="test">
<v-list-item-title>
<CVicon color="white" :right="true" text="edit" tooltip="Edit pipeline name"></CVicon>
<CVicon color="#c5c5c5" :right="true" text="edit" tooltip="Edit pipeline name"></CVicon>
</v-list-item-title>
</v-list-item>
<v-list-item @click="test">
<v-list-item-title>
<CVicon color="white" :right="true" text="add" tooltip="Add new pipeline"></CVicon>
<CVicon color="#c5c5c5" :right="true" text="add" tooltip="Add new pipeline"></CVicon>
</v-list-item-title>
</v-list-item>
<v-list-item @click="test">
@@ -36,7 +36,7 @@
</v-list-item>
<v-list-item @click="test">
<v-list-item-title>
<CVicon color="white" :right="true" text="mdi-content-copy" tooltip="Duplicate pipeline"></CVicon>
<CVicon color="#c5c5c5" :right="true" text="mdi-content-copy" tooltip="Duplicate pipeline"></CVicon>
</v-list-item-title>
</v-list-item>
</v-list>
@@ -63,7 +63,8 @@
<v-tab>Threshold</v-tab>
</v-tabs>
<div class="videoClass">
<img :src="steamAdress">
<img v-if="cameraList.length > 0" :src="steamAdress">
<span v-else>No Cameras Are connected</span>
</div>
<h5 id="Point">{{point}}</h5>
</div>
@@ -91,7 +92,8 @@ import CVicon from '../components/cv-icon'
},
methods:{
test(){
let o = this.$msgPack().encode("dasd");
console.log(o);
}
},
data() {
@@ -100,16 +102,18 @@ import CVicon from '../components/cv-icon'
}
},
computed:{
selectedComponent(){
switch(this.selectedTab){
case 0:
return "InputTab";
case 1:
return "ThresholdTab";
case 2:
return "ContoursTab";
case 3:
return "OutputTab";
selectedComponent:{
get(){
switch(this.selectedTab){
case 0:
return "InputTab";
case 1:
return "ThresholdTab";
case 2:
return "ContoursTab";
case 3:
return "OutputTab";
}
}
},
point:{

View File

@@ -16,7 +16,6 @@ import CVswitch from '../../components/cv-switch'
props:['value'],
components:{
CVslider,
rangeSlider,
CVselect,
CVswitch
},