import * as ImGui_Impl from "./imgui_impl";
import { ImGuiWindow } from "./imgui_impl";
import * as ImGui from "imgui-js";
import { ImGuiIO } from "imgui-js"
import { ImVec4 } from "imgui-js";
import { ImVec2 } from "imgui-js";
import * as PIXI from "pixi.js";
import * as U from "./utils";

async function main(): Promise<void>
{
    console.log("main()");
    await ImGui.default();
    window.requestAnimationFrame(init);
}

const clearColor:ImVec4 = new ImVec4(0.7, 0.9, 1, 1);
function init(): void
{
    console.log("init()");
    console.log("Total allocated space (uordblks) @ _init:", ImGui.bind.mallinfo().uordblks);

    ImGui_Impl.PrePIXIInit();

    let settings = { width: 1, height: 1, antialias: true, backgroundColor: U.vec2col(clearColor) };

    let app : PIXI.Application = new PIXI.Application(settings);

    const output: HTMLElement = document.getElementById("output") || document.body;
    output.appendChild(app.view);
    app.view.tabIndex = 1;
    app.view.style.position = "absolute";
    app.view.style.left = "0px";
    app.view.style.right = "0px";
    app.view.style.top = "0px";
    app.view.style.bottom = "0px";
    app.view.style.width = "100%";
    app.view.style.height = "100%";

    ImGui_Impl.Init(app);

    app.ticker.add(
        (deltaTime: number) =>
        {
            const dt: number = deltaTime * 1 / (1000 * PIXI.settings.TARGET_FPMS);

            app.render();
        }
    );


    let resizeFunc = function()
    {
        app.renderer.resize(window.innerWidth, window.innerHeight);
    };

    let bg: PIXI.Graphics = new PIXI.Graphics();
    bg.beginFill(0xFF0000);
    bg.drawRect(100, 100, 300, 300);
    bg.endFill();

    let styleCb: () => void = () => { ImGui.StyleColorsLight(); };

    const imgui: ImGuiWindow = new ImGuiWindow(512, 512, makeUpdate());
    const imgui2: ImGuiWindow = new ImGuiWindow(512, 512, makeUpdate2());
    imgui2.x = 200;
    imgui2.y = 400;

    imgui.withContext(styleCb);
    imgui2.withContext(styleCb);
    
    app.stage.addChild(imgui);
    app.stage.addChild(bg);
    app.stage.addChild(imgui2);

    window.onresize = resizeFunc;
    resizeFunc();
}

function makeUpdate(): (timeElapsed: number) => void
{
    let text: string = "text";
    return (timeElapsed: number) =>
    {
        ImGui.SetNextWindowPos(new ImVec2(0, 0));
        ImGui.SetNextWindowSize(new ImVec2(500, 500), ImGui.ImGuiCond.Always);
        ImGui.Begin("Test Window"); 
        if (ImGui.Button("Add Text"))
        {
            text += "A";
        }
        ImGui.Text(text);
        ImGui.End();
    };
}

function makeUpdate2(): (timeElapsed: number) => void
{
    let text:string = "";
    return (timeElapsed: number) =>
    {
        ImGui.SetNextWindowPos(new ImVec2(0, 0));
        ImGui.SetNextWindowSize(new ImVec2(500, 500), ImGui.ImGuiCond.Always);
        ImGui.Begin("Test Window 2"); 
        ImGui.InputText("Input: ", (_ = text) => text = _);
        ImGui.Text(text);
        ImGui.End();
    };
}

(function()
 {
     if (document.readyState == "complete")
     {
         main();
     }
     else
     {
         window.onload = main;
     }
 })();