import { height_equaler } from "./height_equaler.js";
import { product } from "./product.js";
import { products_loader } from "./products_loader.js";
import { product_container } from "./product_container.js";
import { product_containers } from "./product_containers.js";
import { searcher } from "./searcher.js";
import { login_bar } from "./login_bar.js";
import { scroll_up } from "./scroll_up.js";
import { color_theme } from "./color_theme.js";

document.addEventListener("DOMContentLoaded", async () => {
    const languages = new cx_libtranslate.languages("app/assets/languages");
    await languages.load("index.json");

    const preferences = new cx_libtranslate.preferences(languages);
    preferences.selector.insert().add_listener(() => { location.reload(); });

    const phrasebook = await preferences.load_choosen_phrasebook();
    phrasebook.set_as_default();

    const autotranslate = await preferences.get_autotranslate();
    autotranslate.connect();

    const top_bar_spacing = new height_equaler(
        document.querySelector(".top-bar"),
        document.querySelector(".top-bar-spacing")
    );

    const container = document.querySelector(".products");
    const search_bar = document.querySelector("form.search");
    const search_title = document.querySelector(".search-title");
    const login_space = document.querySelector(".top-bar .right");
    const scroll_up_button = document.querySelector(".scroll-up-button");
    const reverse_colors = document.querySelector(".reverse-colors");
    const manager = new product_containers(container);

    new login_bar(login_space);
    new scroll_up(scroll_up_button);
    new color_theme(reverse_colors);
    new searcher(search_bar, manager, search_title).show_all();
});