Refactor frontend for off-chain communication. Many bugs fixed

[graup]

• Utility functions (generate state and fen) outsourced into utils file
• Moved chess.js state to game state. Closes #205
• Use chess.js npm package instead of directly including code of library
• Moved event handling from playGame to gamesFactory
• Added last move time to localstorage to redisplay timeout after reload
• Show move number in UI
• Keep track of currently visible game (to enable notifications of moves in other games)
• Fixes #152
• Some other small bugs
• close #210

[kyroy]

WARNING in ./app/javascript/gamesFactory.js
jshint results in errors
  Line is too long. @ line 475 char 103
        console.log("Sent move no", game.state[8] * 128 + game.state[9], 'from', fromIndex, 'to', toIndex);

  Strings must use singlequote. @ line 475 char 31
        console.log("Sent move no", game.state[8] * 128 + game.state[9], 'from', fromIndex, 'to', toIndex);

  Line is too long. @ line 844 char 101
        if ((game.chess.turn() === 'w' && game.self.color === 'white' && data.args.timeoutState !== 0) ||

  Line is too long. @ line 845 char 101
            (game.chess.turn() === 'b' && game.self.color === 'black' && data.args.timeoutState !== 0)) {

  'generateState' is defined but never used. @ line 3 char 9
    import {generateState, generateFen} from './utils/fen-conversion.js';

WARNING in ./app/javascript/playGame.js
jshint results in errors
  Line is too long. @ line 173 char 112
            gameStates.addSelfMove(game.gameId, algebraicToIndex(move.from), algebraicToIndex(move.to), game.state);

[graup]

There are some new bugs, but I wanted to get this PR up now because I won't have time to look at it further until tomorrow.

Sometimes I get an error that the move counts don't match after reloading. Also the notification for new moves in other games doesn't work 100% yet.

[kyroy]

Were these bugs also existing before he refactoring?

[graup]

Before refactoring lots of other things didn't work, so it wasn't really possible to see them. I would say these are new bugs. The basic move, claims / react to claim events and reading from local storage still works.

[kyroy]

games.update needs to be changed (see games.add) => done

[kyroy]

let lastMoveTime;
try {
  // Try to find out time of last move
  lastMoveTime = gameStates.getLastMoveTime(game);
  if (!lastMoveTime) {
    // get it from blockchain?
  }
} catch (e) {
}

The last move time is not stored in the contract. However, we could search the transaction where the last move was made / when the game was joined by the second player

[kyroy]

When pressing surrender or close, the message "waiting..." is present, but does not get updated. When reloading the page, the action is already completed.

[kyroy]

At some point, we should also remove the move listeners ;)

[dennis-westphal]

When starting a new game, I get this:

Move no. NaN is not really ideal ;-)

[dennis-westphal]

Offering a draw does not work for both sides:

[dennis-westphal]

When a game is won, the claimEther button is displayed. This should not be the cause; the frontend should automatically claim the ether (worked before).

[kyroy]

the frontend should automatically claim the ether (worked before).

Ye, this worked for onchain... not for offchain ;)

[dennis-westphal]

Now there seems to be a different problem:

[dennis-westphal]

Also, the Move no NaN issue still exists.

[kyroy]

Ye, i am working on some problems ;)
Atm i don't care about the move number... don't know why this was added ;)

[graup]

I encountered cases were the move couldn't be saved because the move number wasn't correct. If that's fixed we can remove the counter again :)

[kyroy]

The move that was send, was send with the old state, not with the new state. This may have caused the error ;)

[graup]

Proxy communication seems to work (better than before).

The last big bug is that moveFromState goes out-of-gas. Still haven't found a good way to debug that :(

[lisasi]

Oh, i always read "another" as "other". Weird. Of course you're right @dennis-westphal!

[graup]

Merging to clean up Issues. Going to create a new issue for the remaining bug(s).