1 files changed, 48 insertions, 7 deletions

diff --git a/frontend/site/projects/museum/views/home.js b/frontend/site/projects/museum/views/home.js
index 1520c11..7c42ef9 100644
--- a/frontend/site/projects/museum/views/home.js
+++ b/frontend/site/projects/museum/views/home.js
@@ -1,13 +1,18 @@
 import React, { Component } from 'react'
 import { connect } from 'react-redux'
 
+import { history } from 'site/store'
 import actions from 'site/actions'
 
 import "./home.css"
 
+let clicked = false
+let started = false
+
 class Home extends Component {
   constructor(props) {
     super(props)
+    this.ref = React.createRef()
     this.handleClick = this.handleClick.bind(this)
     this.state = {
       open: false,
@@ -26,18 +31,54 @@ class Home extends Component {
 
   handleClick(e) {
     e && e.preventDefault()
-    if (this.state.open) {
-      actions.site.interact()
-      this.setState({ hidden: true })
+    actions.site.interact()
+
+    this.index = 0
+    const FLASH_TIME = 150
+    const order = [
+      ["home orange-text intro", FLASH_TIME],
+      ["home white-text orange-bg", FLASH_TIME],
+      ["home orange-text white-bg", FLASH_TIME],
+      ["home white-text orange-bg", FLASH_TIME],
+      ["home orange-text white-bg", FLASH_TIME],
+      ["home white-text orange-bg", FLASH_TIME],
+    ]
+
+    const go = () => {
+      clearTimeout(this.timeout)
+      const item = order[this.index]
+      if (item) {
+        this.ref.current.className = item[0]
+        this.index += 1
+        this.timeout = setTimeout(go, item[1])
+      } else {
+        this.ref.current.className = "home orange-text intro hidden"
+        clicked = true
+      }
     }
-    else {
-      this.setState({ open: true })
+
+    if (!clicked) {
+      go()
+    } else if (!started) {
+      this.ref.current.className = "home orange-text black-bg open"
+      setTimeout(() => {
+        started = true
+      }, 200)
+    } else {
+      this.ref.current.className = "home orange-text orange-bg open"
+      setTimeout(() => {
+        history.push("/last-museum/stankievech-1")
+      }, FLASH_TIME)
     }
   }
 
   render() {
     return (
-      <div className={this.state.hidden ? "home hidden open" : this.state.open ? "home open" : "home"} onClick={this.handleClick}>
+      <div
+        ref={this.ref}
+        className="home orange-text intro"
+        onClick={this.handleClick}
+      >
         <div className="home-byline byline-top">KW PRESENTS</div>
         <div className="home-title title-1">THE L<span>AST</span></div>
         <div className="home-title title-2">MUSEUM</div>
@@ -53,7 +94,7 @@ class Home extends Component {
         </div>
         <div className="home-byline byline-bottom">CURATED BY NADIM SAMMAN</div>
         <div className="home-message">
-          Lorem ipsum dolor sit amet, pro ea errem nonumes, gubergren deterruisset sit eu. Quo nostrud definitiones ex, sea dicant accommodare ei, te vix habeo minim voluptatum.
+          The Last Museum hovers somewhere between life and death, lockdown and escape. Spanning six continents and too many screens, it is home to new muses - born of encounters between digital space and facts on the ground. It is web-site-specific. You are already here.
         </div>
         <div className={this.state.showCurtain ? "curtain" : "curtain hidden"} />
       </div>