linting

client/package.json

@@ -26,9 +26,11 @@
     "redux": "^4.0.0"
   },
   "devDependencies": {
-    "jest": "^18.0.0",
-    "eslint": "^5.6.0",
     "babel-preset-react": "^6.24.1",
-    "eslint-plugin-react": "^7.11.1"
+    "eslint": "^5.6.0",
+    "eslint-config-airbnb-base": "^13.1.0",
+    "eslint-plugin-import": "^2.14.0",
+    "eslint-plugin-react": "^7.11.1",
+    "jest": "^18.0.0"
   }
 }

client/src/actions.jsx

@@ -1,23 +1,23 @@
 export const SET_ACCOUNT = 'SET_ACCOUNT';
-export const setAccount = (value) => ({ type: SET_ACCOUNT, value });
+export const setAccount = value => ({ type: SET_ACCOUNT, value });
 
 export const SET_CRYPS = 'SET_CRYPS';
-export const setCryps = (value) => ({ type: SET_CRYPS, value });
+export const setCryps = value => ({ type: SET_CRYPS, value });
 
 export const SET_ITEMS = 'SET_ITEMS';
-export const setItems = (value) => ({ type: SET_ITEMS, value });
+export const setItems = value => ({ type: SET_ITEMS, value });
 
 export const SET_GAME = 'SET_GAME';
-export const setGame = (value) => ({ type: SET_GAME, value });
+export const setGame = value => ({ type: SET_GAME, value });
 
 export const SET_ACTIVE_ITEM = 'SET_ACTIVE_ITEM';
-export const setActiveItem = (value) => ({ type: SET_ACTIVE_ITEM, value });
+export const setActiveItem = value => ({ type: SET_ACTIVE_ITEM, value });
 
 export const SET_ACTIVE_INCOMING = 'SET_ACTIVE_INCOMING';
-export const setActiveIncoming = (value) => ({ type: SET_ACTIVE_INCOMING, value });
+export const setActiveIncoming = value => ({ type: SET_ACTIVE_INCOMING, value });
 
 export const SET_ACTIVE_SKILL = 'SET_ACTIVE_SKILL';
-export const setActiveSkill = (crypId, skill) => ({ type: SET_ACTIVE_SKILL, value:  crypId ? { crypId, skill} : null });
+export const setActiveSkill = (crypId, skill) => ({ type: SET_ACTIVE_SKILL, value: crypId ? { crypId, skill } : null });
 
 export const SET_WS = 'SET_WS';
-export const setWs = (value) => ({ type: SET_WS, value });
+export const setWs = value => ({ type: SET_WS, value });

client/src/components/battle.cryp.card.jsx

@@ -22,8 +22,8 @@ function CrypCard(cryp) {
                 <div className="has-text-centered">{cryp.hp.value} / {cryp.stam.value} HP </div>
                 <progress className="progress is-dark" value={cryp.hp.value} max={cryp.stam.value}></progress>
 
-                <div className="has-text-centered">{cryp.xp} / {Math.pow(2,cryp.lvl+1)} XP </div>
+                <div className="has-text-centered">{cryp.xp} / {Math.pow(2, cryp.lvl + 1)} XP </div>
-                <progress className="progress is-dark" value={cryp.xp} max={Math.pow(2,cryp.lvl+1)}></progress>
+                <progress className="progress is-dark" value={cryp.xp} max={Math.pow(2, cryp.lvl + 1)}></progress>
 
             </div>
             <button

client/src/components/body.component.jsx

@@ -10,7 +10,7 @@ const CrypListContainer = require('./cryp.list.container');
 const GameContainer = require('./game.container');
 
 const addState = connect(
-    function receiveState(state) {
+    (state) => {
         const { game, ws } = state;
 
         if (!game) {
@@ -20,17 +20,17 @@ const addState = connect(
 
         return { game };
     },
-    function receiveDispatch(dispatch) {
+    (dispatch) => {
         function setGame(game) {
-            dispatch(actions.setGame(game))
+            dispatch(actions.setGame(game));
         }
-        return {setGame}
+        return { setGame };
-    }
+    },
 );
 
-function renderBody(props){
+function renderBody(props) {
-    const {game, setGame} = props;
+    const { game, setGame } = props;
-    if (game){
+    if (game) {
         return (
             <div>
                 <GameContainer />
@@ -42,7 +42,7 @@ function renderBody(props){
                 Return to Main Menu
                 </button>
             </div>
-        )
+        );
     }
     return (
         <section className="columns">

client/src/components/cryp.list.jsx

@@ -1,9 +1,12 @@
 const preact = require('preact');
 
 const { stringSort } = require('./../utils');
+
 const nameSort = stringSort('name');
 
-function CrypList({ cryps, activeItem, sendGamePve, sendGamePvp, sendItemUse }) {
+function CrypList({
+    cryps, activeItem, sendGamePve, sendGamePvp, sendItemUse,
+}) {
     if (!cryps) return <div>not ready</div>;
     const crypPanels = cryps.sort(nameSort).map(cryp => (
 
@@ -27,8 +30,8 @@ function CrypList({ cryps, activeItem, sendGamePve, sendGamePvp, sendItemUse })
                 <div className="has-text-centered">{cryp.hp.value} / {cryp.stam.value} HP </div>
                 <progress className="progress is-dark" value={cryp.hp.value} max={cryp.stam.value}></progress>
 
-                <div className="has-text-centered">{cryp.xp} / {Math.pow(2,cryp.lvl+1)} XP </div>
+                <div className="has-text-centered">{cryp.xp} / {Math.pow(2, cryp.lvl + 1)} XP </div>
-                <progress className="progress is-dark" value={cryp.xp} max={Math.pow(2,cryp.lvl+1)}></progress>
+                <progress className="progress is-dark" value={cryp.xp} max={Math.pow(2, cryp.lvl + 1)}></progress>
 
             </div>
             <button

client/src/components/cryp.panel.jsx

@@ -33,5 +33,5 @@ function renderCrypPanel(cryp) {
                 </div>
             </div>
         </div>
-    )
+    );
 }

client/src/components/game.join.button.jsx

@@ -2,14 +2,14 @@ const preact = require('preact');
 const { connect } = require('preact-redux');
 
 const addState = connect(
-    function receiveState(state) {
+    (state) => {
         const { ws, cryps } = state;
         function sendGameJoin(gameId) {
             return ws.sendGameJoin(gameId, [cryps[0].id]);
         }
 
         return { account: state.account, sendGameJoin };
-    }
+    },
 );
 
 function GameJoinButton({ account, sendGameJoin }) {

client/src/components/game.jsx

@@ -12,7 +12,7 @@ function GamePanel(props) {
         setActiveIncoming,
         selectSkillTarget,
         selectIncomingTarget,
-        account
+        account,
     } = props;
 
     if (!game) return <div>...</div>;
@@ -21,7 +21,7 @@ function GamePanel(props) {
 
     const playerTeam = game.teams.find(t => t.id === account.id);
 
-    const incoming = playerTeam.incoming.map(inc => {
+    const incoming = playerTeam.incoming.map((inc) => {
         key.unbind('1');
         key('1', () => setActiveIncoming(inc.id));
         return (
@@ -55,11 +55,9 @@ function GamePanel(props) {
             );
         });
 
-        const statuses = cryp.statuses.map((status, i) => {
+        const statuses = cryp.statuses.map((status, i) => (
-            return (
+            <div key={i}>{status} for {status.turns}T</div>
-                <div key={i}>{status} for {status.turns}T</div>
+        ));
-            )
-        })
 
         if (activeIncoming) console.log('should be a pointer');
         return (
@@ -84,8 +82,8 @@ function GamePanel(props) {
                     <div className="has-text-centered">{cryp.hp.value} / {cryp.stam.value} HP </div>
                     <progress className="progress is-dark" value={cryp.hp.value} max={cryp.stam.value}></progress>
 
-                    <div className="has-text-centered">{cryp.xp} / {Math.pow(2,cryp.lvl+1)} XP </div>
+                    <div className="has-text-centered">{cryp.xp} / {Math.pow(2, cryp.lvl + 1)} XP </div>
-                    <progress className="progress is-dark" value={cryp.xp} max={Math.pow(2,cryp.lvl+1)}></progress>
+                    <progress className="progress is-dark" value={cryp.xp} max={Math.pow(2, cryp.lvl + 1)}></progress>
                 </div>
                 {statuses}
                 {skills}
@@ -100,15 +98,13 @@ function GamePanel(props) {
             <div className="tile">
                 {cryps}
             </div>
-        )
+        );
     }
 
     function OpponentCrypCard(cryp) {
-        const statuses = cryp.statuses.map((status, i) => {
+        const statuses = cryp.statuses.map((status, i) => (
-            return (
+            <div key={i}>{status.status} for {status.turns}T</div>
-                <div key={i}>{status.status} for {status.turns}T</div>
+        ));
-            )
-        });
 
         return (
             <div key={cryp.id} className="tile is-vertical">
@@ -128,8 +124,8 @@ function GamePanel(props) {
                     <div className="has-text-centered">{cryp.hp.value} / {cryp.stam.value} HP </div>
                     <progress className="progress is-dark" value={cryp.hp.value} max={cryp.stam.value}></progress>
 
-                    <div className="has-text-centered">{cryp.xp} / {Math.pow(2,cryp.lvl+1)} XP </div>
+                    <div className="has-text-centered">{cryp.xp} / {Math.pow(2, cryp.lvl + 1)} XP </div>
-                    <progress className="progress is-dark" value={cryp.xp} max={Math.pow(2,cryp.lvl+1)}></progress>
+                    <progress className="progress is-dark" value={cryp.xp} max={Math.pow(2, cryp.lvl + 1)}></progress>
 
                 </div>
                 {statuses}
@@ -146,18 +142,18 @@ function GamePanel(props) {
                 onClick={() => selectSkillTarget(team.id)} >
                 {cryps}
             </div>
-        )
+        );
     }
 
     // style={{ "min-height": "100%" }}
-    function phaseText(phase){
+    function phaseText(phase) {
-        switch (phase){
+        switch (phase) {
-        case 'Skill':
+            case 'Skill':
-            return "Choose abilities"
+                return 'Choose abilities';
-        case 'Target':
+            case 'Target':
-            return "Block abilities"
+                return 'Block abilities';
-        case 'Finish':
+            case 'Finish':
-            return "Game over"
+                return 'Game over';
         }
     }
     return (
@@ -180,7 +176,7 @@ function GamePanel(props) {
                 <div className="title is-4">log</div>
             </div>
         </section>
-    )
+    );
 }
 
 module.exports = GamePanel;

client/src/components/header.component.jsx

@@ -13,7 +13,7 @@ function renderHeader() {
                 </div>
             </div>
         </section>
-    )
+    );
 }
 
 module.exports = renderHeader;

client/src/components/login.component.jsx

@@ -1,7 +1,7 @@
 // eslint-disable-next-line
 const preact = require('preact');
 
-function renderLogin({ account, submitLogin, submitRegister}) {
+function renderLogin({ account, submitLogin, submitRegister }) {
     if (account) return <div>{JSON.stringify(account)}</div>;
 
     const details = {
@@ -45,7 +45,7 @@ function renderLogin({ account, submitLogin, submitRegister}) {
                     <button
                         className="button inverted"
                         type="submit"
-                        onClick={() => submitLogin("ntr", "grepgrepgrep")}>
+                        onClick={() => submitLogin('ntr', 'grepgrepgrep')}>
                         Default
                     </button>
                     <button

client/src/components/login.container.jsx

@@ -3,7 +3,7 @@ const { connect } = require('preact-redux');
 const Login = require('./login.component');
 
 const addState = connect(
-    function receiveState(state) {
+    (state) => {
         const { ws } = state;
         function submitLogin(name, password) {
             return ws.sendAccountLogin(name, password);
@@ -12,7 +12,7 @@ const addState = connect(
             return ws.sendAccountRegister(name, password);
         }
         return { account: state.account, submitLogin, submitRegister };
-    }
+    },
 );
 
 module.exports = addState(Login);

client/src/keyboard.jsx

@@ -2,7 +2,7 @@ const key = require('keymaster');
 const actions = require('./actions');
 
 function setupKeys(store) {
-    store.subscribe(function mapKeys() {
+    store.subscribe(() => {
         const state = store.getState();
 
         key.unbind('esc');
@@ -16,8 +16,6 @@ function setupKeys(store) {
         if (state.activeIncoming) {
             key('esc', () => store.dispatch(actions.setActiveIncoming(null)));
         }
-        
-
     });
 }
 

client/src/main.jsx

@@ -24,7 +24,7 @@ const store = createStore(
         cryps: reducers.crypsReducer,
         items: reducers.itemsReducer,
         ws: reducers.wsReducer,
-    })
+    }),
 );
 
 store.subscribe(() => console.log(store.getState()));
@@ -34,6 +34,11 @@ const ws = createSocket(store);
 store.dispatch(actions.setWs(ws));
 ws.connect();
 
+function blah() {
+
+}
+
+
 // tells jdenticon to look for new svgs and render them
 // so we don't have to setInnerHtml or manually call update
 jdenticon.config = {

client/src/reducers.jsx

@@ -3,80 +3,80 @@ const actions = require('./actions');
 const defaultAccount = null;
 function accountReducer(state = defaultAccount, action) {
     switch (action.type) {
-    case actions.SET_ACCOUNT:
+        case actions.SET_ACCOUNT:
-        return action.value;
+            return action.value;
-    default:
+        default:
-        return state;
+            return state;
     }
 }
 
 const defaultCryps = null;
 function crypsReducer(state = defaultCryps, action) {
     switch (action.type) {
-    case actions.SET_CRYPS:
+        case actions.SET_CRYPS:
-        return action.value;
+            return action.value;
-    default:
+        default:
-        return state;
+            return state;
     }
 }
 
 const defaultItems = null;
 function itemsReducer(state = defaultItems, action) {
     switch (action.type) {
-    case actions.SET_ITEMS:
+        case actions.SET_ITEMS:
-        return action.value;
+            return action.value;
-    default:
+        default:
-        return state;
+            return state;
     }
 }
 
 const defaultActiveItem = null;
 function activeItemReducer(state = defaultActiveItem, action) {
     switch (action.type) {
-    case actions.SET_ACTIVE_ITEM:
+        case actions.SET_ACTIVE_ITEM:
-        return action.value;
+            return action.value;
-    default:
+        default:
-        return state;
+            return state;
     }
 }
 
 const defaultActiveSkill = null;
 function activeSkillReducer(state = defaultActiveSkill, action) {
     switch (action.type) {
-    case actions.SET_ACTIVE_SKILL:
+        case actions.SET_ACTIVE_SKILL:
-        return action.value;
+            return action.value;
-    default:
+        default:
-        return state;
+            return state;
     }
 }
 
 const defaultActiveIncoming = null;
 function activeIncomingReducer(state = defaultActiveIncoming, action) {
     switch (action.type) {
-    case actions.SET_ACTIVE_INCOMING:
+        case actions.SET_ACTIVE_INCOMING:
-        return action.value;
+            return action.value;
-    default:
+        default:
-        return state;
+            return state;
     }
 }
 
 const defaultGame = null;
 function gameReducer(state = defaultGame, action) {
     switch (action.type) {
-    case actions.SET_GAME:
+        case actions.SET_GAME:
-        return action.value;
+            return action.value;
-    default:
+        default:
-        return state;
+            return state;
     }
 }
 
 const defaultWs = null;
 function wsReducer(state = defaultWs, action) {
     switch (action.type) {
-    case actions.SET_WS:
+        case actions.SET_WS:
-        return action.value;
+            return action.value;
-    default:
+        default:
-        return state;
+            return state;
     }
 }
 

client/src/socket.jsx

@@ -27,20 +27,20 @@ function createSocket(store) {
         ws.binaryType = 'arraybuffer';
 
         // Connection opened
-        ws.addEventListener('open', function wsOpen(event) {
+        ws.addEventListener('open', (event) => {
             // send({ method: 'account_login', params: { name: 'ntr', password: 'grepgrepgrep' } });
         });
 
         // Listen for messages
         ws.addEventListener('message', onMessage);
 
-        ws.addEventListener('error', function wsError(event) {
+        ws.addEventListener('error', (event) => {
             console.error('WebSocket error', event);
             account = null;
             // return setTimeout(connect, 5000);
         });
 
-        ws.addEventListener('close', function wsClose(event) {
+        ws.addEventListener('close', (event) => {
             console.error('WebSocket closed', event);
             account = null;
             return setTimeout(connect, 5000);
@@ -63,7 +63,7 @@ function createSocket(store) {
         store.dispatch(actions.setAccount(login));
         // send({ method: 'cryp_spawn', params: { name: 'muji' } });
         send({ method: 'account_cryps', params: {} });
-        send({ method: 'item_list', params: {}});
+        send({ method: 'item_list', params: {} });
         console.log(account);
     }
 
@@ -134,7 +134,9 @@ function createSocket(store) {
     function sendGameSkill(gameId, crypId, targetTeamId, skill) {
         send({
             method: 'game_skill',
-            params: { game_id: gameId, cryp_id: crypId, target_team_id: targetTeamId, skill }
+            params: {
+                game_id: gameId, cryp_id: crypId, target_team_id: targetTeamId, skill,
+            },
         });
         store.dispatch(actions.setActiveSkill(null));
     }

client/src/utils.jsx

@@ -33,4 +33,4 @@ const numSort = (k, desc) => {
 module.exports = {
     stringSort,
     numSort,
-}
+};