staggered, cancellable preloading of all section image assets, as soon as the section loads

1 files changed, 6 insertions, 14 deletions

diff --git a/animism-align/frontend/app/views/viewer/player/components.fullscreen/fullscreen.image.js b/animism-align/frontend/app/views/viewer/player/components.fullscreen/fullscreen.image.js
index 60ba7c9..a05789b 100644
--- a/animism-align/frontend/app/views/viewer/player/components.fullscreen/fullscreen.image.js
+++ b/animism-align/frontend/app/views/viewer/player/components.fullscreen/fullscreen.image.js
@@ -1,29 +1,21 @@
 import React from 'react'
 
 import { CURTAIN_COLOR_LOOKUP } from 'app/constants'
+import { displayElementImageURL } from 'app/utils/annotation.utils'
+
 export const FullscreenImage = ({ element, media, transitionDuration }) => {
   const color = element.color || CURTAIN_COLOR_LOOKUP.white
 
-  const item = media.lookup[element.settings.media_id]
+  const mediaItem = media.lookup[element.settings.media_id]
   const style = {
     backgroundColor: color.backgroundColor,
     color: color.textColor,
     transitionDuration,
   }
   
-  let url;
-  // console.log(element, item)
-  if (item.type === 'gallery') {
-    const index = parseInt(element.settings.frame_index)
-    const frame_id = item.settings.image_order[index]
-    const frame = item.settings.display_lookup[frame_id]
-    if (!frame) {
-      console.error("Slide not found:", element.settings.frame_index)
-      return <div />
-    }
-    url = frame.url
-  } else {
-    url = item.settings.display.url
+  let url = displayElementImageURL(element, mediaItem)
+  if (!url) {
+    return <div />
   }
 
   return (