Features/bottombar redux #97
@ -1,17 +1,11 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
|
import DefaultValues from '../../../configuration/defaultValues';
|
||||||
import './../../../css/sidebar/widgets/verticalWidget.css';
|
import './../../../css/sidebar/widgets/verticalWidget.css';
|
||||||
|
|
||||||
class VerticalWidget extends React.Component<any, any> {
|
class VerticalWidget extends React.Component<any, any> {
|
||||||
incrementValue = (value: any) => {
|
// Active Channel
|
||||||
this.props.dispatch({ type: 'vertical/increaseValue', payload: value});
|
increaseChannel = () => {
|
||||||
}
|
|
||||||
|
|
||||||
decrementValue = (value: any) => {
|
|
||||||
this.props.dispatch({ type: 'vertical/decreaseValue' , payload: value});
|
|
||||||
}
|
|
||||||
|
|
||||||
increaseChannel = () => {
|
|
||||||
this.props.dispatch({type: 'vertical/increaseChannel'});
|
this.props.dispatch({type: 'vertical/increaseChannel'});
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -19,6 +13,24 @@ class VerticalWidget extends React.Component<any, any> {
|
|||||||
this.props.dispatch({type: 'vertical/decreaseChannel'});
|
this.props.dispatch({type: 'vertical/decreaseChannel'});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Vertical Offset
|
||||||
|
incrementVerticalOffset = () => {
|
||||||
|
this.props.dispatch({ type: 'vertical/increaseVerticalOffset'});
|
||||||
|
}
|
||||||
|
|
||||||
|
decrementVerticalOffset = () => {
|
||||||
|
this.props.dispatch({ type: 'vertical/decreaseVerticalOffset'});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Time Per Division
|
||||||
|
incrementTimePerDivision = () => {
|
||||||
|
this.props.dispatch({type: 'vertical/increaseTimePerDivision'});
|
||||||
|
}
|
||||||
|
|
||||||
|
decrementTimePerDivision = () => {
|
||||||
|
this.props.dispatch({type: 'vertical/decreaseTimePerDivision'});
|
||||||
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<div className="VerticalWidget">
|
<div className="VerticalWidget">
|
||||||
@ -34,9 +46,9 @@ class VerticalWidget extends React.Component<any, any> {
|
|||||||
</button>
|
</button>
|
||||||
<label
|
<label
|
||||||
className="AdjustChannelBlockValue"
|
className="AdjustChannelBlockValue"
|
||||||
style={{color: this.props.verticalWidget.channelColorsList[this.props.verticalWidget.channel-1]}}
|
style={{color: this.props.verticalWidget.channelColorsList[this.props.verticalWidget.activeChannel-1]}}
|
||||||
>
|
>
|
||||||
CH{this.props.verticalWidget.channel.toString()}
|
CH{this.props.verticalWidget.activeChannel.toString()}
|
||||||
</label>
|
</label>
|
||||||
<button
|
<button
|
||||||
className="PlusButton"
|
className="PlusButton"
|
||||||
@ -45,40 +57,40 @@ class VerticalWidget extends React.Component<any, any> {
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="VerticalWidgetAdjustBlock-Value1">
|
<div className="VerticalWidgetAdjustBlock-TimePerDivision">
|
||||||
<button
|
<button
|
||||||
className="MinusButton"
|
className="MinusButton"
|
||||||
onClick={() => this.decrementValue(1)}>
|
onClick={() => this.decrementTimePerDivision}>
|
||||||
-
|
-
|
||||||
</button>
|
</button>
|
||||||
<label
|
<label
|
||||||
className="AdjustValueBlockValue1"
|
className="AdjustValueBlockTimePerDivision"
|
||||||
style={{color: this.props.verticalWidget.channelColorsList[this.props.verticalWidget.channel-1]}}
|
style={{color: this.props.verticalWidget.channelColorsList[this.props.verticalWidget.activeChannel-1]}}
|
||||||
>
|
>
|
||||||
{this.props.verticalWidget.value1.toString()}{"V/div"}
|
{DefaultValues.x1ProbeValues[this.props.verticalWidget.timePerDivisionIndex[this.props.verticalWidget.activeChannel-1]]}
|
||||||
</label>
|
</label>
|
||||||
<button
|
<button
|
||||||
className="PlusButton"
|
className="PlusButton"
|
||||||
onClick={() => this.incrementValue(1)}>
|
onClick={() => this.incrementTimePerDivision}>
|
||||||
+
|
+
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="VerticalWidgetAdjustBlock-Value2">
|
<div className="VerticalWidgetAdjustBlock-VerticalOffset">
|
||||||
<button
|
<button
|
||||||
className="MinusButton"
|
className="MinusButton"
|
||||||
onClick={() => this.decrementValue(2)}>
|
onClick={() => this.decrementVerticalOffset}>
|
||||||
-
|
-
|
||||||
</button>
|
</button>
|
||||||
<label
|
<label
|
||||||
className="AdjustValueBlockValue2"
|
className="AdjustValueBlockVerticalOffset"
|
||||||
style={{color: this.props.verticalWidget.channelColorsList[this.props.verticalWidget.channel-1]}}
|
style={{color: this.props.verticalWidget.channelColorsList[this.props.verticalWidget.activeChannel-1]}}
|
||||||
>
|
>
|
||||||
{this.props.verticalWidget.value2.toString()}{"mV"}
|
{this.props.verticalWidget.verticalOffset[this.props.verticalWidget.activeChannel-1].toString()}{"mV"}
|
||||||
</label>
|
</label>
|
||||||
<button
|
<button
|
||||||
className="PlusButton"
|
className="PlusButton"
|
||||||
onClick={() => this.incrementValue(2)}>
|
onClick={() => this.incrementVerticalOffset}>
|
||||||
+
|
+
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
37
Software/waveview/src/configuration/defaultValues.tsx
Normal file
37
Software/waveview/src/configuration/defaultValues.tsx
Normal file
@ -0,0 +1,37 @@
|
|||||||
|
const x1ProbeValues = [
|
||||||
|
"10V/div",
|
||||||
|
"5V/div",
|
||||||
|
"2V/div",
|
||||||
|
"1V/div",
|
||||||
|
"500mV/div",
|
||||||
|
"200mV/div",
|
||||||
|
"100mV/div",
|
||||||
|
"50mV/div",
|
||||||
|
"20mV/div",
|
||||||
|
"10mV/div",
|
||||||
|
"5mV/div",
|
||||||
|
"2mV/div",
|
||||||
|
"1mV/div"
|
||||||
|
];
|
||||||
|
const x10ProbeValues = [
|
||||||
|
"100V/div",
|
||||||
|
"50V/div",
|
||||||
|
"20V/div",
|
||||||
|
"10V/div",
|
||||||
|
"5V/div",
|
||||||
|
"2V/div",
|
||||||
|
"1V/div",
|
||||||
|
"500mV/div",
|
||||||
|
"200mV/div",
|
||||||
|
"100mV/div",
|
||||||
|
"50mV/div",
|
||||||
|
"20mV/div",
|
||||||
|
"10mV/div"
|
||||||
|
];
|
||||||
|
// 13 different voltages per divison presets
|
||||||
|
// Start at x1ProbeValues[6] and change accordingly
|
||||||
|
|
||||||
|
export default {
|
||||||
|
x1ProbeValues,
|
||||||
|
x10ProbeValues
|
||||||
|
};
|
@ -15,20 +15,20 @@
|
|||||||
padding-right: 2vw;
|
padding-right: 2vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
.VerticalWidgetAdjustBlock-Value1 {
|
.VerticalWidgetAdjustBlock-TimePerDivision {
|
||||||
margin-top: 1vh;
|
margin-top: 1vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
.AdjustValueBlockValue1 {
|
.AdjustValueBlockTimePerDivision {
|
||||||
padding-left: 2vw;
|
padding-left: 2vw;
|
||||||
padding-right: 2vw;
|
padding-right: 2vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
.VerticalWidgetAdjustBlock-Value2 {
|
.VerticalWidgetAdjustBlock-VerticalOffset {
|
||||||
margin-top: 1vh;
|
margin-top: 1vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
.AdjustValueBlockValue2 {
|
.AdjustValueBlockVerticalOffset {
|
||||||
padding-left: 2vw;
|
padding-left: 2vw;
|
||||||
padding-right: 2vw;
|
padding-right: 2vw;
|
||||||
}
|
}
|
@ -1,88 +1,47 @@
|
|||||||
|
import DefaultValues from '../../configuration/defaultValues';
|
||||||
|
|
||||||
const initialState = {
|
const initialState = {
|
||||||
channel: 1,
|
activeChannel: 1,
|
||||||
channelColorsList: ["#EBFF00", "#00FF19", "#0075FF", "#FF0000"],
|
channelColorsList: ["#EBFF00", "#00FF19", "#0075FF", "#FF0000"],
|
||||||
value1: 0,
|
timePerDivision: [DefaultValues.x1ProbeValues[6], DefaultValues.x1ProbeValues[6], DefaultValues.x1ProbeValues[6], DefaultValues.x1ProbeValues[6]],
|
||||||
value2: 0
|
timePerDivisionIndex: [6, 6, 6, 6],
|
||||||
|
verticalOffset: [0, 0, 0, 0]
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function(state = initialState, action: {type: any, payload: any}) {
|
export default function(state = initialState, action: {type: any, payload: any}) {
|
||||||
switch(action.type) {
|
switch(action.type) {
|
||||||
case "vertical/increaseChannel":
|
case "vertical/increaseChannel":
|
||||||
if (state.channel >= 4) {
|
if (state.activeChannel >= 4) {
|
||||||
return {
|
return { ...state }
|
||||||
channel: state.channel,
|
|
||||||
channelColorsList: state.channelColorsList,
|
|
||||||
value1: state.value1,
|
|
||||||
value2: state.value2
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
channel: state.channel + 1,
|
...state,
|
||||||
channelColorsList: state.channelColorsList,
|
activeChannel: state.activeChannel + 1
|
||||||
value1: state.value1,
|
|
||||||
value2: state.value2
|
|
||||||
};
|
};
|
||||||
case "vertical/decreaseChannel":
|
case "vertical/decreaseChannel":
|
||||||
if (state.channel == 1) {
|
if (state.activeChannel == 1) {
|
||||||
return {
|
return { ...state }
|
||||||
channel: state.channel,
|
|
||||||
channelColorsList: state.channelColorsList,
|
|
||||||
value1: state.value1,
|
|
||||||
value2: state.value2
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
channel: state.channel - 1,
|
...state,
|
||||||
channelColorsList: state.channelColorsList,
|
activeChannel: state.activeChannel - 1
|
||||||
value1: state.value1,
|
|
||||||
value2: state.value2
|
|
||||||
};
|
};
|
||||||
case "vertical/increaseValue":
|
case "vertical/increaseVerticalOffset":
|
||||||
if (action.payload == 1) {
|
return { ...state }
|
||||||
return {
|
// Decrease vertical offset
|
||||||
channel: state.channel,
|
case "vertical/decreaseVerticalOffset":
|
||||||
channelColorsList: state.channelColorsList,
|
return { ...state }
|
||||||
value1: state.value1 + 1,
|
// Decrease vertical offset
|
||||||
value2: state.value2
|
case "vertical/increaseTimePerDivision":
|
||||||
}
|
if (state.timePerDivisionIndex[state.activeChannel - 1] >= 12) {
|
||||||
}
|
return { ...state }
|
||||||
else if (action.payload == 2) {
|
|
||||||
return {
|
|
||||||
channel: state.channel,
|
|
||||||
channelColorsList: state.channelColorsList,
|
|
||||||
value1: state.value1,
|
|
||||||
value2: state.value2 + 1
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else return {
|
|
||||||
channel: state.channel,
|
|
||||||
channelColorsList: state.channelColorsList,
|
|
||||||
value1: state.value1,
|
|
||||||
value2: state.value2
|
|
||||||
};
|
};
|
||||||
case "vertical/decreaseValue":
|
// Increase time per division
|
||||||
if (action.payload == 1) {
|
case "vertical/decreaseTimePerDivision":
|
||||||
return {
|
if (state.timePerDivisionIndex[state.activeChannel - 1] == 0) {
|
||||||
channel: state.channel,
|
return { ...state }
|
||||||
channelColorsList: state.channelColorsList,
|
|
||||||
value1: state.value1 - 1,
|
|
||||||
value2: state.value2
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else if (action.payload == 2) {
|
|
||||||
return {
|
|
||||||
channel: state.channel,
|
|
||||||
channelColorsList: state.channelColorsList,
|
|
||||||
value1: state.value1,
|
|
||||||
value2: state.value2 - 1
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else return {
|
|
||||||
channel: state.channel,
|
|
||||||
channelColorsList: state.channelColorsList,
|
|
||||||
value1: state.value1,
|
|
||||||
value2: state.value2
|
|
||||||
};
|
};
|
||||||
|
// Decrease time per division
|
||||||
default:
|
default:
|
||||||
return state;
|
return state;
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user