Templating Funktion

Der Name der Templating Funktion ist resizerfn und die Klasse ist com.dev5310.imageresizer.templating.ImageResizerTemplatingFunction.

Es gibt drei Sets a vier Templating-Funktionen. Diese lassen sich in die drei Kategorien Pfad, Link und kompletter Link unterteilen.

  • Pfad (resizerfn.getPath()) → Der Pfad ab dem imaging Servlet: /.imaging/resizer/500/125/94-7/dam/jcr: bdd4c472-e1a9-453b-a11d-6f2e4b90d281/Hafenluft.JPG
  • Link (resizerfn.getLink()) → Ein Link ohne Domain aber mit Context Pfad: /dev/.imaging/resizer/500/125/94-7/dam/jcr:bdd4c472-e1a9-453b-a11d-6f2e4b90d281/Hafenluft.JPG
  • Kompletter Link (resizerfn.getCompleteLink()) → Ein Link mit Domain: http://localhost:8080/dev/.imaging/resizer/500/125/94-7/dam/jcr:bdd4c472-e1a9-453b-a11d-6f2e4b90d281/Hafenluft.JPG

Die vier Funktionen in den drei Sets sind jeweils gleich aufgebaut, sprich haben die gleichen Signaturen:

  1. ContentMap contentMap, int width, int height
  2. ContentMap contentMap, int width, int height, String horizontalFocus, String verticalFocus
  3. String assetItemKey, int width, int height, String horizontalFocus, String verticalFocus
  4. Asset asset, int width, int height, String horizontalFocus, String verticalFocus

Diese vier Methoden sind alle Überladen und rufen die nĂ€chste unter ihnen auf.

Builder Templating Funktion

Es gibt einen Builder der mit

  • resizerfn.getCompleteLinkBuilder()
  • resizerfn.getLinkBuilder()
  • resizerfn.getPathBuilder()

aufgerufen werden kann. Dieser gibt ein Objekt zurĂŒck, welches ĂŒber folgenden Methoden die Parameter gesetzt werden können:

  • setSize(int width, int height)
  • setFocalPoint(String horizontalFocus, String verticalFocus)
  • setFocalPoint(ContentMap contentMap)
  • setAsset(Asset asset)
  • setAsset(String assetItemKey)
  • setAsset(ContentMap contentMap)
  • setFocalPointAndAsset(ContentMap contentMap)
  • setFormat(SupportedImageFormats format)
  • setFormat(String fileExtension)

Diese Methoden geben das gleiche Objekt zurĂŒck, auf die sie aufgerufen werden. Mit generateLink() kann der Link dann erzeugt werden und nach den generieren kann das Objekt weiter genutzt werden, um Links mit anderen Formaten und Auflösungen zu generieren.

Diese Methode kann null zurĂŒckgeben, wenn es das Asset nicht gibt. Dies kann vorkommen, wenn ein Asset noch nicht publiziert oder nach einer Verlinkung gelöscht wurde.

Beispiel fĂŒr die Nutzung des Builders in Freemarker:

[#assign sourceSets = {
"1280":  {"width": 2000, "height": 280},
"1024":  {"width": 1279, "height": 280},
"768":  {"width": 1023, "height": 250},
"1": {"width": 767, "height": 180}
}]

[@sizerImageBuilder sourceSets=sourceSets image=content.image!/]

[#macro sizerImageBuilder sourceSets image alt="" cssClass="cover" lazy=false]
[#assign builder = resizerfn.getCompleteLinkBuilder().setFocalPointAndAsset(image)]
<picture class="${cssClass}">
    [#list sourceSets as size, sourceSet]
    <source media='(min-width: ${size!"1"}px)' type='image/webp'
            srcset='${builder.setFormat("webp").setSize(sourceSet.width, sourceSet.height).generateLink()!}'/>
    <source media='(min-width: ${size!"1"}px)' type="image/jpeg"
            srcset='${builder.setFormat("jpg").generateLink()!}'/>
    [/#list]
    <img src="${builder.generateLink()!}" alt="${alt!}" loading='${lazy?then("lazy", "eager")}'/>
</picture>
[/#macro]

ErklÀrung der Methoden Parameter

  • contentMap → Eine Contentmap in der unter damID die der Item Key des Assets und unter focusHorizontal, focusVertical die Fokuspunkte liegen. In der zweiten reicht die damID.
  • assetItemKey → Der Asset Item Key als String. Beispiel: jcr:bdd4c472-e1a9-453b-a11d-6f2e4b90d281
  • asset → Das Asset das aus der damfn.getAsset(assetItemKey) mit bekommen werden kann.
  • width → Die Breite des angeforderten Bildes
  • height → Die Höhe des angeforderten Bildes
  • horizontalFocus → Der horizontale Fokuspunkt
  • verticalFocus → Der vertikale Fokuspunkt

Registrierung der Bildauflösungen

Alle Templating Funktionen registrieren die angeforderte Auflösung automatisch, damit das Bild beim Imaging Endpunkt auch in der vom Template benötigten Auflösung bereitgestellt werden kann. Außerdem ist eine weitere Funktion dazu gekommen die eine Breite und Höhe entgegennimmt und diese dann registriert: resizerfn.allowDimension(final int width, final int height). Wenn das Feature in der Config deaktiviert ist, wird diese Funktion nicht benötigt.

Fallback bei nicht unterstĂŒtzten Assets

Property Beschreibung
/modules/imageresizer/config@fallbackToDamLinks
- Default: true
Bei true: Wenn ein Asset angefordert wird, das ein nicht unterstĂŒtztes Format hat (z.B. SVG oder ICO) wird der normale DAM link des DAM Servlets zurĂŒckgegeben, um einen kaputten Link zu verhindern.

Bei false: Es wird immer ein Imageresizer-Link generiert, egal ob es sich um ein unterstĂŒtzest Format beim Asset handelt. Dies kann kaputte Links erzeugen.