1 files changed, 49 insertions, 13 deletions

diff --git a/frontend/site/projects/museum/views/nav.overlay.js b/frontend/site/projects/museum/views/nav.overlay.js
index d3951cf..7a6c7a5 100644
--- a/frontend/site/projects/museum/views/nav.overlay.js
+++ b/frontend/site/projects/museum/views/nav.overlay.js
@@ -1,4 +1,5 @@
 import React, { Component } from 'react'
+import { connect } from 'react-redux'
 
 import actions from 'site/actions'
 
@@ -7,6 +8,7 @@ import "./nav.css"
 import TextOverlay from './text.overlay'
 import JakrawalLinks from './jakrawal.links'
 import TitlesOverlay from './titles.overlay'
+import Flash from './flash'
 import { ARTISTS, ARTIST_ORDER, PROJECT_PAGE_SET } from "site/projects/museum/constants"
 import { ArrowLeft, ArrowRight } from "site/projects/museum/icons"
 import MuteButton from "site/audio/mute.button"
@@ -14,13 +16,15 @@ import { history } from "site/store"
 
 import Counter from './counter'
 
-export default class NavOverlay extends Component {
+class NavOverlay extends Component {
   state = {
     showHome: false,
+    showLanguage: false,
     showFooter: false,
     showArtist: false,
     showCounter: false,
     showMuteButton: false,
+    isProjectPage: false,
     artist: {},
   }
 
@@ -30,6 +34,7 @@ export default class NavOverlay extends Component {
     this.previousArtist = this.previousArtist.bind(this)
     this.nextArtist = this.nextArtist.bind(this)
     this.goHome = this.goHome.bind(this)
+    this.changeLanguage = this.changeLanguage.bind(this)
   }
 
   componentDidMount() {
@@ -52,41 +57,49 @@ export default class NavOverlay extends Component {
     if (pathkey === 'start') {
       this.setState({
         showHome: false,
+        showLanguage: true,
         showFooter: false,
         showArtist: false,
         showCounter: false,
         currentArtist: null,
         showMuteButton: false,
+        isProjectPage: false,
         artist: {},
       })
     }
     else if (pathkey === 'home') {
       this.setState({
         showHome: false,
+        showLanguage: true,
         showFooter: true,
         showArtist: false,
         showCounter: false,
         currentArtist: null,
         showMuteButton: true,
+        isProjectPage: false,
         artist: {},
       })
     }
     else if (PROJECT_PAGE_SET.has(pathkey)) {
       this.setState({
         showHome: false,
+        showLanguage: false,
         showFooter: false,
         showArtist: false,
         showCounter: false,
         showMuteButton: false,
+        isProjectPage: true,
       })
     }
     else if (pathkey in ARTISTS) {
       const shouldShowFooter = this.state.currentArtist !== pathkey
       this.setState({
         showHome: true,
+        showLanguage: true,
         showFooter: true,
         showArtist: true,
         showMuteButton: true,
+        isProjectPage: false,
         showCounter: pathkey === 'nilthamrong' && path_chapter !== "home",
         currentArtist: pathkey,
         artist: ARTISTS[pathkey],
@@ -94,10 +107,12 @@ export default class NavOverlay extends Component {
     } else {
       this.setState({
         showHome: false,
+        showLanguage: false,
         showFooter: false,
         showCounter: false,
         showArtist: false,
         showMuteButton: false,
+        isProjectPage: false,
         currentArtist: null,
         artist: {},
       })
@@ -109,7 +124,9 @@ export default class NavOverlay extends Component {
     // this.footerRef.current.classList.add("instant")
     this.footerRef.current.classList.add("visible")
     this.footerTimeout = setTimeout(() => {
-      this.footerRef.current.classList.remove("visible")
+      if (this.footerRef.current) {
+        this.footerRef.current.classList.remove("visible")
+      }
     }, 5000)
   }
 
@@ -135,21 +152,15 @@ export default class NavOverlay extends Component {
     history.push(`/last-museum/home/`)
   }
 
+  changeLanguage() {
+    actions.site.changeLanguage(this.props.language === "de" ? "en" : "de")
+  }
+
   render() {
-    const { showArtist, showHome, showMuteButton, showCounter, showFooter, artist } = this.state
+    const { showArtist, showHome, showLanguage, showMuteButton, showCounter, showFooter, isProjectPage, artist } = this.state
     return (
       <div className="museum-nav">
         <JakrawalLinks location={this.props.location} match={this.props.match} />
-        <div className="home-corner">
-          {showHome && (
-            <div className="home-link" onClick={this.goHome}>
-              Home
-            </div>
-          )}
-          {showMuteButton && (
-            <MuteButton />
-          )}
-        </div>
         {showCounter && <Counter />}
         <TextOverlay location={this.props.location} match={this.props.match} />
         {showFooter && (
@@ -168,8 +179,33 @@ export default class NavOverlay extends Component {
           )
         )}
         <TitlesOverlay location={this.props.location} match={this.props.match} />
+        <div className="home-corner">
+          {showHome && (
+            <div className="home-link" onClick={this.goHome} style={{ opacity: isProjectPage ? 0 : 1 }}>
+              Home
+            </div>
+          )}
+          {showLanguage && (
+            <div className="home-link" onClick={this.changeLanguage}>
+              {this.props.language === "de" ? (
+                <span><b>de</b> / en</span>
+              ) : (
+                <span>de / <b>en</b></span>
+              )}
+            </div>
+          )}
+          {showMuteButton && (
+            <MuteButton />
+          )}
+        </div>
+        <Flash location={this.props.location} match={this.props.match} />
       </div>
     )
   }
 }
 
+const mapStateToProps = state => ({
+  language: state.site.language,
+})
+
+export default connect(mapStateToProps)(NavOverlay)