diff --git a/client/src/components/GameBoard.css b/client/src/components/GameBoard.css
index 264bb20..f4f8302 100644
--- a/client/src/components/GameBoard.css
+++ b/client/src/components/GameBoard.css
@@ -21,3 +21,8 @@
border-collapse: collapse;
text-align: center;
}
+
+.gameboard td {
+ color: yellow;
+ font-weight: bold;;
+}
diff --git a/client/src/components/GameBoard.jsx b/client/src/components/GameBoard.jsx
index 6bd72f7..05c4212 100644
--- a/client/src/components/GameBoard.jsx
+++ b/client/src/components/GameBoard.jsx
@@ -1,19 +1,34 @@
import React from 'react';
import _ from 'lodash';
+import { useBoard } from '../hooks/board.js';
+
import './GameBoard.css';
+const makeCell = (isSelected, isDouble, i) => {
+ let s = '';
+ if (!isSelected) {
+ if (!isDouble) {
+ s = `$${200 * (i + 1)}`;
+ } else {
+ s = `$${400 * (i + 1)}`;
+ }
+ }
+ return
Room Code: ???
- { _.range(6).map(i => {`Category ${i + 1}`} | ) }
+ { board.categories.map(c => {c} | ) }
- { _.range(5).map(r => {
- _.range(6).map(c => {`$${200 * (r + 1)}`} | )
+ { board.selected.map((r, i) =>
{
+ r.map(selected => makeCell(selected, board.double, i))
}
)}
diff --git a/client/src/hooks/board.js b/client/src/hooks/board.js
new file mode 100644
index 0000000..1fd84e2
--- /dev/null
+++ b/client/src/hooks/board.js
@@ -0,0 +1,5 @@
+import { useSelector } from 'react-redux';
+
+export function useBoard() {
+ return useSelector(state => state.board);
+}
diff --git a/client/src/reducers/board.js b/client/src/reducers/board.js
new file mode 100644
index 0000000..f30efe9
--- /dev/null
+++ b/client/src/reducers/board.js
@@ -0,0 +1,15 @@
+import { createSlice } from '@reduxjs/toolkit';
+import _ from 'lodash';
+
+export const boardSlice = createSlice({
+ name: 'board',
+ initialState: {
+ mode: 'table',
+ categories: _.range(1, 7).map(n => "Category " + n),
+ double: false,
+ selected: _.chunk(_.fill(Array(30), false), 6),
+ },
+ reducers: {} // TODO
+});
+
+export default boardSlice.reducer;
diff --git a/client/src/store.js b/client/src/store.js
index d9335f7..5184cdd 100644
--- a/client/src/store.js
+++ b/client/src/store.js
@@ -1,10 +1,10 @@
import { configureStore } from '@reduxjs/toolkit';
-import counterReducer from './reducers/counter.js';
import gamestateReducer from './reducers/gamestate.js';
+import boardReducer from './reducers/board.js';
export default configureStore({
reducer: {
- counter: counterReducer,
gamestate: gamestateReducer,
+ board: boardReducer,
}
});