import LayoutItem from "../LayoutItem";
import LayoutItemFactory, {LayoutItemImplConfig} from "../LayoutItemFactory";

export default class Text extends LayoutItem{
    public text: string = "";
    public classes: string[] = [];

    constructor(params: Partial<Text> = {}) {
        super(params);
        Object.assign(this, params);
    }

    public placeHtml(container: HTMLElement): void {
        const textDiv = document.createElement("div");
        textDiv.classList.toggle("pad-hidden", !this.visible);
        textDiv.innerText = this.text;
        textDiv.classList.add("pad-text", ...this.classes);
        container.append(textDiv);
        this.placedHtml.push(container);
    }
}

export function addTextToFactory(factory: LayoutItemFactory): void {
    factory.registerConstructor("text", (config, params) => {
        const impl = config.impl;
        if (!isTextConfig(impl)) return null;
        const textParam: Partial<Text> = params as Partial<Text>;
        textParam.text = impl.text;
        textParam.classes = impl.classes;
        return new Text(textParam);
    })
}

function isTextConfig(config:LayoutItemImplConfig): config is TextConfig{
    return config.type === "text";
}

interface TextConfig extends LayoutItemImplConfig{
    type: "text";
    text: string;
    classes: string[];
}