json-crud-ui-comp-table 1.3.3 → 1.3.4

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/WithSearchHtmlId/BuildTable/getKSTableConfig.js

@@ -0,0 +1,11 @@
+import onReadFail from "../../../CommonFuncs/onReadFail.js";
+
+export const getKSTableConfig = async () => {
+    const config = await fetch("./Index/Configs/WithSearch/config.json");
+    // debugger;
+    const configJson = await config.json();
+
+    configJson.callbacks.table.onReadFail = onReadFail;
+
+    return configJson;
+};

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/WithSearchHtmlId/BuildTable/index.js

@@ -0,0 +1,10 @@
+import { getKSTableConfig } from "./getKSTableConfig.js";
+import { callKSTable } from "./callKSTable.js";
+
+const startFunc = async () => {
+    const config = await getKSTableConfig();
+
+    await callKSTable(config);
+};
+
+export default startFunc;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/WithSearchHtmlId/clickFunc.js

@@ -0,0 +1,24 @@
+import buildTable from "./BuildTable/index.js";
+
+const clickFuncToRun = ({ inCurrentTarget }) => {
+    // console.log("inCurrentTarget : ", inCurrentTarget);
+    applyActive({ inCurrentTarget });
+    // inCurrentTarget.classList.add("active");
+
+    buildTable().then();
+};
+
+const applyActive = ({ inCurrentTarget }) => {
+    const localCurrentTarget = inCurrentTarget;
+
+    const menu = localCurrentTarget.closest("#menu");
+
+    menu.querySelectorAll("li a.active")
+        .forEach(a => a.classList.remove("active"));
+
+    localCurrentTarget.classList.add("active");
+
+    localCurrentTarget.classList.add("active");
+};
+
+export { clickFuncToRun };

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/WithSearchHtmlId/start.js

@@ -0,0 +1,11 @@
+import { clickFuncToRun } from "./clickFunc.js";
+
+const funcToRun = () => {
+    const htmlElement = document.getElementById('WithSearchHtmlId');
+    // debugger;
+    htmlElement.addEventListener("click", (event) =>
+        clickFuncToRun({ inCurrentTarget: event.currentTarget })
+    );
+};
+
+export default funcToRun;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/WithSerialHtmlId/BuildTable/callKSTable.js

@@ -0,0 +1,5 @@
+export const callKSTable = async (config) => {
+    if (window?.KSTableComp?.initShowTable) {
+        return window.KSTableComp.initShowTable(config);
+    };
+};

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/WithSerialHtmlId/BuildTable/getKSTableConfig.js

@@ -0,0 +1,12 @@
+import onReadFail from "../../../CommonFuncs/onReadFail.js";
+
+export const getKSTableConfig = async () => {
+
+    const config = await fetch("./Index/Configs/WithSerial/config.json");
+    // debugger;
+    const configJson = await config.json();
+
+    configJson.callbacks.table.onReadFail = onReadFail;
+
+    return configJson;
+};

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/WithSerialHtmlId/BuildTable/index.js

@@ -0,0 +1,10 @@
+import { getKSTableConfig } from "./getKSTableConfig.js";
+import { callKSTable } from "./callKSTable.js";
+
+const startFunc = async () => {
+    const config = await getKSTableConfig();
+
+    await callKSTable(config);
+};
+
+export default startFunc;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/WithSerialHtmlId/clickFunc.js

@@ -0,0 +1,24 @@
+import buildTable from "./BuildTable/index.js";
+
+const clickFuncToRun = ({ inCurrentTarget }) => {
+    // console.log("inCurrentTarget : ", inCurrentTarget);
+    applyActive({ inCurrentTarget });
+    // inCurrentTarget.classList.add("active");
+
+    buildTable().then();
+};
+
+const applyActive = ({ inCurrentTarget }) => {
+    const localCurrentTarget = inCurrentTarget;
+
+    const menu = localCurrentTarget.closest("#menu");
+
+    menu.querySelectorAll("li a.active")
+        .forEach(a => a.classList.remove("active"));
+
+    localCurrentTarget.classList.add("active");
+
+    localCurrentTarget.classList.add("active");
+};
+
+export { clickFuncToRun };

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/WithSerialHtmlId/start.js

@@ -0,0 +1,11 @@
+import { clickFuncToRun } from "./clickFunc.js";
+
+const funcToRun = () => {
+    const htmlElement = document.getElementById('WithSerialHtmlId');
+    // debugger;
+    htmlElement.addEventListener("click", (event) =>
+        clickFuncToRun({ inCurrentTarget: event.currentTarget })
+    );
+};
+
+export default funcToRun;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/loginButtonId/clickFunc/api/postLogin.js

@@ -0,0 +1,15 @@
+import getLoginPayload from "../credentials/getLoginPayload.js";
+
+const postLogin = async () => {
+    return fetch("/Secured/V1/GenerateToken/ToCookie", {
+        method: "POST",
+        headers: {
+            "Content-Type": "application/json"
+        },
+        body: JSON.stringify(
+            getLoginPayload()
+        )
+    });
+};
+
+export default postLogin;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/loginButtonId/clickFunc/credentials/getLoginPayload.js

@@ -0,0 +1,9 @@
+import getPassword from "./getPassword.js";
+import getUserName from "./getUserName.js";
+
+const getLoginPayload = () => ({
+    UserName: getUserName(),
+    Password: getPassword()
+});
+
+export default getLoginPayload;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/loginButtonId/clickFunc/credentials/getPassword.js

@@ -0,0 +1,4 @@
+const getPassword = () =>
+    document.getElementById("Password").value;
+
+export default getPassword;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/loginButtonId/clickFunc/credentials/getUserName.js

@@ -0,0 +1,4 @@
+const getUserName = () =>
+    document.getElementById("Username").value;
+
+export default getUserName;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/loginButtonId/clickFunc/index.js

@@ -0,0 +1,16 @@
+import postLogin from "./api/postLogin.js";
+import handleLoginFailure from "./ui/loginFailure/index.js";
+import handleLoginSuccess from "./ui/loginSuccess/index.js";
+
+const clickFuncToRun = async () => {
+    const response = await postLogin();
+
+    if (response.status === 200) {
+        handleLoginSuccess();
+        return;
+    };
+
+    handleLoginFailure();
+};
+
+export default clickFuncToRun;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/loginButtonId/clickFunc/ui/loginFailure/index.js

@@ -0,0 +1,7 @@
+import showLoginError from "./showLoginError.js";
+
+const handleLoginFailure = () => {
+    showLoginError();
+};
+
+export default handleLoginFailure;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/loginButtonId/clickFunc/ui/loginFailure/showLoginError.js

@@ -0,0 +1,15 @@
+const showLoginError = () => {
+    document
+        .getElementById("loginError")
+        .classList.remove("hidden");
+
+    document
+        .getElementById("loginError")
+        .textContent = "Invalid username or password";
+
+    document
+        .getElementById("loginModalContent")
+        .classList.add("border-2", "border-red-500");
+};
+
+export default showLoginError;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/loginButtonId/clickFunc/ui/loginSuccess/hideLoginError.js

@@ -0,0 +1,11 @@
+const hideLoginError = () => {
+    document
+        .getElementById("loginError")
+        .classList.add("hidden");
+
+    document
+        .getElementById("loginModalContent")
+        .classList.remove("border-2", "border-red-500");
+};
+
+export default hideLoginError;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/loginButtonId/clickFunc/ui/loginSuccess/index.js

@@ -0,0 +1,11 @@
+import hideLoginError from "./hideLoginError.js";
+import hideLoginModal from "../../../../../Common/LoginModal/hide.js";
+import applyLoggedInMenu from "../../../../../Common/MenuState/applyLoggedInMenu.js";
+
+const handleLoginSuccess = () => {
+    hideLoginError();
+    hideLoginModal();
+    applyLoggedInMenu();
+};
+
+export default handleLoginSuccess;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/loginButtonId/clickFunc copy.js

@@ -0,0 +1,74 @@
+const decodeJwt = (token) => {
+    const [header, payload] = token.split(".");
+
+    return {
+        header: JSON.parse(atob(header)),
+        payload: atob(payload)
+    };
+};
+
+const clickFuncToRun = async ({ inCurrentTarget }) => {
+    const UserName =
+        document.getElementById("Username").value;
+
+    const Password =
+        document.getElementById("Password").value;
+
+    const response = await fetch("/Secured/V1/GenerateToken/ToCookie", {
+        method: "POST",
+        headers: {
+            "Content-Type": "application/json"
+        },
+        body: JSON.stringify({
+            UserName,
+            Password
+        })
+    });
+
+    if (response.status === 200) {
+        document
+            .getElementById("loginError")
+            .classList.add("hidden");
+
+        document
+            .getElementById("loginModalContent")
+            .classList.remove("border-2", "border-red-500");
+
+        const loginModal =
+            document.getElementById("loginModal");
+
+        loginModal.classList.add("hidden");
+
+        document
+            .getElementById("UserHeaderHtmlId").closest("li")
+            .style.display = "";
+
+
+        document
+            .getElementById("loginHeaderHtmlId").closest("li")
+            .style.display = "none";
+
+        const token = document.cookie
+            .split("; ")
+            .find(row => row.startsWith("KSToken="))
+            ?.split("=")[1];
+
+        const userCode = decodeJwt(token);
+        document
+            .getElementById("UserHeaderHtmlId").querySelector("span").innerHTML = userCode.payload;
+    } else {
+        document
+            .getElementById("loginError")
+            .textContent = "Invalid username or password";
+
+        document
+            .getElementById("loginError")
+            .classList.remove("hidden");
+
+        document
+            .getElementById("loginModalContent")
+            .classList.add("border-2", "border-red-500");
+    };
+};
+
+export { clickFuncToRun };

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/loginButtonId/start.js

@@ -0,0 +1,11 @@
+import clickFuncToRun from "./clickFunc/index.js";
+
+const funcToRun = () => {
+    const htmlElement = document.getElementById('loginButtonId');
+    // debugger;
+    htmlElement.addEventListener("click", (event) =>
+        clickFuncToRun({ inCurrentTarget: event.currentTarget })
+    );
+};
+
+export default funcToRun;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/loginHeaderHtmlId/clickFunc.js

@@ -0,0 +1,21 @@
+const clickFuncToRun = ({ inCurrentTarget }) => {
+    const loginModal =
+        document.getElementById("loginModal");
+
+    loginModal.classList.remove("hidden");
+};
+
+const applyActive = ({ inCurrentTarget }) => {
+    const localCurrentTarget = inCurrentTarget;
+
+    const menu = localCurrentTarget.closest("#menu");
+
+    menu.querySelectorAll("li a.active")
+        .forEach(a => a.classList.remove("active"));
+
+    localCurrentTarget.classList.add("active");
+
+    localCurrentTarget.classList.add("active");
+};
+
+export { clickFuncToRun };

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/loginHeaderHtmlId/start.js

@@ -0,0 +1,11 @@
+import { clickFuncToRun } from "./clickFunc.js";
+
+const funcToRun = () => {
+    const htmlElement = document.getElementById('loginHeaderHtmlId');
+    // debugger;
+    htmlElement.addEventListener("click", (event) =>
+        clickFuncToRun({ inCurrentTarget: event.currentTarget })
+    );
+};
+
+export default funcToRun;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/AddListeners/start.js

@@ -0,0 +1,19 @@
+import showAllHtmlId from "./ShowAllHtmlId/start.js";
+import withSerialHtmlId from "./WithSerialHtmlId/start.js";
+import withSearchHtmlId from "./WithSearchHtmlId/start.js";
+import loginHeaderHtmlId from "./loginHeaderHtmlId/start.js";
+import loginButtonId from "./loginButtonId/start.js";
+import userHeaderHtmlId from "./UserHeaderHtmlId/start.js";
+import escapeKey from "./EscapeKey/start.js";
+
+const hookAllListeners = () => {
+    showAllHtmlId();
+    withSerialHtmlId();
+    withSearchHtmlId();
+    loginHeaderHtmlId();
+    loginButtonId();
+    userHeaderHtmlId();
+    escapeKey();
+};
+
+export { hookAllListeners };

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/ApplyMenuFromCookie/index.js

@@ -0,0 +1,16 @@
+import getTokenFromCookie from "../Common/AuthCookie/getTokenFromCookie.js";
+import applyLoggedInMenu from "../Common/MenuState/applyLoggedInMenu.js";
+import applyLoggedOutMenu from "../Common/MenuState/applyLoggedOutMenu.js";
+
+const applyMenuFromCookie = () => {
+    const token = getTokenFromCookie();
+
+    if (!token) {
+        applyLoggedOutMenu();
+        return;
+    };
+
+    applyLoggedInMenu();
+};
+
+export default applyMenuFromCookie;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/Common/AuthCookie/decodeJwt.js

@@ -0,0 +1,10 @@
+const decodeJwt = (token) => {
+    const [header, payload] = token.split(".");
+
+    return {
+        header: JSON.parse(atob(header)),
+        payload: atob(payload)
+    };
+};
+
+export default decodeJwt;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/Common/AuthCookie/deleteKSTokenCookie.js

@@ -0,0 +1,5 @@
+const deleteKSTokenCookie = () => {
+    document.cookie = "KSToken=; Max-Age=0; Path=/";
+};
+
+export default deleteKSTokenCookie;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/Common/AuthCookie/getTokenFromCookie.js

@@ -0,0 +1,7 @@
+const getTokenFromCookie = () =>
+    document.cookie
+        .split("; ")
+        .find(row => row.startsWith("KSToken="))
+        ?.split("=")[1];
+
+export default getTokenFromCookie;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/Common/AuthCookie/getUserCode.js

@@ -0,0 +1,12 @@
+import decodeJwt from "./decodeJwt.js";
+import getTokenFromCookie from "./getTokenFromCookie.js";
+
+const getUserCode = () => {
+    const token = getTokenFromCookie();
+
+    if (!token) return "";
+
+    return decodeJwt(token).payload;
+};
+
+export default getUserCode;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/Common/LoginModal/hide.js

@@ -0,0 +1,7 @@
+const hideLoginModal = () => {
+    document
+        .getElementById("loginModal")
+        .classList.add("hidden");
+};
+
+export default hideLoginModal;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/Common/MenuState/applyLoggedInMenu.js

@@ -0,0 +1,11 @@
+import hideLoginMenu from "./hideLoginMenu.js";
+import showUserMenu from "./showUserMenu.js";
+import updateUserHeader from "./updateUserHeader.js";
+
+const applyLoggedInMenu = () => {
+    showUserMenu();
+    hideLoginMenu();
+    updateUserHeader();
+};
+
+export default applyLoggedInMenu;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/Common/MenuState/applyLoggedOutMenu.js

@@ -0,0 +1,11 @@
+import hideUserMenu from "./hideUserMenu.js";
+import resetUserHeader from "./resetUserHeader.js";
+import showLoginMenu from "./showLoginMenu.js";
+
+const applyLoggedOutMenu = () => {
+    hideUserMenu();
+    showLoginMenu();
+    resetUserHeader();
+};
+
+export default applyLoggedOutMenu;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/Common/MenuState/hideLoginMenu.js

@@ -0,0 +1,8 @@
+const hideLoginMenu = () => {
+    document
+        .getElementById("loginHeaderHtmlId")
+        .closest("li")
+        .style.display = "none";
+};
+
+export default hideLoginMenu;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/Common/MenuState/hideUserMenu.js

@@ -0,0 +1,8 @@
+const hideUserMenu = () => {
+    document
+        .getElementById("UserHeaderHtmlId")
+        .closest("li")
+        .style.display = "none";
+};
+
+export default hideUserMenu;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/Common/MenuState/resetUserHeader.js

@@ -0,0 +1,8 @@
+const resetUserHeader = () => {
+    document
+        .getElementById("UserHeaderHtmlId")
+        .querySelector("span")
+        .textContent = "User";
+};
+
+export default resetUserHeader;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/Common/MenuState/showLoginMenu.js

@@ -0,0 +1,8 @@
+const showLoginMenu = () => {
+    document
+        .getElementById("loginHeaderHtmlId")
+        .closest("li")
+        .style.display = "";
+};
+
+export default showLoginMenu;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/Common/MenuState/showUserMenu.js

@@ -0,0 +1,8 @@
+const showUserMenu = () => {
+    document
+        .getElementById("UserHeaderHtmlId")
+        .closest("li")
+        .style.display = "";
+};
+
+export default showUserMenu;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/Common/MenuState/updateUserHeader.js

@@ -0,0 +1,10 @@
+import getUserCode from "../AuthCookie/getUserCode.js";
+
+const updateUserHeader = () => {
+    document
+        .getElementById("UserHeaderHtmlId")
+        .querySelector("span")
+        .textContent = getUserCode();
+};
+
+export default updateUserHeader;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/CommonFuncs/afterHeadSave.js

@@ -0,0 +1,33 @@
+import onSuccessFunc from "./onSuccess.js";
+
+const afterHeadSave = async (inPk) => {
+    const config = await fetch("Index/Configs/AddItem/config.json");
+    const configJson = await config.json();
+
+    configJson.endPoints.findFromParams = configJson.endPoints.findFromParams.replace("{pk}", inPk);
+    configJson.callbacks.vertical.onSuccess = onSuccessFunc;
+
+    if (window.KSTable) {
+        console.log("table loaded from cdn");
+
+        await window.KSTable.initCreate(configJson);
+    };
+
+    const configForSubTable = await fetch("Index/Configs/AddItem/configForSubTable.json");
+    const configForSubTableJson = await configForSubTable.json();
+
+    const findColumn = configForSubTableJson.columnsConfig.find(element => {
+        return element.columnName === "ParentPk";
+    });
+
+    findColumn.defaultValue = inPk.toString();
+    configForSubTableJson.endPoints.read += inPk.toString();
+
+    if (window.KSTable) {
+        console.log("table loaded from cdn");
+
+        await window.KSTable.initTableWithFooter(configForSubTableJson);
+    };
+};
+
+export default afterHeadSave;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/CommonFuncs/onReadFail.js

@@ -0,0 +1,10 @@
+const startFunc = (inResponseStatus) => {
+    const loginModal =
+        document.getElementById("loginModal");
+
+    loginModal.classList.remove("hidden");
+
+    loginModal.querySelector("input").focus();
+};
+
+export default startFunc;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/CommonFuncs/onSuccess.js

@@ -0,0 +1,13 @@
+import afterHeadSave from "./afterHeadSave.js";
+
+const onSuccessFunc = async (res) => {
+    const fromReponse = await res.json();
+    // console.log("fromReponse : ", fromReponse);
+
+    document.getElementById("htmlId").innerHTML = fromReponse.pk;
+
+    // window.location.href = `../WithSubTable/index.html?pk=${fromReponse.pk}`;
+    await afterHeadSave(fromReponse.pk);
+};
+
+export default onSuccessFunc;

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/buildHeader.js

@@ -0,0 +1,12 @@
+// import headerBuild from "/header/v3/initHeader.js";
+
+const buildHeader = async () => {
+    const fromFetch = await fetch("./Index/headers.json");
+    const headerConfig = await fromFetch.json();
+    // debugger;
+    await window.KSHeader(headerConfig);
+
+    // await headerBuild(headerConfig);
+};
+
+export { buildHeader };

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/runAfterDomLoad.js

@@ -0,0 +1,14 @@
+import { buildHeader } from "./buildHeader.js";
+import { hookAllListeners } from "./AddListeners/start.js";
+import applyMenuFromCookie from "./ApplyMenuFromCookie/index.js";
+
+const runAfterDomLoad = () => {
+    import("../../../script.js").then(fromPromise => {
+        buildHeader().then(fromPromise => {
+            applyMenuFromCookie();
+            hookAllListeners();
+        });
+    });
+};
+
+export { runAfterDomLoad };

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/DomContentLoaded/start.js

@@ -0,0 +1,7 @@
+import { runAfterDomLoad } from "./runAfterDomLoad.js";
+
+export function startDomContentLoaded() {
+    document.addEventListener("DOMContentLoaded", () => {
+        runAfterDomLoad();
+    });
+};

package/bin/v3/commands/TableComp/template/v4/Index/FormLoad/start.js

@@ -0,0 +1,5 @@
+import { startDomContentLoaded } from "./DomContentLoaded/start.js";
+
+export function startFormLoad() {
+    startDomContentLoaded();
+}