1 files changed, 16 insertions, 13 deletions
diff --git a/frontend/site/projects/museum/views/petros.nav.js b/frontend/site/projects/museum/views/petros.nav.js
index 4eb6d5e..7a54c72 100644
--- a/frontend/site/projects/museum/views/petros.nav.js
+++ b/frontend/site/projects/museum/views/petros.nav.js
@@ -13,6 +13,7 @@ import actions from "site/actions"
 import { generateTransform } from 'app/views/tile/tile.utils'
 
 import PetrosText from "./petros.text"
+import { PetrosIcons } from "./petros.icons"
 
 const RESET_STATE = {
   ready: false,
@@ -52,10 +53,10 @@ const INITIAL_VIEW = {
 // set this to 0.1 in development, 1.0 otherwise :)
 const FASTFORWARD = 1.0
 
-const LOOP_TIMEOUT = 6000 * FASTFORWARD
-const MOVEMENT_TIMEOUT = 45000 * FASTFORWARD
-const TEXT_LOAD_TIMEOUT = 15000 * FASTFORWARD
-const SHOW_NAV_TIMEOUT = 10000 * FASTFORWARD
+const LOOP_TIMEOUT = 2000 * FASTFORWARD
+const MOVEMENT_TIMEOUT = 41000 * FASTFORWARD
+const TEXT_LOAD_TIMEOUT = 6000 * FASTFORWARD
+const SHOW_NAV_TIMEOUT = 2000 * FASTFORWARD
 const TEXT_HIDE_TIMEOUT = 20000 * FASTFORWARD
 
 const SUBTITLE_COUNT = 12
@@ -135,7 +136,7 @@ class PetrosNav extends Component {
     page.tiles.some(tile => {
       if (tile.settings.popup_group === "glyph") {
         let transform = generateTransform(tile, null, bounds, videoBounds)
-        transform = transform.replace(/scale(\d+\.\d+)/g, "scale(0.9)")
+        transform = transform.replace(/scale\([^)]+\)/g, "")
         this.setState({
           glyphTransform: {
             transform
@@ -179,7 +180,7 @@ class PetrosNav extends Component {
       this.setState({
         textPrep: true,
       })
-    }, 1000)
+    }, 250)
 
     this.textTimeout = setTimeout(() => {
       // Turn off the glyph
@@ -274,17 +275,19 @@ class PetrosNav extends Component {
           }
         />
 
-        <img
-          className={(ready && !(textActive || textDone)) ? "petros-text visible" : "petros-text"}
+        <div
+          className={[
+            "petros-text",
+            ready && !(textActive || textDone) ? "visible" : "",
+            hovering === "text" || textActive || textDone ? "white" : "",
+          ].join(" ")}
           style={glyphTransform}
-          src={(hovering === "text" || textActive || textDone)
-            ? `/thelastmuseum/static/media/last-museum/petros-moris/OracleTextButton${index}-White.png`
-            : `/thelastmuseum/static/media/last-museum/petros-moris/OracleTextButton${index}.png`
-          }
           onMouseEnter={this.handleEnter}
           onMouseLeave={this.handleLeave}
           onClick={this.handleClickText}
-        />
+        >
+          {PetrosIcons[(index - 1)]}
+        </div>
 
         {ready && (
           <img