import "./index.scss";

// Provided by the server-side template
declare const editor_url: string;

window.addEventListener("DOMContentLoaded", function () {
    const frameholder = document.getElementById("frameholder");
    const office_frame = document.createElement("iframe");
    office_frame.name = "office_frame";
    office_frame.id = "office_frame";

    // The title should be set for accessibility
    office_frame.title = "Office Frame";

    // This attribute allows true fullscreen mode in slideshow view
    // when using PowerPoint's 'view' action.
    office_frame.setAttribute("allowfullscreen", "true");

    // The sandbox attribute is needed to allow automatic redirection to the O365 sign-in page in the business user flow
    office_frame.setAttribute(
        "sandbox",
        "allow-downloads allow-scripts allow-same-origin allow-forms allow-modals allow-popups allow-top-navigation allow-popups-to-escape-sandbox",
    );

    office_frame.setAttribute(
        "allow",
        "clipboard-read *; clipboard-write *; fullscreen *",
    );
    if (frameholder) {
        frameholder.appendChild(office_frame);
    }

    const officeForm = document.getElementById(
        "office_form",
    ) as HTMLFormElement | null;
    officeForm?.submit();

    const url = new URL(editor_url);
    const editor_domain = url.origin;

    window.addEventListener("message", function (message: MessageEvent) {
        if (message.origin !== editor_domain) {
            return;
        }

        let data: { MessageId: "UI_Close" | null; data: string };
        try {
            data =
                typeof message.data === "string"
                    ? JSON.parse(message.data)
                    : message.data;
        } catch (e: unknown) {
            console.error("error while parsing data from message UI_CLOSE", e);
            return;
        }

        if ("UI_Close" === data.MessageId) {
            closeEditor();
        }
    });
});

function closeEditor(): void {
    const params = new URLSearchParams(window.location.search);
    const returnPath = params.get("returnPath") ?? "/";

    window.location.assign(returnPath);
}
