aswi20220x00-gitlab/webapp/components/annotation/DocumentAnnotationView.tsx @ c2192cda

/**
 * Creates an annotation view of a document.
 * @returns The annotation view.
 */
import { useContext } from 'react';
import { AnnotationContext } from '../../contexts/AnnotationContext';
import { Button } from 'antd';

export function DocumentAnnotationView() {
    const { annotation } = useContext(AnnotationContext);

    if (!annotation) {
        return <p>Došlo k chybě. Anotace nebyla nalezena</p>;
    }

    return (
        <div>
            <Button
                onClick={() => {
                    const selection = window.getSelection();
                    if (!selection) {
                        return;
                    }
                    if (!annotation?.tagStartPositions || !annotation.tagLengths) {
                        console.log('start or lengths not found');
                        return;
                    }

                    let startTag = selection.anchorNode;
                    let endTag = selection.focusNode;

                    if (!startTag || !endTag) {
                        console.log('Selection not found');
                        return;
                    }

                    if (startTag.nodeName.includes('#')) {
                        startTag = startTag.parentNode;
                    }
                    if (endTag.nodeName.includes('#')) {
                        endTag = endTag.parentNode;
                    }
                    if (!startTag || !endTag) {
                        console.log('Selection element not found');
                        return;
                    }

                    if (!(startTag instanceof Element)) {
                        console.log('StartTag is not instance of Element');
                        return;
                    }
                    if (!(endTag instanceof Element)) {
                        console.log('EndTag is not instance of Element');
                        return;
                    }

                    const startElement = startTag as Element;
                    const endElement = endTag as Element;

                    const startId: number =
                        Number(startElement.getAttribute('aswi-tag-id')) ?? -1;
                    const endId: number =
                        Number(endElement.getAttribute('aswi-tag-id')) ?? -1;

                    const startPosition =
                        annotation.tagStartPositions[startId] +
                        annotation.tagLengths[startId] +
                        selection.anchorOffset;
                    const endPosition =
                        annotation.tagStartPositions[endId] +
                        annotation.tagLengths[endId] +
                        selection.focusOffset -
                        1;
                }}
            >
                Test
            </Button>
            <div
                dangerouslySetInnerHTML={{ __html: annotation.documentToRender ?? '' }}
            />
        </div>
    );
}