Internet_Programming_Library_Barsukov_/lab3/all/js/lines.js

import { hideUpdateModal, showUpdateModal } from "./lines-modal";
import {
    createLine, deleteLine, getAllItemTypes, getAllLongs, getAllLines, getLine, updateLine,
} from "./lines-rest-api";
import {
    cntrls, createItemsOption, createTableRow, imagePlaceholder,
} from "./lines-ui";

async function drawItemsSelect() {
    // console.info("drawItemsSelect");
    const data = await getAllItemTypes();

    cntrls.itemsType.innerHTML = "";
    cntrls.itemsType.appendChild(createItemsOption("Choose item", "", true));

    data.forEach((item) => {
        cntrls.itemsType.appendChild(createItemsOption(item.name, item.id));
    });
}

async function drawLongsSelect() {
    // console.info("drawItemsSelect2");
    const data = await getAllLongs();
    cntrls.itemsLongs.innerHTML = "";
    cntrls.itemsLongs.appendChild(createItemsOption("Choose item", "", true));
    data.forEach((item) => {
        cntrls.itemsLongs.appendChild(createItemsOption(item.name, item.id));
    });
}

async function drawLinesTable() {
    // console.info("drawLinesTable");
    if (!cntrls.table) {
        return;
    }
    const data = await getAllLines();
    // console.log(data);
    cntrls.table.innerHTML = "";
    data.forEach((item, index) => {
        cntrls.table.appendChild(
            createTableRow(
                item,
                index,
                () => showUpdateModal(item),
                // () => location.assign(`page-edit.html?id=${item.id}`),
                () => removeLine(item.id),
            ),
        );
    });
}

async function addLine(item, author, title, long, image, text) {
    // console.info("addLine");
    const data = await createLine(item, author, title, long, image, text);
    // console.info("Added");
    console.info(data);
    drawLinesTable();
}

async function editLine(id, item, author, title, long, image, text) {
    // console.info("editLine");
    const data = await updateLine(id, item, author, title, long, image, text);
    // console.info("Updated");
    console.info(data);
    drawLinesTable();
}

async function removeLine(id) {
    // console.info("removeLine");
    if (!confirm("Do you really want to remove this item?")) {
        console.info("Canceled");
        return;
    }
    // console.info("Try to remove item");
    const data = await deleteLine(id);
    console.info(data);
    drawLinesTable();
}

async function readFile(file) {
    // console.info("readFile");
    const reader = new FileReader();
    return new Promise((resolve, reject) => {
        reader.onloadend = () => {
            const fileContent = reader.result;
            resolve(fileContent);
        };
        reader.onerror = () => {
            reject(new Error("oops, something went wrong with the file reader."));
        };
        reader.readAsDataURL(file);
    });
}

function readTextFile(file) {
    const reader = new FileReader();
    return new Promise((resolve, reject) => {
        reader.onloadend = () => {
            const fileContent = reader.result;
            resolve(fileContent);
        };
        reader.onerror = () => {
            reject(new Error("oops, something went wrong with the file reader."));
        };
        if (file) {
            reader.readAsText(file);
        } else {
            console.error("НЕТУ ФАЙЛА");
            resolve("No text");
        }
    });
}

async function updateImagePreview() {
    // console.info("updateImagePreview");
    const file = cntrls.image.files[0];
    const fileContent = await readFile(file);
    console.info("base64 ", fileContent);
    cntrls.imagePreview.src = fileContent;
}

export function linesForm() {
    // console.info("linesForm");

    drawItemsSelect();
    drawLongsSelect();

    drawLinesTable();

    cntrls.image.addEventListener("change", () => updateImagePreview());

    cntrls.button.addEventListener("click", () => showUpdateModal(null));

    cntrls.form.addEventListener("submit", async (event) => {
        console.info("Form onSubmit");
        event.preventDefault();
        event.stopPropagation();
        if (!cntrls.form.checkValidity()) {
            return;
        }

        let imageBase64 = "";
        if (cntrls.imagePreview.src !== imagePlaceholder) {
            const result = await fetch(cntrls.imagePreview.src);
            const blob = await result.blob();
            imageBase64 = await readFile(blob);
        }

        const currentId = cntrls.lineId.value;

        let content = "";
        const file = cntrls.text.files[0];
        if (file) {
            content = await readTextFile(file);
        } else {
            const line = await getLine(currentId);
            content = line.text;
            // content = lines[cntrls.lineId].text.value;
        }
        console.log("2!!", content, "!!");

        if (!currentId) {
            await addLine(
                cntrls.itemsType.value,
                cntrls.author.value,
                cntrls.title.value,
                cntrls.itemsLongs.value,
                imageBase64,
                content,
            );
        } else {
            await editLine(
                currentId,
                cntrls.itemsType.value,
                cntrls.author.value,
                cntrls.title.value,
                cntrls.itemsLongs.value,
                imageBase64,
                content,
            );
        }

        hideUpdateModal();
    });
}