diff options
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.js | 25 |
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> + ) +} |
