replace the marquee

11 files changed, 126 insertions, 22 deletions

diff --git a/frontend/site/app/revisions.js b/frontend/site/app/revisions.js
new file mode 100644
index 0000000..8d3b16e
--- /dev/null
+++ b/frontend/site/app/revisions.js
@@ -0,0 +1,14 @@
+/**
+ * In case you need to, you can make last-minute modifications to the
+ * graph before it's loaded.  This might be preferable in case there
+ * are certain edits that need to be applied conditionally.
+ */
+
+import { isMobile } from "app/utils"
+
+export default function reviseGraph (graph) {
+  if (isMobile) {
+    //
+  }
+  return graph
+}
diff --git a/frontend/site/site.css b/frontend/site/app/roadblock.css
index 0597514..0597514 100644
--- a/frontend/site/site.css
+++ b/frontend/site/app/roadblock.css
diff --git a/frontend/site/index.js b/frontend/site/index.js
index 6d80528..a945659 100644
--- a/frontend/site/index.js
+++ b/frontend/site/index.js
@@ -2,8 +2,6 @@ import React from 'react'
 import ReactDOM from 'react-dom'
 import { Provider } from 'react-redux'
 
-import './site.css'
-
 import App from './APP_TARGET'
 
 import { store, history } from 'site/store'
diff --git a/frontend/site/projects/museum/app/revisions.js b/frontend/site/projects/museum/app/revisions.js
new file mode 100644
index 0000000..9aa66a7
--- /dev/null
+++ b/frontend/site/projects/museum/app/revisions.js
@@ -0,0 +1,24 @@
+
+import { isMobile } from "app/utils"
+
+export default function reviseSite (graph) {
+  console.log(graph)
+  if (!isMobile) {
+    return graph
+  }
+  graph.pages['/last-museum/home'].tiles = (
+    graph.pages['/last-museum/home'].tiles
+      .filter(tile => tile.type !== 'text')
+  )
+  Object.keys(graph.pages).forEach(path => {
+    const page = graph.pages[path]
+    if (path.match("opoku")) {
+      page.tiles.forEach(tile => {
+        if (tile.type === 'image') {
+          tile.settings.scale /= 2
+        }
+      })
+    }
+  })
+  return graph
+}
diff --git a/frontend/site/projects/museum/app/roadblock.css b/frontend/site/projects/museum/app/roadblock.css
index 73102af..6b2cf40 100644
--- a/frontend/site/projects/museum/app/roadblock.css
+++ b/frontend/site/projects/museum/app/roadblock.css
@@ -1,15 +1,17 @@
 .roadblock {
-  background: #111;
-  color: #ff790d;
-  position: absolute;
-  top: 0; left: 0;
+  position: fixed;
+  top: 0;
+  left: 0;
   width: 100vw;
   height: 100vh;
+  background: #111;
+  color: #ff790d;
   padding: 1rem 0;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: space-between;
+  z-index: 2;
 }
 .roadblock-byline {
   font-family: "Druk Wide";
diff --git a/frontend/site/projects/museum/constants.js b/frontend/site/projects/museum/constants.js
index c14fa25..4d983f0 100644
--- a/frontend/site/projects/museum/constants.js
+++ b/frontend/site/projects/museum/constants.js
@@ -378,6 +378,10 @@ export const MARQUEES = {
   'opoku-1-hail-to-you': {
     en: 'Hail to you, lords of truth, free from wrongdoing, who exist forever and forever. I have reached you because I am an akh with my forms. I am powerful through my magic. Going forth by day / Papyrus of Sobekmose / Book of the Dead ...',
     de: 'Seid gegrüßt, ihr Herren der Wahrheit, frei von Unrecht, die ihr für immer und ewig existiert. Ich habe euch erreicht, weil ich mit meinen Formen ein akh bin. Ich bin mächtig durch meine Magie. Weitergehen bei Tag / Papyrus des Sobekmose / Totenbuch ...',
+  },
+  'opoku-9-to-me-belongs-yesterday': {
+    en: 'To me belongs yesterday which is pregnant with tomorrow. Its births will rise on another occasion of his. (I am) the one whose ba is secret, who made the gods, who gives offerings to the protector of the west (side) of the sky, the steering rudder of the east, lord of two faces whose rays are seen, lord of the elevations who goes forth at twilight, manifestations … / Solar Text. Coming forth by day and not preventing the BA / Papyrus of Sobekmose / Book of the Dead',
+    de: 'To me belongs yesterday which is pregnant with tomorrow. Its births will rise on another occasion of his. (I am) the one whose ba is secret, who made the gods, who gives offerings to the protector of the west (side) of the sky, the steering rudder of the east, lord of two faces whose rays are seen, lord of the elevations who goes forth at twilight, manifestations … / Solar Text. Coming forth by day and not preventing the BA / Papyrus of Sobekmose / Book of the Dead',
   }
 }
 
diff --git a/frontend/site/projects/museum/views/marquee.css b/frontend/site/projects/museum/views/marquee.css
index 2fcfd5a..adec4b5 100644
--- a/frontend/site/projects/museum/views/marquee.css
+++ b/frontend/site/projects/museum/views/marquee.css
@@ -8,8 +8,8 @@
 .marquee-text {
   white-space: nowrap;
   padding-left: 100vw;
-  width: 6500px;
+  width: 8500px;
   font-family: "Druk Wide", sans-serif;
-  font-size: 30px;
+  font-size: 26px;
   color: #fff;
 }
diff --git a/frontend/site/projects/museum/views/marquee.js b/frontend/site/projects/museum/views/marquee.js
index 6cd2818..bd47b39 100644
--- a/frontend/site/projects/museum/views/marquee.js
+++ b/frontend/site/projects/museum/views/marquee.js
@@ -1,5 +1,5 @@
 import React, { Component } from 'react'
-import Marquee from "react-fast-marquee"
+import Marquee from "react-smooth-marquee"
 
 import "./marquee.css"
 
@@ -36,6 +36,17 @@ export default class MarqueeContainer extends Component {
     if (!this.state.message) return null
     return (
       <div className="marquee-container">
+        <Marquee>
+          <span className="marquee-text">
+            {this.state.message[language]}
+          </span>
+        </Marquee>
+      </div>
+    )
+  }
+}
+
+/*
         <Marquee
           direction="left"
           speed={112}
@@ -45,7 +56,4 @@ export default class MarqueeContainer extends Component {
             {this.state.message[language]}
           </span>
         </Marquee>
-      </div>
-    )
-  }
-}
+*/
diff --git a/frontend/site/projects/museum/views/mobile.css b/frontend/site/projects/museum/views/mobile.css
index b195911..ab84f1b 100644
--- a/frontend/site/projects/museum/views/mobile.css
+++ b/frontend/site/projects/museum/views/mobile.css
@@ -1,3 +1,23 @@
+.home-footer {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 96%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-evenly;
+}
+.home-footer a {
+  display: inline-block;
+  padding: 0.375rem ​1rem;
+  color: #ff790d;
+  font-family: "Druk Wide", sans-serif;
+  font-size: 1.2rem;
+  font-style: italic;
+  text-decoration: none;
+}
+
 @media only screen and (max-device-height: 500px) {
   /* site container */
   .container {
@@ -66,6 +86,9 @@
   }
 
   /* artist pages */
+  .page-artists .artist-detail-name {
+    text-shadow: 0 0 3px #ff790d;
+  }
   .page-artists .artist-location {
     bottom: 0.5rem;
   }
@@ -85,6 +108,7 @@
     bottom: 0;
     background: #111111;
     padding: 0.75rem;
+    font-size: 0.675rem;
     margin: 0;
   }
 
@@ -102,6 +126,7 @@
     font-size: 1.1rem;
   }
   .page-essay.page-artists .page-title {
+    text-shadow: 0 0 3px #000;
     margin: 1rem 0;
   }
 
@@ -152,4 +177,12 @@
   .text-overlay {
     padding: 10vw;
   }
+
+  /* zohra */
+  .marquee-text {
+    font-size: 12px;
+  }
+  .marquee-container {
+    bottom: 3rem;
+  }
 }
\ No newline at end of file
diff --git a/frontend/site/projects/museum/views/nav.overlay.js b/frontend/site/projects/museum/views/nav.overlay.js
index 6d06fc3..3e3b8dc 100644
--- a/frontend/site/projects/museum/views/nav.overlay.js
+++ b/frontend/site/projects/museum/views/nav.overlay.js
@@ -1,21 +1,23 @@
 import React, { Component } from 'react'
 import { connect } from 'react-redux'
+import { Link } from 'react-router-dom'
 
 import actions from 'site/actions'
 
 import "./nav.css"
 
-import TextOverlay from './text.overlay'
-import JakrawalLinks from './jakrawal.links'
-import TitlesOverlay from './titles.overlay'
-import Flash from './flash'
-import Marquee from './marquee'
-import LandscapeWarning from './landscape.warning'
 import { ARTISTS, ARTIST_ORDER, PROJECT_PAGE_SET, BACK_TO_KW } from "site/projects/museum/constants"
 import { ArrowLeft, ArrowRight } from "site/projects/museum/icons"
 import MuteButton from "site/audio/mute.button"
 import { history } from "site/store"
+import { isMobile } from "app/utils"
+import LandscapeWarning from './landscape.warning'
 
+import TextOverlay from './text.overlay'
+import JakrawalLinks from './jakrawal.links'
+import TitlesOverlay from './titles.overlay'
+import Flash from './flash'
+import Marquee from './marquee'
 import Counter from './counter'
 
 class NavOverlay extends Component {
@@ -27,6 +29,7 @@ class NavOverlay extends Component {
     showCounter: false,
     showMuteButton: false,
     isProjectPage: false,
+    showHomeFooterLinks: false,
     showClose: false,
     orangeClose: false,
     artist: {},
@@ -68,6 +71,7 @@ class NavOverlay extends Component {
         currentArtist: null,
         showMuteButton: false,
         isProjectPage: false,
+        showHomeFooterLinks: false,
         showClose: true,
         orangeClose: false,
         artist: {},
@@ -83,6 +87,7 @@ class NavOverlay extends Component {
         currentArtist: null,
         showMuteButton: true,
         isProjectPage: false,
+        showHomeFooterLinks: isMobile,
         showClose: true,
         orangeClose: true,
         artist: {},
@@ -96,6 +101,7 @@ class NavOverlay extends Component {
         showArtist: false,
         showCounter: false,
         showMuteButton: false,
+        showHomeFooterLinks: false,
         isProjectPage: true,
         showClose: false,
         orangeClose: false,
@@ -110,6 +116,7 @@ class NavOverlay extends Component {
         showArtist: true,
         showMuteButton: true,
         isProjectPage: false,
+        showHomeFooterLinks: false,
         showClose: false,
         orangeClose: false,
         showCounter: pathkey === 'nilthamrong' && path_chapter !== "home",
@@ -125,6 +132,7 @@ class NavOverlay extends Component {
         showArtist: false,
         showMuteButton: false,
         isProjectPage: false,
+        showHomeFooterLinks: false,
         showClose: false,
         orangeClose: false,
         currentArtist: null,
@@ -172,7 +180,11 @@ class NavOverlay extends Component {
 
   render() {
     const { language } = this.props
-    const { showArtist, showHome, showLanguage, showMuteButton, showCounter, showFooter, showClose, orangeClose, isProjectPage, artist } = this.state
+    const {
+      showHome, showLanguage, showMuteButton,
+      showFooter, showHomeFooterLinks, showClose, orangeClose,
+      showArtist, isProjectPage, artist, showCounter
+    } = this.state
     return (
       <div className="museum-nav">
         <JakrawalLinks location={this.props.location} match={this.props.match} />
@@ -193,6 +205,13 @@ class NavOverlay extends Component {
             <div className="footer no-artist" ref={this.footerRef} />
           )
         )}
+        {showHomeFooterLinks && (
+          <div className="home-footer">
+            <Link to="/last-museum/credits">CREDITS</Link>
+            <Link to="/last-museum/artists">ARTISTS</Link>
+            <Link to="/last-museum/essay">TEXTS</Link>
+          </div>
+        )}
         <Marquee location={this.props.location} match={this.props.match} language={this.props.language} />
         <TitlesOverlay location={this.props.location} match={this.props.match} />
         <div className="home-corner">
diff --git a/frontend/site/site/site.reducer.js b/frontend/site/site/site.reducer.js
index faf7aae..aceb6d5 100644
--- a/frontend/site/site/site.reducer.js
+++ b/frontend/site/site/site.reducer.js
@@ -1,5 +1,7 @@
 import * as types from 'site/types'
 
+import reviseSite from '../APP_TARGET/revisions'
+
 const initialState = {
   siteTitle: 'swimmer',
   ready: false,
@@ -24,7 +26,7 @@ export default function siteReducer(state = initialState, action) {
     case types.site.loaded:
       return {
         ...state,
-        graph: action.data.graph,
+        graph: reviseSite(action.data.graph),
         cursors: buildCursors(action.data.graph),
       }
 
@@ -72,4 +74,4 @@ function buildCursors(graph) {
       accumulator[item.id] = item
       return accumulator
     }, {})
-}
\ No newline at end of file
+}