fullscreen text

5 files changed, 14 insertions, 14 deletions

diff --git a/animism-align/frontend/app/views/align/components/annotations/annotation.index.js b/animism-align/frontend/app/views/align/components/annotations/annotation.index.js
index b42f1ee..8e1fa43 100644
--- a/animism-align/frontend/app/views/align/components/annotations/annotation.index.js
+++ b/animism-align/frontend/app/views/align/components/annotations/annotation.index.js
@@ -43,6 +43,7 @@ class AnnotationIndex extends PureComponent {
   }
   handleClick(e, annotation) {
     e.stopPropagation()
+    if (!annotation) return
     if (e.shiftKey) {
       e.preventDefault()
       this.handleParagraphSelection(annotation, e.metaKey)
diff --git a/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.gallery.js b/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.gallery.js
index 61d24e3..c7df7f8 100644
--- a/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.gallery.js
+++ b/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.gallery.js
@@ -2,7 +2,7 @@ import React, { Component } from 'react'
 
 import { durationToHeight } from 'app/utils/align.utils'
 import { capitalize } from 'app/utils'
-import { annotationFadeTimings, thumbnailURL } from 'app/utils/annotation.utils'
+import { annotationFadeTimings } from 'app/utils/annotation.utils'
 
 import { checkAnnotationMediaNotReady, AnnotationMediaLoading } from './annotationTypes.utility'
 
@@ -10,7 +10,7 @@ export const AnnotationGallery = ({ y, annotation, media, timeline, selected, on
   const { text } = annotation
   const className = selected ? 'annotation media gallery selected' : 'annotation media gallery'
   if (checkAnnotationMediaNotReady(annotation, media)) {
-    return <AnnotationMediaLoading y={y} className={className} onClick={onClick} onDoubleClick={onDoubleClick} />
+    return <AnnotationMediaLoading y={y} annotation={annotation} className={className} onClick={onClick} onDoubleClick={onDoubleClick} />
   }
   const mediaItem = media[annotation.settings.media_id]
 
diff --git a/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.image.js b/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.image.js
index 7c97d99..8574067 100644
--- a/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.image.js
+++ b/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.image.js
@@ -9,7 +9,7 @@ export const AnnotationImage = ({ y, annotation, media, timeline, selected, onCl
   const { text } = annotation
   const className = selected ? 'annotation media image selected' : 'annotation media image'
   if (checkAnnotationMediaNotReady(annotation, media)) {
-    return <AnnotationMediaLoading y={y} className={className} onClick={onClick} onDoubleClick={onDoubleClick} />
+    return <AnnotationMediaLoading y={y} annotation={annotation} className={className} onClick={onClick} onDoubleClick={onDoubleClick} />
   }
   const mediaItem = media[annotation.settings.media_id]
 
diff --git a/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.utility.js b/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.utility.js
index 07c986c..1238163 100644
--- a/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.utility.js
+++ b/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.utility.js
@@ -91,7 +91,7 @@ export const AnnotationMediaLoading = ({ y, annotation, media, className, onClic
         style={{ top: y }}
         onClick={e => onClick(e, annotation)}
         onDoubleClick={e => onDoubleClick(e, annotation)}
-      >LOADING...</div>
+      >MEDIA NOT SET</div>
     )
   }
   if (!(annotation.settings.media_id in media)) {
diff --git a/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.video.js b/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.video.js
index 1ebc804..4533a5d 100644
--- a/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.video.js
+++ b/animism-align/frontend/app/views/align/components/annotations/annotationTypes/annotationTypes.video.js
@@ -1,19 +1,24 @@
 import React, { Component } from 'react'
 
-import { thumbnailURL } from 'app/utils/annotation.utils'
+import { annotationFadeTimings } from 'app/utils/annotation.utils'
+import { durationToHeight } from 'app/utils/align.utils'
 import { checkAnnotationMediaNotReady, AnnotationMediaLoading } from './annotationTypes.utility'
 
-export const AnnotationVideo = ({ y, annotation, media, selected, onClick, onDoubleClick }) => {
+export const AnnotationVideo = ({ y, annotation, media, timeline, selected, onClick, onDoubleClick }) => {
   const { start_ts, text } = annotation
   const className = selected ? 'annotation media video selected' : 'annotation media video'
   if (checkAnnotationMediaNotReady(annotation, media)) {
-    return <AnnotationMediaLoading y={y} className={className} onClick={onClick} onDoubleClick={onDoubleClick} />
+    return <AnnotationMediaLoading y={y} annotation={annotation} className={className} onClick={onClick} onDoubleClick={onDoubleClick} />
   }
   const data = media[annotation.settings.media_id]
+  const {
+    fadeInDuration, fadeOutDuration, duration,
+  } = annotationFadeTimings(annotation)
+  const durationHeight = annotation.settings.fullscreen ? durationToHeight(duration, timeline) : 'auto'
   return (
     <div
       className={className}
-      style={{ top: y }}
+      style={{ top: y, height: durationHeight }}
       onClick={e => onClick(e, annotation)}
       onDoubleClick={e => onDoubleClick(e, annotation)}
     >
@@ -27,9 +32,3 @@ export const AnnotationVideo = ({ y, annotation, media, selected, onClick, onDou
     </div>
   )
 }
-
-/*
-      <div className='img'>
-        <img src={thumbnailURL(data)} alt={data.title} />
-      </div>
-*/
\ No newline at end of file