[ Add ] Debounce & Throttle utility methods

[ Fix ]  Several detail bugs

Author: TechQuery

.esdoc.json

@@ -13,7 +13,7 @@
                 "test": {
                     "source": "./test",
                     "interfaces": ["describe", "it"],
-                    "includes": ["\\.js$"]
+                    "includes": ["\\.spec\\.js$"]
                 },
                 "manual": {
                     "files": ["./manual/Template.md"]

.gitignore

@@ -1,5 +1,6 @@
 # Node.JS
 node_modules/
+package-lock.json
 
 # Building
 dist/

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "dom-renderer",
-    "version": "0.8.1",
+    "version": "0.9.0",
     "description": "Template engine based on HTML 5, ECMAScript 6 & MVVM",
     "keywords": [
         "template",
@@ -32,40 +32,40 @@
         "pack": "cross-env NODE_ENV=pack  amd-bundle source/index dist/dom-renderer -m",
         "patch": "babel source/DOM/polyfill.js -o dist/polyfill.js",
         "build": "npm run format  &&  npm run lint  &&  npm run pack  &&  npm run patch",
-        "debug": "npm run pack  &&  mocha --inspect-brk",
+        "debug": "npm run pack  &&  mocha --inspect-brk --no-timeouts",
         "test": "npm run build  &&  mocha --exit  &&  esdoc",
         "prepublishOnly": "npm test",
-        "help": "esdoc  &&  web-server docs/ -o"
+        "help": "esdoc  &&  opn docs/index.html"
     },
     "husky": {
         "hooks": {
             "pre-commit": "npm test  &&  git add ."
         }
     },
     "peerDependencies": {
-        "@babel/polyfill": "^7.2.5"
+        "@babel/polyfill": "^7.4.4"
     },
     "devDependencies": {
-        "@babel/cli": "^7.2.3",
-        "@babel/polyfill": "^7.2.5",
-        "@babel/preset-env": "^7.3.4",
-        "@babel/register": "^7.0.0",
-        "amd-bundle": "^1.7.7",
+        "@babel/cli": "^7.4.4",
+        "@babel/polyfill": "^7.4.4",
+        "@babel/preset-env": "^7.4.4",
+        "@babel/register": "^7.4.4",
+        "amd-bundle": "^1.7.8",
         "babel-plugin-inline-import": "^3.0.0",
         "cross-env": "^5.2.0",
         "esdoc": "^1.1.0",
         "esdoc-ecmascript-proposal-plugin": "^1.0.0",
         "esdoc-external-webapi-plugin": "^1.0.0",
         "esdoc-standard-plugin": "^1.0.0",
-        "eslint": "^5.15.1",
-        "husky": "^1.3.1",
-        "jsdom": "^14.0.0",
-        "koapache": "^1.0.6",
-        "mocha": "^6.0.2",
-        "prettier": "^1.16.4",
+        "eslint": "^5.16.0",
+        "husky": "^2.1.0",
+        "jsdom": "^15.0.0",
+        "mocha": "^6.1.4",
+        "opn-cli": "^4.1.0",
+        "prettier": "^1.17.0",
         "should": "^13.2.3",
         "should-sinon": "0.0.6",
-        "sinon": "^7.2.7"
+        "sinon": "^7.3.2"
     },
     "prettier": {
         "tabWidth": 4,

package.json

@@ -129,13 +129,6 @@ export function scanDOM(root, expression, { attribute, text, ...element }) {
     });
 }
 
-/**
- * @return {Promise<Number>} https://developer.mozilla.org/en-US/docs/Web/API/DOMHighResTimeStamp
- */
-export function nextTick() {
-    return new Promise(resolve => self.requestAnimationFrame(resolve));
-}
-
 /**
  * @param {HTMLElement} input
  *

source/DOM/utility.js source/DOM/parser.jssource/DOM/utility.js renamed to source/DOM/parser.js

@@ -30,26 +30,18 @@ const { window } = new JSDOM('', {
  *
  * @return {Promise}
  */
-export function typeIn(input, raw) {
-    return Promise.all(
-        Array.from(
-            raw,
-            data =>
-                new Promise(resolve =>
-                    setTimeout(() => {
-                        input.value += data;
+export async function typeIn(input, raw) {
+    for (let data of raw) {
+        input.value += data;
 
-                        input.dispatchEvent(
-                            new InputEvent('input', {
-                                bubbles: true,
-                                composed: true,
-                                data
-                            })
-                        );
+        input.dispatchEvent(
+            new InputEvent('input', {
+                bubbles: true,
+                composed: true,
+                data
+            })
+        );
 
-                        resolve();
-                    })
-                )
-        )
-    );
+        await new Promise(resolve => setTimeout(resolve));
+    }
 }

source/DOM/polyfill.js

@@ -0,0 +1,54 @@
+/**
+ * @return {Promise<Number>} https://developer.mozilla.org/en-US/docs/Web/API/DOMHighResTimeStamp
+ */
+export function nextTick() {
+    return new Promise(resolve => self.requestAnimationFrame(resolve));
+}
+
+/**
+ * @param {Number} [seconds=0.25]
+ *
+ * @return {Promise} Wait seconds in Macro tasks
+ */
+export function delay(seconds = 0.25) {
+    return new Promise(resolve => setTimeout(resolve, seconds * 1000));
+}
+
+/**
+ * @param {Function} origin
+ * @param {Number}   [interval=0.25] - Seconds
+ *
+ * @return {Function}
+ */
+export function debounce(origin, interval = 0.25) {
+    var timer;
+
+    return function() {
+        clearTimeout(timer);
+
+        timer = setTimeout(
+            origin.bind.apply(origin, [].concat.apply([this], arguments)),
+            interval * 1000
+        );
+    };
+}
+
+/**
+ * @param {Function} origin
+ * @param {Number}   [interval=0.25] - Seconds
+ *
+ * @return {Function} Wrapped function with Result cache
+ */
+export function throttle(origin, interval = 0.25) {
+    var lastTime, lastValue;
+
+    return function() {
+        const now = Date.now();
+
+        if (lastTime && lastTime + interval * 1000 > now) return lastValue;
+
+        lastTime = now;
+
+        return (lastValue = origin.apply(this, arguments));
+    };
+}

source/DOM/timer.js

@@ -1,7 +1,9 @@
-export * from './DOM/utility';
+export * from './DOM/parser';
 
 export * from './DOM/CustomInputEvent';
 
+export * from './DOM/timer';
+
 export { default as Template } from './view/Template';
 
 export { default as Model } from './view/Model';

source/index.js

@@ -1,4 +1,4 @@
-import { nextTick } from '../DOM/utility';
+import { nextTick } from '../DOM/timer';
 
 const view_data = new WeakMap(),
     cache_data = Symbol('Cache data'),

source/view/Model.js

@@ -13,7 +13,6 @@ export default class Template extends Array {
         Object.assign(super(), {
             [template_raw]: raw,
             [template_scope]: scope || [],
-            [template_value]: null,
             onChange: onChange instanceof Function && onChange
         });
 
@@ -27,7 +26,7 @@ export default class Template extends Array {
     }
 
     toString() {
-        return this[template_value] + '';
+        return this[template_value] != null ? this[template_value] + '' : '';
     }
 
     /**
@@ -103,7 +102,7 @@ export default class Template extends Array {
                 return value;
             }
         } catch (error) {
-            console.warn(error);
+            if (template_value in this) console.warn(error);
         }
 
         return '';