import { id as mid } from "module";
import { TraceSource } from "@implab/core-amd/log/TraceSource";
import { argumentNotNull } from "@implab/core-amd/safe";
import { getItemDom, getScope, scheduleRender } from "./render";
import { RenditionBase } from "./RenditionBase";
import { Scope } from "./Scope";
import { Subscribable } from "../observable";
import { Cancellation } from "@implab/core-amd/Cancellation";
import { collectNodes, destroy, isDocumentFragmentNode, isMounted, placeAt, startupWidgets } from "./traits";

const trace = TraceSource.get(mid);

export class WatchRendition<T> extends RenditionBase<Node> {
    private readonly _component: (arg: T) => unknown;

    private readonly _node: Node;

    private readonly _scope = new Scope();

    private readonly _subject: Subscribable<T>;

    private _renderJob?: { value: T };

    private _ct = Cancellation.none;

    constructor(component: (arg: T) => unknown, subject: Subscribable<T>) {
        super();
        argumentNotNull(component, "component");

        this._component = component;

        this._subject = subject;

        this._node = document.createComment("[Watch]");
    }

    protected _create() {
        const scope = getScope();
        scope.own(() => {
            this._scope.destroy();
            destroy(this._node);
        });
        scope.own(this._subject.subscribe({ next: this._onValue }));
        this._ct = new Cancellation(cancel => scope.own(cancel));
    }

    private readonly _onValue = (value: T) => {
        if (!this._renderJob) {
            // schedule a new job
            this._renderJob = { value };
            this._render().catch(e => trace.error(e));
        } else {
            // update existing job
            this._renderJob = { value };
        }
    };

    private async _render() {
        const beginRender = await scheduleRender(this._scope);
        const endRender = beginRender();
        try {
            // don't render destroyed rendition
            if (this._ct.isRequested())
                return;

            // remove all previous content
            this._scope.clean();

            // render the new node
            const node = getItemDom(this._renderJob ? this._component(this._renderJob.value) : undefined);

            // get actual content
            const pending = isDocumentFragmentNode(node) ?
                collectNodes(node.childNodes) :
                [node];

            placeAt(node, this._node, "after");

            if (isMounted(this._node))
                pending.forEach(n => startupWidgets(n));

            if (pending.length)
                this._scope.own(() => pending.forEach(destroy));

            this._renderJob = undefined;
        } finally {
            endRender();
        }
    }

    protected _getDomNode() {
        if (!this._node)
            throw new Error("The instance of the widget isn't created");
        return this._node;
    }


}