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

UI Redesign (#22)

Browse Source 
* Rework UI into a new, responsive layout

* Send two streams (only one is currently downscaled)
This commit is contained in:
Declan Freeman-Gleason
2020-07-13 19:34:31 -07:00
committed by GitHub
parent aed92e7132
commit 8b46ad1cab
29 changed files with 945 additions and 559 deletions
Download Patch File Download Diff File Expand all files Collapse all files

113
photon-client/src/views/PipelineViews/ContoursTab.vue
View File

@@ -1,55 +1,58 @@
<template>
<div>
<CVrangeSlider
v-model="contourArea"
name="Area"
:min="0"
:max="100"
:step="0.1"
@input="handlePipelineData('contourArea')"
@rollback="e=> rollback('contourArea',e)"
/>
<CVrangeSlider
v-model="contourRatio"
name="Ratio (W/H)"
:min="0"
:max="100"
:step="0.1"
@input="handlePipelineData('contourRatio')"
@rollback="e=> rollback('contourRatio',e)"
/>
<CVrangeSlider
v-model="contourExtent"
name="Extent"
:min="0"
:max="100"
@input="handlePipelineData('contourExtent')"
@rollback="e=> rollback('contourExtent',e)"
/>
<CVslider
v-model="contourSpecklePercentage"
name="Speckle Rejection"
:min="0"
:max="100"
@input="handlePipelineData('contourSpecklePercentage')"
@rollback="e=> rollback('contourSpecklePercentage',e)"
/>
<CVselect
v-model="contourGroupingMode"
name="Target Group"
:list="['Single','Dual']"
@input="handlePipelineData('targetGroup')"
@rollback="e=> rollback('targetGroup',e)"
/>
<CVselect
v-model="contourIntersection"
name="Target Intersection"
:list="['None','Up','Down','Left','Right']"
:disabled="contourGroupingMode === 0"
@input="handlePipelineData('contourIntersection')"
@rollback="e=> rollback('contourIntersection',e)"
/>
</div>
<div>
<CVrangeSlider
v-model="contourArea"
name="Area"
min="0"
max="100"
step="0.1"
@input="handlePipelineData('contourArea')"
@rollback="e=> rollback('contourArea',e)"
/>
<CVrangeSlider
v-model="contourRatio"
name="Ratio (W/H)"
min="0"
max="100"
step="0.1"
@input="handlePipelineData('contourRatio')"
@rollback="e=> rollback('contourRatio',e)"
/>
<CVrangeSlider
v-model="contourExtent"
name="Extent"
min="0"
max="100"
@input="handlePipelineData('contourExtent')"
@rollback="e=> rollback('contourExtent',e)"
/>
<CVslider
v-model="contourSpecklePercentage"
name="Speckle Rejection"
min="0"
max="100"
:slider-cols="largeBox"
@input="handlePipelineData('contourSpecklePercentage')"
@rollback="e=> rollback('contourSpecklePercentage',e)"
/>
<CVselect
v-model="contourGroupingMode"
name="Target Group"
:select-cols="largeBox"
:list="['Single','Dual']"
@input="handlePipelineData('targetGroup')"
@rollback="e=> rollback('targetGroup',e)"
/>
<CVselect
v-model="contourIntersection"
name="Target Intersection"
:select-cols="largeBox"
:list="['None','Up','Down','Left','Right']"
:disabled="contourGroupingMode === 0"
@input="handlePipelineData('contourIntersection')"
@rollback="e=> rollback('contourIntersection',e)"
/>
</div>
</template>
<script>
@@ -71,6 +74,14 @@
return {}
},
computed: {
largeBox: {
get() {
// Sliders and selectors should be fuller width if we're on screen size medium and
// up and either not in compact mode (because the tab will be 100% screen width),
// or in driver mode (where the card will also be 100% screen width).
return this.$vuetify.breakpoint.mdAndUp && (!this.$store.state.compactMode || this.$store.getters.isDriverMode) ? 10 : 8;
}
},
contourArea: {
get() {
return this.$store.getters.currentPipelineSettings.contourArea