cx-doxy/assets/app_parts.js

import { applet_animations, applet_builder } from "./applet.js";
import { dom_manager } from "./functions.js";
import { dictionary } from "./dictionary.js";

class submission_part {
    #header;
    #image;
    #description;
    #applet;
    #applet_close;
    #target;

    constructor(
        header_selector,
        image_selector,
        description_selector,
        close_selector
    ) {
        this.#header = document.querySelector(header_selector);
        this.#image = document.querySelector(image_selector);
        this.#description = document.querySelector(description_selector);
        this.#applet_close = this.#description.querySelector(close_selector);

        if (!dom_manager.is_element(this.#header)) {
            throw "Could not found header by selector.";
        }

        if (!dom_manager.is_element(this.#image)) {
            throw "Could not found image by selector.";
        }

        if (!dom_manager.is_element(this.#description)) {
            throw "Could not found description by selector.";
        }
        

        if (!dom_manager.is_element(this.#applet_close)) {
            throw "Could not found close button by selector.";
        }

        this.#applet = this.#applet_builder(this.#applet_close);
        this.current = null;
    }

    #applet_builder(close) {
        const builder = new applet_builder();
        
        builder.minimalise = close;
        builder.maximalise = this.#header;
        builder.target = this.#description;
        builder.animation = applet_animations.hide_opacity_generator(500);

        return builder.build();
    }

    #welcome() {
        this.#header.innerText = dictionary.welcome.title;

        const title = document.createElement("h1");
        title.innerText = dictionary.welcome.title;

        const description = document.createElement("p");
        description.innerText = dictionary.welcome.description;

        this.#clean_description();
        this.#description.appendChild(title);
        this.#description.appendChild(description);
    }

    #clean_description() {
        this.#description.childNodes.forEach(node => {
            if (node !== this.#applet_close) {
                node.remove();
            }
        });
    }

    set current(target) {
        if (target === null) {
            this.#welcome();
        }

        this.#target = target;
    }

    get current() {
        return this.#target;
    }
}

export { submission_part };