e-Spirit/javascript-content-api-library

ImageMap data issue

Closed this issue · 7 comments

JosefBredereck commented

The ImageMap was introduced with #72.

I have discovered some required adjustments.

Steps to reproduce:

  1. Add CMS_INPUT_IMAGEMAP to FirstSpirit template
  2. Add a new element to LINKEDITORS/LINKEDITOR with the following properties
  • CMS_INPUT_TEXT as lt_headline
  • CMS_INPUT_DOM as lt_text
  • FS_REFERENCE <FILTER> <ALLOW type="picture"/> as lt_image
  • CMS_INPUT_LINK as lt_ctaLink
  1. Fill the template and set any image add a link via link editor
  2. Fill all fields of the link inclusive image

Expected behavior:

  • resolution.widht and resolution.height is not 0.
  • areas.link.data.lt_image contains the data of areas.data.lt_link with the respected id

Current behavior (data JSON):

{
  "type": "ImageMap",
  "areas": [
    {
      "areaType": "rect",
      "link": {
        "template": "labeled_image_link",
        "data": {
          "lt_ctaLink": {
            "type": "Link",
            "template": "internal_link",
            "data": {
              "lt_link": {
                "type": "Reference",
                "referenceId": "62f97fc7-baa6-4e9f-943b-3ac860e37fa5",
                "referenceType": "PageRef"
              },
              "lt_linkBehavior": {
                "fsType": "Option",
                "label": "Im neuen Tab/Fenster öffnen",
                "identifier": "_blank"
              },
              "lt_linkTitle": null,
              "lt_text": "Link"
            },
            "meta": {}
          },
          "lt_headline": "[...]",
          "lt_image": "[REFERENCED-ITEM-6f7c2425-cd34-4a87-9523-49593fe687ad]",
          "lt_text": [
            {
              "data": {},
              "content": [
                {
                  "type": "text",
                  "content": "[...]",
                  "data": {}
                }
              ],
              "type": "paragraph"
            }
          ]
        }
      },
      "data": {
        "lt_image": {
          "type": "Image",
          "id": "6f7c2425-cd34-4a87-9523-49593fe687ad",
          "previewId": "6f7c2425-cd34-4a87-9523-49593fe687ad.de_DE",
          "meta": {},
          "description": "[...]",
          "resolutions": {
            "ORIGINAL": {
              "fileSize": 24218532,
              "extension": "png",
              "mimeType": "image/png",
              "width": 6122,
              "height": 2991,
              "url": "[...]"
            },
            [...]
          }
        }
      }
    }
  ],
  "resolution": {
    "width": 0,
    "height": 0,
    "uid": "ORIGINAL"
  },
  "media": {
    "type": "Image",
    "id": "35440048-905a-4843-a69b-fdb3fe0e60a1",
    "previewId": "35440048-905a-4843-a69b-fdb3fe0e60a1.de_DE",
    "meta": {}
  }
}
nico-mcalley commented

I will create a bugticket in our Jira. How urgent is this topic / is there a workaround for it?

JosefBredereck commented

It is not the most urgent topic. A workaround would be manual mapping.

JosefBredereck commented

@henczi-espirit, I found an additional issue that is not ignorable. As you can see in the JSON, there is "areaType": "rect" but the data where the rect is located is missing. That makes me curious since there is a mapping for the case. https://github.com/e-Spirit/fsxa-api/blob/99fbe85d8c022a21ce4a16a3329babefb93308c0/src/modules/CaaSMapper.ts#L377

JosefBredereck commented

Additionally, there is a typing issue with the interface ImageMapArea when you try to access the image data of an area: Property 'data' does not exist on type 'ImageMapArea' when the structure is exposed like in the JSON above.

JosefBredereck commented

Additionally, there is a typing issue with the interface ImageMapArea when you try to access the image data of an area: Property 'data' does not exist on type 'ImageMapArea' when the structure is exposed like in the JSON above.

As far as I can identify this, the data property gets added in one of these functions to the image map when the project references get resolved.
https://github.com/e-Spirit/fsxa-api/blob/68325988b6e77c1d862e6be7ab844aa76fc76b2d/src/modules/CaaSMapper.ts#L533
https://github.com/e-Spirit/fsxa-api/blob/68325988b6e77c1d862e6be7ab844aa76fc76b2d/src/modules/CaaSMapper.ts#L558

nico-mcalley commented

Internal Ticket id: TNG-1126