Studio Developer Manual / Version 2204
Table Of Contents
Thumbnail resolving is implemented in instances of ThumbnailResolver
. ThumbnailResolver
instances are registered with the editorContext
and configured with a content type name and property names.
A default configuration for thumbnail resolvers can be found in the class
BlueprintFormsStudioPluginBase.ts
.
A ThumbnailResolver
is selected when the configured content type matches the content type of
the content in the link list. Thumbnail resolvers respect the content type inheritance. For example, the thumbnail
resolver for CMTeasable
will also be used for content of type
CMArticle
, since CMArticle
is a subtype of
CMTeasable
.
The properties are evaluated in the configured order. If one of the configured properties contains an image blob,
the corresponding thumbnail URL is returned.
If the property is a link list, a matching ThumbnailResolver
is looked up for the first content of
this list and the search for the thumbnail blob goes on. If no blob is found, a default icon is shown.
import ThumbnailResolverFactory from "@coremedia/studio-client.ext.cap-base-components/thumbnails/ThumbnailResolverFactory"; import editorContext from "@coremedia/studio-client.main.editor-components/sdk/editorContext"; //... editorContext._.registerThumbnailResolver( ThumbnailResolverFactory.create("CMCollection", "pictures", "items")); editorContext._.registerThumbnailResolver( ThumbnailResolverFactory.create("CMTeasable", "pictures")); editorContext._.registerThumbnailResolver( ThumbnailResolverFactory.create("CMPicture", "data"));
Example 9.113. Example thumbnail resolver configuration
The configuration above could be applied as follows:
Example 1: Link list contains CMPicture
content
When the
data
property of theCMPicture
content contains an image, then this image is used to render the thumbnail.
Example 2: Link list contains CMCollection
content
When a document inside a link list is a
CMCollection
document, use the propertiesitems
andpictures
and check the first item of these link list properties.When this linked item is an instance of
CMTeasable
, use thepictures
property to look up the content that contains the thumbnail.Finally, when the call stack arrives at an instance of
CMPicture
, use thedata
blob property to render the thumbnail.