-
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Picture.fusion
68 lines (68 loc) · 4.21 KB
/
Picture.fusion
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
prototype(Carbon.Image:Component.Presentation.Picture) < prototype(Carbon.Image:Helper.BasisPresentation) {
renderer = afx`
<Carbon.Eel:Tag tagName={props.figureTagName} attributes={props.figureAttributes}>
<Carbon.Eel:Tag @key='wrapper' tagName={props.linkAttributes ? 'a' : null} attributes={props.linkAttributes}>
<picture {...props.pictureAttributes}>
<Neos.Fusion:Loop
@if={props.additionalFormats && private.isAssetImageSource}
@key='additionalFormats'
items={props.additionalFormats}
itemName='format'
>
<Carbon.Image:Component.Fragment.Source
@key='noSources'
@if={!props.sources && format != props.defaultFormat}
lazy={props.lazy}
imageSource={private.sizedImageSource.withFormat(format)}
type={'image/' + format}
srcset={private.finalSrcSet}
sizes={props.sizes}
width={props.width}
height={props.height}
/>
<Neos.Fusion:Loop @key='sources' items={props.sources} itemName='source' @if={props.sources}>
<Carbon.Image:Component.Fragment.Source
lazy={props.lazy}
imageSource={source.imageSource ? source.imageSource.withFormat(format) : private.sizedImageSource.withFormat(format)}
type={'image/' + format}
media={source.media || props.media}
srcset={source.srcset || private.finalSrcSet}
sizes={source.sizes || props.sizes}
width={source.width || props.width}
height={source.height || props.height}
/>
</Neos.Fusion:Loop>
</Neos.Fusion:Loop>
<Neos.Fusion:Loop @key='sources' items={props.sources} itemName='source' @if={props.sources}>
<Carbon.Image:Component.Fragment.Source
lazy={props.lazy}
imageSource={source.imageSource ? (props.defaultFormat ? source.imageSource.withFormat(props.defaultFormat) : source.imageSource) : (props.defaultFormat ? private.sizedImageSource.withFormat(props.defaultFormat) : private.sizedImageSource)}
type={props.defaultFormat ? ('image/' + props.defaultFormat) : (source.imageSource ? source.type : private.sizedImageSource.type)}
media={source.media}
srcset={source.srcset || private.finalSrcSet}
sizes={source.sizes || props.sizes}
width={source.width || props.width}
height={source.height || props.height}
/>
</Neos.Fusion:Loop>
<Carbon.Image:Component.Fragment.Image
@key='image'
lazy={props.lazy}
lazyWidth={props.lazyWidth}
id={props.id}
class={Carbon.String.merge(props.class, private.imageClass, props.lazy ? props.lazyClass : null)}
style={props.style}
title={props.title}
loading={props.loading}
alt={props.alternativeText}
imageSource={props.defaultFormat ? private.sizedImageSource.withFormat(props.defaultFormat) : private.sizedImageSource}
sizes={props.sizes}
srcset={private.isScalableImageSource ? private.finalSrcSet : null}
objectFit={props.objectFit}
/>
</picture>
</Carbon.Eel:Tag>
<Carbon.Image:Component.Fragment.Figcaption @key='figcaption' {...props} />
</Carbon.Eel:Tag>
`
}