commit 525d9023c01f02b22655e267dd66f6dfc119274c parent e04da180562dd6244ea009cd231d59679f82602d Author: therealFIGBERT <figbertwelner@gmail.com> Date: Wed, 27 Nov 2019 22:10:33 -0800 Rename folders to better describe contents Diffstat:
15 files changed, 319 insertions(+), 319 deletions(-)
diff --git a/src/components/App.js b/src/components/App.js @@ -1,7 +1,7 @@ import React from 'react'; -import { ModeSelect } from "./complex/modeSelect"; -import { SimpleCalc } from "./complex/simpleCalc"; -import { AngSizeCalc } from "./complex/angSize"; +import { ModeSelect } from "./highLevel/modeSelect"; +import { SimpleCalc } from "./highLevel/simpleCalc"; +import { AngSizeCalc } from "./highLevel/angSize"; export class App extends React.Component { constructor(props) { diff --git a/src/components/complex/angSize.js b/src/components/complex/angSize.js @@ -1,155 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import { CalcOut } from "../simple/calcOut"; -import { Pad } from "../simple/pad"; - -export class AngSizeCalc extends React.Component { - constructor(props) { - super(props); - this.state = { - output: '', - aVal: '', - aTruth: false, - rVal: '', - rTruth: false, - dVal: '', - dTruth: false - }; - this.onChange = this.onChange.bind(this); - this.onClick = this.onClick.bind(this); - this.calcAngle = this.calcAngle.bind(this); - this.calcSize = this.calcSize.bind(this); - this.calcDistance = this.calcDistance.bind(this); - } - - onClick(object) { - const objectID = object.target.value; - if (objectID === '⍺') { - if (!this.state.aTruth && !(this.state.rTruth && this.state.dTruth)) { - this.setState({ - aVal: '', - aTruth: !this.state.aTruth, - output: '' - }); - } else if (this.state.aTruth) { - this.setState({ - aVal: '', - aTruth: !this.state.aTruth, - output: '' - }); - } - } else if (objectID === 'r') { - if (!this.state.rTruth && !(this.state.aTruth && this.state.dTruth)) { - this.setState({ - rVal: '', - rTruth: !this.state.rTruth, - output: '' - }); - } else if (this.state.rTruth) { - this.setState({ - rVal: '', - rTruth: !this.state.rTruth, - output: '' - }); - } - } else if (objectID === 'd') { - if (!this.state.dTruth && !(this.state.aTruth && this.state.rTruth)) { - this.setState({ - dVal: '', - dTruth: !this.state.dTruth, - output: '' - }); - } else if (this.state.dTruth) { - this.setState({ - dVal: '', - dTruth: !this.state.dTruth, - output: '' - }); - } - } - } - - onChange(object) { - const value = object.target.value, - name = object.target.name; - if (name === '⍺') { - this.setState({ aVal: value }, () => { - if (this.state.rTruth) { - this.calcDistance() - } else if (this.state.dTruth) { - this.calcSize() - } - }); - } else if (name === 'r') { - this.setState({ rVal: value }, () => { - if (this.state.aTruth) { - this.calcDistance() - } else if (this.state.dTruth) { - this.calcAngle() - } - }); - } else if (name === 'd') { - this.setState({ dVal: value }, () => { - if (this.state.aTruth) { - this.calcSize() - } else if (this.state.rTruth) { - this.calcAngle() - } - }); - } - } - - calcDistance() { - const size = Number(this.state.rVal), - angle = Number(this.state.aVal), - distance = (180 * size) / (3.14 * angle), - message = 'd = ' + distance; - this.setState({ - output: message - }); - } - - calcSize() { - const angle = Number(this.state.aVal), - distance = Number(this.state.dVal), - size = (angle * 3.14 * distance) / 180, - message = 'r = ' + size; - this.setState({ - output: message - }); - } - - calcAngle() { - const size = Number(this.state.rVal), - distance = Number(this.state.dVal), - angle = (180 * size) / (3.14 * distance), - message = '⍺ = ' + angle; - this.setState({ - output: message - }); - } - - render() { - return ( - <div> - <CalcOut mode={this.props.mode} output={this.state.output} /> - <Pad - type={'large'} - mode={this.props.mode} - buttonValues={['⍺', 'r', 'd', 'select']} - disabledTruths={[this.state.aTruth, this.state.rTruth, this.state.dTruth]} - displayValues={['⍺', 'r', 'd', '…']} - textValues={[this.state.aVal, this.state.rVal, this.state.dVal]} - onClick={this.onClick} - onChange={this.onChange} - onModeClick={this.props.onModeChange} - /> - </div> - ); - } -} - -AngSizeCalc.propTypes = { - mode: PropTypes.string.isRequired, - onModeChange: PropTypes.func.isRequired -}; -\ No newline at end of file diff --git a/src/components/complex/modeSelect.js b/src/components/complex/modeSelect.js @@ -1,28 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import { CalcOut } from "../simple/calcOut"; -import { Pad } from "../simple/pad"; - -const values = ['basic', 'angSize', 'consecNum', 'simultaneousEQ', 'polyAng'], - displayValues = ['Simple Calculator', 'Angular/Real Size', 'Consecutive Number', 'Simultaneous Equations', 'Polygon Angles']; - -export class ModeSelect extends React.Component { - render() { - return ( - <div> - <CalcOut mode={this.props.mode} /> - <Pad - type={'large'} - mode={this.props.mode} - buttonValues={values} - displayValues={displayValues} - onClick={this.props.onButtonPress} - style={{alignContent: 'center'}} - /> - </div> - ); - } -} -ModeSelect.propTypes = { - mode: PropTypes.string.isRequired -}; -\ No newline at end of file diff --git a/src/components/complex/simpleCalc.js b/src/components/complex/simpleCalc.js @@ -1,130 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import { CalcOut } from "../simple/calcOut"; -import { Pad } from "../simple/pad"; - -const buttonValues = [ - ['AC', 'DEL', '%', '÷'], - ['7', '8', '9', '×'], - ['4', '5', '6', '–'], - ['1', '2', '3', '+'], - ['…', '0', '.', '='] -]; - -export class SimpleCalc extends React.Component { - constructor(props) { - super(props); - this.state = { - output: 0, - input: '', - justSolved: false - }; - this.onButtonPress = this.onButtonPress.bind(this); - this.addDigit = this.addDigit.bind(this); - this.equate = this.equate.bind(this); - this.delete = this.delete.bind(this); - this.clear = this.clear.bind(this); - } - - onButtonPress(object) { - let value = object.target.value; - switch (value) { - case 'AC': - this.clear(); - break; - case 'DEL': - this.delete(); - break; - case '=': - this.equate(); - break; - case undefined: - break; - default: - this.addDigit(value); - } - } - - addDigit(buttonVal) { - if (this.state.justSolved) { - this.setState({ - output: 0, - input: '', - justSolved: false - }); - } - let value; - switch (buttonVal) { - case '÷': - value = '/'; - break; - case '–': - value = '-'; - break; - case '×': - value = '*'; - break; - default: - value = buttonVal; - } - const newInput = this.state.input + value; - this.setState({ - input: newInput - }); - } - - delete() { - this.setState({ - input: this.state.input.slice(0,-1) - }); - } - - clear() { - this.setState({ - output: 0, - input: '' - }); - } - - equate() { - if (!this.state.justSolved) { - let final; - if (!isNaN(Number(this.state.input.slice(-1)))) { - // eslint-disable-next-line - final = eval(this.state.input); - if (final == null || isNaN(final)) { - final = 'ERROR'; - } - } else { - final = 'ERROR'; - } - this.setState({ - output: final, - input: '', - justSolved: true - }); - } - } - - render() { - return ( - <div> - <CalcOut - mode={this.props.mode} - output={this.state.output} - input={this.state.input} - /> - <Pad - type={'small'} - buttonValues={buttonValues} - onClick={this.onButtonPress} - onModeClick={this.props.onModeChange} - /> - </div> - ); - } -} -SimpleCalc.propTypes = { - mode: PropTypes.string.isRequired, - onModeChange: PropTypes.func -}; -\ No newline at end of file diff --git a/src/components/highLevel/angSize.js b/src/components/highLevel/angSize.js @@ -0,0 +1,155 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { CalcOut } from "../lowLevel/calcOut"; +import { Pad } from "../lowLevel/pad"; + +export class AngSizeCalc extends React.Component { + constructor(props) { + super(props); + this.state = { + output: '', + aVal: '', + aTruth: false, + rVal: '', + rTruth: false, + dVal: '', + dTruth: false + }; + this.onChange = this.onChange.bind(this); + this.onClick = this.onClick.bind(this); + this.calcAngle = this.calcAngle.bind(this); + this.calcSize = this.calcSize.bind(this); + this.calcDistance = this.calcDistance.bind(this); + } + + onClick(object) { + const objectID = object.target.value; + if (objectID === '⍺') { + if (!this.state.aTruth && !(this.state.rTruth && this.state.dTruth)) { + this.setState({ + aVal: '', + aTruth: !this.state.aTruth, + output: '' + }); + } else if (this.state.aTruth) { + this.setState({ + aVal: '', + aTruth: !this.state.aTruth, + output: '' + }); + } + } else if (objectID === 'r') { + if (!this.state.rTruth && !(this.state.aTruth && this.state.dTruth)) { + this.setState({ + rVal: '', + rTruth: !this.state.rTruth, + output: '' + }); + } else if (this.state.rTruth) { + this.setState({ + rVal: '', + rTruth: !this.state.rTruth, + output: '' + }); + } + } else if (objectID === 'd') { + if (!this.state.dTruth && !(this.state.aTruth && this.state.rTruth)) { + this.setState({ + dVal: '', + dTruth: !this.state.dTruth, + output: '' + }); + } else if (this.state.dTruth) { + this.setState({ + dVal: '', + dTruth: !this.state.dTruth, + output: '' + }); + } + } + } + + onChange(object) { + const value = object.target.value, + name = object.target.name; + if (name === '⍺') { + this.setState({ aVal: value }, () => { + if (this.state.rTruth) { + this.calcDistance() + } else if (this.state.dTruth) { + this.calcSize() + } + }); + } else if (name === 'r') { + this.setState({ rVal: value }, () => { + if (this.state.aTruth) { + this.calcDistance() + } else if (this.state.dTruth) { + this.calcAngle() + } + }); + } else if (name === 'd') { + this.setState({ dVal: value }, () => { + if (this.state.aTruth) { + this.calcSize() + } else if (this.state.rTruth) { + this.calcAngle() + } + }); + } + } + + calcDistance() { + const size = Number(this.state.rVal), + angle = Number(this.state.aVal), + distance = (180 * size) / (3.14 * angle), + message = 'd = ' + distance; + this.setState({ + output: message + }); + } + + calcSize() { + const angle = Number(this.state.aVal), + distance = Number(this.state.dVal), + size = (angle * 3.14 * distance) / 180, + message = 'r = ' + size; + this.setState({ + output: message + }); + } + + calcAngle() { + const size = Number(this.state.rVal), + distance = Number(this.state.dVal), + angle = (180 * size) / (3.14 * distance), + message = '⍺ = ' + angle; + this.setState({ + output: message + }); + } + + render() { + return ( + <div> + <CalcOut mode={this.props.mode} output={this.state.output} /> + <Pad + type={'large'} + mode={this.props.mode} + buttonValues={['⍺', 'r', 'd', 'select']} + disabledTruths={[this.state.aTruth, this.state.rTruth, this.state.dTruth]} + displayValues={['⍺', 'r', 'd', '…']} + textValues={[this.state.aVal, this.state.rVal, this.state.dVal]} + onClick={this.onClick} + onChange={this.onChange} + onModeClick={this.props.onModeChange} + /> + </div> + ); + } +} + +AngSizeCalc.propTypes = { + mode: PropTypes.string.isRequired, + onModeChange: PropTypes.func.isRequired +}; +\ No newline at end of file diff --git a/src/components/highLevel/modeSelect.js b/src/components/highLevel/modeSelect.js @@ -0,0 +1,28 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { CalcOut } from "../lowLevel/calcOut"; +import { Pad } from "../lowLevel/pad"; + +const values = ['basic', 'angSize', 'consecNum', 'simultaneousEQ', 'polyAng'], + displayValues = ['Simple Calculator', 'Angular/Real Size', 'Consecutive Number', 'Simultaneous Equations', 'Polygon Angles']; + +export class ModeSelect extends React.Component { + render() { + return ( + <div> + <CalcOut mode={this.props.mode} /> + <Pad + type={'large'} + mode={this.props.mode} + buttonValues={values} + displayValues={displayValues} + onClick={this.props.onButtonPress} + style={{alignContent: 'center'}} + /> + </div> + ); + } +} +ModeSelect.propTypes = { + mode: PropTypes.string.isRequired +}; +\ No newline at end of file diff --git a/src/components/highLevel/simpleCalc.js b/src/components/highLevel/simpleCalc.js @@ -0,0 +1,130 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { CalcOut } from "../lowLevel/calcOut"; +import { Pad } from "../lowLevel/pad"; + +const buttonValues = [ + ['AC', 'DEL', '%', '÷'], + ['7', '8', '9', '×'], + ['4', '5', '6', '–'], + ['1', '2', '3', '+'], + ['…', '0', '.', '='] +]; + +export class SimpleCalc extends React.Component { + constructor(props) { + super(props); + this.state = { + output: 0, + input: '', + justSolved: false + }; + this.onButtonPress = this.onButtonPress.bind(this); + this.addDigit = this.addDigit.bind(this); + this.equate = this.equate.bind(this); + this.delete = this.delete.bind(this); + this.clear = this.clear.bind(this); + } + + onButtonPress(object) { + let value = object.target.value; + switch (value) { + case 'AC': + this.clear(); + break; + case 'DEL': + this.delete(); + break; + case '=': + this.equate(); + break; + case undefined: + break; + default: + this.addDigit(value); + } + } + + addDigit(buttonVal) { + if (this.state.justSolved) { + this.setState({ + output: 0, + input: '', + justSolved: false + }); + } + let value; + switch (buttonVal) { + case '÷': + value = '/'; + break; + case '–': + value = '-'; + break; + case '×': + value = '*'; + break; + default: + value = buttonVal; + } + const newInput = this.state.input + value; + this.setState({ + input: newInput + }); + } + + delete() { + this.setState({ + input: this.state.input.slice(0,-1) + }); + } + + clear() { + this.setState({ + output: 0, + input: '' + }); + } + + equate() { + if (!this.state.justSolved) { + let final; + if (!isNaN(Number(this.state.input.slice(-1)))) { + // eslint-disable-next-line + final = eval(this.state.input); + if (final == null || isNaN(final)) { + final = 'ERROR'; + } + } else { + final = 'ERROR'; + } + this.setState({ + output: final, + input: '', + justSolved: true + }); + } + } + + render() { + return ( + <div> + <CalcOut + mode={this.props.mode} + output={this.state.output} + input={this.state.input} + /> + <Pad + type={'small'} + buttonValues={buttonValues} + onClick={this.onButtonPress} + onModeClick={this.props.onModeChange} + /> + </div> + ); + } +} +SimpleCalc.propTypes = { + mode: PropTypes.string.isRequired, + onModeChange: PropTypes.func +}; +\ No newline at end of file diff --git a/src/components/simple/calcOut/index.js b/src/components/lowLevel/calcOut/index.js diff --git a/src/components/simple/calcOut/styles.module.css b/src/components/lowLevel/calcOut/styles.module.css diff --git a/src/components/simple/largeButton/index.js b/src/components/lowLevel/largeButton/index.js diff --git a/src/components/simple/largeButton/styles.module.css b/src/components/lowLevel/largeButton/styles.module.css diff --git a/src/components/simple/pad/index.js b/src/components/lowLevel/pad/index.js diff --git a/src/components/simple/pad/styles.module.css b/src/components/lowLevel/pad/styles.module.css diff --git a/src/components/simple/smallButton/index.js b/src/components/lowLevel/smallButton/index.js diff --git a/src/components/simple/smallButton/styles.module.css b/src/components/lowLevel/smallButton/styles.module.css