cradova 1.0.1 → 1.0.2

package/dist/scripts/swipe.js

@@ -0,0 +1,114 @@
+export function swipe(item) {
+    let caller;
+    let startX = 0, startY = 0;
+    if (typeof item === "object") {
+        caller = item;
+    }
+    else {
+        throw new Error("no call given for the swipe handler");
+    }
+    function handleTouchStart(e) {
+        startX = e.changedTouches[0].screenX;
+        startY = e.changedTouches[0].screenY;
+    }
+    function handleTouchEnd(e) {
+        const diffX = e.changedTouches[0].screenX - startX;
+        const diffY = e.changedTouches[0].screenY - startY;
+        const ratioX = Math.abs(diffX / diffY);
+        const ratioY = Math.abs(diffY / diffX);
+        const absDiff = Math.abs(ratioX > ratioY ? diffX : diffY);
+        if (absDiff < 10) {
+            if (caller.touch) {
+                callback.touch(caller.touch);
+            }
+        }
+        if (ratioX > ratioY) {
+            // left and right
+            if (diffX >= 0) {
+                if (caller.right) {
+                    callback.right(caller.right);
+                }
+            }
+            else {
+                if (caller.left) {
+                    callback.left(caller.left);
+                }
+            }
+            // up and down
+        }
+        else {
+            if (diffY >= 0) {
+                if (caller.down) {
+                    callback.down(caller.down);
+                }
+            }
+            else {
+                if (caller.up) {
+                    callback.up(caller.up);
+                }
+            }
+        }
+    }
+    const escapeTSError = document.body;
+    escapeTSError.addEventListener("touchstart", handleTouchStart);
+    escapeTSError.addEventListener("touchend", handleTouchEnd);
+    const callback = {
+        touch(callback) {
+            return callback();
+        },
+        right(callback) {
+            return callback();
+        },
+        left(callback) {
+            return callback();
+        },
+        down(callback) {
+            return callback();
+        },
+        up(callback) {
+            return callback();
+        },
+    };
+}
+/*
+ *** HOW TO USE ***
+
+    function touch(){
+     console.log("touching")
+    }
+    
+    
+
+    function up(){
+     console.log("swipe up")
+    }
+    
+
+    function down(){
+     console.log("swipe down")
+    }
+    
+
+    function right(){
+     console.log("swipe right")
+    }
+
+
+    function left(){
+     console.log("swipe left")
+    }
+
+
+
+    let obj = {down: down,
+               touch: touch,
+               up: up,
+               right: right,
+               left: left
+           }
+
+    swipe(obj)
+
+
+
+ */

package/dist/scripts/track.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Send a new state to specified element with stateID
+ *
+ * @param stateID
+ * @param state
+ * @returns element(s)
+ */
+export declare function dispatch(stateID: string | Record<string, any>, state?: Record<string, any>): HTMLElement[];
+export declare function fullScreen(e: Element): {
+    set(): void;
+    exist(): void;
+};

package/dist/scripts/track.js

@@ -0,0 +1,150 @@
+// the global dispatcher
+function cradovaDispatchtrack(nodes /*NodeListOf<Element>*/, stateID, state) {
+    const updated = [];
+    for (let i = 0; i < nodes.length; i++) {
+        const element = nodes[i];
+        // abort re-rendering if the state is not for this element
+        if (!element.stateID || element.stateID !== stateID) {
+            continue;
+        }
+        updated.push(element);
+        if (typeof state === "object") {
+            // updating the element's state
+            for (const key in state) {
+                // updating element styling
+                if (key === "style") {
+                    for (const [k, v] of Object.entries(state[key])) {
+                        element.style[k] = v;
+                    }
+                    continue;
+                }
+                if (element.style[key] && key !== "src") {
+                    element.style[key] = state[key];
+                    continue;
+                }
+                if (element.style[key] === "" && key !== "src") {
+                    element.style[key] = state[key];
+                    continue;
+                }
+                if (typeof element[key] === "function") {
+                    element[key]();
+                    continue;
+                }
+                // updating element's inner text
+                if (key === "text") {
+                    element.innerText = state[key];
+                    continue;
+                }
+                // setting element dimesion to full screen
+                if (key === "fullscreen") {
+                    if (state[key]) {
+                        fullScreen(element).set();
+                    }
+                    else {
+                        fullScreen(element).exist();
+                    }
+                    continue;
+                }
+                // adding class name to element
+                if (key === "class" && typeof state[key] === "string") {
+                    const classes = state[key].split(" ");
+                    for (let i = 0; i < classes.length; i++) {
+                        if (classes[i]) {
+                            element.classList.add(classes[i]);
+                        }
+                    }
+                    // console.log(element.className, "cl");
+                    continue;
+                }
+                // toggling element class
+                if (key === "toggleclass") {
+                    element.classList.toggle(state[key]);
+                    //          console.log(element.className, "tc");
+                    continue;
+                }
+                //removing element class
+                if (key === "removeclass") {
+                    element.classList.remove(state[key]);
+                    //  console.log(element.className, "rm");
+                    continue;
+                }
+                //removing element class
+                if (key === "remove") {
+                    element.parentElement?.remove(element);
+                    continue;
+                }
+                // changing the element children tree
+                if (key === "tree") {
+                    if (typeof state[key] === "function") {
+                        state[key] = state[key]();
+                    }
+                    if (typeof state[key] === "function") {
+                        state[key] = state[key]();
+                    }
+                    if (Array.isArray(state[key])) {
+                        throw new TypeError("cradova err invalid element, should be a single element or parent element from cradova");
+                    }
+                    if (!(state[key] instanceof HTMLElement)) {
+                        console.error("cradova err wrong element type: can't create element state on " +
+                            state[key]);
+                        throw new TypeError("cradova err invalid element, should be a html element from cradova");
+                    }
+                    // destroy the component tree
+                    element.innerHTML = "";
+                    // rebuild the component tree
+                    // console.log(state[key]);
+                    element.append(state[key]);
+                    continue;
+                }
+                element[key] = state[key];
+            }
+        }
+    }
+    return updated;
+}
+/**
+ * Send a new state to specified element with stateID
+ *
+ * @param stateID
+ * @param state
+ * @returns element(s)
+ */
+export function dispatch(stateID, state) {
+    // TODO: this will be updated to use data-stateid soon
+    // speed test still going on
+    const nodes = document.querySelectorAll(".cra_child_doc");
+    let updated = [];
+    if (typeof state === "undefined" && typeof stateID === "object") {
+        for (const [id, eachState] of Object.entries(stateID)) {
+            const node = cradovaDispatchtrack(nodes, id, eachState);
+            updated.push(...node);
+        }
+    }
+    else {
+        if (typeof stateID === "string") {
+            const node = cradovaDispatchtrack(nodes, stateID, state);
+            updated.push(...node);
+        }
+    }
+    return updated;
+}
+// for making the dom elements fulscreen
+export function fullScreen(e) {
+    return {
+        set() {
+            e.requestFullscreen().catch((err) => {
+                throw err;
+            });
+        },
+        exist() {
+            document.exitFullscreen();
+        },
+    };
+}
+/*
+ *** HOW TO USE ***
+
+u("#container").fullscreen().toggle()
+u("#container").fullscreen().exist()
+u("#container").fullscreen().set()
+*/

package/dist/scripts/widget.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Document fragment
+ * @param childrens
+ * @returns
+ */
+declare type fragmentTYPE = (() => any) | HTMLElement;
+export declare const fragment: (...childrens: fragmentTYPE[]) => () => DocumentFragment;
+export {};

package/dist/scripts/widget.js

@@ -0,0 +1,21 @@
+/**
+ * Document fragment
+ * @param childrens
+ * @returns
+ */
+export const fragment = function (...childrens) {
+    const par = document.createDocumentFragment();
+    // building it's children tree.
+    for (let i = 0; i < childrens.length; i++) {
+        const ch = childrens[i];
+        if (typeof ch === "function") {
+            par.append(ch());
+        }
+        else {
+            if (ch instanceof HTMLElement) {
+                par.append(ch);
+            }
+        }
+    }
+    return () => par;
+};

package/dist/types.d.ts

@@ -0,0 +1,12 @@
+export declare type CradovaElemetType = HTMLElement & Record<string, any> & {
+    style: Record<string, unknown>;
+    stateID: string;
+};
+export declare type CradovaHTMLElemetType = (...element_initials: any[]) => ((...element_initials: any[]) => "empty cradova call") | ((...element_initials: any[]) => HTMLElement | undefined);
+export declare type CradovaScreenType = {
+    name: string;
+    template: Function | HTMLElement;
+    transition?: string;
+    callBack?: (html?: any, data?: Record<string, any>) => void;
+    persist?: boolean;
+};

package/dist/types.js

@@ -0,0 +1 @@
+export {};