import { TraceSource } from "@implab/core-amd/log/TraceSource";
import { id as mid } from "module";
import { IScope, Scope } from "./Scope";
import { isNode, isRendition, isWidget } from "./traits";

const trace = TraceSource.get(mid);

interface Context {
    readonly scope: IScope;

    readonly priority: number;

    readonly hooks?: (() => void)[];
}

type RenderTask = {
    /**
     * The priority for this task
     */
    readonly priority: number,

    /**
     * The rendering action performed in this task
     */
    readonly render: () => void;
};

type Range = {
    /** minimum value in this range */
    readonly min: number;
    /** maximum value in this range */
    readonly max: number;
};

// empty range
const emptyPriorities: Range = { min: NaN, max: NaN };

// holds render tasks
let _renderQueue: RenderTask[] = [];

// holds the minimum and the maximum task priorities in the queue. Used to
// optimize rendering process is all tasks are with the same priority.
let _renderQueuePriorities: Range = emptyPriorities;

// current context
let _context: Context = {
    scope: Scope.dummy,
    priority: 0
};

// started render operations
let _renderCount = 0;

// next id for render operations
let _renderId = 1;

// hooks for render completion, executed when all render operations has 
// been completed
let _renderedHooks: (() => void)[] = [];

const guard = (cb: () => void) => {
    try {
        cb();
    } catch (e) {
        trace.error(e);
    }
};

/**
 * Creates a new rendition context with the specified parameters and makes it
 * an active context.
 * 
 * @see getScope
 * @see getPriority
 * 
 * @param scope The scope for the current context
 * @param priority The priority for the current context
 * @returns The function to restore the previous context and execute pending hooks
 */
const enterContext = (scope: IScope, priority: number) => {
    const prev = _context;
    const captured = _context = { scope, priority, hooks: [] };
    return () => {
        if (_context !== captured)
            trace.error("endRender mismatched beginRender call");

        const { hooks } = _context;
        if (hooks)
            hooks.forEach(guard);

        _context = prev;
    };
};

/**
 * Starts the new render operation. When the operation is started the counter
 * of running operations is increased. If this is the first render operation
 * then the `onRendering` event is fired.
 * 
 * @returns The id of the started rendering operation.
 */
const startRender = () => {
    _renderCount++;
    if (_renderCount === 1)
        onRendering();

    return _renderId++;
};

/**
 * Completes the rendering operation. When the operation is completed the counter
 * of running operations is decreased. If there is no more running operations left
 * then the `onRendered` event is fired.
 * 
 */
const completeRender = () => {
    _renderCount--;
    if (_renderCount === 0)
        onRendered();
};

/** 
 * Invokes the specified within the rendition context. The rendition context
 * is created for the task invocation and restored after the task is competed.
 * 
 * @param scope The cope for the rendition context
 * @param priority The priority for the rendition context
 * @returns The result returned by the task
 */
export const renderTask = <T>(task: () => T, scope: IScope, priority: number, renderId: number) => {
    const restoreContext = enterContext(scope, priority);
    try {
        trace.debug("beginRender [{0}], priority = {1}", renderId, priority);
        return task();
    } finally {
        trace.debug("endRender [{0}]", renderId);
        restoreContext();
        completeRender();
    }
};

const processRenderQueue = () => {
    const q = _renderQueue;
    const { min, max } = _renderQueuePriorities;

    _renderQueue = [];
    _renderQueuePriorities = emptyPriorities;

    // all tasks scheduled due queue processing will be queued to the next 
    // processRenderQueue iteration
    if (min !== max) {
        // if there are tasks with different priorities in the queue
        trace.debug("Processing render queue, {0} tasks, priorities=[{1}..{2}] ", q.length, min, max);
        q.sort(({ priority: a }, { priority: b }) => a - b).forEach(({ render }) => guard(render));
    } else {
        // all tasks are have same priority
        trace.debug("Processing render queue, {0} tasks, priority = {1} ", q.length, min);
        q.forEach(({ render }) => guard(render));
    }

    if (_renderQueue.length)
        trace.debug("Render queue is processed, {0} tasks rescheduled", _renderQueue.length);
};

/**
 * Adds the specified task to the render queue. The task will be added with the
 * specified priority.
 * 
 * Render queue contains a list of render tasks. Each task is executed within
 * its own rendering context with the specified scope. The priority determines
 * the order in which tasks will be executed where the tasks with lower priority
 * numbers are executed first.
 * 
 * When the queue is empty and the task is added then the render queue will be
 * scheduled for execution. While the current queue is being executed all
 * enqueued tasks are added to the new queue and processed after the current
 * execution has been completed.
 * 
 * @param task The action to execute. This action will be executed with
 *  {@link renderTask} function in its own rendering context.
 * @param scope The scope used to create a rendering context for the task.
 * @param priority The priority
 */
export const queueRenderTask = (task: () => void, scope = Scope.dummy, priority = getPriority()) => {
    const renderId = startRender();
    trace.debug("scheduleRender [{0}], priority = {1}", renderId, priority);

    const render = () => renderTask(task, scope, priority, renderId);

    if (!_renderQueue.length) {
        // this is the first task, schedule next render queue processing
        Promise.resolve().then(processRenderQueue, e => trace.error(e));

        // initialize priorities
        _renderQueuePriorities = { min: priority, max: priority };
    } else {

        // update priorities if needed
        const { min, max } = _renderQueuePriorities;
        if (priority < min)
            _renderQueuePriorities = { min: priority, max };
        else if (priority > max)
            _renderQueuePriorities = { min, max: priority };
    }

    _renderQueue.push({ priority, render });
};

/**
 * Starts the synchronous rendering process with the specified scope and priority.
 * 
 * @param scope The scope for the current rendition
 * @param priority The priority for the current scope
 * @returns The function to complete the current rendering
 */
export const beginRender = (scope = Scope.dummy, priority = 0) => {
    const renderId = startRender();
    const restoreContext = enterContext(scope, priority);
    trace.debug("beginRender [{0}], priority = {1}", renderId, priority);

    return () => {
        trace.debug("endRender [{0}]", renderId);
        restoreContext();
        completeRender();
    };
};

// called when the first beginRender is called for this iteration
const onRendering = () => {
    trace.log("Rendering started");
    setTimeout(() => {
        if (_renderCount !== 0)
            trace.error("Rendering tasks aren't finished, currently running = {0}", _renderCount);
    });
};

// called when all render operations are complete
const onRendered = () => {
    trace.log("Rendering compete");
    _renderedHooks.forEach(guard);
    _renderedHooks = [];
};

/** Returns promise when the rendering has been completed.  */
export const whenRendered = () => new Promise<void>((resolve) => {
    if (_renderCount)
        _renderedHooks.push(resolve);
    else
        resolve();
});

/**
 * Registers hook which is called after the render operation is completed. The
 * hook will be called once only for the current operation.
 * 
 * @param hook The hook which should be called when rendering is complete.
 */
export const renderHook = (hook: () => void) => {
    const { hooks } = _context;
    if (hooks)
        hooks.push(hook);
    else
        guard(hook);
};

/**
 * Registers special hook which will be called with the specified state. The 
 * hook is called once after the rendering is complete. When the rendition is
 * destroyed the hook is called with the undefined parameter.
 * 
 * This function is used to register `ref` hooks form a tsx rendition.
 * 
 * @param value The state which will be supplied as a parameter for the hook
 * @param ref reference hook
 */
export const refHook = <T>(value: T, ref: JSX.Ref<T>) => {
    const { hooks, scope } = _context;
    if (hooks)
        hooks.push(() => ref(value));
    else
        guard(() => ref(value));

    scope.own(() => ref(undefined));
};

/** Returns the current scope. Scope is used to track resources bound to the
 * current rendering. When the rendering is destroyed the scope is cleaned and
 * all bound resources are released.
 */
export const getScope = () => _context.scope;

/**
 * Returns the current render task priority. This value is used by some renditions
 * to schedule asynchronous nested updates with lower priority then themselves.
 */
export const getPriority = () => _context.priority;

/** Schedules the rendition to be rendered to the DOM Node
 * @param rendition The rendition to be rendered
 * @param scope The scope
 */
export const render = (rendition: unknown, scope = Scope.dummy) =>
    renderTask(() => getItemDom(rendition), scope, getPriority(), startRender());

const emptyFragment = document.createDocumentFragment();

/** Renders DOM element for different types of the argument. */
export const getItemDom = (v: unknown) => {
    if (typeof v === "string" || typeof v === "number" || v instanceof RegExp || v instanceof Date) {
        // primitive types converted to the text nodes
        return document.createTextNode(v.toString());
    } else if (isNode(v)) {
        // nodes are kept as is
        return v;
    } else if (isRendition(v)) {
        // renditions are instantiated
        return v.getDomNode();
    } else if (isWidget(v)) {
        // widgets are converted to it's markup
        return v.domNode;
    } else if (typeof v === "boolean" || v === null || v === undefined) {
        // null | undefined | boolean are removed
        return emptyFragment;
    } else if (v instanceof Array) {
        // arrays will be translated to document fragments
        const fragment = document.createDocumentFragment();
        v.map(item => getItemDom(item))
            .forEach(node => fragment.appendChild(node));
        return fragment;
    } else {
        // bug: explicit error otherwise
        throw new Error(`Invalid parameter: ${String(v)}`);
    }
};