GuillaumeHemmen/pokemon-js
1
0
Fork 0
mirror of https://github.com/chase-manning/pokemon-js.git synced 2025-09-08 08:47:13 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

✨ add ability to teleport

Browse source
This commit is contained in:
Chase Manning 2023-10-13 15:00:50 +01:00
commit 819870208a
2 changed files with 25 additions and 13 deletions

31
src/components/MapChangeHandler.tsx
View file

@ -1,8 +1,13 @@
import styled from "styled-components"; import styled from "styled-components";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
import { exitMap, selectPos, selectMap, setMap } from "../state/gameSlice"; import {
exitMap,
selectPos,
selectMap,
setMap,
setMapWithPos,
} from "../state/gameSlice";
import { useEffect } from "react"; import { useEffect } from "react";
import { MapId } from "../maps/map-types";
import emitter, { Event } from "../app/emitter"; import emitter, { Event } from "../app/emitter";
import { isExit } from "../app/map-helper"; import { isExit } from "../app/map-helper";
import { selectBlackScreen, setBlackScreen } from "../state/uiSlice"; import { selectBlackScreen, setBlackScreen } from "../state/uiSlice";
@ -32,19 +37,19 @@ const MapChangeHandler = () => {
useEffect(() => { useEffect(() => {
const nextMap = map.maps[pos.y] ? map.maps[pos.y][pos.x] : null; const nextMap = map.maps[pos.y] ? map.maps[pos.y][pos.x] : null;
const exit = isExit(map.exits, pos.x, pos.y); const exit = isExit(map.exits, pos.x, pos.y);
const teleport =
map.teleports && map.teleports[pos.y]
? map.teleports[pos.y][pos.x]
: null;
if (!nextMap && !exit) return; if (!nextMap && !exit && !teleport) return;
if (darkScreen) return; if (darkScreen) return;
const updateMap = (map_?: MapId) => { const transition = (action: () => void) => {
dispatch(setBlackScreen(true)); dispatch(setBlackScreen(true));
setTimeout(() => { setTimeout(() => {
emitter.emit(Event.EnterDoor); emitter.emit(Event.EnterDoor);
if (map_) { action();
dispatch(setMap(map_));
} else {
dispatch(exitMap());
}
}, 300); }, 300);
setTimeout(() => { setTimeout(() => {
dispatch(setBlackScreen(false)); dispatch(setBlackScreen(false));
@ -52,11 +57,13 @@ const MapChangeHandler = () => {
}; };
if (nextMap) { if (nextMap) {
updateMap(nextMap); transition(() => dispatch(setMap(nextMap)));
} else if (exit) { } else if (exit) {
updateMap(); transition(() => dispatch(exitMap()));
} else if (teleport) {
transition(() => dispatch(setMapWithPos(teleport)));
} }
}, [pos, map.maps, dispatch, map.exits, darkScreen]); }, [pos, map.maps, dispatch, map.exits, darkScreen, map.teleports]);
return <Overlay $show={darkScreen} />; return <Overlay $show={darkScreen} />;
}; };

7
src/state/gameSlice.ts
View file

@ -1,6 +1,6 @@
import { createSlice, PayloadAction } from "@reduxjs/toolkit"; import { createSlice, PayloadAction } from "@reduxjs/toolkit";
import { RootState } from "./store"; import { RootState } from "./store";
import { MapId, MapItemType, TrainerType } from "../maps/map-types"; import { MapId, MapItemType, MapWithPos, TrainerType } from "../maps/map-types";
import palletTown from "../maps/pallet-town"; import palletTown from "../maps/pallet-town";
import { getPokemonStats } from "../app/use-pokemon-stats"; import { getPokemonStats } from "../app/use-pokemon-stats";
import mapData from "../maps/map-data"; import mapData from "../maps/map-data";
@ -146,6 +146,10 @@ export const gameSlice = createSlice({
const map = mapData[action.payload]; const map = mapData[action.payload];
state.pos = map.start; state.pos = map.start;
}, },
setMapWithPos: (state, action: PayloadAction<MapWithPos>) => {
state.map = action.payload.map;
state.pos = action.payload.pos;
},
exitMap(state) { exitMap(state) {
const map = mapData[state.map]; const map = mapData[state.map];
if (!map) return; if (!map) return;
@ -345,6 +349,7 @@ export const {
moveDown, moveDown,
setMap, setMap,
setPos, setPos,
setMapWithPos,
exitMap, exitMap,
setMoving, setMoving,
addInventory, addInventory,