Back to Frontend

ImageFigure.Scala

common/app/views/fragments/imageFigure.scala.html

latest2.5 KB
Original Source

@import layout.ContentWidths.MainMedia @import model.ImageAsset @import views.support.{ImgSrc, Item700} @import model.DotcomContentType @( picture: model.ImageMedia, lightboxIndex: Option[Int] = None, isShowcase: Boolean = false, isFeature: Boolean = false, isSplash: Boolean = false, widthsByBreakpoint: layout.WidthsByBreakpoint = MainMedia.inline, image_figureClasses: Option[(model.ImageAsset, String)] = None, shareInfo: Option[(Seq[model.ShareLink], DotcomContentType)] = None, doCaption: Boolean = true )(implicit request: RequestHeader) @defining(image_figureClasses match { case Some((image, figureClasses)) => (Some(image), s"element element-image $figureClasses", false) case None => (ImgSrc.getFallbackAsset(picture), s"media-primary media-content ${if(isShowcase && !isSplash) "media-primary--showcase"}", true) } ) { case (imageOption, figureClasses, isMain) => @id.map{ id => data-media-id="@id" } } @lightboxIndex.map { index => id="img-@index" } > @if(isMain) { } @defining(Item700.bestFor(picture)) { asset => } @defining( if (isMain) { Seq("maxed", "responsive-img") } else { Seq("gu-image") } ) { classes => @lightbox { @fragments.image( picture, classes, widthsByBreakpoint, imageOption.flatMap(_.altText).getOrElse(""), isShowcase ) } } @if(doCaption) { @showcaseFeature{ @caption(picture, imageOption, isMain) } } } @showcaseFeature(captionHtml: => Html) = { @captionHtml } @lightbox(imageHtml: => Html) = { @lightboxIndex.map { index => @imageHtml @fragments.inlineSvg("expand-image", "icon", List("centered-icon", "rounded-icon", "article__fullscreen", "modern-visible")) @shareInfo.map { case (shareLinks, contentType) => @share.blockLevelSharing(s"img-$index", shareLinks, contentType) } }.getOrElse { @imageHtml } } @caption(picture: model.ImageMedia, imageOption: Option[ImageAsset], isMain: Boolean) = { @imageOption.map { img => @if(img.showCaption) { @if(isMain) { @if(!isSplash) { @fragments.inlineSvg("information", "icon", List("reveal-caption-icon", "centered-icon")) [email protected]("triangle", "icon", List("hide-until-tablet")) @img.caption.map(Html()) @if(img.displayCredit && !img.creditEndsWithCaption) { @img.credit.map(Html()) }_ } } else { [email protected]("triangle", "icon") @img.caption.map(Html()) @if(img.displayCredit && !img.creditEndsWithCaption) { @img.credit.map(Html()) }_ } } } }