import { BeaconWidget } from '../../challenge/widget/beacon.js';
export class ContentWidgets {
    constructor(editor, domNode) {
        this.widgets = [];
        this.widgetLayerRect = null;
        this.domNode = domNode;
        this.editor = editor;
        this.editor.onDidLayoutChange(() => {
            // Read the width of the activity bar to offset the widget layer correctly
            // Done as a hack as the activity bar is on its way to be deprecated
            const barRect = this.editor.activityBar._barContainer.getBoundingClientRect();
            this.domNode.style.left = `${barRect.width}px`;
            this.widgetLayerRect = null;
            this.widgets.forEach((widget) => {
                this.layoutWidget(widget);
            });
        });
    }
    getWidgetLayerRect() {
        if (!this.widgetLayerRect) {
            this.widgetLayerRect = this.domNode.getBoundingClientRect();
        }
        return this.widgetLayerRect;
    }
    addWidget(widget) {
        const domNode = widget.getDomNode();
        domNode.style.position = 'absolute';
        this.widgets.push(widget);
        this.domNode.appendChild(domNode);
        this.layoutWidget(widget);
    }
    layoutWidget(widget) {
        const position = widget.getPosition();
        if (position === null) {
            if (typeof widget.layout === 'function') {
                widget.layout(this.editor);
            }
            return;
        }
        const parentRect = this.getWidgetLayerRect();
        const p = this.editor.queryPosition(position);
        const domNode = widget.getDomNode();
        if (!p) {
            domNode.style.display = 'none';
            return;
        }
        if (widget instanceof BeaconWidget) {
            widget.setResolvedPosition(p.x, p.y);
            widget.setBlockPosition(p.isBlock);
        }
        domNode.style.display = 'block';
        domNode.style.transform = `translate(${p.x - parentRect.left}px, ${p.y - parentRect.top}px)`;
        // TODO: This is a hack to display widgets over dialogs.
        // Implement a dialog tracker in the dialogs module and use it to query the highest z-index
        // This value is to make sure they appear on top of Blockly's widget div
        domNode.style.zIndex = '200000';
    }
    removeWidget(widget) {
        this.domNode.removeChild(widget.getDomNode());
        const idx = this.widgets.indexOf(widget);
        this.widgets.splice(idx, 1);
    }
}
//# sourceMappingURL=content-widgets.js.map