summaryrefslogtreecommitdiff
path: root/animism-align/frontend/app/views/viewer/player/components.inline/inline.gallery.js
diff options
context:
space:
mode:
Diffstat (limited to 'animism-align/frontend/app/views/viewer/player/components.inline/inline.gallery.js')
-rw-r--r--animism-align/frontend/app/views/viewer/player/components.inline/inline.gallery.js25
1 files changed, 23 insertions, 2 deletions
diff --git a/animism-align/frontend/app/views/viewer/player/components.inline/inline.gallery.js b/animism-align/frontend/app/views/viewer/player/components.inline/inline.gallery.js
index eb43e23..277a237 100644
--- a/animism-align/frontend/app/views/viewer/player/components.inline/inline.gallery.js
+++ b/animism-align/frontend/app/views/viewer/player/components.inline/inline.gallery.js
@@ -1,7 +1,7 @@
import React from 'react'
import { CURTAIN_COLOR_LOOKUP } from 'app/constants'
-import { MediaCitation, Vitrine, Gallery } from '../components.utility'
+import { MediaCitation, Vitrine, Gallery, Carousel } from '../components.utility'
export const InlineVitrine = ({ paragraph, media, currentParagraph, currentAnnotation, onAnnotationClick, onDoubleClick }) => {
const annotation = paragraph.annotations[0]
@@ -18,9 +18,9 @@ export const InlineVitrine = ({ paragraph, media, currentParagraph, currentAnnot
>
{annotation.settings.title && <div className='heading'>{annotation.settings.title}</div>}
<Vitrine media={item} />
- <MediaCitation media={item} />
</div>
)
+ // <MediaCitation media={item} />
}
export const InlineGallery = ({ paragraph, media, currentParagraph, currentAnnotation, onAnnotationClick, onDoubleClick }) => {
@@ -43,3 +43,24 @@ export const InlineGallery = ({ paragraph, media, currentParagraph, currentAnnot
</div>
)
}
+
+export const InlineCarousel = ({ paragraph, media, currentParagraph, currentAnnotation, onAnnotationClick, onDoubleClick }) => {
+ const annotation = paragraph.annotations[0]
+ const item = media.lookup[annotation.settings.media_id]
+ const color = CURTAIN_COLOR_LOOKUP[annotation.settings.color] || CURTAIN_COLOR_LOOKUP.white
+ const style = {
+ backgroundColor: color.backgroundColor,
+ color: color.textColor,
+ }
+
+ return (
+ <div
+ className='inline-element media carousel'
+ >
+ <div style={style} className='carousel-container'>
+ <Carousel media={item} />
+ </div>
+ <MediaCitation media={item} />
+ </div>
+ )
+}