From dd6d8ca80fd532431e027187901635f753097f95 Mon Sep 17 00:00:00 2001 From: Gene Mecija Date: Tue, 14 Jan 2020 02:37:04 -0800 Subject: [PATCH] Morse player function, config file --- src/App.js | 2 + src/app-modes/PracticeMode.js | 2 +- src/components/AlphaNumeric.js | 1 - src/components/DitDah.js | 1 - src/components/Legend.js | 39 ++++++++++++++++ src/components/ModePicker.js | 2 +- src/components/MorseCard.js | 1 - src/config.json | 11 +++++ src/css/App.css | 2 +- src/css/App.css.map | 2 +- src/data/morse-code.json | 47 ++++++++++++++++++++ src/hooks/useMorsePlayer.js | 81 ++++++++++++++++++++++++++++++++++ src/hooks/useTelegraph.js | 33 +++++++++----- src/scss/App.scss | 3 +- 14 files changed, 207 insertions(+), 20 deletions(-) create mode 100644 src/components/Legend.js create mode 100644 src/config.json create mode 100644 src/data/morse-code.json create mode 100644 src/hooks/useMorsePlayer.js diff --git a/src/App.js b/src/App.js index a76de12..0413752 100644 --- a/src/App.js +++ b/src/App.js @@ -10,6 +10,7 @@ import {GameModeContext} from "./gameContext" import PracticeMode from './app-modes/PracticeMode'; import TimedMode from './app-modes/TimedMode' import ChallengeMode from './app-modes/ChallengeMode' +import Legend from './components/Legend'; function App() { @@ -18,6 +19,7 @@ function App() { return (
+ {gameMode === 'practice' && } diff --git a/src/app-modes/PracticeMode.js b/src/app-modes/PracticeMode.js index 187581f..5379e62 100644 --- a/src/app-modes/PracticeMode.js +++ b/src/app-modes/PracticeMode.js @@ -5,7 +5,7 @@ import MorseBufferDisplay from '../components/MorseBufferDisplay' import MorseDisplay from '../components/MorseDisplay' function PracticeMode() { - + console.log("PracticeMode loaded"); const {morseCharBuffer, morseWords, clearHistory} = useTelegraph('practice') return ( diff --git a/src/components/AlphaNumeric.js b/src/components/AlphaNumeric.js index e6d6d9f..bbe6ec0 100644 --- a/src/components/AlphaNumeric.js +++ b/src/components/AlphaNumeric.js @@ -2,7 +2,6 @@ import React from "react" import morseCode from '../data/morse-reverse.json' function AlphaNumeric(props) { - console.log('AlphaNumeric rendered'); if (props.morseLetter === '') { return ( diff --git a/src/components/DitDah.js b/src/components/DitDah.js index 75fcc95..deb2612 100644 --- a/src/components/DitDah.js +++ b/src/components/DitDah.js @@ -2,7 +2,6 @@ import React from "react" import morseCode from '../data/morse-reverse.json' function DitDah(props) { - console.log('DitDah rendered'); if (props.morseLetter === '') { return (   diff --git a/src/components/Legend.js b/src/components/Legend.js new file mode 100644 index 0000000..cdb0d71 --- /dev/null +++ b/src/components/Legend.js @@ -0,0 +1,39 @@ +import React from "react" +import morseCode from '../data/morse-code.json' + +import useMorsePlayer from "../hooks/useMorsePlayer"; + +function Legend() { + + const { playMorseWord } = useMorsePlayer() + + function handleClick(e) { + e.preventDefault() + + let word = e.target.innerHTML + let newWord = convertWordToMorse(word) + console.log(newWord); + + let name = '--._._-._.' + playMorseWord(newWord) + + } + function convertWordToMorse(word) { + let morse = '' + for (let i in word) { + morse += morseCode[word[i].toLowerCase()] + morse += ' ' + } + return morse + } + + return ( +
+ + + +
+ ) +} + +export default React.memo(Legend) \ No newline at end of file diff --git a/src/components/ModePicker.js b/src/components/ModePicker.js index 9339520..0d4ee78 100644 --- a/src/components/ModePicker.js +++ b/src/components/ModePicker.js @@ -25,4 +25,4 @@ function ModePicker() { ) } -export default ModePicker \ No newline at end of file +export default React.memo(ModePicker) \ No newline at end of file diff --git a/src/components/MorseCard.js b/src/components/MorseCard.js index bd52193..3142293 100644 --- a/src/components/MorseCard.js +++ b/src/components/MorseCard.js @@ -3,7 +3,6 @@ import AlphaNumeric from './AlphaNumeric' import DitDah from './DitDah' function MorseCard(props) { - console.log('MorseCard rendered'); let morseComponent let alphaNumericsComponent diff --git a/src/config.json b/src/config.json new file mode 100644 index 0000000..52aff37 --- /dev/null +++ b/src/config.json @@ -0,0 +1,11 @@ +{ + "timingUnit": 1, + "ditMaxTime": 60, + "mainVolume": 0.2, + "frequency": 550.0, + "practiceSpeed": { + "slow": 40, + "normal": 24, + "fast": 17 + } +} \ No newline at end of file diff --git a/src/css/App.css b/src/css/App.css index 8db981a..b625c8a 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: #FFF; + background: #444; } #root { diff --git a/src/css/App.css.map b/src/css/App.css.map index 7e52b8d..18fd22b 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/data/morse-code.json b/src/data/morse-code.json new file mode 100644 index 0000000..d1ccd83 --- /dev/null +++ b/src/data/morse-code.json @@ -0,0 +1,47 @@ +{ + "0": "-----", + "1": ".----", + "2": "..---", + "3": "...--", + "4": "....-", + "5": ".....", + "6": "-....", + "7": "--...", + "8": "---..", + "9": "----.", + "a": ".-", + "b": "-...", + "c": "-.-.", + "d": "-..", + "e": ".", + "f": "..-.", + "g": "--.", + "h": "....", + "i": "..", + "j": ".---", + "k": "-.-", + "l": ".-..", + "m": "--", + "n": "-.", + "o": "---", + "p": ".--.", + "q": "--.-", + "r": ".-.", + "s": "...", + "t": "-", + "u": "..-", + "v": "...-", + "w": ".--", + "x": "-..-", + "y": "-.--", + "z": "--..", + ".": ".-.-.-", + ",": "--..--", + "?": "..--..", + "!": "-.-.--", + "-": "-....-", + "/": "-..-.", + "@": ".--.-.", + "(": "-.--.", + ")": "-.--.-" + } \ No newline at end of file diff --git a/src/hooks/useMorsePlayer.js b/src/hooks/useMorsePlayer.js new file mode 100644 index 0000000..d5a74e9 --- /dev/null +++ b/src/hooks/useMorsePlayer.js @@ -0,0 +1,81 @@ +import config from '../config.json' + +function useMorsePlayer() { + + const ditMaxTime = config.ditMaxTime + + // Tone Setup + let AudioContext = window.AudioContext || window.webkitAudioContext + window.AudioContext = window.AudioContext || window.webkitAudioContext; + let context + if (AudioContext) { + context = new AudioContext() + } else { + context = null + } + + let frequency = config.frequency + + function play(ditDah) { + let length = ((ditDah === '.') ? ditMaxTime : ditMaxTime*3) + // length = 1 + + return new Promise((resolve, reject) => { + if (context.state === 'interrupted') { + context.resume() + } + let o + o = context.createOscillator() + o.frequency.value = frequency + o.type = "sine" + o.onended = () => { + resolve() + } + + let startTime = context.currentTime; + + let g = context.createGain() + g.gain.exponentialRampToValueAtTime(config.mainVolume, startTime) + g.gain.setValueAtTime(config.mainVolume, startTime) + o.connect(g) + g.connect(context.destination) + o.start(startTime) + + g.gain.setTargetAtTime(0.0001, startTime + length/1000, 0.001) + o.stop(startTime + length/1000 + 0.05) + console.log("length/1000", length/1000); + }) + } + + function playMorseWord(morse) { + let chars = Array.from(morse) + let currentPromise = Promise.resolve(); + + for (let i = 0; i < chars.length; i++) { + currentPromise = currentPromise.then(() => { + return playChar(chars[i]); + }); + } + + function playChar(char) { + let delay = (char === '.') ? ditMaxTime + ditMaxTime : ditMaxTime*3 + ditMaxTime + + return new Promise(function(resolve) { + if (char === '.' || char === '-') { + play(char) + .then(setTimeout(() => { + resolve(); + }, delay)) + } else { + setTimeout(() => { + resolve(); + }, delay) + } + }); + } + } + + return { playMorseWord } +} + +export default useMorsePlayer \ No newline at end of file diff --git a/src/hooks/useTelegraph.js b/src/hooks/useTelegraph.js index 36625c5..cd9d705 100644 --- a/src/hooks/useTelegraph.js +++ b/src/hooks/useTelegraph.js @@ -1,18 +1,19 @@ import {useState, useEffect} from 'react' +import config from '../config.json' function useTelegraph(mode = 'practice') { const [morseCharBuffer, setMorseCharBuffer] = useState('') // e.g. '-..' const [morseWords, setMorseWords] = useState([]) // e.g. [['-..','.','-,'], ['...','---','...']] - + let charTimer = 0 let charTime = 0 let gapTimer = 0 let gapTime = 0 - - const timingUnit = 15 // default: 25 - - const ditMaxTime = 5 // default: 3 + + const timingUnit = config.timingUnit + + const ditMaxTime = config.practiceSpeed.normal const letterGapMinTime = ditMaxTime*3 const wordGapMaxTime = ditMaxTime*7 const morseHistorySize = 5 @@ -27,7 +28,8 @@ function useTelegraph(mode = 'practice') { context = null } - let o + let o // Oscillator Node + let g // Gain Node let frequency = 550.0 let isRunning = false @@ -39,11 +41,11 @@ function useTelegraph(mode = 'practice') { function handleInputStart(event) { event.preventDefault() + console.log('ditmaxtime:', ditMaxTime); + if (isRunning) { - console.log("isRunning True:", isRunning); return } else { - console.log("isRunning False:", isRunning); isRunning = true // TODO: @@ -60,8 +62,8 @@ function useTelegraph(mode = 'practice') { o.frequency.value = frequency o.type = "sine" - let g = context.createGain() - g.gain.exponentialRampToValueAtTime(0.08, context.currentTime) + g = context.createGain() + g.gain.exponentialRampToValueAtTime(config.mainVolume, context.currentTime) o.connect(g) g.connect(context.destination) o.start() @@ -73,6 +75,7 @@ function useTelegraph(mode = 'practice') { } } + function startCharTimer() { // Reset character time charTime = 0 @@ -91,6 +94,9 @@ function useTelegraph(mode = 'practice') { (event.repeat)) { return } + // if (event.repeat) { + // return + // } if (charTime <= ditMaxTime) { setMorseCharBuffer(prev => prev + '.') @@ -100,8 +106,11 @@ function useTelegraph(mode = 'practice') { stopCharTimer() startGapTimer() - console.log("o.context.state:", o.context.state); - if (o.context.state === 'running') {o.stop()} + + if (o.context.state === 'running') { + g.gain.setTargetAtTime(0.0001, context.currentTime, 0.001) + o.stop(context.currentTime + 0.01) + } } else { return } } diff --git a/src/scss/App.scss b/src/scss/App.scss index 17c5439..a8f1906 100644 --- a/src/scss/App.scss +++ b/src/scss/App.scss @@ -9,7 +9,8 @@ html, body { height: 100%; width: 100%; box-sizing: border-box; - background: $main-bg-color; + // background: $main-bg-color; + background: #444 } #root { height: 100%;