summaryrefslogtreecommitdiff
path: root/frontend/site/projects/museum/views/marquee.js
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/site/projects/museum/views/marquee.js')
-rw-r--r--frontend/site/projects/museum/views/marquee.js51
1 files changed, 51 insertions, 0 deletions
diff --git a/frontend/site/projects/museum/views/marquee.js b/frontend/site/projects/museum/views/marquee.js
new file mode 100644
index 0000000..5d031eb
--- /dev/null
+++ b/frontend/site/projects/museum/views/marquee.js
@@ -0,0 +1,51 @@
+import React, { Component } from 'react'
+import Marquee from "react-fast-marquee"
+
+import "./marquee.css"
+
+import { MARQUEES } from "site/projects/museum/constants"
+
+export default class MarqueeContainer extends Component {
+ constructor(props) {
+ super(props)
+ this.state = {
+ }
+ }
+
+ componentDidMount() {
+ this.load()
+ }
+
+ componentDidUpdate(prevProps) {
+ if (this.props.location.pathname !== prevProps.location.pathname) {
+ this.load()
+ }
+ }
+
+ load() {
+ const { match } = this.props
+ const { page_name } = match.params
+ if (!(page_name in MARQUEES)) {
+ this.setState({ message: null })
+ }
+ this.setState({ message: MARQUEES[page_name] })
+ }
+
+ render() {
+ const { language } = this.props
+ if (!this.state.message) return null
+ return (
+ <div className="marquee-container">
+ <Marquee
+ direction="left"
+ speed={412}
+ gradient={false}
+ >
+ <span className="marquee-text">
+ {this.state.message[language]}
+ </span>
+ </Marquee>
+ </div>
+ )
+ }
+}