Please tell me how to display images in the popup list.

[uda-backup]

  {
    "@context": "http://www.w3.org/ns/anno.jsonld",
    "id": 270,
    "type": "Annotation",
    "mediaPrimary": 32,
    "reviewPrimary": 270,
    "annotationId": "5703a43fc049971a4479fc015df1bb07",
    "target": {
      "source": "https://amyusement.fun/test/mitekaku/uploads/b24705053f71a5bbc87631550d3467be_1.webp",
      "selector": {
        "type": "FragmentSelector",
        "conformsTo": "http://www.w3.org/TR/media-frags/",
        "value": "xywh=pixel:41,422,266,43"
      }
    },
    "body": [
      {
        "type": "TextualBody",
        "value": "あああ",
        "purpose": "commenting",
        "created": "2024-05-17 13:32:49",
        "creator": {
          "id": "http://recogito.example.com/rainer",
          "name": "rainer"
        },
        "review_id": 270
      },
      {
        "type": "TextualBody",
        "value": "ｄｄｄｄ",
        "purpose": "commenting",
        "created": "2024-05-17 13:32:49",
        "creator": {
          "id": "http://recogito.example.com/rainer",
          "name": "rainer"
        },
        "review_id": 271
      },
      {
        "type": "TextualBody",
        "value": "ｆｆｆ",
        "purpose": "commenting",
        "created": "2024-05-17 13:33:01",
        "creator": {
          "id": "http://recogito.example.com/rainer",
          "name": "rainer"
        },
        "review_id": 272
      },
      {
        "type": "Image",
        "value": "<img src='uploads/b24705053f71a5bbc87631550d3467be_0.png'>",
        "purpose": "commenting",
        "created": "2024-05-17 13:33:33",
        "creator": {
          "id": "http://recogito.example.com/rainer",
          "name": "rainer"
        },
        "review_id": 273
      }
    ]
  }
];

Here is the JSON data to read.
If you set "type": "Image", it will not be displayed in the list in the popup, and if you set "type": "TextualBody", the normal text "" will be displayed. It will be.
How can I display images in a list?

[rsimon]

Displaying images is not supported by the default editor, sorry. You would have to build your own editor extension in this case. (The upcoming v3 will make this easier, at least if you are using React. But there is no documentation available yet. Will come in the next months.)

[uda-backup]

I got it!

Thank you for letting me know!

Is it possible for you to give me a simple example of how to add an extension to display images?

[rsimon]

Sorry, I don't have the time right now to write a tutorial for your personal use case. But hopefully this will get you started:

• If you want to work with the current version of Annotorious: https://annotorious.github.io/guides/editor-widgets/
• If you want to try v3: https://github.com/annotorious/annotorious/blob/main/packages/annotorious-react/test/App.tsx (Sorry, no time for documentation there yet, but this shows the very basics of how you can just supply your own React component as a popup.)

[uda-backup]

I got it!

thank you!

I'll check it out and try it!