cradova 1.0.0

package/scripts/localStorage.js

@@ -0,0 +1,26 @@
+let ls = {
+    store: () => console.log(),
+    retrieve: () => console.log(),
+    remove: () => console.log(),
+    getKey: () => console.log(),
+    clear: () => console.log(),
+};
+ls.store = (name, value) => {
+    if (typeof value !== "string") {
+        value = JSON.stringify(value);
+    }
+    localStorage.setItem(name, value);
+};
+ls.retrieve = (name) => {
+    localStorage.getItem(name);
+};
+ls.remove = (name) => {
+    localStorage.removeItem(name);
+};
+ls.getKey = (index) => {
+    window.localStorage.key(index);
+};
+ls.clear = () => {
+    localStorage.clear();
+};
+export default ls;

package/scripts/localStorage.ts

@@ -0,0 +1,37 @@
+type l = {
+  store: (name: string, value: unknown) => void;
+  retrieve: (name: string) => void;
+  remove: (name: string) => void;
+  getKey: (index: number) => void;
+  clear: () => void;
+};
+
+let ls: l = {
+  store: () => console.log(),
+  retrieve: () => console.log(),
+  remove: () => console.log(),
+  getKey: () => console.log(),
+  clear: () => console.log(),
+};
+
+ls.store = (name: string, value: any) => {
+  if (typeof value !== "string") {
+    value = JSON.stringify(value);
+  }
+  localStorage.setItem(name, value);
+};
+ls.retrieve = (name: string) => {
+  localStorage.getItem(name);
+};
+
+ls.remove = (name: string) => {
+  localStorage.removeItem(name);
+};
+ls.getKey = (index: number) => {
+  window.localStorage.key(index);
+};
+ls.clear = () => {
+  localStorage.clear();
+};
+
+export default ls;

package/scripts/media.d.ts

@@ -0,0 +1,22 @@
+/**
+Write CSS media in javascript
+
+@example
+
+_.media("min-width: 790px",
+["#container",
+{
+    width: "100%",
+    height: "100%",
+    "background-color": "#0000"
+}],
+
+["#header",
+{
+    width: "100%",
+    height: "20%",
+    "background-color": "#fff"
+}]
+)
+*/
+export default function media(value: string, ...properties: any[]): void;

package/scripts/media.js

@@ -0,0 +1,48 @@
+/**
+Write CSS media in javascript
+
+@example
+
+_.media("min-width: 790px",
+["#container",
+{
+    width: "100%",
+    height: "100%",
+    "background-color": "#0000"
+}],
+
+["#header",
+{
+    width: "100%",
+    height: "20%",
+    "background-color": "#fff"
+}]
+)
+*/
+export default function media(value, ...properties) {
+    /* This is for creating css
+   @media styles using javascipt*/
+    const styS = "@media only screen and (" + value + ") " + "{", styE = "}";
+    let style = "  ", aniSty = " ";
+    const proplen = properties.length;
+    let totalAnimation, Animation = "  ";
+    const animationStep = (num) => {
+        for (const [k, v] of Object.entries(properties[num][1])) {
+            style += "" + k + ": " + v + ";";
+        }
+        aniSty += "" + properties[num][0] + "{" + style + "}";
+        return aniSty;
+    };
+    for (let i = 0; i < proplen; i++) {
+        Animation += animationStep(i);
+    }
+    let aniStyleTag = document.querySelector("style");
+    if (aniStyleTag === null) {
+        aniStyleTag = document.createElement("style");
+    }
+    aniStyleTag.media = "screen";
+    totalAnimation = aniStyleTag.innerHTML;
+    totalAnimation += styS + Animation + styE;
+    aniStyleTag.innerHTML = totalAnimation;
+    document.head.append(aniStyleTag);
+}

package/scripts/media.ts

@@ -0,0 +1,51 @@
+/**
+Write CSS media in javascript
+
+@example
+
+_.media("min-width: 790px",
+["#container",
+{
+    width: "100%",
+    height: "100%",
+    "background-color": "#0000"
+}],
+
+["#header",
+{
+    width: "100%",
+    height: "20%",
+    "background-color": "#fff"
+}]
+)
+*/
+export default function media(value: string, ...properties: any[]) {
+  /* This is for creating css  
+ @media styles using javascipt*/
+  const styS = "@media only screen and (" + value + ") " + "{",
+    styE = "}";
+  let style = "  ",
+    aniSty = " ";
+  const proplen = properties.length;
+  let totalAnimation,
+    Animation = "  ";
+  const animationStep = (num: number) => {
+    for (const [k, v] of Object.entries(properties[num][1])) {
+      style += "" + k + ": " + v + ";";
+    }
+    aniSty += "" + properties[num][0] + "{" + style + "}";
+    return aniSty;
+  };
+  for (let i = 0; i < proplen; i++) {
+    Animation += animationStep(i);
+  }
+  let aniStyleTag = document.querySelector("style");
+  if (aniStyleTag === null) {
+    aniStyleTag = document.createElement("style");
+  }
+  aniStyleTag.media = "screen";
+  totalAnimation = aniStyleTag.innerHTML;
+  totalAnimation += styS + Animation + styE;
+  aniStyleTag.innerHTML = totalAnimation;
+  document.head.append(aniStyleTag);
+}

package/scripts/reuse.ts

@@ -0,0 +1,74 @@
+export default function reuse(element) {
+    
+    return (...incoming) => {
+        let childrens2rd, props, text;
+
+        for (let i = 0; i < incoming.length; i++) {
+            if (
+                typeof incoming[i] === "function" ||
+                incoming[i] instanceof HTMLElement
+            ) {
+                if (Array.isArray(childrens2rd)) {
+                    childrens2rd.push(incoming[i]);
+                } else {
+                    childrens2rd = [incoming[i]];
+                }
+                continue;
+            }
+            //
+            if (
+                !(incoming[i] instanceof HTMLElement) &&
+                typeof incoming[i] === "object"
+            ) {
+                props = incoming[i];
+                continue;
+            }
+            if (typeof incoming[i] === "string") {
+                text = incoming[i];
+                continue;
+            }
+        }
+
+        //
+        // dynamic props
+        //
+
+        if (props && typeof props === "object" && !Array.isArray(props)) {
+            for (const prop in props) {
+                if (prop === "style") {
+                    for (const [k, v] of Object.entries(props[prop])) {
+                        element.style[k] = v;
+                    }
+                    continue;
+                }
+                if (prop === "text") {
+                    element.innerText = props[prop];
+                    continue;
+                }
+                if (prop === "class") {
+                    element.classList.add(props[prop]);
+                    continue;
+                }
+                element[prop] = props[prop];
+            }
+        }
+        if (childrens2rd && childrens2rd[0]) {
+            for (let i = 0; i < childrens2rd.length; i++) {
+                if (typeof childrens2rd[i] === "function") {
+                    element.append(childrens2rd[i](props));
+                    continue;
+                }
+                element.append(childrens2rd[i]);
+            }
+        }
+        if (text) {
+            element.append(text);
+        }
+        if (element.stateID) {
+            // adding cradova dynamic signature
+            element.classList.add("cra_child_doc");
+        }
+        return element;
+    
+}
+}

package/scripts/speaker.d.ts

@@ -0,0 +1,2 @@
+declare const Speaker: {};
+export default Speaker;

package/scripts/speaker.js

@@ -0,0 +1,16 @@
+const Speaker = {};
+Speaker.speak = function (text, language = "en", volume = 1, rate = 1, pitch = 1) {
+    // common languages (not supported by all browsers)
+    // en - english,  it - italian, fr - french,  de - german, es - spanish
+    // ja - japanese, ru - russian, zh - chinese, hi - hindi,  ko - korean
+    const utterance = new SpeechSynthesisUtterance(text);
+    utterance.lang = language;
+    utterance.volume = volume;
+    utterance.rate = rate;
+    utterance.pitch = pitch;
+    speechSynthesis.speak(utterance);
+};
+Speaker.stop = () => {
+    return speechSynthesis && speechSynthesis.cancel();
+};
+export default Speaker;

package/scripts/speaker.ts

@@ -0,0 +1,25 @@
+const Speaker = {};
+
+Speaker.speak = function (
+  text,
+  language = "en",
+  volume = 1,
+  rate = 1,
+  pitch = 1
+) {
+  // common languages (not supported by all browsers)
+  // en - english,  it - italian, fr - french,  de - german, es - spanish
+  // ja - japanese, ru - russian, zh - chinese, hi - hindi,  ko - korean
+  const utterance = new SpeechSynthesisUtterance(text);
+  utterance.lang = language;
+  utterance.volume = volume;
+  utterance.rate = rate;
+  utterance.pitch = pitch;
+  speechSynthesis.speak(utterance);
+};
+
+Speaker.stop = () => {
+  return speechSynthesis && speechSynthesis.cancel();
+};
+
+export default Speaker;

package/scripts/store.d.ts

@@ -0,0 +1,10 @@
+declare class store {
+    #private;
+    constructor(initial: unknown);
+    status(): unknown;
+    set(value: unknown): void;
+    forward(): void;
+    backward(): void;
+}
+declare const Store: (initial: unknown) => store;
+export default Store;

package/scripts/store.js

@@ -0,0 +1,56 @@
+var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+    if (kind === "m") throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+};
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _store_index, _store_history, _store_value;
+class store {
+    constructor(initial) {
+        _store_index.set(this, 0);
+        _store_history.set(this, []);
+        _store_value.set(this, null);
+        __classPrivateFieldSet(this, _store_value, initial, "f");
+        __classPrivateFieldGet(this, _store_history, "f").push(initial);
+    }
+    status() {
+        return __classPrivateFieldGet(this, _store_value, "f");
+    }
+    set(value) {
+        __classPrivateFieldSet(this, _store_value, value, "f");
+        __classPrivateFieldGet(this, _store_history, "f").push(value);
+        __classPrivateFieldSet(this, _store_index, __classPrivateFieldGet(this, _store_index, "f") + 1, "f");
+    }
+    forward() {
+        if (__classPrivateFieldGet(this, _store_history, "f").length > __classPrivateFieldGet(this, _store_index, "f") + 1) {
+            __classPrivateFieldSet(this, _store_value, __classPrivateFieldGet(this, _store_history, "f")[__classPrivateFieldGet(this, _store_index, "f") + 1], "f");
+        }
+    }
+    backward() {
+        if (__classPrivateFieldGet(this, _store_history, "f").length > 0 && __classPrivateFieldGet(this, _store_index, "f") > 0) {
+            __classPrivateFieldSet(this, _store_value, __classPrivateFieldGet(this, _store_history, "f")[__classPrivateFieldGet(this, _store_index, "f") - 1], "f");
+            __classPrivateFieldSet(this, _store_index, __classPrivateFieldGet(this, _store_index, "f") - 1, "f");
+        }
+    }
+}
+_store_index = new WeakMap(), _store_history = new WeakMap(), _store_value = new WeakMap();
+const Store = function (initial) {
+    return new store(initial);
+};
+// const value = Store("hello world people");
+// console.log(value.status());
+//
+// value.set("hi yall people");
+// console.log(value.status());
+//
+// value.backward();
+// console.log(value.status());
+//
+// value.forward();
+// console.log(value.status());
+export default Store;

package/scripts/store.ts

@@ -0,0 +1,47 @@
+class store {
+  #index = 0;
+  #history: unknown[] = [];
+  #value: unknown = null;
+  constructor(initial: unknown) {
+    this.#value = initial;
+    this.#history.push(initial);
+  }
+  status() {
+    return this.#value;
+  }
+
+  set(value: unknown) {
+    this.#value = value;
+    this.#history.push(value);
+    this.#index += 1;
+  }
+  forward() {
+    if (this.#history.length > this.#index + 1) {
+      this.#value = this.#history[this.#index + 1];
+    }
+  }
+  backward() {
+    if (this.#history.length > 0 && this.#index > 0) {
+      this.#value = this.#history[this.#index - 1];
+      this.#index -= 1;
+    }
+  }
+}
+
+const Store = function (initial: unknown) {
+  return new store(initial);
+};
+
+// const value = Store("hello world people");
+// console.log(value.status());
+//
+// value.set("hi yall people");
+// console.log(value.status());
+//
+// value.backward();
+// console.log(value.status());
+//
+// value.forward();
+// console.log(value.status());
+
+export default Store;

package/scripts/swipe.d.ts

@@ -0,0 +1,9 @@
+declare type calls = {
+    up: () => void;
+    down: () => void;
+    right: () => void;
+    left: () => void;
+    touch: () => void;
+};
+export default function swipe(item: calls): void;
+export {};

package/scripts/swipe.js

@@ -0,0 +1,113 @@
+export default 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);
+                }
+            }
+        }
+    }
+    document.body.addEventListener("touchstart", handleTouchStart);
+    document.body.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/scripts/swipe.ts

@@ -0,0 +1,129 @@
+type calls = {
+  up: () => void;
+  down: () => void;
+  right: () => void;
+  left: () => void;
+  touch: () => void;
+};
+
+export default function swipe(item: calls) {
+  let caller: calls;
+  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: TouchEvent) {
+    startX = e.changedTouches[0].screenX;
+    startY = e.changedTouches[0].screenY;
+  }
+
+  function handleTouchEnd(e: TouchEvent) {
+    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);
+        }
+      }
+    }
+  }
+
+  document.body.addEventListener("touchstart", handleTouchStart);
+  document.body.addEventListener("touchend", handleTouchEnd);
+
+  const callback = {
+    touch(callback: () => void) {
+      return callback();
+    },
+    right(callback: () => void) {
+      return callback();
+    },
+
+    left(callback: () => void) {
+      return callback();
+    },
+
+    down(callback: () => void) {
+      return callback();
+    },
+
+    up(callback: () => void) {
+      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/scripts/widget.d.ts

@@ -0,0 +1,2 @@
+declare const w: (...childrens: HTMLElement[] | ((el: Record<string, string>) => HTMLElement)[]) => () => DocumentFragment;
+export default w;