All files / roosterjs-content-model-dom/lib/domToModel/processors imageProcessor.ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
1x
1x
1x
1x
1x
 
 
 
 
 
1x
33x
33x
 
 
33x
 
33x
33x
33x
 
33x
33x
33x
 
33x
33x
 
33x
1x
 
33x
 
 
33x
1x
 
33x
10x
10x
 
 
33x
33x
 
 
 
import { addDecorators } from '../../modelApi/common/addDecorators';
import { addSegment } from '../../modelApi/common/addSegment';
import { createImage } from '../../modelApi/creators/createImage';
import { parseFormat } from '../utils/parseFormat';
import { stackFormat } from '../utils/stackFormat';
import type { ContentModelImageFormat, ElementProcessor } from 'roosterjs-content-model-types';
 
/**
 * @internal
 */
export const imageProcessor: ElementProcessor<HTMLImageElement> = (group, element, context) => {
    stackFormat(context, { segment: 'shallowClone' }, () => {
        const imageFormat: ContentModelImageFormat = context.segmentFormat;
 
        // Use getAttribute('src') instead of retrieving src directly, in case the src has port and may be stripped by browser
        const src = element.getAttribute('src') ?? '';
 
        parseFormat(element, context.formatParsers.segment, imageFormat, context);
        parseFormat(element, context.formatParsers.image, imageFormat, context);
        parseFormat(element, context.formatParsers.block, context.blockFormat, context);
 
        const image = createImage(src, imageFormat);
        const alt = element.alt;
        const title = element.title;
 
        parseFormat(element, context.formatParsers.dataset, image.dataset, context);
        addDecorators(image, context);
 
        if (alt) {
            image.alt = alt;
        }
        Iif (title) {
            image.title = title;
        }
        if (context.isInSelection) {
            image.isSelected = true;
        }
        if (context.selection?.type == 'image' && context.selection.image == element) {
            image.isSelectedAsImageSelection = true;
            image.isSelected = true;
        }
 
        const paragraph = addSegment(group, image);
        context.domIndexer?.onSegment(element, paragraph, [image]);
    });
};