diff --git a/src/App.js b/src/App.js index 5d3c2df..0e534a2 100644 --- a/src/App.js +++ b/src/App.js @@ -1,4 +1,4 @@ -import React, {useContext} from 'react'; +import React, {useContext, useState} from 'react'; import './css/App.css'; import MorseButton from './components/MorseButton' import ModePicker from './components/ModePicker' @@ -15,11 +15,20 @@ import TimedMode from './app-modes/TimedMode' import ChallengeMode from './app-modes/ChallengeMode' import Legend from './components/Legend'; +import MorseBufferDisplay from './components/MorseBufferDisplay' +import MorseDisplay from './components/MorseDisplay' + function App() { console.log('App.js rendered') const {gameMode} = useContext(GameModeContext) + // const [keyType, setKeyType] = useState('straight') + + // function handleClick(e) { + // setKeyType(e.target.id) + // console.log("Switched to " + e.target.id + " keyType."); + // } return (
@@ -29,8 +38,8 @@ function App() { {gameMode === 'practice' && } - {gameMode === 'timed' && } - {gameMode === 'challenge' && } + {/* {gameMode === 'timed' && } + {gameMode === 'challenge' && } */} diff --git a/src/app-modes/PracticeMode.js b/src/app-modes/PracticeMode.js index 5b1751e..39145a4 100644 --- a/src/app-modes/PracticeMode.js +++ b/src/app-modes/PracticeMode.js @@ -7,22 +7,15 @@ import MorseBufferDisplay from '../components/MorseBufferDisplay' import MorseDisplay from '../components/MorseDisplay' -export default React.memo(function PracticeMode(props) { - console.log("COMPONENT LOADED: PracticeMode"); - const {keyType} = useContext(KeyTypeContext) - // const [telegraphType, setTelegraphType] = useState('electronic') +export default React.memo(function PracticeMode() { - // useElectronicKey() - // const {morseCharBuffer, morseWords, clearHistory} = useStraightKey('practice') - + const {keyType} = useContext(KeyTypeContext) return ( <> {keyType === "straight" ? : }

- {/*
-
*/} ); diff --git a/src/components/KeyTypePicker.js b/src/components/KeyTypePicker.js index b7d4213..908f4e8 100644 --- a/src/components/KeyTypePicker.js +++ b/src/components/KeyTypePicker.js @@ -3,15 +3,23 @@ import {KeyTypeContext} from "../contexts/keyTypeContext" export default React.memo(function KeyTypePicker() { - const {switchKeyType} = useContext(KeyTypeContext) + const {setKeyType} = useContext(KeyTypeContext) function handleClick(e) { - switchKeyType(e.target.id) - console.log("Switched to " + e.target.id + " keyType."); + setKeyType(e.target.id) + + let buttons = document.querySelector(".mode-picker#keyType").childNodes + buttons.forEach(button => { + console.log('buttonID', button.id); + if (button.id === e.target.id) { + button.classList.add('selected') + } else { button.classList.remove('selected')} + }) + } return ( -
+
@@ -20,4 +28,26 @@ export default React.memo(function KeyTypePicker() {
) -}) \ No newline at end of file +}) + + +// > STRAIGHT KEY SELECTED +// CONTEXT LOAD: KeyTypeContextProvider +// COMPONENT LOADED: PracticeMode +// COMPONENT LOAD: MorseBufferDisplay +// COMPONENT LOAD: MorseDisplay +// morseWords Array [] + +// ————————— + +// > ELECTRONIC KEY SELECTED +// CONTEXT LOAD: KeyTypeContextProvider +// COMPONENT LOADED: PracticeMode +// COMPONENT LOAD: MorseBufferDisplay +// COMPONENT LOAD: MorseDisplay +// morseWords Array [] + +// CONTEXT LOAD: MorseBufferContextProvider // MorseBufferContextProvider reloading when Electronic selected +// COMPONENT LOAD: MorseBufferDisplay +// COMPONENT LOAD: MorseDisplay +// morseWords Array [] \ No newline at end of file diff --git a/src/components/ModePicker.js b/src/components/ModePicker.js index 3c0453c..723d25b 100644 --- a/src/components/ModePicker.js +++ b/src/components/ModePicker.js @@ -11,7 +11,7 @@ function ModePicker() { } return ( -
+
diff --git a/src/components/MorseBufferDisplay.js b/src/components/MorseBufferDisplay.js index b8d5f7a..d250baf 100644 --- a/src/components/MorseBufferDisplay.js +++ b/src/components/MorseBufferDisplay.js @@ -3,15 +3,12 @@ import DitDahDisplay from "./DitDahDisplay" import morseCode from '../data/morse-reverse.json' import {MorseBufferContext} from "../contexts/morseBufferContext" -function MorseBufferDisplay() { +export default React.memo(function MorseBufferDisplay() { + const {morseCharBuffer} = useContext(MorseBufferContext) - console.log('COMPONENT LOAD: MorseBufferDisplay'); let ditDahs = morseCharBuffer.split('').map((ditdah,index) => ) - let alphanumeric = '' - // if (morseCharBuffer.includes(' ')) { - let letters = morseCharBuffer.split(' ') if (morseCharBuffer === '') {} @@ -29,15 +26,6 @@ function MorseBufferDisplay() { } } } - - // } else if (morseCharBuffer !== '') { - // let letters = morseCharBuffer - // if (morseCode[letters] === undefined) { - // alphanumeric += '[?]' - // } else { - // alphanumeric += morseCode[letters] - // } - // } return (
@@ -51,6 +39,4 @@ function MorseBufferDisplay() {
) -} - -export default MorseBufferDisplay \ No newline at end of file +}) \ No newline at end of file diff --git a/src/components/MorseDisplay.js b/src/components/MorseDisplay.js index 2b536df..23796e2 100644 --- a/src/components/MorseDisplay.js +++ b/src/components/MorseDisplay.js @@ -2,11 +2,10 @@ import React, {useContext} from "react" import MorseCard from './MorseCard' import {MorseBufferContext} from "../contexts/morseBufferContext" -function MorseDisplay() { - console.log('COMPONENT LOAD: MorseDisplay'); +export default (function MorseDisplay() { const {morseWords} = useContext(MorseBufferContext) - console.log('morseWords', morseWords); + let morseCards = morseWords.map((word,index) => ) return ( @@ -14,6 +13,4 @@ function MorseDisplay() { {morseCards}
) -} - -export default MorseDisplay \ No newline at end of file +}) \ No newline at end of file diff --git a/src/contexts/keyTypeContext.js b/src/contexts/keyTypeContext.js index 090e91c..0741785 100644 --- a/src/contexts/keyTypeContext.js +++ b/src/contexts/keyTypeContext.js @@ -1,24 +1,19 @@ -import React, {Component} from "react" +import React, {useState} from "react" const KeyTypeContext = React.createContext() -class KeyTypeContextProvider extends Component { - state = { - keyType: "electronic" - } - - switchKeyType = (type) => { - this.setState({keyType: type}) - } +function KeyTypeContextProvider(props) { - render() { - return ( - - {this.props.children} - - ) - } + const [keyType, setKeyType] = useState('straight') + return ( + + {props.children} + + ) } export {KeyTypeContextProvider, KeyTypeContext} diff --git a/src/contexts/morseBufferContext.js b/src/contexts/morseBufferContext.js index f218e9e..06a72d5 100644 --- a/src/contexts/morseBufferContext.js +++ b/src/contexts/morseBufferContext.js @@ -3,28 +3,10 @@ import React, {useState} from "react" const MorseBufferContext = React.createContext() function MorseBufferContextProvider(props) { - // state = { - // morseCharBuffer: '', - // morseWords: [] - // //morseCharBuffer, morseWords, clearHistory, setMorseCharBuffer, setMorseWords - // } - console.log('MorseBufferContextProvider LOADED'); + const [morseCharBuffer, setMorseCharBuffer] = useState('') const [morseWords, setMorseWords] = useState([]) - - // switchKeyType = (type = "straight") => { - // this.setState({keyType: type}) - // } - - // setMorseCharBuffer = (value) => { - // this.setState({morseCharBuffer: value}) - // } - // setMorseWords = (value) => { - // this.setState({morseWords: value}) - // } - - // render() { return ( ) - // } - } export {MorseBufferContextProvider, MorseBufferContext} diff --git a/src/css/App.css b/src/css/App.css index cd66f0b..1d9887c 100644 --- a/src/css/App.css +++ b/src/css/App.css @@ -5,7 +5,7 @@ html, body { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; - background: #444; + background: #FFF; } #root { @@ -22,7 +22,7 @@ html, body { width: 100%; } -#mode-picker { +.mode-picker { display: -webkit-box; display: -ms-flexbox; display: flex; @@ -30,7 +30,7 @@ html, body { align-self: center; } -#mode-picker button { +.mode-picker button { background: #fcfcfc; margin: 15px; padding: 5px; @@ -40,6 +40,11 @@ html, body { border-radius: 0px; } +.mode-picker .selected { + -webkit-box-shadow: 0px -6px 10px white, 0px 4px 15px rgba(0, 0, 0, 0.15); + box-shadow: 0px -6px 10px white, 0px 4px 15px rgba(0, 0, 0, 0.15); +} + #legend { width: 450px; display: -webkit-box; diff --git a/src/css/App.css.map b/src/css/App.css.map index b3a82f3..0074683 100644 --- a/src/css/App.css.map +++ b/src/css/App.css.map @@ -1,6 +1,6 @@ { "version": 3, - "mappings": "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", + "mappings": "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", "sources": [ "../scss/App.scss" ], diff --git a/src/hooks/useElectronicKey.js b/src/hooks/useElectronicKey.js index eff1103..b85f288 100644 --- a/src/hooks/useElectronicKey.js +++ b/src/hooks/useElectronicKey.js @@ -238,7 +238,6 @@ function useElectronicKey() { else { stopDepressSyncTimer() } } } - function startDepressSyncTimer() { depressSyncTimerRunning = true @@ -264,40 +263,11 @@ function useElectronicKey() { } depressSyncTime = 0 } - // function startGapTimer() { - // gapTime = 0 - // gapTimer = setInterval(() => { - // gapTime += 1 - - // // Gap between words - // if (mode === 'practice' && gapTime >= wordGapMaxTime) { - // setMorseCharBuffer(prev => prev + '/') - // clearInterval(gapTimer) - // gapTimer = 0 - // gapTime = 0 - // } - // if (mode === 'challenge' && gapTime >= letterGapMinTime) { - // setMorseCharBuffer(prev => prev + '_') - // clearInterval(gapTimer) - // gapTimer = 0 - // gapTime = 0 - // } - // }, timingUnit); - // } function checkGapBetweenInputs() { // Check Gap between letters - // console.log('gapTime', gapTime); - // console.log('letterGapMinTime', letterGapMinTime); - // console.log('wordGapMaxTime', wordGapMaxTime); if (gapTime >= letterGapMinTime && gapTime < wordGapMaxTime) { - // console.log('letterGapMinTime <= gapTime < wordGapMaxTime:',letterGapMinTime, gapTime, wordGapMaxTime); - // if (mode === 'practice') { setMorseCharBuffer(prev => prev + ' ') gapTime = 0 - // } else if (mode === 'challenge') { - // console.log("UNDERSCORE ADDED"); - // setMorseCharBuffer(prev => prev + '_') - // } clearInterval(gapTimer) gapTimer = 0 } @@ -341,7 +311,6 @@ function useElectronicKey() { // eslint-disable-next-line }, [morseCharBuffer]) - return {morseCharBuffer, morseWords, setMorseCharBuffer, setMorseWords} } export default useElectronicKey \ No newline at end of file diff --git a/src/hooks/useStraightKey.js b/src/hooks/useStraightKey.js index 798440e..984307e 100644 --- a/src/hooks/useStraightKey.js +++ b/src/hooks/useStraightKey.js @@ -5,7 +5,7 @@ import config from '../config.json' // STRAIGHT KEY TELEGRAPH function useStraightKey() { - + const {morseCharBuffer, setMorseCharBuffer, morseWords, setMorseWords} = useContext(MorseBufferContext) let charTimer = 0 @@ -172,7 +172,7 @@ function useStraightKey() { morseButton.removeEventListener('touchstart', handleInputStart) morseButton.removeEventListener('mouseup', handleInputEnd) morseButton.removeEventListener('touchend', handleInputEnd) - clearHistory() + // clearHistory() } // eslint-disable-next-line }, []) @@ -198,7 +198,6 @@ function useStraightKey() { // eslint-disable-next-line }, [morseCharBuffer]) - return {morseCharBuffer, morseWords, clearHistory, setMorseCharBuffer, setMorseWords} } export default useStraightKey \ No newline at end of file diff --git a/src/scss/App.scss b/src/scss/App.scss index b0b01c7..8d03db7 100644 --- a/src/scss/App.scss +++ b/src/scss/App.scss @@ -1,7 +1,7 @@ $main-bg-color: #FFF; $main-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.2); $main-border-radius: 0px; -// $border-radius-neumorphic: 0px -6px 10px rgba(255, 255, 255, 1), 0px 4px 15px rgba(0, 0, 0, 0.15); +$border-radius-neumorphic: 0px -6px 10px rgba(255, 255, 255, 1), 0px 4px 15px rgba(0, 0, 0, 0.15); html, body { margin: 0px; @@ -9,8 +9,8 @@ html, body { height: 100%; width: 100%; box-sizing: border-box; - // background: $main-bg-color; - background: #444 + background: $main-bg-color; + // background: #444 } #root { height: 100%; @@ -19,7 +19,7 @@ html, body { align-items: center; width: 100%; } -#mode-picker { +.mode-picker { display: flex; align-self: center; button { @@ -30,6 +30,9 @@ html, body { border: 0px; border-radius: $main-border-radius; } + .selected { + box-shadow: $border-radius-neumorphic; + } } #legend {