import { IEditableAttribute } from "../../core/EditableAttributes.js";
import HtmlControl from "../../core/HtmlControl.js";
import { isInsideHtmlEditor } from "../../core/HtmlEditor.js";
import { XNode } from "../../core/XNode.js";


declare let __web_components_path__: any;

export default class PdfLink
    extends HtmlControl {

    get editableAttributes(): IEditableAttribute[] {
        return [
            { name: "src", type: "pdf" },
            { name: "target", type: "string", value: "_self" }
        ];
    }

    async prepare() {
        const pdfFileLink = this.getAttribute("src");
        const posterLink = this.getAttribute("poster") || this.getPoster();
        const target = this.getAttribute("target") || "_self";
        let root: HTMLElement | ShadowRoot = this;
        let part = void 0;
        if (isInsideHtmlEditor(this)) {
            root = this.attachShadow({ mode: "open"});
            part = "img";
        }

        XNode.render(root, <div>
            <a href={pdfFileLink} target={target}>
                <img part={part} src={posterLink}/>
            </a>
        </div>);

    }

    getPoster() {
        console.log(__web_components_path__);
        const poster = new URL("content/images/pdf/pdf.svg", __web_components_path__ ?? (document.currentScript as any).src).toString();
        console.log(poster);
        return poster;
    }

}

customElements.define("pdf-link", PdfLink);