How to get configureAsImageInFrame

import configureAsImageInFrame from 'fontoxml-families/src/configureAsImageInFrame.js'

Type: Function

Use this family when images can contain other elements which should be rendered.

The meaning that this family indicates is visualized through a border and optionally a background color to delimit the content to which the semantics apply.

Elements belonging to this family cannot be split in two by pressing Enter, and two adjacent elements will not be merged into one. Either would defeat the purpose of semantics.

Use this family for images which can contain other elements which should be rendered. For example an desc element, which contains a description of the image. These images may be represented by a permanent id or a non-permanent id. By setting the option options.isPermanentId to true, the result of the query is interpreted as a permanent id, which will be resolved.

The optionsOrReferenceAttributeName parameter can be both the name of the attribute containing the permanent id, or the options object. This options object may then contain an XPath query resolving to the reference (either permanent or relative) which points to the image.

For backwards compatibility, the fourth argument to this function may be the name of an attribute. If the attribute name is passed as the fourth parameter, the image is assumed to use permanent ids. This is deprecated, using an options object as the fourth argument is preferred.

The following visualization options are visualized by the group with image in frame family:

  • backgroundColor

  • showWhen

The following widget areas are available:

  • blockHeaderLeft

  • blockHeaderRight

  • blockBefore

  • blockAfter

  • blockFooter

  • blockOutsideBefore

  • blockOutsideAfter

This family has a number of additional options which affect how it behaves:

  • defaultTextContainer

  • referenceQuery

  • isPermanentId

Note that this family supports the doubleClickOperation option, being the operation which is executed on double-click.


# Name Type Description
1. sxModule SxModule
2. selector XPathTest
3. markupLabel String
4. options CvkOptions

The options, or the name of the attribute in which the permanent id referencing this image is located. The generic CvkOptions are expanded with two properties:



Name Type Description
isPermanentId Boolean

Whether the reference is a permanent id.

  Default value
referenceQuery XPathQuery

An XPath query resulting in the reference of the image

5. oldOptionsParameter


// Configure HTML images without permanent ids
configureAsImageInFrame(sxModule, 'self::img', 'image', { referenceQuery: '@src', isPermanentId: false });

// Configure HTML images with permanent ids
configureAsImageInFrame(sxModule, 'self::img', 'image', { referenceQuery: '@src', isPermanentId: true });

// Configure an other kind of image with the url as its text content
configureAsImageInFrame(sxModule, 'self::img', 'image', { referenceQuery: 'string(.)', isPermanentId: true });

// Configure HTML images using the deprecated syntax. This forces permanent ids
configureAsImageInFrame(sxModule, 'self::img', 'image', 'src');
Was this page helpful?