diff --git a/Resources/Private/Fusion/Prototypes/Image.fusion b/Resources/Private/Fusion/Prototypes/Image.fusion
index bdd8b06..cbcbd36 100644
--- a/Resources/Private/Fusion/Prototypes/Image.fusion
+++ b/Resources/Private/Fusion/Prototypes/Image.fusion
@@ -134,8 +134,9 @@ prototype(Sitegeist.Kaleidoscope:Image) < prototype(Neos.Fusion:Component) {
# apply format, width and height to the imageSource
imageSource = ${props.imageSource}
imageSource.@if.hasImageSource = ${props.imageSource && Type.instance(props.imageSource, '\\Sitegeist\\Kaleidoscope\\Domain\\ImageSourceInterface')}
- imageSource.@process.applyWidth = ${props.width ? value.withWidth(props.width) : value}
- imageSource.@process.applyHeight = ${props.height ? value.withHeight(props.height) : value}
+ imageSource.@process.applyDimensions = ${(props.width && props.height) ? value.withDimensions(props.width, props.height) : value}
+ imageSource.@process.applyWidth = ${(props.width && !props.height) ? value.withWidth(props.width) : value}
+ imageSource.@process.applyHeight = ${(props.height && !props.width) ? value.withHeight(props.height) : value}
imageSource.@process.applyFormat = ${props.format ? value.withFormat(props.format) : value}
}
diff --git a/Resources/Private/Fusion/Prototypes/Picture.fusion b/Resources/Private/Fusion/Prototypes/Picture.fusion
index b51f54c..1bf606d 100644
--- a/Resources/Private/Fusion/Prototypes/Picture.fusion
+++ b/Resources/Private/Fusion/Prototypes/Picture.fusion
@@ -81,9 +81,11 @@ prototype(Sitegeist.Kaleidoscope:Picture) < prototype(Neos.Fusion:Component) {
@private {
# apply format, width and height to the imageSource
imageSource = ${props.imageSource}
- imageSource.@if.has = ${props.imageSource && Type.instance(props.imageSource, '\\Sitegeist\\Kaleidoscope\\Domain\\ImageSourceInterface')} imageSource.@process.applyWidth = ${props.width ? value.setWidth(props.width) : value}
- imageSource.@process.applyHeight = ${props.height ? value.setHeight(props.height) : value}
- imageSource.@process.applyFormat = ${props.format ? value.setFormat(props.format) : value}
+ imageSource.@if.has = ${props.imageSource && Type.instance(props.imageSource, '\\Sitegeist\\Kaleidoscope\\Domain\\ImageSourceInterface')}
+ imageSource.@process.applyDimensions = ${(props.width && props.height) ? value.withDimensions(props.width, props.height) : value}
+ imageSource.@process.applyWidth = ${(props.width && !props.height) ? value.withWidth(props.width) : value}
+ imageSource.@process.applyHeight = ${(props.height && !props.width) ? value.withHeight(props.height) : value}
+ imageSource.@process.applyFormat = ${props.format ? value.withFormat(props.format) : value}
}
renderer = afx`
diff --git a/Resources/Private/Fusion/Prototypes/Source.fusion b/Resources/Private/Fusion/Prototypes/Source.fusion
index 3939ed7..605f6e2 100644
--- a/Resources/Private/Fusion/Prototypes/Source.fusion
+++ b/Resources/Private/Fusion/Prototypes/Source.fusion
@@ -5,51 +5,50 @@ prototype(Sitegeist.Kaleidoscope:Source) < prototype(Neos.Fusion:Component) {
}
imageSource = null
+ imageSource.@process.contextFallback = ${value || __imageSource}
+
srcset = null
+ srcset.@process.contextFallback = ${value || __srcset}
+
sizes = null
+ sizes.@process.contextFallback = ${value || __sizes}
+
width = null
+ width.@process.contextFallback = ${value || __width}
+
height = null
+ height.@process.contextFallback = ${value || __height}
+
format = null
+ format.@process.contextFallback = ${value || __format}
+
type = null
media = null
renderDimensionAttributes = true
- renderer = Neos.Fusion:Component {
-
- @context {
- imageSource = ${props.imageSource || __imageSource}
- format = ${props.format || __format}
- width = ${props.width || __width}
- height = ${props.height || __height}
- srcset = ${props.srcset || __srcset}
- sizes = ${props.sizes || __sizes}
- }
+ @private {
+ isScalableSource = ${props.imageSource && Type.instance(props.imageSource, '\\Sitegeist\\Kaleidoscope\\Domain\\ScalableImageSourceInterface')}
- @if.hasImageSource = ${imageSource && Type.instance(imageSource, '\\Sitegeist\\Kaleidoscope\\Domain\\ImageSourceInterface')}
- isScalableSource = ${imageSource && Type.instance(imageSource, '\\Sitegeist\\Kaleidoscope\\Domain\\ScalableImageSourceInterface')}
-
- imageSource = ${imageSource}
- imageSource.@process.applyWidth = ${width ? value.withWidth(width) : value}
- imageSource.@process.applyHeight = ${height ? value.withHeight(height) : value}
+ imageSource = ${props.imageSource}
+ imageSource.@if.hasImageSource = ${props.imageSource && Type.instance(props.imageSource, '\\Sitegeist\\Kaleidoscope\\Domain\\ImageSourceInterface')}
+ imageSource.@process.applyDimensions = ${(width && height) ? value.withDimensions(width, height) : value}
+ imageSource.@process.applyWidth = ${(width && !height) ? value.withWidth(width) : value}
+ imageSource.@process.applyHeight = ${(height && !width) ? value.withHeight(height) : value}
imageSource.@process.applyFormat = ${format ? value.withFormat(format) : value}
- type = ${format ? 'image/' + format : props.type}
- srcset = ${srcset}
- sizes = ${sizes}
- media = ${props.media}
- renderDimensionAttributes = ${props.renderDimensionAttributes}
-
- renderer = afx`
-
- `
+ type = ${props.format ? 'image/' + props.format : props.type}
}
+
+ renderer = afx`
+
+ `
}