diff --git a/client/src/components/infoview/main.tsx b/client/src/components/infoview/main.tsx index b77c3957..c7f553ae 100644 --- a/client/src/components/infoview/main.tsx +++ b/client/src/components/infoview/main.tsx @@ -156,7 +156,7 @@ export function Main(props: { world: string, level: number, data: LevelInfo}) { const completed = useAppSelector(selectCompleted(gameId, props.world, props.level)) - console.debug(`template: ${props.data.template}`) + console.debug(`template: ${props.data?.template}`) // React.useEffect (() => { // if (props.data.template) { diff --git a/client/src/components/level.tsx b/client/src/components/level.tsx index 922fddb5..acce7cbc 100644 --- a/client/src/components/level.tsx +++ b/client/src/components/level.tsx @@ -22,7 +22,7 @@ import { ConnectionContext, connection, useLeanClient } from '../connection' import { useAppDispatch, useAppSelector } from '../hooks' import { useGetGameInfoQuery, useLoadInventoryOverviewQuery, useLoadLevelQuery } from '../state/api' import { changedSelection, codeEdited, selectCode, selectSelections, selectCompleted, helpEdited, - selectHelp, selectDifficulty, selectInventory } from '../state/progress' + selectHelp, selectDifficulty, selectInventory, selectTypewriterMode, changeTypewriterMode } from '../state/progress' import { store } from '../state/store' import { Button } from './button' import Markdown from './markdown' @@ -203,12 +203,17 @@ function PlayableLevel({impressum, setImpressum}) { const {worldId, levelId} = useContext(WorldLevelIdContext) const {mobile} = React.useContext(MobileContext) + const dispatch = useAppDispatch() + const difficulty = useSelector(selectDifficulty(gameId)) const initialCode = useAppSelector(selectCode(gameId, worldId, levelId)) const initialSelections = useAppSelector(selectSelections(gameId, worldId, levelId)) const inventory: Array = useSelector(selectInventory(gameId)) - const gameInfo = useGetGameInfoQuery({game: gameId}) + const typewriterMode = useSelector(selectTypewriterMode(gameId)) + const setTypewriterMode = (newTypewriterMode: boolean) => dispatch(changeTypewriterMode({game: gameId, typewriterMode: newTypewriterMode})) + + const gameInfo = useGetGameInfoQuery({game: gameId}) const level = useLoadLevelQuery({game: gameId, world: worldId, level: levelId}) // The state variables for the `ProofContext` @@ -220,12 +225,11 @@ function PlayableLevel({impressum, setImpressum}) { const [showHelp, setShowHelp] = useState>(new Set()) // Only for mobile layout const [pageNumber, setPageNumber] = useState(0) - const [typewriterMode, setTypewriterMode] = useState(true) + // set to true to prevent switching between typewriter and editor const [lockInputMode, setLockInputMode] = useState(false) const [typewriterInput, setTypewriterInput] = useState("") const lastLevel = levelId >= gameInfo.data?.worldSize[worldId] - const dispatch = useAppDispatch() // impressum pop-up function toggleImpressum() {setImpressum(!impressum)} @@ -319,8 +323,6 @@ function PlayableLevel({impressum, setImpressum}) { console.debug(`not inserting template.`) } } - } else { - setTypewriterMode(true) } }, [level, levelId, worldId, gameId, editor]) @@ -335,7 +337,7 @@ function PlayableLevel({impressum, setImpressum}) { }, [gameId, worldId, levelId]) useEffect(() => { - if (!typewriterMode) { + if (!typewriterMode && editor) { // Delete last input attempt from command line editor.executeEdits("typewriter", [{ range: editor.getSelection(), diff --git a/client/src/state/progress.ts b/client/src/state/progress.ts index f5531594..c8c4242d 100644 --- a/client/src/state/progress.ts +++ b/client/src/state/progress.ts @@ -26,7 +26,8 @@ export interface GameProgressState { inventory: string[], difficulty: number, openedIntro: boolean, - data: WorldProgressState + data: WorldProgressState, + typewriterMode?: boolean } /** @@ -126,6 +127,11 @@ export const progressSlice = createSlice({ addGameProgress(state, action) state.games[action.payload.game].openedIntro = action.payload.openedIntro }, + /** set the typewriter mode */ + changeTypewriterMode(state: ProgressState, action: PayloadAction<{game: string, typewriterMode: boolean}>) { + addGameProgress(state, action) + state.games[action.payload.game].typewriterMode = action.payload.typewriterMode + } } }) @@ -196,7 +202,14 @@ export function selectOpenedIntro(game: string) { } } +/** return typewriter mode for the current game if it exists */ +export function selectTypewriterMode(game: string) { + return (state) => { + return state.progress.games[game]?.typewriterMode ?? true + } +} + /** Export actions to modify the progress */ export const { changedSelection, codeEdited, levelCompleted, deleteProgress, deleteLevelProgress, loadProgress, helpEdited, changedInventory, changedOpenedIntro, - changedDifficulty } = progressSlice.actions + changedDifficulty, changeTypewriterMode} = progressSlice.actions