diff --git a/packages/map-designer/src/Parameters.ts b/packages/map-designer/src/Parameters.ts index de36de27..23907f29 100644 --- a/packages/map-designer/src/Parameters.ts +++ b/packages/map-designer/src/Parameters.ts @@ -15,9 +15,9 @@ export class Parameters { static mapTileHalfHeight = 200; - static mapTileOffsetX = 200; + static mapTileOffsetX = 250; - static mapTileOffsetY = 256; + static mapTileOffsetY = 260; static totalCoins = 6000; diff --git a/packages/renderer/src/scenes/TileMap.ts b/packages/renderer/src/scenes/TileMap.ts index 3c9a395c..46ab612e 100644 --- a/packages/renderer/src/scenes/TileMap.ts +++ b/packages/renderer/src/scenes/TileMap.ts @@ -283,7 +283,7 @@ export class TileMap extends Phaser.Scene { onComplete: () => bombSprite.destroy(), }); } - tower.healthBar.setHp(newTowerHp); + tower.setHp(newTowerHp); troop.attack(tower.x, tower.y); }, ); diff --git a/public/assets/tower1.png b/public/assets/tower1.png index a14ce41d..eff7efb2 100644 Binary files a/public/assets/tower1.png and b/public/assets/tower1.png differ diff --git a/public/assets/tower2.png b/public/assets/tower2.png index 26c237b6..64314481 100644 Binary files a/public/assets/tower2.png and b/public/assets/tower2.png differ diff --git a/public/assets/tower3.png b/public/assets/tower3.png index 59b9517a..16392a9a 100644 Binary files a/public/assets/tower3.png and b/public/assets/tower3.png differ diff --git a/src/assets/deltaMap.png b/src/assets/deltaMap.png new file mode 100644 index 00000000..3b364bd5 Binary files /dev/null and b/src/assets/deltaMap.png differ diff --git a/src/components/BattleTV/BattleTV.module.css b/src/components/BattleTV/BattleTV.module.css index 59b51af7..3737720b 100644 --- a/src/components/BattleTV/BattleTV.module.css +++ b/src/components/BattleTV/BattleTV.module.css @@ -70,7 +70,7 @@ } .automatch { - background-color: antiquewhite; + background-color: rgba(92, 129, 136, 0.37) !important; } .item .picholder { diff --git a/src/components/BattleTV/BattleTV.tsx b/src/components/BattleTV/BattleTV.tsx index 571c00b1..fb91f465 100644 --- a/src/components/BattleTV/BattleTV.tsx +++ b/src/components/BattleTV/BattleTV.tsx @@ -32,6 +32,10 @@ function getIcon(loggedInUser: User, match: Match) { return styles.battlecardwin; } else if (match.matchVerdict == Verdict.Player2) { return styles.battlecardlose; + } else if (match.matchVerdict == Verdict.Success) { + return styles.battlecardwin; + } else if (match.matchVerdict == Verdict.Failure) { + return styles.battlecardlose; } } else { // user is PLAYER2 @@ -110,12 +114,15 @@ function PaginatedItems() { ) : ( currentItems && currentItems.map((match: Match) => ( -
+
diff --git a/src/components/Editor/Editor.tsx b/src/components/Editor/Editor.tsx index 9c7d517e..6b028af9 100644 --- a/src/components/Editor/Editor.tsx +++ b/src/components/Editor/Editor.tsx @@ -1,6 +1,6 @@ import * as Editor from './EditorTypes'; import styles from './style.module.css'; -import { useRef, useEffect, useState } from 'react'; +import { useRef, useEffect } from 'react'; import * as monaco from 'monaco-editor'; import { MonacoLanguageClient, @@ -57,7 +57,6 @@ buildWorkerDefinition( export default function CodeEditor(props: Editor.Props): JSX.Element { const divCodeEditor = useRef(null); - let editor: monaco.editor.IStandaloneCodeEditor; const userCode: string = props.page == 'Dashboard' ? useAppSelector(UserCode) @@ -66,11 +65,6 @@ export default function CodeEditor(props: Editor.Props): JSX.Element { const theme: string = useAppSelector(Theme); const autocomplete: boolean = useAppSelector(Autocomplete); const dispatch: React.Dispatch = useAppDispatch(); - const [workspace, setWorkspace] = useState({ - filepath: '', - folderpath: '', - }); - const [currWebsocket, setCurrWebSocket] = useState(); const keyboardHandler = useAppSelector(KeyboardHandler); @@ -94,9 +88,9 @@ export default function CodeEditor(props: Editor.Props): JSX.Element { aliases: ['Java', 'java'], }); - function createLanguageClient( + const createLanguageClient = ( transports: MessageTransports, - ): MonacoLanguageClient { + ): MonacoLanguageClient => { return new MonacoLanguageClient({ name: 'Code Editor Language Client', clientOptions: { @@ -112,49 +106,18 @@ export default function CodeEditor(props: Editor.Props): JSX.Element { }, }, }); - } - - useEffect(() => { - if (!autocomplete) return; - const url = `${lspUrl}/${ - props.language == 'c_cpp' ? 'cpp' : props.language - }`; - const wsClient = new WebSocket(url); - setCurrWebSocket(wsClient); - wsClient.onopen = () => { - const updater = { - operation: 'fileUpdate', - code: userCode, - }; - wsClient.send(JSON.stringify(updater)); - - const filePathRequest = { - operation: 'getAbsPath', - }; - wsClient.send(JSON.stringify(filePathRequest)); - const socket = toSocket(wsClient); - const reader = new WebSocketMessageReader(socket); - reader.listen((message: Message) => { - const fileInfo = message as Message & Editor.Workspace; - setWorkspace({ - filepath: fileInfo.filepath, - folderpath: fileInfo.folderpath, - }); - reader.dispose(); - }); - }; - return () => { - wsClient?.close(1000); - }; - }, [props.language, autocomplete]); + }; - useEffect(() => { - if (!divCodeEditor.current) return; - editor = monaco.editor.create(divCodeEditor.current, { + const createEditor = ( + divref: HTMLDivElement, + workspace: Editor.Workspace | null, + websocket: WebSocket | null, + ) => { + const editor = monaco.editor.create(divref, { model: monaco.editor.createModel( userCode, language == 'c_cpp' ? 'cpp' : language, - monaco.Uri.parse(workspace.filepath), + monaco.Uri.parse(workspace != null ? workspace.filepath : ''), ), fontSize: fontSize, cursorStyle: @@ -181,37 +144,13 @@ export default function CodeEditor(props: Editor.Props): JSX.Element { enabled: true, }, }); - - let languageClient: MonacoLanguageClient; - if (workspace.filepath != '' && currWebsocket != undefined) { - MonacoServices.install({ - workspaceFolders: [ - { - uri: Uri.parse(workspace.folderpath), - name: 'parse folder', - index: 1, - }, - ], - }); - - const socket = toSocket(currWebsocket); - const reader = new WebSocketMessageReader(socket); - const writer = new WebSocketMessageWriter(socket); - languageClient = createLanguageClient({ - reader, - writer, - }); - languageClient.start(); - reader.onClose(() => languageClient.stop()); - } - editor.onDidChangeModelContent(() => { - if (currWebsocket != undefined) { + if (websocket != null) { const currUpdater = { operation: 'fileUpdate', code: editor.getValue(), }; - currWebsocket.send(JSON.stringify(currUpdater)); + websocket.send(JSON.stringify(currUpdater)); } const codeNlanguage: CodeAndLanguage = { currentUserCode: editor.getValue(), @@ -263,46 +202,73 @@ export default function CodeEditor(props: Editor.Props): JSX.Element { }, ); + return editor; + }; + + useEffect(() => { + if (!divCodeEditor.current) return; + let languageClient: MonacoLanguageClient; + let editor: monaco.editor.IStandaloneCodeEditor; + let wsClient: WebSocket; + if (autocomplete) { + const url = `${lspUrl}/${ + props.language == 'c_cpp' ? 'cpp' : props.language + }`; + wsClient = new WebSocket(url); + wsClient.onopen = () => { + const updater = { + operation: 'fileUpdate', + code: userCode, + }; + wsClient.send(JSON.stringify(updater)); + const filePathRequest = { + operation: 'getAbsPath', + }; + wsClient.send(JSON.stringify(filePathRequest)); + const socket = toSocket(wsClient); + const filePathMessageReader = new WebSocketMessageReader(socket); + filePathMessageReader.listen((message: Message) => { + const fileInfo = message as Message & Editor.Workspace; + const workspace: Editor.Workspace = { + filepath: fileInfo.filepath, + folderpath: fileInfo.folderpath, + }; + filePathMessageReader.dispose(); + editor = createEditor( + divCodeEditor.current as HTMLDivElement, + workspace, + wsClient, + ); + MonacoServices.install({ + workspaceFolders: [ + { + uri: Uri.parse(workspace.folderpath), + name: 'Workspace', + index: 1, + }, + ], + }); + const newSocket = toSocket(wsClient); + const writer = new WebSocketMessageWriter(newSocket); + const reader = new WebSocketMessageReader(newSocket); + languageClient = createLanguageClient({ + reader, + writer, + }); + languageClient.start(); + reader.onClose(() => languageClient.stop()); + }); + }; + } else { + editor = createEditor(divCodeEditor.current, null, null); + } return () => { languageClient?.stop(); monaco.editor.getModels().forEach(model => model.dispose()); editor?.dispose(); + wsClient?.close(1000); }; - }, [ - fontSize, - theme, - language, - keyboardHandler, - props.page, - workspace, - currWebsocket, - ]); - - const userCodeChangeHandler = () => { - const codeNlanguage: CodeAndLanguage = { - currentUserCode: editor.getValue(), - currentUserLanguage: language, - }; - dispatch(updateUserCode(codeNlanguage)); - }; - - const dailyChallengeCodechange = () => { - const codeNlanguage: CodeAndLanguage = { - currentUserCode: editor.getValue(), - currentUserLanguage: language, - }; - dispatch(changeDcCode(codeNlanguage)); - }; + }, [fontSize, theme, language, keyboardHandler, props.page, autocomplete]); - return ( -
- ); + return
; } diff --git a/src/components/Home/AboutGame/AboutGame.tsx b/src/components/Home/AboutGame/AboutGame.tsx index 370f3215..eeefc634 100644 --- a/src/components/Home/AboutGame/AboutGame.tsx +++ b/src/components/Home/AboutGame/AboutGame.tsx @@ -1,6 +1,6 @@ import styles from './AboutGame.module.css'; import { Container, Row, Col } from 'react-bootstrap'; -import mapimg from './../../../../src/assets/renderer.jpeg'; +import mapimg from './../../../../src/assets/deltaMap.png'; export default function AboutGame(): JSX.Element { return ( diff --git a/src/components/Leaderboard/DailyLeaderboard.tsx b/src/components/Leaderboard/DailyLeaderboard.tsx index ea09de99..c15a44ba 100644 --- a/src/components/Leaderboard/DailyLeaderboard.tsx +++ b/src/components/Leaderboard/DailyLeaderboard.tsx @@ -102,7 +102,7 @@ function PaginatedItems() { {' ' + row.userName.substring(0, 10)}
- {row.score} + {row.score.toFixed(2)} ))} diff --git a/src/components/Leaderboard/Leaderboard.module.css b/src/components/Leaderboard/Leaderboard.module.css index ec1fae9f..1a5fc607 100644 --- a/src/components/Leaderboard/Leaderboard.module.css +++ b/src/components/Leaderboard/Leaderboard.module.css @@ -121,6 +121,17 @@ margin-right: 5px; border: none; padding: 15px 30px; + max-width: 0.8rem; + overflow-x: auto; +} +.list .item .name::-webkit-scrollbar { + display: none; + overflow-x: scroll; +} + +.list .name .name { + -ms-overflow-style: none; + scrollbar-width: none; } .list .item .score { @@ -169,11 +180,11 @@ padding: 15px 30px; } -.attackButton > img { +.attackButton>img { transition: all 0.3s ease-in-out; } -.attackButton > img:hover { +.attackButton>img:hover { transform: scale(1.15); cursor: pointer; } @@ -203,26 +214,26 @@ list-style: none; } -.menuText{ +.menuText { color: #aaaaaa; font-family: 'Poppins'; } -.menuBackground{ - background-color:#1e1e1e !important; -} +.menuBackground { + background-color: #1e1e1e !important; +} .matchHeader { background-color: #232627; - backdrop-filter: blur(100px); + backdrop-filter: blur(100px); height: 9vh; border: 0px; } -.headerText{ +.headerText { font-family: 'Poppins'; font-size: 28px; - color:#aaaaaa; + color: #aaaaaa; font-weight: bold; } @@ -254,7 +265,8 @@ border-radius: 5px; font-family: 'Poppins'; } -.content{ + +.content { background-color: transparent; } @@ -286,4 +298,4 @@ .dropdown-toggle { color: #aaaaaa; background-color: #ffffff; -} +} \ No newline at end of file diff --git a/src/components/Leaderboard/Leaderboard.tsx b/src/components/Leaderboard/Leaderboard.tsx index 5bfc4468..4fb05eaa 100644 --- a/src/components/Leaderboard/Leaderboard.tsx +++ b/src/components/Leaderboard/Leaderboard.tsx @@ -160,7 +160,9 @@ function PaginatedItems() { className={styles.pic} src={getAvatarByID(row.user.avatarId).url} > - {' ' + row.user.username.substring(0, 10)} + + {' ' + row.user.username.substring(0, 10)} +
@@ -237,6 +239,7 @@ function PaginatedItems() { onClick={() => { setActiveTier(undefined); fetchLeaderboardByTier(0); + setPage(0); }} > All Tiers @@ -246,6 +249,7 @@ function PaginatedItems() { onClick={() => { setActiveTier(TierType.Tier1); fetchLeaderboardByTier(0, TierType.Tier1); + setPage(0); }} > Tier 1 @@ -255,6 +259,7 @@ function PaginatedItems() { onClick={() => { setActiveTier(TierType.Tier2); fetchLeaderboardByTier(0, TierType.Tier2); + setPage(0); }} > Tier 2