- Set window title depending on view and state

- Added link to home

web/static/js/components/game/header.js

@@ -1,6 +1,13 @@
-import React, {PropTypes} from 'react';
+import React, {PropTypes}     from 'react';
+import { setDocumentTitle }   from '../../utils';
 
 export default class Header extends React.Component {
+  componentDidUpdate() {
+    const { game } = this.props;
+
+    setDocumentTitle(`${this._titleText()} · #${game.id}`);
+  }
+
   _titleText() {
     const { game, playerId, currentTurn } = this.props;
     const { my_board, opponents_board, readyForBattle } = game;

web/static/js/views/errors/not_found.js

@@ -1,9 +1,15 @@
-import React, {PropTypes} from 'react';
+import React, {PropTypes}   from 'react';
+import { Link }             from 'react-router';
 import { connect }          from 'react-redux';
 import NewGameButton        from '../../components/game/new_game_button';
 import Logo                 from '../../components/common/logo';
+import { setDocumentTitle } from '../../utils';
 
 class NotFoundView extends React.Component {
+  componentDidMount() {
+    setDocumentTitle('Yo Ho Ho, game not found!');
+  }
+
   render() {
     const { lobbyChannel, dispatch } = this.props;
 
@@ -12,6 +18,7 @@ class NotFoundView extends React.Component {
         <Logo/>
         <h1>Yo Ho Ho, game not found!</h1>
         <NewGameButton lobbyChannel={lobbyChannel} dispatch={dispatch}>Start new battle, arr!</NewGameButton>
+        <p><Link to="/">Back to home</Link></p>
       </div>
     );
   }

web/static/js/views/game/show.js

@@ -1,4 +1,5 @@
 import React, { PropTypes }   from 'react';
+import { Link }               from 'react-router';
 import { Socket }             from 'phoenix';
 import { connect }            from 'react-redux';
 import { joinGame }           from '../../actions/game';
@@ -11,6 +12,7 @@ import Chat                   from '../../components/game/chat';
 import Header                 from '../../components/game/header';
 import Instructions           from '../../components/game/instructions';
 import Logo                   from '../../components/common/logo';
+import { setDocumentTitle }   from '../../utils';
 
 class GameShowView extends React.Component {
   componentDidMount() {
@@ -76,11 +78,13 @@ class GameShowView extends React.Component {
   }
 
   _renderResult() {
-    const { playerId, winnerId } = this.props;
+    const { game, playerId, winnerId } = this.props;
 
     const message = playerId === winnerId ?  'Yo Ho Ho, victory is yours!' : 'You got wrecked, landlubber!';
     const twitterMessage = playerId === winnerId ?  'Yo Ho Ho, I won a battle at Phoenix Battleship' : 'I got wrecked at Phoenix Battleship';
 
+    setDocumentTitle(`${message} · #${game.id}`);
+
     return (
       <div id="game_result">
         <header>
@@ -91,6 +95,7 @@ class GameShowView extends React.Component {
             href={`https://twitter.com/intent/tweet?url=https://phoenix-battleship.herokuapp.com&button_hashtag=myelixirstatus&text=${twitterMessage}`}
             className="twitter-hashtag-button"><i className="fa fa-twitter"/> Share result</a>
         </header>
+        <Link to="/">Back to home</Link>
       </div>
     );
   }

web/static/js/views/home/index.js

@@ -5,11 +5,13 @@ import { fetchGames }           from '../../actions/home';
 import NewGameButton            from '../../components/game/new_game_button';
 import ListItem                 from '../../components/game/list_item';
 import Logo                     from '../../components/common/logo';
+import { setDocumentTitle }     from '../../utils';
 
 class HomeIndexView extends React.Component {
   componentDidMount() {
     const { dispatch, lobbyChannel } = this.props;
 
+    setDocumentTitle('Ahoy, Matey!');
     dispatch(fetchGames(lobbyChannel));
   }