Main Image

[adgad]

Problem

With <bodyXML>, we used to rely on the presence of an <ft-content> imageset as the first item of the body, to determine whether or not the topper should show an image. This was controlled by a checkbox in Spark (and probably Methode before that).

In cp-content-pipeline, this image was removed from the body, and shown in the topper instead.

Ideal future state

We would not need to put the image in the body at all. The decision to show/hide the image in the topper should be a decision made within the topper itself. In the future this might be topperTree, in the short term maybe on the existing topper object in C&M:
topper.hideMainImage = true

Challenge

Our existing articles still have a main image in the body. While we could determine if it's the mainImage or not by comparing the IDs, the bodyTree transformer will only have access to bodyXML, and not other C&M fields (is that correct @epavlova ?)

Options

1. Spark to continue placing mainImage in body as a regular image set

This would require some modifications in cp-content-pipeline - currently it maps the top image to be it's own type main-image. Maybe this could happen in the resolvers - and an external property of the image-set node maybe?

2. Spark to place mainImage in body as a main-image type

This is equivalent to what we do right now in cp-content-pipeline, so that should all work as normal. BUT i think has the same challenge of not being able to categorically say if a historical top image is a main image or just a random image?

3. Option 1, but move the main image to be below the byline (i.e. part of the body, rather than topper).

This means that cp-content-pipeline wouldn't need to know or care whether the first image is a main image or not. Requires editorial/design approval.

[adgad]

It seems Editorial also use this functionality to get non-standard (i.e. not-16/9) images at the top of the article. e.g. https://www.ft.com/content/152651f3-758e-4742-ae99-7197699ca7ce

[adgad]

https://github.com/Financial-Times/cp-content-pipeline/blob/869676927a6cee1b19bee87790f66fe632575809/packages/schema/src/resolvers/content-tree/tagMappings.ts#L94

This is the current mapping rule in cp-content-pipeline:

  'body > ft-content[type="http://www.ft.com/ontology/content/ImageSet"]:first-child':
    ($el) => ({
      // CustomCodeComponent uses an inner bodyXML parsed as a RichText
      // The rule about main-image should not apply to CustomCodeComponent.
      type:
        capiData?.type() === 'CustomCodeComponent' || capiData?.topperHasImage()
          ? 'image-set'
          : 'main-image',
      id: $el.attr('url') || '',

I'm not sure if the xml->tree migrator is going to know if topperHasImage?