From f08105c39f3385ec2b1979c6bfc83e6c3245322e Mon Sep 17 00:00:00 2001 From: Daniel Ledda Date: Sun, 24 May 2020 11:46:17 +0200 Subject: [PATCH] Can't quite tell what's changed --- package.json | 5 +- public/index.html | 2 +- public/static/favicon.ico | Bin 3150 -> 0 bytes public/static/manifest.json | 25 -------- public/static/robots.txt | 3 - src/App.tsx | 57 ++++++++++++++++-- src/Components/Game.tsx | 1 - src/Components/GameSetup.tsx | 84 ++++++++------------------- src/Components/KadiBlockRenderer.tsx | 3 +- src/Components/KadiBoard.tsx | 12 ++-- src/Components/KadiGrandTotalRow.tsx | 2 +- src/LocaleContext.ts | 19 ++++++ src/UserContext.ts | 17 ++++++ src/index.tsx | 2 + src/logo.svg | 7 --- src/static/css/game.css | 14 ++--- src/static/enums.ts | 2 +- src/static/settings.json | 1 - src/static/strings.ts | 19 ++---- webpack.config.js | 6 +- 20 files changed, 144 insertions(+), 137 deletions(-) delete mode 100755 public/static/favicon.ico delete mode 100755 public/static/manifest.json delete mode 100755 public/static/robots.txt create mode 100755 src/LocaleContext.ts create mode 100755 src/UserContext.ts delete mode 100755 src/logo.svg diff --git a/package.json b/package.json index a00c356..12341ad 100755 --- a/package.json +++ b/package.json @@ -6,8 +6,9 @@ "license": "ISC", "author": "Daniel Ledda", "scripts": { - "build": "webpack --mode development", - "postbuild": "rsync -avu --delete dist/ ../kadi_backend/dist/game/static", + "build-dev": "webpack --mode development && postbuild", + "build": "webpack --mode production", + "postbuild": "rsync -avu --delete dist/ ../kadi_backend/static/game", "start": "webpack-dev-server --mode development", "test": "echo \"Error: no test specified\" && exit 1" }, diff --git a/public/index.html b/public/index.html index 104521c..3a4647d 100755 --- a/public/index.html +++ b/public/index.html @@ -2,7 +2,7 @@ - + N%%Bp7T4;J@?%2_x=5zbI<2~->=X60stMr0B~{wzpi9D0MG|# zyuANt7z6;uz%?PEfAnimLl^)6h5ARwGXemG2>?hqQv-I^Gpyh$JH}Ag92}3{$a#z& zd`il2Sb#$U&e&4#^4R|GTgk!Qs+x*PCL{2+`uB5mqtnqLaaw`*H2oqJ?XF(zUACc2 zSibBrdQzcidqv*TK}rpEv1ie&;Famq2IK5%4c}1Jt2b1x_{y1C!?EU)@`_F)yN*NK z)(u03@%g%uDawwXGAMm%EnP9FgoucUedioDwL~{6RVO@A-Q$+pwVRR%WYR>{K3E&Q zzqzT!EEZ$_NHGYM6&PK#CGUV$pTWsiI5#~m>htoJ!vbc0=gm3H8sz8KzIiVN5xdCT z%;}`UH2Pc8))1VS-unh?v4*H*NIy5On{MRKw7BTmOO9oE2UApwkCl9Z?^dod9M^#w z51tEZhf+#dpTo#GDDy#kuzoIjMjZ?%v*h$ z*vwUMOjGc?R0(FjLWkMD)kca4z6~H45FIzQ!Zzu&-yWyMdCBsDr2`l}Q{8fH$H@O< z$&snNzbqLk?(GIe?!PVh?F~2qk4z^rMcp$P^hw^rUPjyCyoNTRw%;hNOwrCoN?G0E z!wT^=4Loa9@O{t;Wk(Nj=?ms1Z?UN_;21m%sUm?uib=pg&x|u)8pP#l--$;B9l47n zUUnMV0sXLe*@Gvy>XWjRoqc2tOzgYn%?g@Lb8C&WsxV1Kjssh^ZBs*Ysr+E6%tsC_ zCo-)hkYY=Bn?wMB4sqm?WS>{kh<6*DO)vXnQpQ9`-_qF6!#b;3Nf@;#B>e2j$yokl6F|9p1<($2 z=WSr%)Z?^|r6njhgbuMrIN>8JE05u0x5t@_dEfbGn9r0hK4c2vp>(*$GXsjeLL_uz zWpyfUgdv!~-2N;llVzik#s2*XB*%7u8(^sJv&T3pzaR&<9({17Zs~UY>#ugZZkHBs zD+>0_an$?}utGp$dcXtyFHnTQZJ}SF=oZ}X07dz~K>^o(vjTzw8ZQc!Fw1W=&Z?9% zv63|~l}70sJbY?H8ON8j)w5=6OpXuaZ}YT03`2%u8{;B0Vafo_iY7&BiQTbRkdJBYL}?%ATfmc zLG$uXt$@3j#OIjALdT&Ut$=9F8cgV{w_f5eS)PjoVi z&oemp-SKJ~UuGuCP1|iY?J^S&P z)-IG?O-*=z6kfZrX5H*G=aQ{ZaqnOqP@&+_;nq@mA>EcjgxrYX8EK|Iq4&E&rxR?R z8N$QOdRwY zr{P`O)=87>YLHtFfGXW z6P)ucrhj~It_9w<^v5>T6N1U}+BkS))=WX*2JY=}^b2czGhH<`?`(}}qMcpPx_%>M zM|fs(+I1m&_h(zqp-HgP>re$2O^o$q)xu#fl0ivOJE({duU)a*OD(eYgSi^cdTn}pqcPM(;S)2%1By^Wh%-CaC%>d9hi`7J zaxL7@;nhA>PE%s99&;z{8>VFgf{u!(-B-x7Of6ueme+ScryL`h(^qKE)DtieWY>-7 zgB)VJESQS4*1LU(2&@pgLvSt{(((C?K_V(rQk``i&5}ZPG;G^FiPlZ$7|-vEmMWlU z5lQ%iK2nu=h2wd_7>gK@vX=*AG+u~rQP$NwPC`ZA?4nh{3tui1x@bT6-;Rk3yDQ>d z?3qRD#+PeV7#FAa>s`Xwxsx_oRFcN$StW2=CW`=qObsT?SD^#^jM1Yk}PSPxJ zG@-_mnNU_)vM|iLRSI>UMp|hatyS}17R{10IuL0TLlupt>9dRs_SPQbv7BLYyC#qv16E-y@XZ= z-!p7I%#r-BVi$nQq3&ssRc_IC%R6$tA&^s_l46880~Wst3@>(|EO<}T4~ci~#!=e; zD)B>o%1+$ksURD1p7I-<3ehlFyVkqrySf&gg>Bp0Z9?JaG|gyTZ{Cb8SdvAWVmFX7v2ohs!OCc!Udk zUITUpmZ33rKLI#(&lDj}cKA#dpL4Fil=$5pu_wi1XJR!llw` zSItPBDEdMHk2>c7#%lBxZHHvtVUOZ$}v?=?AT~9!Jcqa@IJGuMg(s^7r>pcTrd)pS`{5Cu8WPey` z9)!!OUUY@L%9Q+bZa*S5`3f_|lFCPN6kdp_M2>{le8;cn^XUsPa+TUk47qd6)IBR% zk*&Ip?!Ge_gmmdj)BX}P_5o@VI2*wbZ^>UhFju}0gQZh!pP%4XT9{@w;G#b3XK8sN zF(7i$Jv(IM$8Akys9dhP^^~H2(7BfJp}yDW1#@!CL-!mGcSCnJ599WK9MV@yo_u$v MDeX2GIKR{Qf5okjU;qFB diff --git a/public/static/manifest.json b/public/static/manifest.json deleted file mode 100755 index 080d6c7..0000000 --- a/public/static/manifest.json +++ /dev/null @@ -1,25 +0,0 @@ -{ - "short_name": "React App", - "name": "Create React App Sample", - "icons": [ - { - "src": "favicon.ico", - "sizes": "64x64 32x32 24x24 16x16", - "type": "image/x-icon" - }, - { - "src": "logo192.png", - "type": "image/png", - "sizes": "192x192" - }, - { - "src": "logo512.png", - "type": "image/png", - "sizes": "512x512" - } - ], - "start_url": ".", - "display": "standalone", - "theme_color": "#000000", - "background_color": "#ffffff" -} diff --git a/public/static/robots.txt b/public/static/robots.txt deleted file mode 100755 index e9e57dc..0000000 --- a/public/static/robots.txt +++ /dev/null @@ -1,3 +0,0 @@ -# https://www.robotstxt.org/robotstxt.html -User-agent: * -Disallow: diff --git a/src/App.tsx b/src/App.tsx index 1067fdc..34eb7ba 100755 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,25 +1,74 @@ import React, {ReactNode} from "react"; import Game from "./Components/Game"; -import {LocaleContext, localeDefaultVal} from "./static/strings"; import "semantic-ui-css/semantic.min.css"; +import {SupportedLang} from "./static/enums"; +import {IntlStrings} from "./static/strings"; +import UserContext, {IUserContext} from "./UserContext"; +import LocaleContext, {ILocaleContext} from "./LocaleContext"; +import axios from "axios"; +import {SERVER_BASE_NAME} from "./index"; interface AppState { + userContext: IUserContext; + localeContext: ILocaleContext; } interface AppProps {} class App extends React.Component { + private readonly updateUserContext: (username: string, loggedIn: boolean) => void; + private readonly changeLang: (lang: SupportedLang) => void; constructor(props: AppProps) { super(props); - this.state = { + this.updateUserContext = (username, loggedIn) => { + this.setState({userContext: { + username: username, + loggedIn: loggedIn, + updateUserContext: this.updateUserContext + }}); }; + + this.changeLang = (lang: SupportedLang) => { + if (lang in SupportedLang) { + this.setState({localeContext: { + strings: IntlStrings[lang], + currentLang: lang, + changeLang: this.changeLang + }}); + } + }; + + this.state = { + userContext: { + username: "", + loggedIn: false, + updateUserContext: this.updateUserContext, + }, + localeContext: { + currentLang: SupportedLang.gb, + strings: IntlStrings[SupportedLang.gb], + changeLang: this.changeLang, + } + }; + } + + componentDidMount(): void { + axios.get("/api/user", {baseURL: SERVER_BASE_NAME}) + .then((res) => { + const data = res.data as any; + this.updateUserContext(data.username, true); + this.changeLang(data.lang); + }) + .catch(err => console.log(err)); } render(): ReactNode { return ( - - + + + + ); } diff --git a/src/Components/Game.tsx b/src/Components/Game.tsx index 485a1a7..ecead83 100755 --- a/src/Components/Game.tsx +++ b/src/Components/Game.tsx @@ -21,7 +21,6 @@ class Game extends React.Component { const startupSettings: GameSettings = { playerIds: Settings.players, ruleset: Settings.ruleset, - lang: Settings.lang as SupportedLang }; this.state = { diff --git a/src/Components/GameSetup.tsx b/src/Components/GameSetup.tsx index 2f9e6f3..d118fc5 100755 --- a/src/Components/GameSetup.tsx +++ b/src/Components/GameSetup.tsx @@ -1,7 +1,25 @@ import React, {ChangeEvent, FocusEvent, KeyboardEvent, ReactNode} from "react"; import {getSchemaListings, SchemaListing} from "../static/rulesets"; -import {LocaleContext, LanguageNames} from "../static/strings"; +import {LanguageNames} from "../static/strings"; +import LocaleContext from "../LocaleContext"; import {SupportedLang} from "../static/enums"; +import {Button} from "semantic-ui-react"; + +interface GameSetupProps { + onSetupComplete: (settings: GameSettings) => void; + settings: GameSettings; +} + +interface GameSetupState { + selectedRuleset: string; + enteredPlayerIds: string[]; + editingPlayerName: boolean; +} + +export interface GameSettings { + ruleset: string; + playerIds: string[]; +} class GameSetup extends React.Component { private readonly availableRulesets: SchemaListing[]; @@ -14,22 +32,12 @@ class GameSetup extends React.Component { this.availableRulesets = getSchemaListings(); this.changeLang = () => {}; this.state = { - selectedLang: this.props.settings.lang, selectedRuleset: this.props.settings.ruleset, enteredPlayerIds: this.props.settings.playerIds, editingPlayerName: false, }; } - componentDidMount(): void { - this.changeLang = this.context.changeLang; - } - - onLanguageChange: (lang: SupportedLang) => void = (lang) => { - this.setState({ selectedLang: lang }); - this.changeLang(lang); - }; - onRulesetChange: (ruleset: string) => void = (ruleset) => { this.setState({ selectedRuleset: ruleset }); }; @@ -52,31 +60,12 @@ class GameSetup extends React.Component { this.props.onSetupComplete({ ruleset: this.state.selectedRuleset, playerIds: this.state.enteredPlayerIds, - lang: this.state.selectedLang, }); }; render(): ReactNode { const Locale = this.context.strings; - const langOptions: ReactNode[] = []; - for (const lang in SupportedLang) { - let className = "option"; - if (this.state.selectedLang === lang) { - className += " selected"; - } - langOptions.push(( -
this.onLanguageChange(lang as SupportedLang)} - > - {LanguageNames[lang as SupportedLang]} - -
- )); - } - const rulesetOptions: ReactNode[] = []; for (const rulesetListing of this.availableRulesets) { let className = "option"; @@ -143,24 +132,15 @@ class GameSetup extends React.Component { {rulesetOptions} -
-
- - {Locale.setupScreen.selectLanguage} - -
-
- {langOptions} -
-
- +
@@ -170,24 +150,6 @@ class GameSetup extends React.Component { } GameSetup.contextType = LocaleContext; -interface GameSetupProps { - onSetupComplete: (settings: GameSettings) => void; - settings: GameSettings; -} - -interface GameSetupState { - selectedLang: SupportedLang; - selectedRuleset: string; - enteredPlayerIds: string[]; - editingPlayerName: boolean; -} - -export interface GameSettings { - ruleset: string; - playerIds: string[]; - lang: SupportedLang; -} - const AddPlayerField: React.FunctionComponent = ({playersListEmpty, submitNewPlayer, userEditing}) => { const Locale = React.useContext(LocaleContext).strings; diff --git a/src/Components/KadiBlockRenderer.tsx b/src/Components/KadiBlockRenderer.tsx index 4dd3745..348bdf4 100755 --- a/src/Components/KadiBlockRenderer.tsx +++ b/src/Components/KadiBlockRenderer.tsx @@ -1,7 +1,7 @@ import {BlockDef} from "../static/rulesets"; import {CellLocation} from "../Classes/PlayerScoreCard"; import React, {ReactElement} from "react"; -import {formatUnicorn, LocaleContext} from "../static/strings"; +import {formatUnicorn} from "../static/strings"; import {FieldType} from "../static/enums"; import {BlockScores, CellEventResponse} from "./KadiBoard"; import GenericKadiRowContainer from "./GenericKadiRowContainer"; @@ -9,6 +9,7 @@ import KadiEditableRowCells from "./KadiEditableRowCells"; import KadiBlockTotalRow from "./KadiBlockTotalRow"; import KadiBlockSubtotalRow from "./KadiBlockSubtotalRow"; import KadiBlockBonusRow from "./KadiBlockBonusRow"; +import LocaleContext from "../LocaleContext"; interface BlockRendererProps { blockSchema: BlockDef; diff --git a/src/Components/KadiBoard.tsx b/src/Components/KadiBoard.tsx index d47c4e2..ad5ff4e 100755 --- a/src/Components/KadiBoard.tsx +++ b/src/Components/KadiBoard.tsx @@ -1,7 +1,8 @@ import React, {ReactElement, ReactNode, useContext} from "react"; import PlayerScoreCard, {CellLocation, PlayerScoreCardJSONRepresentation} from "../Classes/PlayerScoreCard"; import {BlockDef, GameSchema, getGameSchemaById} from "../static/rulesets"; -import {formatUnicorn, LocaleContext} from "../static/strings"; +import {formatUnicorn} from "../static/strings"; +import LocaleContext from "../LocaleContext"; import {CellFlag} from "../static/enums"; import {ScoreCellValue} from "../Classes/ScoreCell"; import {CaretakerSet} from "../Classes/Caretaker"; @@ -131,11 +132,14 @@ class KadiBoard extends React.Component { } private getJSONRepresentationForBoard(): string { - const JSONRepresentation: PlayerScoreCardJSONRepresentation[] = []; + const JSONScoreCards: PlayerScoreCardJSONRepresentation[] = []; for (const playerId in this.state.scoreSheet) { - JSONRepresentation.push(this.state.scoreSheet[playerId].getJSONRepresentation()); + JSONScoreCards.push(this.state.scoreSheet[playerId].getJSONRepresentation()); } - return JSON.stringify(JSONRepresentation); + return JSON.stringify({ + gameType: this.gameSchema.id, + results: JSONScoreCards + }); } private canSave(): boolean { diff --git a/src/Components/KadiGrandTotalRow.tsx b/src/Components/KadiGrandTotalRow.tsx index 0e9618a..2612ae0 100755 --- a/src/Components/KadiGrandTotalRow.tsx +++ b/src/Components/KadiGrandTotalRow.tsx @@ -1,5 +1,5 @@ import React, {ReactNode} from "react"; -import {LocaleContext} from "../static/strings"; +import LocaleContext from "../LocaleContext"; import KadiCell from "./KadiCell"; import {FieldType} from "../static/enums"; import {Icon} from "semantic-ui-react"; diff --git a/src/LocaleContext.ts b/src/LocaleContext.ts new file mode 100755 index 0000000..ee42f91 --- /dev/null +++ b/src/LocaleContext.ts @@ -0,0 +1,19 @@ +import {SupportedLang} from "./static/enums"; +import React from "react"; +import {IntlStrings} from "./static/strings"; + +export interface ILocaleContext { + currentLang: SupportedLang; + strings: any; + changeLang: (lang: SupportedLang) => void; +} + +export const localeDefaultVal: ILocaleContext = { + currentLang: SupportedLang.gb, + strings: IntlStrings[SupportedLang.gb as SupportedLang], + changeLang: () => {}, +}; + +const LocaleContext = React.createContext(localeDefaultVal); + +export default LocaleContext; \ No newline at end of file diff --git a/src/UserContext.ts b/src/UserContext.ts new file mode 100755 index 0000000..a099de1 --- /dev/null +++ b/src/UserContext.ts @@ -0,0 +1,17 @@ +import React from "react"; + +export interface IUserContext { + username: string; + loggedIn: boolean; + updateUserContext: (username: string, loggedIn: boolean) => void; +} + +const userDefaultVal = { + loggedIn: false, + username: "", + updateUserContext: () => {}, +} as IUserContext; + +const UserContext = React.createContext(userDefaultVal); + +export default UserContext; \ No newline at end of file diff --git a/src/index.tsx b/src/index.tsx index 27a77cb..1acefcd 100755 --- a/src/index.tsx +++ b/src/index.tsx @@ -4,6 +4,8 @@ import App from "./App"; import * as serviceWorker from "./serviceWorker"; import "./filetypes.d"; +export const SERVER_BASE_NAME = "/kadi"; + ReactDOM.render(( diff --git a/src/logo.svg b/src/logo.svg deleted file mode 100755 index 91e6951..0000000 --- a/src/logo.svg +++ /dev/null @@ -1,7 +0,0 @@ -svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3"> - - - - - - diff --git a/src/static/css/game.css b/src/static/css/game.css index d80d2e9..8aa3635 100755 --- a/src/static/css/game.css +++ b/src/static/css/game.css @@ -74,7 +74,7 @@ input[type="number"] { } -.kniffelTable { +.kadiTable { margin-left: auto; margin-right: auto; border: var(--thick-border); @@ -82,27 +82,27 @@ input[type="number"] { border-radius: var(--outer-radius); } -.kniffelCell, +.kadiCell, .rowLabelCell, .playerNameCell, .topLeftBlankCell { background-color: var(--bg-cells); } -.kniffelCell.editable { +.kadiCell.editable { background-color: var(--bg-cells); transition: background-color 100ms; } -.kniffelCell.editable:hover { +.kadiCell.editable:hover { background-color: var(--bg-cell-hover); } -tr.subtotalField > .kniffelCell { +tr.subtotalField > .kadiCell { border-top: var(--thick-border); } -tr.totalField > .kniffelCell, +tr.totalField > .kadiCell, .playerNameCell, .topLeftBlankCell { border-top: var(--thick-border); @@ -114,7 +114,7 @@ tr.totalField > .kniffelCell, border-right: var(--thick-border); } -.kniffelTable > thead { +.kadiTable > thead { font-size: xx-large; text-align: center; background-color: var(--bg-border); diff --git a/src/static/enums.ts b/src/static/enums.ts index f9ca071..4339058 100755 --- a/src/static/enums.ts +++ b/src/static/enums.ts @@ -15,7 +15,7 @@ export enum CellFlag { } export enum SupportedLang { - en = "en", + gb = "gb", de = "de", it = "it", } \ No newline at end of file diff --git a/src/static/settings.json b/src/static/settings.json index 3807dd7..0924150 100755 --- a/src/static/settings.json +++ b/src/static/settings.json @@ -1,5 +1,4 @@ { - "lang": "en", "players": [], "ruleset": "default_en", "maxHistoryLength": 256, diff --git a/src/static/strings.ts b/src/static/strings.ts index 063adfd..d4bf683 100755 --- a/src/static/strings.ts +++ b/src/static/strings.ts @@ -22,13 +22,13 @@ export function formatUnicorn(fmt: string, ...args: string[]): string { } export const LanguageNames: Record = { - en: "English", + gb: "English", de: "Deutsch", it: "Italiano", }; -const IntlStrings = { - en: { +export const IntlStrings = { + gb: { rowLabels: { subtotal: "Subtotal", bonus: "Bonus", @@ -123,15 +123,4 @@ const IntlStrings = { players: "Giocatori:", }, }, -} as const; - -export const localeDefaultVal = { - strings: IntlStrings[Settings.lang as SupportedLang], - changeLang: changeLang, -}; - -export const LocaleContext = React.createContext(localeDefaultVal); - -export function changeLang(newLang: SupportedLang): void { - localeDefaultVal.strings = IntlStrings[newLang]; -} \ No newline at end of file +} as const; \ No newline at end of file diff --git a/webpack.config.js b/webpack.config.js index d16b73a..8433349 100755 --- a/webpack.config.js +++ b/webpack.config.js @@ -3,7 +3,7 @@ const webpack = require("webpack"); module.exports = { entry: "./src/index.tsx", - mode: "development", + mode: "production", module: { rules: [ { @@ -38,13 +38,13 @@ module.exports = { resolve: { extensions: [".tsx", ".ts", ".js", "*"] }, output: { path: path.resolve(__dirname, "dist/"), - publicPath: "/kadi/game/static/", + publicPath: "/kadi/static/game/", filename: "bundle.js" }, devServer: { contentBase: path.join(__dirname, "public/"), port: 3000, - publicPath: "http://localhost:3000/dist/", + publicPath: "http://localhost:3000/", hotOnly: true }, plugins: [new webpack.HotModuleReplacementPlugin()]