const Home = {
    init: async () => {
        let html = await fetch('/lib/pages/home/index.html').then((response) => response.text());
        app.innerHTML = html;

        if (USER.possibilities.can_view_territory) {
            Home.personal.house.setHTML();
            Home.personal.homestead.setHTML();

            Home.group.house.setHTML();
            Home.group.homestead.setHTML();
        }
    },
    personal: {
        house: {
            list: [],
            loadAPI: async () => {
                const uuid = localStorage.getItem("uuid");
                const URL = `${CONFIG.api}houses/list?mode=sheep`;
                const res = await fetch(URL, {
                    headers: {
                        "Content-Type": "application/json",
                        "Authorization": uuid
                    }
                });
                Home.personal.house.list = await res.json();
                return Home.personal.house.list;
            },
            setHTML: async () => {
                const list = Home.personal.house.list.length > 0
                    ? Home.personal.house.list
                    : await Home.personal.house.loadAPI();

                if (USER.possibilities.can_view_territory && list.length)
                    document.getElementById('details-personal-territory').style.display = "";

                list.sort((a, b) => b.id - a.id);
                Home.renderCards(list, "house", "personal");
            }
        },
        homestead: {
            list: [],
            loadAPI: async () => {
                const uuid = localStorage.getItem("uuid");
                const URL = `${CONFIG.api}homestead/list?mode=sheep`;
                const res = await fetch(URL, {
                    headers: {
                        "Content-Type": "application/json",
                        "Authorization": uuid
                    }
                });
                Home.personal.homestead.list = await res.json();
                return Home.personal.homestead.list;
            },
            setHTML: async () => {
                const list = Home.personal.homestead.list.length > 0
                    ? Home.personal.homestead.list
                    : await Home.personal.homestead.loadAPI();

                if (USER.possibilities.can_view_territory && list.length)
                    document.getElementById('details-personal-territory').style.display = "";

                list.sort((a, b) => b.id - a.id);
                Home.renderCards(list, "homestead", "personal");
            }
        }
    },
    group: {
        house: {
            list: [],
            loadAPI: async () => {
                const uuid = localStorage.getItem("uuid");
                const URL = `${CONFIG.api}house/list?mode=group`;
                const res = await fetch(URL, {
                    headers: {
                        "Content-Type": "application/json",
                        "Authorization": uuid
                    }
                });
                Home.group.house.list = await res.json();
                return Home.group.house.list;
            },
            setHTML: async () => {
                const list = Home.group.house.list.length > 0
                    ? Home.group.house.list
                    : await Home.group.house.loadAPI();

                if (USER.possibilities.can_view_territory && list.length)
                    document.getElementById('details-group-territory').style.display = "";

                list.sort((a, b) => b.id - a.id);
                Home.renderCards(list, "house", "group");
            }
        },
        homestead: {
            list: [],
            loadAPI: async () => {
                const uuid = localStorage.getItem("uuid");
                const URL = `${CONFIG.api}homestead/list?mode=group`;
                const res = await fetch(URL, {
                    headers: {
                        "Content-Type": "application/json",
                        "Authorization": uuid
                    }
                });
                Home.group.homestead.list = await res.json();
                return Home.group.homestead.list;
            },
            setHTML: async () => {
                const list = Home.group.homestead.list.length > 0
                    ? Home.group.homestead.list
                    : await Home.group.homestead.loadAPI();

                if (USER.possibilities.can_view_territory && list.length)
                    document.getElementById('details-group-territory').style.display = "";

                list.sort((a, b) => b.id - a.id);
                Home.renderCards(list, "homestead", "group");
            }
        }
    },
    renderCards: (list, type, block) => {
        const container = document.getElementById(`home-${block}-territory-list`);
        const fragment = document.createDocumentFragment();

        for (const el of list) {
            const card = document.createElement('app-territory-card');
            card.image = `${CONFIG.web}cards/${type}/${type === "house" ? "T" : "H"}${el.id}.webp`;
            card.address = `${el.title} ${el.number})`;
            card.link = `/territory/card/${type}/${el.id}`;
            fragment.appendChild(card);
        }

        container.appendChild(fragment);
    }
}