genemecija/learn-morse-code
1
0
Fork 0
mirror of https://github.com/genemecija/learn-morse-code.git synced 2026-01-20 23:30:15 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Challenge mode progress

Browse source
This commit is contained in:
Gene Mecija 2020-01-18 19:35:11 -08:00
parent ee4f87ea35
commit 71625371e2
16 changed files with 143 additions and 150 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
src/App.js
View file

@ -8,7 +8,7 @@ import KeyTypePicker from './components/KeyTypePicker'
// import GameClock from "./components/GameClock"
// import ChallengeWord from "./components/ChallengeWord"
import {GameModeContext} from "./contexts/gameContext"
import {KeyTypeContextProvider} from "./contexts/keyTypeContext"
import {KeyTypeContext} from "./contexts/keyTypeContext"
import {MorseBufferContextProvider} from "./contexts/morseBufferContext"
import PracticeMode from './app-modes/PracticeMode';
import TimedMode from './app-modes/TimedMode'
@ -16,13 +16,17 @@ import ChallengeMode from './app-modes/ChallengeMode'
import Legend from './components/Legend';
import MorseBufferDisplay from './components/MorseBufferDisplay'
import MorseDisplay from './components/MorseDisplay'
import MorseHistory from './components/MorseHistory'
import StraightKey from './components/StraightKey';
import ElectronicKey from './components/ElectronicKey';
function App() {
console.log('App.js rendered')
const {gameMode} = useContext(GameModeContext)
const {keyType} = useContext(KeyTypeContext)
// const [keyType, setKeyType] = useState('straight')
// function handleClick(e) {
@ -35,13 +39,20 @@ function App() {
<Legend />
<ModePicker />
<MorseBufferContextProvider>
<KeyTypeContextProvider>
<KeyTypePicker />
{gameMode === 'practice' && <PracticeMode />}
{/* {gameMode === 'timed' && <TimedMode />}
{gameMode === 'challenge' && <ChallengeMode />} */}
{keyType === "straight" ?
<StraightKey key={gameMode} /> : <ElectronicKey key={gameMode} />}
{gameMode === 'practice' &&
<>
<PracticeMode /><br/>
<MorseBufferDisplay /><br/>
<MorseHistory /><br/>
</>
}
{/* {gameMode === 'timed' && <TimedMode />} */}
{gameMode === 'challenge' && <ChallengeMode />}
<MorseButtons />
</KeyTypeContextProvider>
</MorseBufferContextProvider>
</div>

18
src/app-modes/ChallengeMode.js
View file

@ -1,17 +1,19 @@
import React from 'react';
import React, {useContext} from 'react';
import '../css/App.css';
import morseCode from '../data/morse-reverse.json'
import useStraightKey from '../hooks/useStraightKey';
// import ChallengeWord from '../components/ChallengeWord'
import ChallengeWord from '../components/ChallengeWord'
// import MorseBufferDisplay from '../components/MorseBufferDisplay'
// import ChallengeDisplay from '../components/ChallengeDisplay';
import ChallengeBufferDisplay from '../components/ChallengeBufferDisplay';
import { MorseBufferContext } from '../contexts/morseBufferContext';
function ChallengeMode() { console.log("ChallengeMode loaded");
let word = "morse"
const {morseCharBuffer} = useStraightKey('challenge')
const {morseCharBuffer} = useContext(MorseBufferContext)
// console.log('morseCharBuffer:', morseCharBuffer, '|END');
let morseLetters = morseCharBuffer.split('_').filter(l => l !== '')
// console.log('morseLetters:', morseLetters, morseLetters.length);
@ -23,6 +25,10 @@ function ChallengeMode() { console.log("ChallengeMode loaded");
let morseAlpha = morseCode[morseLetter]
let challengeLetter = challengeLetters[index].toLowerCase()
console.log('morseAlpha', morseAlpha);
console.log('morseLetter', morseLetter);
console.log('challengeLetter', challengeLetter);
if (morseAlpha === challengeLetter) {
correctIndexes.push(index)
// console.log('MATCH', correctIndexes);
@ -50,8 +56,8 @@ function ChallengeMode() { console.log("ChallengeMode loaded");
return (
<>
<div id="challengeWord">{spannedWord}</div>
<ChallengeBufferDisplay buffer={morseCharBuffer.slice(0,-1).replace(/_/g, ' ')} incorrectIndex={incorrectIndex} />
<ChallengeWord word={spannedWord} />
<ChallengeBufferDisplay incorrectIndex={incorrectIndex} />
<button onClick={() => console.log(morseCharBuffer)}>morseCharBuffer</button>
</>
);

6
src/app-modes/PracticeMode.js
View file

@ -4,7 +4,7 @@ import {KeyTypeContext} from "../contexts/keyTypeContext"
import StraightKey from '../components/StraightKey'
import ElectronicKey from '../components/ElectronicKey'
import MorseBufferDisplay from '../components/MorseBufferDisplay'
import MorseDisplay from '../components/MorseDisplay'
import MorseHistory from '../components/MorseHistory'
export default React.memo(function PracticeMode() {
@ -13,9 +13,9 @@ export default React.memo(function PracticeMode() {
return (
<>
{keyType === "straight" ? <StraightKey /> : <ElectronicKey />}
{/* {keyType === "straight" ? <StraightKey /> : <ElectronicKey />}
<MorseBufferDisplay /><br/>
<MorseDisplay /><br/>
<MorseHistory /><br/> */}
</>
);

4
src/app-modes/TimedMode.js
View file

@ -3,7 +3,7 @@ import '../css/App.css';
import useStraightKey from '../hooks/useStraightKey';
import GameClock from '../components/GameClock'
import MorseBufferDisplay from '../components/MorseBufferDisplay'
import MorseDisplay from '../components/MorseDisplay'
import MorseHistory from '../components/MorseHistory'
function TimedMode() {
@ -15,7 +15,7 @@ function TimedMode() {
<>
<GameClock time={30} />
<MorseBufferDisplay buffer={morseCharBuffer} /><br/>
<MorseDisplay morseWords={morseWords} />
<MorseHistory morseWords={morseWords} />
</>
);

50
src/components/ChallengeBufferDisplay.js
View file

@ -1,30 +1,34 @@
import React from "react"
import React, { useContext } from "react"
import DitDahDisplay from "./DitDahDisplay"
import morseCode from '../data/morse-reverse.json'
import { MorseBufferContext } from "../contexts/morseBufferContext"
function ChallengeBufferDisplay(props) {
// INCREMENTING COUNTER TO MONITOR COMPONENT RELOADING
// console.log('ChallengeMode')
if (!document.getElementById('counter')) {
let counter = document.createElement('h1')
let holder = document.createElement('h3')
counter.id = 'counter'
holder.id = 'holder'
counter.innerText = "0"
document.querySelector('#main-content').appendChild(counter)
document.querySelector('#main-content').appendChild(holder)
} else {
let num = document.getElementById('counter').innerText
document.getElementById('counter').innerText = Number(num) + 1
document.getElementById('holder').innerText = props.buffer
}
//
// // INCREMENTING COUNTER TO MONITOR COMPONENT RELOADING
// // console.log('ChallengeMode')
// if (!document.getElementById('counter')) {
// let counter = document.createElement('h1')
// let holder = document.createElement('h3')
// counter.id = 'counter'
// holder.id = 'holder'
// counter.innerText = "0"
// document.querySelector('#main-content').appendChild(counter)
// document.querySelector('#main-content').appendChild(holder)
// } else {
// let num = document.getElementById('counter').innerText
// document.getElementById('counter').innerText = Number(num) + 1
// document.getElementById('holder').innerText = buffer
// }
const {morseCharBuffer} = useContext(MorseBufferContext)
let buffer = morseCharBuffer.slice(0,-1).replace(/_/g, ' ')
console.log('buffer', buffer);
let ditDahs = []
let incorrectIndex = props.incorrectIndex
let morseLetters = props.buffer.split(' ')
let morseLetters = buffer.split(' ')
if (incorrectIndex) {
for (let i in morseLetters) {
@ -37,14 +41,14 @@ function ChallengeBufferDisplay(props) {
}
}
} else {
ditDahs = props.buffer.split('').map((ditdah,index) => <DitDahDisplay key={index} dd={ditdah} />)
ditDahs = buffer.split('').map((ditdah,index) => <DitDahDisplay key={index} dd={ditdah} />)
}
let alphanumeric = ''
let letters = props.buffer.split(' ')
let letters = buffer.split(' ')
if (props.buffer === '') {}
if (buffer === '') {}
else {
for (let i in letters) {
if (letters[i] === ' ') {
@ -60,8 +64,8 @@ function ChallengeBufferDisplay(props) {
}
}
// } else if (props.buffer !== '') {
// let letters = props.buffer
// } else if (buffer !== '') {
// let letters = buffer
// if (morseCode[letters] === undefined) {
// alphanumeric += '[?]'
// } else {

9
src/components/ChallengeWord.js
View file

@ -1,10 +1,7 @@
import React from "react"
function ChallengeWord(props) {
export default React.memo(function ChallengeWord(props) {
return (
<div id="challengeWord">{spannedWord}</div>
<div id="challengeWord">{props.word}</div>
)
}
export default React.memo(ChallengeWord)
})

4
src/components/ModePicker.js
View file

@ -3,10 +3,10 @@ import {GameModeContext} from "../contexts/gameContext"
function ModePicker() {
const {switchGameModeTo} = useContext(GameModeContext)
const {setGameMode} = useContext(GameModeContext)
function handleClick(e) {
switchGameModeTo(e.target.id)
setGameMode(e.target.id)
console.log("Switched to " + e.target.id + " mode.");
}

6
src/components/MorseButtons.js
View file

@ -1,10 +1,6 @@
import React, { useContext } from "react"
import { KeyTypeContext } from "../contexts/keyTypeContext"
import React from "react"
export default React.memo(function MorseButtons() {
const {keyType} = useContext(KeyTypeContext)
return (
<div id="morseButton">
<button className="paddle" id="left"></button>

4
src/components/MorseDisplay.js → src/components/MorseHistory.js
View file

@ -2,14 +2,14 @@ import React, {useContext} from "react"
import MorseCard from './MorseCard'
import {MorseBufferContext} from "../contexts/morseBufferContext"
export default (function MorseDisplay() {
export default (function MorseHistory() {
const {morseWords} = useContext(MorseBufferContext)
let morseCards = morseWords.map((word,index) => <MorseCard key={index} morse={word} />)
return (
<div id="morseDisplay">
<div id="morseHistory">
{morseCards}
</div>
)

25
src/contexts/gameContext.js
View file

@ -1,23 +1,14 @@
import React, {Component} from "react"
import React, {useState} from "react"
const GameModeContext = React.createContext()
class GameModeContextProvider extends Component {
state = {
gameMode: "practice"
}
switchGameModeTo = (mode = "practice") => {
this.setState({gameMode: mode})
}
render() {
return (
<GameModeContext.Provider value={{gameMode: this.state.gameMode, switchGameModeTo: this.switchGameModeTo}}>
{this.props.children}
</GameModeContext.Provider>
)
}
function GameModeContextProvider(props) {
const [gameMode, setGameMode] = useState('practice')
return (
<GameModeContext.Provider value={{gameMode: gameMode, setGameMode: setGameMode}}>
{props.children}
</GameModeContext.Provider>
)
}
export {GameModeContextProvider, GameModeContext}

1
src/css/App.css
View file

@ -114,6 +114,7 @@ html, body {
}
.paddle {
font-size: 60px;
width: 100px;
height: 100px;
background: goldenrod;

2
src/css/App.css.map
View file

@ -1,6 +1,6 @@
{
"version": 3,
"mappings": "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",
"mappings": "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",
"sources": [
"../scss/App.scss"
],

40
src/hooks/useElectronicKey.js
View file

@ -4,7 +4,7 @@ import config from '../config.json'
// ELECTRONIC KEY TELEGRAPH - Iambic A
function useElectronicKey() {
function useElectronicKey(gameMode) {
const {morseCharBuffer, setMorseCharBuffer, morseWords, setMorseWords} = useContext(MorseBufferContext)
@ -309,33 +309,27 @@ function useElectronicKey() {
document.addEventListener('keydown', handleInputStart)
document.addEventListener('keyup', handleInputEnd)
const paddleLeft = document.querySelector('.paddle#left')
const paddleRight = document.querySelector('.paddle#right')
paddleLeft.addEventListener('mousedown', handleInputStart)
paddleLeft.addEventListener('touchstart', handleInputStart)
paddleLeft.addEventListener('mouseup', handleInputEnd)
paddleLeft.addEventListener('touchend', handleInputEnd)
paddleRight.addEventListener('mousedown', handleInputStart)
paddleRight.addEventListener('touchstart', handleInputStart)
paddleRight.addEventListener('mouseup', handleInputEnd)
paddleRight.addEventListener('touchend', handleInputEnd)
const paddles = document.querySelectorAll('.paddle')
paddles.forEach(paddle => {
paddle.addEventListener('mousedown', handleInputStart)
paddle.addEventListener('touchstart', handleInputStart)
paddle.addEventListener('mouseout', handleInputEnd)
paddle.addEventListener('mouseup', handleInputEnd)
paddle.addEventListener('touchend', handleInputEnd)
})
return function cleanup() {
document.removeEventListener('keydown', handleInputStart)
document.removeEventListener('keyup', handleInputEnd)
const paddleLeft = document.querySelector('.paddle#left')
const paddleRight = document.querySelector('.paddle#right')
paddleLeft.removeEventListener('mousedown', handleInputStart)
paddleLeft.removeEventListener('touchstart', handleInputStart)
paddleLeft.removeEventListener('mouseup', handleInputEnd)
paddleLeft.removeEventListener('touchend', handleInputEnd)
paddleRight.removeEventListener('mousedown', handleInputStart)
paddleRight.removeEventListener('touchstart', handleInputStart)
paddleRight.removeEventListener('mouseup', handleInputEnd)
paddleRight.removeEventListener('touchend', handleInputEnd)
const paddles = document.querySelectorAll('.paddle')
paddles.forEach(paddle => {
paddle.removeEventListener('mousedown', handleInputStart)
paddle.removeEventListener('touchstart', handleInputStart)
paddle.removeEventListener('mouseout', handleInputEnd)
paddle.removeEventListener('mouseup', handleInputEnd)
paddle.removeEventListener('touchend', handleInputEnd)
})
}
// eslint-disable-next-line
}, [])

88
src/hooks/useStraightKey.js
View file

@ -1,12 +1,15 @@
import {useEffect, useContext} from 'react'
import {MorseBufferContext} from '../contexts/morseBufferContext'
import config from '../config.json'
// import {GameModeContext} from '../contexts/gameContext'
// STRAIGHT KEY TELEGRAPH
function useStraightKey() {
function useStraightKey(gameMode) {
console.log(gameMode);
const {morseCharBuffer, setMorseCharBuffer, morseWords, setMorseWords} = useContext(MorseBufferContext)
// const {gameMode} = useContext(GameModeContext)
let charTimer = 0
let charTime = 0
@ -99,7 +102,7 @@ function useStraightKey() {
return
}
console.log('charTime:', charTime);
// console.log('charTime:', charTime);
if (charTime <= ditMaxTime) {
setMorseCharBuffer(prev => prev + '.')
} else {
@ -128,33 +131,34 @@ function useStraightKey() {
gapTime += 1
// Gap between words
if (gapTime >= wordGapMaxTime) {
if (gameMode === 'practice' && gapTime >= wordGapMaxTime) {
console.log('practice');
setMorseCharBuffer(prev => prev + '/')
clearInterval(gapTimer)
gapTimer = 0
gapTime = 0
}
// if (mode === 'challenge' && gapTime >= letterGapMinTime) {
// setMorseCharBuffer(prev => prev + '_')
// clearInterval(gapTimer)
// gapTimer = 0
// gapTime = 0
// }
if (gameMode === 'challenge' && gapTime >= letterGapMinTime) {
setMorseCharBuffer(prev => prev + '_')
clearInterval(gapTimer)
gapTimer = 0
gapTime = 0
}
}, timingUnit);
}
function checkGapBetweenInputs() {
// Check Gap between letters
console.log('ditMaxTime', ditMaxTime)
console.log('gapTime', gapTime);
console.log('letterGapMinTime', letterGapMinTime);
console.log('wordGapMaxTime', wordGapMaxTime);
// console.log('ditMaxTime', ditMaxTime)
// console.log('gapTime', gapTime);
// console.log('letterGapMinTime', letterGapMinTime);
// console.log('wordGapMaxTime', wordGapMaxTime);
if (gapTime >= letterGapMinTime && gapTime < wordGapMaxTime) {
// if (mode === 'practice') {
if (gameMode === 'practice') {
setMorseCharBuffer(prev => prev + ' ')
// } else if (mode === 'challenge') {
// setMorseCharBuffer(prev => prev + '_')
// }
} else if (gameMode === 'challenge') {
setMorseCharBuffer(prev => prev + '_')
}
clearInterval(gapTimer)
gapTimer = 0
}
@ -164,43 +168,27 @@ function useStraightKey() {
document.addEventListener('keydown', handleInputStart)
document.addEventListener('keyup', handleInputEnd)
// const morseButton = document.getElementById('morseButton')
// morseButton.addEventListener('mousedown', handleInputStart)
// morseButton.addEventListener('touchstart', handleInputStart)
// morseButton.addEventListener('mouseup', handleInputEnd)
// morseButton.addEventListener('touchend', handleInputEnd)
const paddleLeft = document.querySelector('.paddle#left')
const paddleRight = document.querySelector('.paddle#right')
paddleLeft.addEventListener('mousedown', handleInputStart)
paddleLeft.addEventListener('touchstart', handleInputStart)
paddleLeft.addEventListener('mouseup', handleInputEnd)
paddleLeft.addEventListener('touchend', handleInputEnd)
paddleRight.addEventListener('mousedown', handleInputStart)
paddleRight.addEventListener('touchstart', handleInputStart)
paddleRight.addEventListener('mouseup', handleInputEnd)
paddleRight.addEventListener('touchend', handleInputEnd)
const paddles = document.querySelectorAll('.paddle')
paddles.forEach(paddle => {
paddle.addEventListener('mousedown', handleInputStart)
paddle.addEventListener('touchstart', handleInputStart)
paddle.addEventListener('mouseout', handleInputEnd)
paddle.addEventListener('mouseup', handleInputEnd)
paddle.addEventListener('touchend', handleInputEnd)
})
return function cleanup() {
document.removeEventListener('keydown', handleInputStart)
document.removeEventListener('keyup', handleInputEnd)
const paddleLeft = document.querySelector('.paddle#left')
const paddleRight = document.querySelector('.paddle#right')
paddleLeft.removeEventListener('mousedown', handleInputStart)
paddleLeft.removeEventListener('touchstart', handleInputStart)
paddleLeft.removeEventListener('mouseup', handleInputEnd)
paddleLeft.removeEventListener('touchend', handleInputEnd)
paddleRight.removeEventListener('mousedown', handleInputStart)
paddleRight.removeEventListener('touchstart', handleInputStart)
paddleRight.removeEventListener('mouseup', handleInputEnd)
paddleRight.removeEventListener('touchend', handleInputEnd)
// const morseButton = document.getElementById('morseButton')
// morseButton.removeEventListener('mousedown', handleInputStart)
// morseButton.removeEventListener('touchstart', handleInputStart)
// morseButton.removeEventListener('mouseup', handleInputEnd)
// morseButton.removeEventListener('touchend', handleInputEnd)
const paddles = document.querySelectorAll('.paddle')
paddles.forEach(paddle => {
paddle.removeEventListener('mousedown', handleInputStart)
paddle.removeEventListener('touchstart', handleInputStart)
paddle.removeEventListener('mouseout', handleInputEnd)
paddle.removeEventListener('mouseup', handleInputEnd)
paddle.removeEventListener('touchend', handleInputEnd)
})
// clearHistory()
}
// eslint-disable-next-line
@ -208,7 +196,7 @@ function useStraightKey() {
useEffect(() => {
// PRACTICE MODE
if (morseCharBuffer.slice(-1) === '/') {
if (morseCharBuffer.slice(-1) === '/' && gameMode === 'practice') {
// Remove forward slash
let val = morseCharBuffer.slice(0,morseCharBuffer.length-1)

10
src/index.js
View file

@ -4,12 +4,16 @@ import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
import {GameModeContextProvider} from "./contexts/gameContext"
import { KeyTypeContextProvider } from './contexts/keyTypeContext';
ReactDOM.render(
<GameModeContextProvider>
<App />
</GameModeContextProvider>
<KeyTypeContextProvider>
<GameModeContextProvider>
<App />
</GameModeContextProvider>
</KeyTypeContextProvider>
, document.getElementById('root'));
// If you want your app to work offline and load faster, you can change

1
src/scss/App.scss
View file

@ -83,6 +83,7 @@ html, body {
}
.paddle {
font-size: 60px;
width: 100px;
height: 100px;
background: goldenrod;