phc
/
lean4game
6
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

experiment with json rpc on client

Browse Source
pull/43/head
Alexander Bentkamp 2 years ago
parent 303e0d6e94
commit 796ebfeaab
3 changed files with 64 additions and 15 deletions
Show Stats Download Patch File Download Diff File

42
client/src/App.tsx
Unescape Escape View File

@ -1,8 +1,7 @@
import * as React from 'react';
import { useState } from 'react';
import { useState, useEffect } from 'react';
import { MathJaxContext } from "better-react-mathjax";
import useWebSocket from 'react-use-websocket';
import * as rpc from 'vscode-ws-jsonrpc';
import '@fontsource/roboto/300.css';
import '@fontsource/roboto/400.css';
@ -14,6 +13,7 @@ import { AppBar, CssBaseline, Toolbar, Typography } from '@mui/material';
import Welcome from './components/Welcome';
import Level from './components/Level';
import GoodBye from './components/GoodBye';
import useWebSocket from 'react-use-websocket';
function App() {
const [title, setTitle] = useState("")
@ -22,9 +22,23 @@ function App() {
const [nbLevels, setNbLevels] = useState(0)
const [curLevel, setCurLevel] = useState(0)
const [finished, setFinished] = useState(false)
const [rpcConnection, setRpcConnection] = useState(null)
const socketUrl = 'ws://' + window.location.host + '/websocket/'
const { sendJsonMessage, lastMessage, lastJsonMessage } = useWebSocket(socketUrl)
const { sendJsonMessage, getWebSocket } = useWebSocket(socketUrl, {
onOpen: function (ev) {
const logger = new rpc.ConsoleLogger();
const socket = rpc.toSocket(ev.target as WebSocket);
let rpcConnection = rpc.createWebSocketConnection(socket, logger)
setRpcConnection(rpcConnection);
rpcConnection.listen();
rpcConnection.onNotification("Hello!", () => {
console.log("Yes"); // This prints Hello World
});
rpcConnection.sendNotification("Hello!", 'Hello World');
}
})
const mathJaxConfig = {
loader: {
@ -41,15 +55,15 @@ function App() {
function startGame() {
setCurLevel(1)
}
let mainComponent;
if (finished) {
mainComponent = <GoodBye message={conclusion} />
} else if (curLevel > 0) {
mainComponent = <Level sendJsonMessage={sendJsonMessage} lastMessage={lastMessage} lastJsonMessage={lastJsonMessage} nbLevels={nbLevels} level={curLevel} setCurLevel={setCurLevel} setLevelTitle={setLevelTitle} setFinished={setFinished}/>
} else {
mainComponent = <Welcome sendJsonMessage={sendJsonMessage} lastMessage={lastMessage} lastJsonMessage={lastJsonMessage} setNbLevels={setNbLevels} setTitle={setTitle} startGame={startGame} setConclusion={setConclusion}/>
}
// let mainComponent;
// if (finished) {
// mainComponent = <GoodBye message={conclusion} />
// } else if (curLevel > 0) {
// mainComponent = <Level sendJsonMessage={sendJsonMessage} lastMessage={lastMessage} lastJsonMessage={lastJsonMessage} nbLevels={nbLevels} level={curLevel} setCurLevel={setCurLevel} setLevelTitle={setLevelTitle} setFinished={setFinished}/>
// } else {
// mainComponent = <Welcome sendJsonMessage={sendJsonMessage} lastMessage={lastMessage} lastJsonMessage={lastJsonMessage} setNbLevels={setNbLevels} setTitle={setTitle} startGame={startGame} setConclusion={setConclusion}/>
// }
return (
<div className="App">
@ -65,7 +79,7 @@ function App() {
</Typography>
</Toolbar>
</AppBar>
{mainComponent}
{/* {mainComponent} */}
</MathJaxContext>
</div>
)

34
package-lock.json generated
Unescape Escape View File

@ -18,6 +18,7 @@
"react-dom": "^18.2.0",
"react-markdown": "^8.0.3",
"react-use-websocket": "^4.2.0",
"vscode-ws-jsonrpc": "^2.0.0",
"ws": "^8.9.0"
},
"devDependencies": {
@ -7567,6 +7568,26 @@
"url": "https://opencollective.com/unified"
}
},
"node_modules/vscode-jsonrpc": {
"version": "8.0.2",
"resolved": "https://registry.npmjs.org/vscode-jsonrpc/-/vscode-jsonrpc-8.0.2.tgz",
"integrity": "sha512-RY7HwI/ydoC1Wwg4gJ3y6LpU9FJRZAUnTYMXthqhFXXu77ErDd/xkREpGuk4MyYkk4a+XDWAMqe0S3KkelYQEQ==",
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/vscode-ws-jsonrpc": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/vscode-ws-jsonrpc/-/vscode-ws-jsonrpc-2.0.0.tgz",
"integrity": "sha512-FgTx05ARqmh2gy9k/e4imvr+7wVSXzd8AXE/Rd9d/eDXQwJPbaa7w+PLiswo3MX5FY0Ujk143w2ezELN/Dp14Q==",
"dependencies": {
"vscode-jsonrpc": "^8.0.2"
},
"engines": {
"node": ">=16.11.0",
"npm": ">=8.0.0"
}
},
"node_modules/watchpack": {
"version": "2.4.0",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.0.tgz",
@ -13509,6 +13530,19 @@
"unist-util-stringify-position": "^3.0.0"
}
},
"vscode-jsonrpc": {
"version": "8.0.2",
"resolved": "https://registry.npmjs.org/vscode-jsonrpc/-/vscode-jsonrpc-8.0.2.tgz",
"integrity": "sha512-RY7HwI/ydoC1Wwg4gJ3y6LpU9FJRZAUnTYMXthqhFXXu77ErDd/xkREpGuk4MyYkk4a+XDWAMqe0S3KkelYQEQ=="
},
"vscode-ws-jsonrpc": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/vscode-ws-jsonrpc/-/vscode-ws-jsonrpc-2.0.0.tgz",
"integrity": "sha512-FgTx05ARqmh2gy9k/e4imvr+7wVSXzd8AXE/Rd9d/eDXQwJPbaa7w+PLiswo3MX5FY0Ujk143w2ezELN/Dp14Q==",
"requires": {
"vscode-jsonrpc": "^8.0.2"
}
},
"watchpack": {
"version": "2.4.0",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.0.tgz",

3
package.json
Unescape Escape View File

@ -14,6 +14,7 @@
"react-dom": "^18.2.0",
"react-markdown": "^8.0.3",
"react-use-websocket": "^4.2.0",
"vscode-ws-jsonrpc": "^2.0.0",
"ws": "^8.9.0"
},
"devDependencies": {
@ -28,10 +29,10 @@
"concurrently": "^7.4.0",
"css-loader": "^6.7.1",
"nodemon": "^2.0.20",
"react-refresh": "^0.14.0",
"style-loader": "^3.3.1",
"ts-loader": "^9.4.1",
"typescript": "^4.8.4",
"react-refresh": "^0.14.0",
"webpack": "^5.74.0",
"webpack-cli": "^4.10.0",
"webpack-dev-server": "^4.11.1",

Write Preview
Loading…
Cancel
Save