Image Gallery Plugin

Image Gallery with image preview and toolbox with drag-and-drop support
for sorting images.

Plugin configuration

{
  "id": "io.infomaker.imagegallery",
  "name": "im-imagegallery",
  "url": "https://plugins.writer.infomaker.io/v1/infomaker/im-imagegallery/{PLUGIN_VERSION}/index.js",
  "style": "https://plugins.writer.infomaker.io/v1/infomaker/im-imagegallery/{PLUGIN_VERSION}/style.css",
  "enabled": true,
  "mandatory": false,
  "data": {
    "cropsEnabled": true,
    "imageInfoEnabled": true,
    "downloadEnabled": true,
    "hideDisableCropsCheckbox": false,
    "hideUseFocalPointCheckbox": false,
    "defaultCropMethod": "focal-point",
    "crops": {
      "16:9": [16, 9],
      "8:5": [8, 5],
      "4:3": [4, 3],
      "1:1": [1, 1]
    }
  }
}

Options

Property Type Required Description
cropsEnabled Boolean false The soft crop dialog is hidden by default. Set cropsEnabled to true to enable. Default false.
imageInfoEnabled Boolean false Adds ability to display archive information for image. Set imageInfoEnabled to true to enable. Default false.
downloadEnabled Boolean false Adds ability to download image (original).
hideDisableCropsCheckbox Boolean false Hides the checkbox for disabling automatic crop when set to true, default false.
hideUseFocalPointCheckbox Boolean false Hides the "use focal point" checkbox, default value is false
crops Object false *Required if crops is enabled.
Expressed as an object of named ratios. The value for each named dimension is an array of the width and height ratio.
defaultCropMethod String false Set what method that should be used in crop tool, default value is soft-crop
enableUseOfAnnotationTools Boolean false Enable annotation tool in gallery edit view

Output

<object id="imagegallery-8a52dde8c22e270f0023d2060b0128b4" type="x-im/imagegallery" uuid="c51d19ff-cc44-4788-b1d7-0eb394f9b7f2">
    <data>
        <text>In sodales lectus vel egestas rhoncus</text>
    </data>
    <links>
        <link rel="image" type="x-im/image" uri="im://image/znX8U1CU124n26zu7gb40_jBzSk.jpeg" uuid="c382c937-8511-5d48-9677-55658c2bbb32">
            <data>
                <text>Image caption</text>
                <height>200</height>
                <width>400</width>
                <flags>
                    <flag>disableAutomaticCrop</flag>
                </flags>
            </data>
            <links>
                <link rel="crop" type="x-im/crop" title="16:9" uri="im://crop/0/0/0.445/0.3707865168539326"/>
                <link rel="crop" type="x-im/crop" title="8:5" uri="im://crop/0.4025/0/0.5975/0.5599250936329588"/>
                <link rel="crop" type="x-im/crop" title="4:3" uri="im://crop/0.055/0/0.89/1"/>
                <link rel="crop" type="x-im/crop" title="1:1" uri="im://crop/0.16625/0/0.6675/1"/>

                <link rel="focal-point" type="x-im/focal-point">
                    <data>
                        <x>123</x>
                        <y>456</y>
                    </data>
                </link>

                <link rel="author" uuid="7a39b42b-1315-4711-a136-7b3a9f132110" title="Demo Demosson" type="x-im/author">
                    <data>
                        <email>demo.demosson@infomaker.se</email>
                    </data>
                </link>
            </links>
        </link>

        <!-- Fallback when x-im/imagegallery is unknown-->
        <link rel="alternate" type="image/jpg" url="https://imengine.se/457383845734734">
            <data>
                <width>400</width>
                <height>200</height>
            </data>
        </link>
    </links>
</object>

Notes