bios

1 files changed, 14 insertions, 3 deletions

diff --git a/frontend/site/projects/museum/views/nav.overlay.js b/frontend/site/projects/museum/views/nav.overlay.js
index bd7812e..8c0a356 100644
--- a/frontend/site/projects/museum/views/nav.overlay.js
+++ b/frontend/site/projects/museum/views/nav.overlay.js
@@ -22,6 +22,7 @@ export default class NavOverlay extends Component {
 
   constructor(props) {
     super(props)
+    this.footerRef = React.createRef()
     this.previousArtist = this.previousArtist.bind(this)
     this.nextArtist = this.nextArtist.bind(this)
     this.goHome = this.goHome.bind(this)
@@ -62,6 +63,7 @@ export default class NavOverlay extends Component {
       })
     }
     else if (pathkey in ARTISTS) {
+      const shouldShowFooter = this.state.currentArtist !== pathkey
       this.setState({
         showHome: true,
         showFooter: true,
@@ -69,7 +71,7 @@ export default class NavOverlay extends Component {
         showCounter: pathkey === 'nilthamrong',
         currentArtist: pathkey,
         artist: ARTISTS[pathkey],
-      })
+      }, () => shouldShowFooter && this.quicklyShowFooter())
     } else {
       this.setState({
         showHome: false,
@@ -82,6 +84,15 @@ export default class NavOverlay extends Component {
     }
   }
 
+  quicklyShowFooter() {
+    clearTimeout(this.footerTimeout)
+    // this.footerRef.current.classList.add("instant")
+    this.footerRef.current.classList.add("visible")
+    this.footerTimeout = setTimeout(() => {
+      this.footerRef.current.classList.remove("visible")
+    }, 5000)
+  }
+
   previousArtist() {
     this.go(-1)
   }
@@ -116,7 +127,7 @@ export default class NavOverlay extends Component {
         {showCounter && <Counter />}
         {showFooter && (
           showArtist ? (
-            <div className="footer with-artist">
+            <div className="footer with-artist" ref={this.footerRef}>
               <div className="footer-gradient" />
               <div className="artist-desc">
                 <span className="artist-name">{artist.name}</span>
@@ -126,7 +137,7 @@ export default class NavOverlay extends Component {
               <div className="nav-arrow arrow-right" onClick={this.nextArtist}>{ArrowRight}</div>
             </div>
           ) : (
-            <div className="footer no-artist" />
+            <div className="footer no-artist" ref={this.footerRef} />
           )
         )}
         <TextOverlay location={this.props.location} match={this.props.match} />