Team2890/PhotonVision
4
0
Fork 0
mirror of https://github.com/PhotonVision/photonvision synced 2026-07-02 02:51:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

added integration with vuex

Browse Source
This commit is contained in:
ori agranat
2019-03-26 22:01:10 +02:00
parent ae5c927d1f
commit 028a75e55a
5 changed files with 55 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
chameleon-client/package-lock.json generated
View File

@@ -3490,8 +3490,7 @@
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
"integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ=",
"dev": true,
"optional": true
"dev": true
},
"coa": {
"version": "2.0.2",
@@ -9672,8 +9671,7 @@
"version": "4.0.8",
"resolved": "https://registry.npmjs.org/rx-lite/-/rx-lite-4.0.8.tgz",
"integrity": "sha1-Cx4Rr4vESDbwSmQH6S2kJGe3lEQ=",
"dev": true,
"optional": true
"dev": true
},
"rx-lite-aggregates": {
"version": "4.0.8",
@@ -13612,8 +13610,7 @@
},
"ansi-regex": {
"version": "2.1.1",
"bundled": true,
"optional": true
"bundled": true
},
"aproba": {
"version": "1.2.0",
@@ -13650,8 +13647,7 @@
},
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"optional": true
"bundled": true
},
"concat-map": {
"version": "0.0.1",
@@ -13660,8 +13656,7 @@
},
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
"optional": true
"bundled": true
},
"core-util-is": {
"version": "1.0.2",
@@ -13764,8 +13759,7 @@
},
"inherits": {
"version": "2.0.3",
"bundled": true,
"optional": true
"bundled": true
},
"ini": {
"version": "1.3.5",
@@ -13775,7 +13769,6 @@
"is-fullwidth-code-point": {
"version": "1.0.0",
"bundled": true,
"optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
@@ -13788,20 +13781,17 @@
"minimatch": {
"version": "3.0.4",
"bundled": true,
"optional": true,
"requires": {
"brace-expansion": "^1.1.7"
}
},
"minimist": {
"version": "0.0.8",
"bundled": true,
"optional": true
"bundled": true
},
"minipass": {
"version": "2.2.4",
"bundled": true,
"optional": true,
"requires": {
"safe-buffer": "^5.1.1",
"yallist": "^3.0.0"
@@ -13818,7 +13808,6 @@
"mkdirp": {
"version": "0.5.1",
"bundled": true,
"optional": true,
"requires": {
"minimist": "0.0.8"
}
@@ -13891,8 +13880,7 @@
},
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"optional": true
"bundled": true
},
"object-assign": {
"version": "4.1.1",
@@ -13902,7 +13890,6 @@
"once": {
"version": "1.4.0",
"bundled": true,
"optional": true,
"requires": {
"wrappy": "1"
}
@@ -13978,8 +13965,7 @@
},
"safe-buffer": {
"version": "5.1.1",
"bundled": true,
"optional": true
"bundled": true
},
"safer-buffer": {
"version": "2.1.2",
@@ -14009,7 +13995,6 @@
"string-width": {
"version": "1.0.2",
"bundled": true,
"optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
@@ -14027,7 +14012,6 @@
"strip-ansi": {
"version": "3.0.1",
"bundled": true,
"optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
@@ -14066,13 +14050,11 @@
},
"wrappy": {
"version": "1.0.2",
"bundled": true,
"optional": true
"bundled": true
},
"yallist": {
"version": "3.0.2",
"bundled": true,
"optional": true
"bundled": true
}
}
},
@@ -18000,6 +17982,11 @@
"integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
"dev": true
},
"vuex": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/vuex/-/vuex-3.1.0.tgz",
"integrity": "sha512-mdHeHT/7u4BncpUZMlxNaIdcN/HIt1GsGG5LKByArvYG/v6DvHcOxvDCts+7SRdCoIRGllK8IMZvQtQXLppDYg=="
},
"watchpack": {
"version": "1.6.0",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.6.0.tgz",

1
chameleon-client/package.json
View File

@@ -12,6 +12,7 @@
"vue": "^2.6.6",
"vue-native-websocket": "^2.0.12",
"vue-router": "^3.0.2",
"vuex": "^3.1.0",
"webpack": "^4.29.6"
},
"devDependencies": {

22
chameleon-client/src/components/InputTab.vue
View File

@@ -1,12 +1,11 @@
<template>
<div id="InputTab">
<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>
<chslider class="spacing" title="exposure" :parentData="$store.getters.exposure" @input="onChange('exposure',$event)"></chslider>
<chslider class="spacing" title="Brightness" :parentData="$store.getters.brightness" @input="onChange('brightness',$event)"></chslider>
<chselect class="spacing" title="Orientation" :list="['Normal','Inverted']" :parentData="$store.getters.orientation" @input="onChange('orientation',$event)"></chselect>
<chselect class="spacing" title="Resolution" :list="['idk']" :parentData="$store.getters.resolution" @input="onChange('resolution',$event)"></chselect>
</div>
</template>
<script>
@@ -16,12 +15,6 @@ import chselect from './ch-select.vue'
name: 'InputTab',
data () {
return{
values:{
exposure:0,
brightness:0,
orientation:0,
resolution:0
}
}
},
components: {
@@ -29,17 +22,16 @@ import chselect from './ch-select.vue'
chselect
},
methods: {
onChange(i) {
console.log(i);
onChange: function(key,event) {
this.$store.commit(key, event);
console.log(this.$store.getters);
}
}
}
</script>
<style scoped>
.spacing{
margin-top: 20px;
}
</style>

2
chameleon-client/src/main.js
View File

@@ -6,6 +6,7 @@ import router from "./routes";
import '../theme/index.less';
import VueNativeSock from 'vue-native-websocket';
import locale from 'iview/dist/locale/en-US';
import {store} from './store'
Vue.use(VueRouter);
Vue.use(iView , { locale });
@@ -14,5 +15,6 @@ Vue.config.productionTip = false
new Vue({
router,
store,
render: h => h(App)
}).$mount('#app')

29
chameleon-client/src/store.js Normal file
View File

@@ -0,0 +1,29 @@
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex);
const set = key => (state,val) =>{
state[key] = val
}
export const store = new Vuex.Store({
state:{
exposure:0,
brightness:0,
orientation:0,
resolution:0
},
mutations:{
brightness: set('brightness'),
exposure: set('exposure'),
orientation:set('orientation'),
resolution: set('resolution')
},
getters:{
brightness: state => state.brightness,
exposure: state => state.exposure,
orientation: state => state.orientation,
resolution: state => state.resolution
},
});