From fd7197a1d4bee5837b240835c25883ca1b6238e3 Mon Sep 17 00:00:00 2001
From: Antti Pilto <antti.pilto@student.oulu.fi>
Date: Fri, 28 Apr 2017 21:14:06 +0300
Subject: [PATCH] remove demo specific code

---
 src/components/App/App.jsx        | 12 ++++++++--
 src/components/App/App.scss       | 17 ++++++++++++++
 src/components/Footer/Footer.jsx  | 37 -------------------------------
 src/components/Footer/Footer.scss | 16 -------------
 4 files changed, 27 insertions(+), 55 deletions(-)
 delete mode 100644 src/components/Footer/Footer.jsx
 delete mode 100644 src/components/Footer/Footer.scss

diff --git a/src/components/App/App.jsx b/src/components/App/App.jsx
index 46c5601..b86c168 100644
--- a/src/components/App/App.jsx
+++ b/src/components/App/App.jsx
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
 import './App.scss';
 import Navbar from '../Navbar/Navbar';
 import GameContainer from '../GameContainer/GameContainer';
-import Footer from '../Footer/Footer';
 import { removeHash } from '../../data/helperFuncs';
 
 const options = {};
@@ -25,6 +24,16 @@ class App extends Component {
         this.setState({gameState: 'chooseCharacters'});
     }
 
+    componentWillUpdate(nextProps, nextState) {
+        // This is primarily for demo site purposes. Hides footer when game is on.
+        if(document.getElementById('footer')) {
+            if(nextState.gameState=='chooseCharacters')
+                document.getElementById('footer').style.visibility = "visible";
+            else
+                document.getElementById('footer').style.visibility = "hidden";
+        }
+    }
+
     render() {
         return (
             <div>
@@ -41,7 +50,6 @@ class App extends Component {
                         />
                     </div>
                 </div>
-                {this.state.gameState=='chooseCharacters'?<Footer />:null}
             </div>
         )
     }
diff --git a/src/components/App/App.scss b/src/components/App/App.scss
index 9c6fb85..e1a47c9 100644
--- a/src/components/App/App.scss
+++ b/src/components/App/App.scss
@@ -38,4 +38,21 @@ body {
 .glyphicon-none:before {
     content: "\2122";
     color: transparent !important;
+}
+#footer {
+    /* used in demo */
+    color: #777;
+    font-size: 0.9em;
+    line-height: 1.8em;
+    h4 {
+        margin-top: 20px;
+        color: #d9534f;
+    }
+    a {
+        text-decoration: underline;
+    }
+    #copyright {
+        border-top: 1px #aaa solid;
+        padding: 10px 0px;
+    }
 }
\ No newline at end of file
diff --git a/src/components/Footer/Footer.jsx b/src/components/Footer/Footer.jsx
deleted file mode 100644
index a7b08e9..0000000
--- a/src/components/Footer/Footer.jsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import React, { Component } from 'react';
-import './Footer.scss';
-
-class Footer extends Component {
-    render() {
-        return (
-            <div className="container footer">
-                <div className="col-xs-12">
-                    <h4>How to use</h4>
-                    <p>Kana refers to the two syllabic writing systems used in Japanese: <a href="http://en.wikipedia.org/wiki/Kana" title="Read more at wikipedia">Hiragana and Katakana</a>.</p>
-                    <p>There is no "the right way" to use Kana Quiz.
-                    If you are a beginner, you might want to start by choosing the first two groups (a -&gt; ko) of hiragana. Once you manage to pass the last stage, add in one or two more groups. Aim for the perfection - you want to be answering quickly.</p>
-                    <p>Have fun!</p>
-
-                    <h4>Updates</h4>
-                    <p>
-                        <strong>27 March 2017</strong> &middot; Bufix: Allow mobile browsers to change a locked stage number.<br />
-                        <strong>24 March 2017</strong> &middot; Enhancement: Improved mobile browser usability with reduced margins.<br />
-                        <strong>18 March 2017</strong> &middot; Bugfix: Fixed unintended behavior when same group was selected from both hiragana &amp; katakana. Thanks for the bug report!
-                    </p>
-                    <p>Coders needed! This app is open source, but I'm currently the only one working on it. If you'd like to practice your React.js skills,
-                        feel free to check the issues and fork it on <a href="https://github.com/anzzstuff/kanaquiz">GitHub</a>!</p>
-                    <p>
-                        <strong>14 Aug 2016</strong> &middot; Launch: Here we are finally with a new version of Kana Quiz.
-                        This app doesn't require flash anymore, and should work great with mobile phones and tablets.
-                        Note that this is still a beta version, so there may be a few quirks. I would love to hear
-                        your thoughts, so if you'd like, be sure to shoot me some <a href="https://goo.gl/forms/BwtgpkYjT1iyH8uE3">feedback</a>! {' '}
-                        If you for some reason want to use the old version, it's still available <a href="http://simplemedia.org/kana/flash/" rel="nofollow">here</a>.
-                    </p>
-                    <div className="copyright">&copy; <a href="http://simplemedia.org/">Antti Pilto</a> 2016</div>
-                </div>
-            </div>
-        )
-    }
-}
-
-export default Footer;
\ No newline at end of file
diff --git a/src/components/Footer/Footer.scss b/src/components/Footer/Footer.scss
deleted file mode 100644
index 3a3a784..0000000
--- a/src/components/Footer/Footer.scss
+++ /dev/null
@@ -1,16 +0,0 @@
-.footer {
-    color: #777;
-    font-size: 0.9em;
-    line-height: 1.8em;
-    h4 {
-        margin-top: 20px;
-        color: #d9534f;
-    }
-    a {
-        text-decoration: underline;
-    }
-    .copyright {
-        border-top: 1px #aaa solid;
-        padding: 10px 0px;
-    }
-}