public getDOMObjects()

in src/component/tag/tag/SpotRenderTag.ts [22:101]
65 lines of code
6 McCabe index (conditional complexity)

    public getDOMObjects(atlas: ISpriteAtlas, camera: THREE.Camera, size: ViewportSize): vd.VNode[] {
        const tag: SpotTag = this._tag;
        const container: { offsetHeight: number, offsetWidth: number } = {
            offsetHeight: size.height, offsetWidth: size.width,
        };

        const vNodes: vd.VNode[] = [];
        const [centroidBasicX, centroidBasicY]: number[] = tag.geometry.getCentroid2d();
        const centroidCanvas: number[] =
            this._viewportCoords.basicToCanvasSafe(
                centroidBasicX,
                centroidBasicY,
                container,
                this._transform,
                camera);

        if (centroidCanvas != null) {
            const interactNone: (e: MouseEvent) => void = (e: MouseEvent): void => {
                this._interact$.next({ offsetX: 0, offsetY: 0, operation: TagOperation.None, tag: tag });
            };

            const canvasX: number = Math.round(centroidCanvas[0]);
            const canvasY: number = Math.round(centroidCanvas[1]);

            if (tag.icon != null) {
                if (atlas.loaded) {
                    const sprite: vd.VNode = atlas.getDOMSprite(tag.icon, Alignment.Bottom);
                    const iconTransform: string = `translate(${canvasX}px,${canvasY + 8}px)`;
                    const properties: vd.createProperties = {
                        onpointerdown: interactNone,
                        style: {
                            pointerEvents: "all",
                            transform: iconTransform,
                        },
                    };

                    vNodes.push(vd.h("div", properties, [sprite]));
                }
            } else if (tag.text != null) {
                const textTransform: string = `translate(-50%,0%) translate(${canvasX}px,${canvasY + 8}px)`;
                const properties: vd.createProperties = {
                    onpointerdown: interactNone,
                    style: {
                        color: this._colorToCss(tag.textColor),
                        transform: textTransform,
                    },
                    textContent: tag.text,
                };

                vNodes.push(vd.h("span.mapillary-tag-symbol", properties, []));
            }

            const interact: (e: MouseEvent) => void = this._interact(TagOperation.Centroid, tag, "move");
            const background: string = this._colorToCss(tag.color);
            const transform: string = `translate(-50%,-50%) translate(${canvasX}px,${canvasY}px)`;

            if (tag.editable) {
                let interactorProperties: vd.createProperties = {
                    onpointerdown: interact,
                    style: {
                        background: background,
                        transform: transform,
                    },
                };

                vNodes.push(vd.h("div.mapillary-tag-spot-interactor", interactorProperties, []));
            }

            const pointProperties: vd.createProperties = {
                style: {
                    background: background,
                    transform: transform,
                },
            };

            vNodes.push(vd.h("div.mapillary-tag-vertex", pointProperties, []));
        }

        return vNodes;
    }