diff options
Diffstat (limited to 'frontend/site/projects/museum/views/nav.overlay.js')
| -rw-r--r-- | frontend/site/projects/museum/views/nav.overlay.js | 74 |
1 files changed, 74 insertions, 0 deletions
diff --git a/frontend/site/projects/museum/views/nav.overlay.js b/frontend/site/projects/museum/views/nav.overlay.js new file mode 100644 index 0000000..36af7db --- /dev/null +++ b/frontend/site/projects/museum/views/nav.overlay.js @@ -0,0 +1,74 @@ +import React, { Component } from 'react' + +import actions from 'site/actions' + +import "./nav.css" + +import { ARTISTS } from "site/projects/museum/constants" + +export default class NavOverlay extends Component { + state = { + showHome: false, + showFooter: false, + showArtist: false, + artist: {}, + } + + constructor(props) { + super(props) + } + + componentDidMount() { + this.load() + } + componentDidUpdate() { + if (this.props.location.pathname !== prevProps.location.pathname) { + this.load() + } + } + + load() { + const { pathname } = this.props.location + const pathPartz = pathname.split("-") + const pathkey = pathPartz[0] + if (pathkey === 'start') { + this.setState({ + showFooter: true, + showArtist: false, + artist: {} + }) + } else if (pathkey in ARTISTS) { + this.setState({ + showFooter: true, + showArtist: true, + artist: ARTISTS[pathkey] + }) + } else { + this.setState({ + showFooter: false, + showArtist: false, + artist: {} + }) + } + } + + render() { + const { showArtist, showHome, artist } = this.state + return ( + <div className="museum-nav"> + {showFooter && ( + showArtist ? ( + <div className="footer"> + <span className="arrow-left">{ArrowLeft}</span> + <span className="artist-name">{artist.name}</span> + <span className="artist-location">{artist.location}</span> + <span className="arrow-right">{ArrowRight}</span> + </div> + } : ( + <div className="footer" /> + ) + ))} + </div> + ) + } +} |
