diff --git a/.babelrc b/.babelrc index 9381fa7..bc5f28e 100644 --- a/.babelrc +++ b/.babelrc @@ -5,5 +5,14 @@ "transform-class-properties", "transform-object-rest-spread", "syntax-dynamic-import" - ] + ], + "env": { + "production": { + "plugins": [ + ["transform-react-remove-prop-types", { + "additionalLibraries": ["react-immutable-proptypes"], + }], + ] + } + } } diff --git a/.storybook/__snapshots__/storyshots.test.js.snap b/.storybook/__snapshots__/storyshots.test.js.snap index 2aaf5f5..b338a5e 100644 --- a/.storybook/__snapshots__/storyshots.test.js.snap +++ b/.storybook/__snapshots__/storyshots.test.js.snap @@ -4,6 +4,8 @@ exports[`Storyshots Button default props 1`] = ` .c0 { -webkit-appearance: none; -moz-appearance: none; + background-color: white; + width: 200px; cursor: pointer; margin: 0; position: relative; @@ -21,6 +23,10 @@ exports[`Storyshots Button default props 1`] = ` -ms-flex-align: center; align-items: center; text-transform: uppercase; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; @@ -35,6 +41,17 @@ exports[`Storyshots Button default props 1`] = ` border-left-color: black; } +.c0:disabled { + border-top-color: gray; + border-right-color: gray; + border-bottom-color: gray; + border-left-color: gray; + border-top-style: solid; + border-right-style: solid; + border-bottom-style: solid; + border-left-style: solid; +} + .c0:hover { border-top-style: dotted; border-right-style: dotted; @@ -42,18 +59,21 @@ exports[`Storyshots Button default props 1`] = ` border-left-style: dotted; } -
-
+ `; exports[`Storyshots Button with label 1`] = ` .c0 { -webkit-appearance: none; -moz-appearance: none; + background-color: white; + width: 200px; cursor: pointer; margin: 0; position: relative; @@ -71,6 +91,10 @@ exports[`Storyshots Button with label 1`] = ` -ms-flex-align: center; align-items: center; text-transform: uppercase; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; @@ -85,6 +109,17 @@ exports[`Storyshots Button with label 1`] = ` border-left-color: black; } +.c0:disabled { + border-top-color: gray; + border-right-color: gray; + border-bottom-color: gray; + border-left-color: gray; + border-top-style: solid; + border-right-style: solid; + border-bottom-style: solid; + border-left-style: solid; +} + .c0:hover { border-top-style: dotted; border-right-style: dotted; @@ -92,12 +127,13 @@ exports[`Storyshots Button with label 1`] = ` border-left-style: dotted; } -
Button -
+ `; exports[`Storyshots Cell default props 1`] = ` @@ -208,7 +244,7 @@ exports[`Storyshots Cell with position 1`] = ` /> `; -exports[`Storyshots GameInfoBox default props 1`] = ` +exports[`Storyshots GameInfo default props 1`] = ` .c1 { display: -webkit-box; display: -webkit-flex; @@ -265,27 +301,8 @@ exports[`Storyshots GameInfoBox default props 1`] = `
- .c0 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - -webkit-box-pack: space-around; - -webkit-justify-content: space-around; - -ms-flex-pack: space-around; - justify-content: space-around; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - background: #dddddd; -} - -
- .c0 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; - -webkit-box-pack: space-around; - -webkit-justify-content: space-around; - -ms-flex-pack: space-around; - justify-content: space-around; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; -} - -
- .c0 { - margin: 10px; - display: inline-block; -} - - - .c1 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -.c0 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; -} - -
- .c0 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -
- .c0 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -
- .c0 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -
- .c1 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -.c0 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; -} - -
- .c0 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -
- .c0 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -
- .c0 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -
- .c1 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -.c0 { - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; -} - -
- .c0 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -
- .c0 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -
- .c0 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -
@@ -782,73 +502,16 @@ exports[`Storyshots Row with Cells 1`] = `
- .c0 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -
- .c0 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -
- .c0 { - width: 50px; - height: 50px; - border: 1px solid; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - font-size: 2em; -} - -
diff --git a/.storybook/config.js b/.storybook/config.js index 2bd9b06..8ffc5ab 100644 --- a/.storybook/config.js +++ b/.storybook/config.js @@ -7,7 +7,7 @@ import { addDecorator, configure } from '@storybook/react'; import { withInfo } from '@storybook/addon-info'; -const req = require.context('../app/components', true, /stories\.js$/); +const req = require.context('../client/components', true, /stories\.js$/); const loadStories = () => req.keys().forEach(filename => req(filename)); addDecorator((story, context) => withInfo('common info')(story)(context)); diff --git a/.travis.yml b/.travis.yml index 9ef4635..ac5419c 100644 --- a/.travis.yml +++ b/.travis.yml @@ -3,12 +3,12 @@ language: node_js node_js: - "node" before_install: - - curl -o- -L https://yarnpkg.com/install.sh | bash -s -- --version 0.27.5 + - curl -o- -L https://yarnpkg.com/install.sh | bash -s -- --version 1.0.1 - export PATH=$HOME/.yarn/bin:$PATH script: - yarn - yarn run lint - - yarn run test-ci + - yarn run test:ci - yarn run build cache: yarn: true diff --git a/app/constants/game.js b/app/constants/game.js deleted file mode 100644 index 98a4157..0000000 --- a/app/constants/game.js +++ /dev/null @@ -1,5 +0,0 @@ -export const DEFAULT_SIZE_PLAYINGBOARD = 3; - -export const GAME_CONFIGURE = 0; -export const GAME_RUN = 1; -export const GAME_END = 2; diff --git a/app/index.js b/app/index.js deleted file mode 100644 index 0a3df2e..0000000 --- a/app/index.js +++ /dev/null @@ -1,22 +0,0 @@ -/** - * @author Dmitry Malakhov - */ - -'use strict'; - -import React from 'react'; -import ReactDOM from 'react-dom'; -import { Provider } from 'react-redux'; -import Root from './root'; -import store from './store'; - -const container = document.getElementById('container'); - -window.addEventListener('DOMContentLoaded', () => { - ReactDOM.render( - - - , - container - ); -}); diff --git a/__tests__/button.tests.js b/client/__tests__/button.tests.js similarity index 90% rename from __tests__/button.tests.js rename to client/__tests__/button.tests.js index 925e3bc..2e83dc0 100644 --- a/__tests__/button.tests.js +++ b/client/__tests__/button.tests.js @@ -7,7 +7,7 @@ /* eslint-env jest */ import React from 'react'; import renderer from 'react-test-renderer'; -import Button from '../app/components/Button'; +import Button from '../components/Button'; jest.mock('react-dom'); diff --git a/__tests__/cell.tests.js b/client/__tests__/cell.tests.js similarity index 90% rename from __tests__/cell.tests.js rename to client/__tests__/cell.tests.js index b2a848b..99e2c65 100644 --- a/__tests__/cell.tests.js +++ b/client/__tests__/cell.tests.js @@ -7,7 +7,7 @@ /* eslint-env jest */ import React from 'react'; import renderer from 'react-test-renderer'; -import Cell from '../app/components/Cell'; +import Cell from '../components/Cell'; test('if click on Cell return position', () => { const mockFn = jest.fn(); diff --git a/app/actions/app.js b/client/actions/app.js similarity index 100% rename from app/actions/app.js rename to client/actions/app.js diff --git a/app/actions/game.js b/client/actions/game.js similarity index 92% rename from app/actions/game.js rename to client/actions/game.js index 24a7185..13a8729 100644 --- a/app/actions/game.js +++ b/client/actions/game.js @@ -115,3 +115,13 @@ export const restartGame = () => dispatch => { dispatch(resetGameState()); dispatch(redirectToPath(CONFIGURE_ROUTE)); }; + +export const setTypeOfGame = createAction( + 'SET_TYPE_OF_GAME', + type => ({ type }), +); + +export const initTypeOfGame = type => dispatch => { + dispatch(setTypeOfGame(type)); + dispatch(redirectToPath(CONFIGURE_ROUTE)); +}; diff --git a/build-conf/development.config.js b/client/build-conf/development.config.js similarity index 95% rename from build-conf/development.config.js rename to client/build-conf/development.config.js index ab26bc4..80ccb79 100644 --- a/build-conf/development.config.js +++ b/client/build-conf/development.config.js @@ -8,7 +8,7 @@ const HtmlWebpackPlugin = require('html-webpack-plugin'), webpack = require('webpack'), merge = require('webpack-merge'), { config, PATH_DIST } = require('./shared.config'), - { APP_PORT, GRAPHQL_PORT } = require('../constants/port'); + { APP_PORT, GRAPHQL_PORT } = require('../../constants/port'); const GRAPHQL_ENDPOINT = `http://0.0.0.0:${GRAPHQL_PORT}`; diff --git a/build-conf/production.config.js b/client/build-conf/production.config.js similarity index 100% rename from build-conf/production.config.js rename to client/build-conf/production.config.js diff --git a/build-conf/shared.config.js b/client/build-conf/shared.config.js similarity index 93% rename from build-conf/shared.config.js rename to client/build-conf/shared.config.js index f705350..36b95b8 100644 --- a/build-conf/shared.config.js +++ b/client/build-conf/shared.config.js @@ -8,9 +8,9 @@ const { resolve } = require('path'), webpack = require('webpack'), omit = require('lodash.omit'); -const Package = require('../package.json'); +const Package = require('../../package.json'); -const PATH_SOURCES = resolve(__dirname, '../app'); +const PATH_SOURCES = resolve(__dirname, '../'); const PATH_DIST = resolve(__dirname, '..', 'public'); const dependencies = omit(Package.dependencies, [ @@ -35,7 +35,7 @@ const config = env => ({ sourceMapFilename: '[name].map', }, entry: { - main: ['./index'], + main: ['./root'], vendor: vendorChunks, }, resolve: { diff --git a/build-conf/webpack.config.js b/client/build-conf/webpack.config.js similarity index 100% rename from build-conf/webpack.config.js rename to client/build-conf/webpack.config.js diff --git a/app/components/Button/index.js b/client/components/Button/index.js similarity index 82% rename from app/components/Button/index.js rename to client/components/Button/index.js index 4f1b5bb..b1c9b4b 100644 --- a/app/components/Button/index.js +++ b/client/components/Button/index.js @@ -11,16 +11,18 @@ import { noop } from '../../../utils/misc'; const propTypes = { label: PropTypes.string, + disabled: PropTypes.bool, onClick: PropTypes.func, }; const defaultProps = { label: '', + disabled: false, onClick: noop, }; const Button = props => ( - + {props.label} ); diff --git a/app/components/Button/stories.js b/client/components/Button/stories.js similarity index 100% rename from app/components/Button/stories.js rename to client/components/Button/stories.js diff --git a/app/components/Button/styled/ButtonStyled.js b/client/components/Button/styled/ButtonStyled.js similarity index 74% rename from app/components/Button/styled/ButtonStyled.js rename to client/components/Button/styled/ButtonStyled.js index e15da9f..9082931 100644 --- a/app/components/Button/styled/ButtonStyled.js +++ b/client/components/Button/styled/ButtonStyled.js @@ -12,9 +12,11 @@ import { borderStyle, } from 'polished'; -export const ButtonStyled = styled.div` +export const ButtonStyled = styled.button` -webkit-appearance: none; -moz-appearance: none; + background-color: white; + width: 200px; cursor: pointer; margin: 0; position: relative; @@ -23,10 +25,16 @@ export const ButtonStyled = styled.div` vertical-align: middle; align-items: center; text-transform: uppercase; + justify-content: center; ${padding('15px', '15px', '15px', '15px')} ${borderStyle('solid')} ${borderColor('black')} + &:disabled { + ${borderColor('gray')} + ${borderStyle('solid')} + } + &:hover { ${borderStyle('dotted')} } diff --git a/app/components/Cell/index.js b/client/components/Cell/index.js similarity index 100% rename from app/components/Cell/index.js rename to client/components/Cell/index.js diff --git a/app/components/Cell/stories.js b/client/components/Cell/stories.js similarity index 100% rename from app/components/Cell/stories.js rename to client/components/Cell/stories.js diff --git a/app/components/Cell/styled/CellStyled.js b/client/components/Cell/styled/CellStyled.js similarity index 100% rename from app/components/Cell/styled/CellStyled.js rename to client/components/Cell/styled/CellStyled.js diff --git a/app/components/GameInfoBox/UserInfo/index.js b/client/components/GameInfo/UserInfo/index.js similarity index 100% rename from app/components/GameInfoBox/UserInfo/index.js rename to client/components/GameInfo/UserInfo/index.js diff --git a/app/components/GameInfoBox/UserInfo/styled/NameStyled.js b/client/components/GameInfo/UserInfo/styled/NameStyled.js similarity index 100% rename from app/components/GameInfoBox/UserInfo/styled/NameStyled.js rename to client/components/GameInfo/UserInfo/styled/NameStyled.js diff --git a/app/components/GameInfoBox/UserInfo/styled/ScoreStyled.js b/client/components/GameInfo/UserInfo/styled/ScoreStyled.js similarity index 100% rename from app/components/GameInfoBox/UserInfo/styled/ScoreStyled.js rename to client/components/GameInfo/UserInfo/styled/ScoreStyled.js diff --git a/app/components/GameInfoBox/UserInfo/styled/UserInfoStyled.js b/client/components/GameInfo/UserInfo/styled/UserInfoStyled.js similarity index 100% rename from app/components/GameInfoBox/UserInfo/styled/UserInfoStyled.js rename to client/components/GameInfo/UserInfo/styled/UserInfoStyled.js diff --git a/app/components/GameInfoBox/index.js b/client/components/GameInfo/index.js similarity index 71% rename from app/components/GameInfoBox/index.js rename to client/components/GameInfo/index.js index 617a278..63a145f 100644 --- a/app/components/GameInfoBox/index.js +++ b/client/components/GameInfo/index.js @@ -9,7 +9,7 @@ import PropTypes from 'prop-types'; import { PlayersPropTypes, PlayersDefaultProps } from '../../models/players'; import { ScorePropTypes, ScoreDefaultProps } from '../../models/score'; import UserInfo from './UserInfo'; -import GameInfoBoxStyled from './styled/GameInfoBoxStyled'; +import GameInfoStyled from './styled/GameInfoStyled'; const propTypes = { players: PlayersPropTypes, @@ -23,7 +23,7 @@ const defaultProps = { currentPlayer: 0, }; -const GameInfoBox = ({ players, score, currentPlayer }) => { +const GameInfo = ({ players, score, currentPlayer }) => { const usersInformation = players.map((player, index) => ( { )); return ( - + {usersInformation} - + ); }; -GameInfoBox.propTypes = propTypes; -GameInfoBox.defaultProps = defaultProps; -GameInfoBox.displayName = 'GameInfoBox'; +GameInfo.propTypes = propTypes; +GameInfo.defaultProps = defaultProps; +GameInfo.displayName = 'GameInfo'; -export default GameInfoBox; +export default GameInfo; diff --git a/app/components/GameInfoBox/stories.js b/client/components/GameInfo/stories.js similarity index 61% rename from app/components/GameInfoBox/stories.js rename to client/components/GameInfo/stories.js index be6a1be..d88b8ba 100644 --- a/app/components/GameInfoBox/stories.js +++ b/client/components/GameInfo/stories.js @@ -7,9 +7,9 @@ import React from 'react'; import { storiesOf } from '@storybook/react'; import { action } from '@storybook/addon-actions'; -import GameInfoBox from './'; +import GameInfo from './'; const onClickAction = action('onClick'); -storiesOf('GameInfoBox', module) - .add('default props', () => ); +storiesOf('GameInfo', module) + .add('default props', () => ); diff --git a/app/components/GameInfoBox/styled/GameInfoBoxStyled.js b/client/components/GameInfo/styled/GameInfoStyled.js similarity index 100% rename from app/components/GameInfoBox/styled/GameInfoBoxStyled.js rename to client/components/GameInfo/styled/GameInfoStyled.js diff --git a/app/components/Input/index.js b/client/components/Input/index.js similarity index 100% rename from app/components/Input/index.js rename to client/components/Input/index.js diff --git a/app/components/Input/stories.js b/client/components/Input/stories.js similarity index 100% rename from app/components/Input/stories.js rename to client/components/Input/stories.js diff --git a/app/components/Input/styled/InputStyled.js b/client/components/Input/styled/InputStyled.js similarity index 100% rename from app/components/Input/styled/InputStyled.js rename to client/components/Input/styled/InputStyled.js diff --git a/app/components/Input/styled/LabelStyled.js b/client/components/Input/styled/LabelStyled.js similarity index 58% rename from app/components/Input/styled/LabelStyled.js rename to client/components/Input/styled/LabelStyled.js index 82ec2f7..005bd2f 100644 --- a/app/components/Input/styled/LabelStyled.js +++ b/client/components/Input/styled/LabelStyled.js @@ -6,6 +6,4 @@ import styled from 'styled-components'; -export const LabelStyled = styled.label` - padding: 10px 1px; -`; +export const LabelStyled = styled.label``; diff --git a/app/components/Playingboard/index.js b/client/components/Playingboard/index.js similarity index 100% rename from app/components/Playingboard/index.js rename to client/components/Playingboard/index.js diff --git a/app/components/Playingboard/stories.js b/client/components/Playingboard/stories.js similarity index 100% rename from app/components/Playingboard/stories.js rename to client/components/Playingboard/stories.js diff --git a/app/components/Playingboard/styled/PlayingboardStyled.js b/client/components/Playingboard/styled/PlayingboardStyled.js similarity index 100% rename from app/components/Playingboard/styled/PlayingboardStyled.js rename to client/components/Playingboard/styled/PlayingboardStyled.js diff --git a/app/components/Row/index.js b/client/components/Row/index.js similarity index 100% rename from app/components/Row/index.js rename to client/components/Row/index.js diff --git a/app/components/Row/stories.js b/client/components/Row/stories.js similarity index 100% rename from app/components/Row/stories.js rename to client/components/Row/stories.js diff --git a/app/components/Row/styled/RowStyled.js b/client/components/Row/styled/RowStyled.js similarity index 100% rename from app/components/Row/styled/RowStyled.js rename to client/components/Row/styled/RowStyled.js diff --git a/app/components/SCTransition/index.js b/client/components/SCTransition/index.js similarity index 100% rename from app/components/SCTransition/index.js rename to client/components/SCTransition/index.js diff --git a/app/components/SCTransition/styled/SCTransitionStyled.js b/client/components/SCTransition/styled/SCTransitionStyled.js similarity index 100% rename from app/components/SCTransition/styled/SCTransitionStyled.js rename to client/components/SCTransition/styled/SCTransitionStyled.js diff --git a/client/constants/game.js b/client/constants/game.js new file mode 100644 index 0000000..62327bc --- /dev/null +++ b/client/constants/game.js @@ -0,0 +1,12 @@ +// default config +export const DEFAULT_SIZE_PLAYINGBOARD = 3; + +// status +export const GAME_CONFIGURE = 0; +export const GAME_RUN = 1; +export const GAME_END = 2; + +// types +export const HOTSEAT = 'hotseat'; +export const PLAYER_VS_COMPUTER = 'pvc'; +export const MULTIPLAYER = 'mp'; diff --git a/app/constants/route.js b/client/constants/route.js similarity index 68% rename from app/constants/route.js rename to client/constants/route.js index ebf5466..61adc54 100644 --- a/app/constants/route.js +++ b/client/constants/route.js @@ -3,3 +3,5 @@ export const CONFIGURE_ROUTE = '/configure'; export const PLAYINGBOARD_ROUTE = '/playingboard'; export const FINISH_ROUTE = '/finish'; export const ABOUT_ROUTE = '/about'; +export const CHOICE_TYPE_ROUTE = '/choicetype'; +export const INIT_ROUTE = CHOICE_TYPE_ROUTE; diff --git a/app/routes/ConfigureRoute.js b/client/containers/ConfigureHotseat.js similarity index 59% rename from app/routes/ConfigureRoute.js rename to client/containers/ConfigureHotseat.js index f8f4703..5013981 100644 --- a/app/routes/ConfigureRoute.js +++ b/client/containers/ConfigureHotseat.js @@ -9,11 +9,12 @@ import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import { List } from 'immutable'; import { configureGame } from '../actions/game'; +import { redirectToPath } from '../actions/app'; import Button from '../components/Button'; import Input from '../components/Input'; -import RouteContainer from '../containers/RouteContainer'; -import ConfigureRouteContainer from '../containers/ConfigureRouteContainer'; + import { DEFAULT_SIZE_PLAYINGBOARD } from '../constants/game'; +import { CHOICE_TYPE_ROUTE } from '../constants/route'; import { Player, @@ -28,6 +29,7 @@ const propTypes = { size: PropTypes.number, amountCellsToWin: PropTypes.number, onConfigureGame: PropTypes.func, + onRedirectToPath: PropTypes.func, }; const defaultProps = { @@ -35,9 +37,10 @@ const defaultProps = { size: DEFAULT_SIZE_PLAYINGBOARD, amountCellsToWin: DEFAULT_SIZE_PLAYINGBOARD, onConfigureGame: noop, + onRedirectToPath: noop, }; -class ConfigureRoute extends PureComponent { +class ConfigureHotseatRoute extends PureComponent { constructor(props) { super(props); @@ -60,6 +63,10 @@ class ConfigureRoute extends PureComponent { this.props.onConfigureGame(size, players, amountCellsToWin); } + _handleClickRedirectToChoiceType = () => { + this.props.onRedirectToPath(CHOICE_TYPE_ROUTE); + } + _handleChangePlayerName1 = value => { this.setState({ playerName1: value, @@ -89,46 +96,52 @@ class ConfigureRoute extends PureComponent { } render() { - return ( - - - - - - -