yet-another-js-utils 1.1.4 → 1.1.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/yaju.min.js +1 -1
- package/js-utils.js +24 -6
- package/out.js +26 -3
- package/out.js.map +2 -2
- package/package.json +1 -1
package/dist/yaju.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";(()=>{var
|
|
1
|
+
"use strict";(()=>{var g=(e,t)=>()=>(t||e((t={exports:{}}).exports,t),t.exports);var h=g((T,l)=>{"use strict";l.exports={nil(e){return e===null||typeof e>"u"},hack(e,t,r){return e.slice(t,r+1)},pick(e,t){return e.filter(t)},prune(e,t){return e.filter(function(r){return!t(r)})},check(e,t){return e.every(t)},escape(e){return e.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""").replace(/'/g,"'")},html(e){let t=e[0],r=Math.max(e.length,arguments.length-1);for(let n=1;n<r;n++)t+=arguments[n],t+=e[n];return t},diffVDomAndUpdate(e,t,r){let n=this;n.changedNodes=[];let s=e.childNodes,i=t.childNodes,d=r.childNodes;if(d.length>i.length){let a=d.length-i.length;for(let u=0,o=a;u<o;u++)r.lastChild.remove()}for(let a=0,u=i.length;a<u;a++)if(s[a]){if(s[a].outerHTML!==i[a].outerHTML){let o=["AREA","BASE","BR","COL","EMBED","HR","IMG","INPUT","LINK","META","PARAM","SOURCE","TRACK","WBR"],f=0;if(o.indexOf(i[a].tagName)===-1&&(f=3+i[a].tagName.length),s[a].tagName!==i[a].tagName||s[a].innerHTML===i[a].innerHTML||s[a].outerHTML.slice(-1*s.innerHTML.length-f)!==i[a].outerHTML.slice(-1*i.innerHTML.length-f)){let p=i[a].cloneNode(!0);n.changedNodes.push(p),d[a].replaceWith(p)}else this.diffVDomAndUpdate(s[a],i[a],d[a])}}else{let o=i[a].cloneNode(!0);n.changedNodes.push(o),r.appendChild(o)}},addDataState(e,t){let r=[];e.dataset.state&&e.dataset.state.indexOf(" ")>-1?r=e.dataset.state.split(" "):r=[e.dataset.state],r.indexOf(t)===-1&&(r.push(t),e.dataset.state=r.join(" "))},removeDataState(e,t){let r=[];e.dataset.state&&e.dataset.state.indexOf(" ")>-1?r=e.dataset.state.split(" "):r=[e.dataset.state],e.dataset.state=r.filter(n=>n!==t).join(" ")},replaceDataState(e,t,r){this.removeDataState(e,t),this.addDataState(e,r)},toggleDataState(e,t){e.dataset.state.split(" ").indexOf(t)==-1?this.addDataState(e,t):this.removeDataState(e,t)},resetDataState(e){e.dataset.state=""},ajaxGet(e,t,r,n){var s=new XMLHttpRequest;s.open("GET",e),s.addEventListener("load",function(){if(s.status>=200&&s.status<400)if(r){var i={};try{i=JSON.parse(s.responseText)}catch{console.error("Get request returned invalid JSON.")}n===void 0?t(i):t.apply(n,[i])}else n===void 0?t(s.responseText):t.apply(n,[s.responseText]);else console.error(s.status+" "+s.statusText+" "+e)}),s.addEventListener("error",function(){console.error("Network error trying to access: "+e)}),s.send(null)},ajaxPost(e,t,r,n,s,i,d){var a=new XMLHttpRequest;a.open("POST",e),a.addEventListener("load",function(){a.status>=200&&a.status<400?i===void 0?r(a):r.apply(i,[a]):(d===void 0?n(a):n.apply(d,[a]),console.error(a.status+" "+a.statusText+" "+e))}),a.addEventListener("error",function(){console.error("Network error trying to access: "+e)}),s&&(a.setRequestHeader("Content-Type","application/json"),t=JSON.stringify(t)),a.send(t)},pipe(e,...t){return t.reduce((r,n)=>n(r),e)}}});(function(){window.yaju=h()})();})();
|
package/js-utils.js
CHANGED
|
@@ -137,12 +137,30 @@ module.exports = {
|
|
|
137
137
|
let node = rightItems[i].cloneNode(true);
|
|
138
138
|
$.changedNodes.push(node);
|
|
139
139
|
dom.appendChild(node);
|
|
140
|
-
} else if (
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
140
|
+
} else if (leftItems[i].outerHTML !== rightItems[i].outerHTML) {
|
|
141
|
+
let voidElementsList = [
|
|
142
|
+
'AREA', 'BASE', 'BR', 'COL', 'EMBED', 'HR', 'IMG', 'INPUT', 'LINK', 'META', 'PARAM', 'SOURCE',
|
|
143
|
+
'TRACK', 'WBR'
|
|
144
|
+
],
|
|
145
|
+
closingTagLength = 0;
|
|
146
|
+
if (voidElementsList.indexOf(rightItems[i].tagName) === -1) {
|
|
147
|
+
closingTagLength = 3 + rightItems[i].tagName.length;
|
|
148
|
+
}
|
|
149
|
+
if (
|
|
150
|
+
leftItems[i].tagName !== rightItems[i].tagName
|
|
151
|
+
|| leftItems[i].innerHTML === rightItems[i].innerHTML
|
|
152
|
+
|| (
|
|
153
|
+
leftItems[i].outerHTML.slice((-1 * leftItems.innerHTML.length) - closingTagLength)
|
|
154
|
+
!== rightItems[i].outerHTML.slice((-1 * rightItems.innerHTML.length) - closingTagLength)
|
|
155
|
+
)
|
|
156
|
+
) {
|
|
157
|
+
let node = rightItems[i].cloneNode(true);
|
|
158
|
+
$.changedNodes.push(node);
|
|
159
|
+
domItems[i].replaceWith(node);
|
|
160
|
+
} else {
|
|
161
|
+
// Same container, different contents
|
|
162
|
+
this.diffVDomAndUpdate(leftItems[i], rightItems[i], domItems[i]);
|
|
163
|
+
}
|
|
146
164
|
}
|
|
147
165
|
}
|
|
148
166
|
},
|
package/out.js
CHANGED
|
@@ -123,9 +123,32 @@
|
|
|
123
123
|
$.changedNodes.push(node);
|
|
124
124
|
dom.appendChild(node);
|
|
125
125
|
} else if (leftItems[i].outerHTML !== rightItems[i].outerHTML) {
|
|
126
|
-
let
|
|
127
|
-
|
|
128
|
-
|
|
126
|
+
let voidElementsList = [
|
|
127
|
+
"AREA",
|
|
128
|
+
"BASE",
|
|
129
|
+
"BR",
|
|
130
|
+
"COL",
|
|
131
|
+
"EMBED",
|
|
132
|
+
"HR",
|
|
133
|
+
"IMG",
|
|
134
|
+
"INPUT",
|
|
135
|
+
"LINK",
|
|
136
|
+
"META",
|
|
137
|
+
"PARAM",
|
|
138
|
+
"SOURCE",
|
|
139
|
+
"TRACK",
|
|
140
|
+
"WBR"
|
|
141
|
+
], closingTagLength = 0;
|
|
142
|
+
if (voidElementsList.indexOf(rightItems[i].tagName) === -1) {
|
|
143
|
+
closingTagLength = 3 + rightItems[i].tagName.length;
|
|
144
|
+
}
|
|
145
|
+
if (leftItems[i].tagName !== rightItems[i].tagName || leftItems[i].innerHTML === rightItems[i].innerHTML || leftItems[i].outerHTML.slice(-1 * leftItems.innerHTML.length - closingTagLength) !== rightItems[i].outerHTML.slice(-1 * rightItems.innerHTML.length - closingTagLength)) {
|
|
146
|
+
let node = rightItems[i].cloneNode(true);
|
|
147
|
+
$.changedNodes.push(node);
|
|
148
|
+
domItems[i].replaceWith(node);
|
|
149
|
+
} else {
|
|
150
|
+
this.diffVDomAndUpdate(leftItems[i], rightItems[i], domItems[i]);
|
|
151
|
+
}
|
|
129
152
|
}
|
|
130
153
|
}
|
|
131
154
|
},
|
package/out.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["js-utils.js", "main.js"],
|
|
4
|
-
"sourcesContent": ["module.exports = {\r\n // # Nil\r\n\r\n // I like the NOT operator\r\n // I like strict type checking\r\n // Hence a strictly typed equivalent:\r\n // - 3-letters name n\r\n // - single argument\r\n\r\n /**\r\n * Nil\r\n * Either null or undefined\r\n * @param { boolean } exp\r\n * @returns { boolean }\r\n */\r\n nil(exp) { // values implicitly considered functions\r\n if (\r\n exp === null\r\n || typeof exp === 'undefined'\r\n ) {\r\n return true;\r\n }\r\n return false;\r\n },\r\n\r\n // # Hack\r\n\r\n // .slice() uses a closed-open interval\r\n // the mathematical convention goes closed-closed\r\n\r\n /**\r\n * Hack\r\n * @param { number } start\r\n * @param { number } end\r\n * @returns\r\n */\r\n hack(array, start, end) {\r\n return array.slice(start, end + 1);\r\n },\r\n\r\n // # Prune/Pick\r\n\r\n // Javascript inherited spreadsheet-like .filter()\r\n // It felt confusing there\r\n // It feels confusing here too\r\n\r\n /**\r\n * Pick\r\n * @param {*} array\r\n * @param {*} pruningFunction\r\n * @returns\r\n */\r\n pick(array, pruningFunction) {\r\n return array.filter(pruningFunction);\r\n },\r\n\r\n /**\r\n * Prune\r\n * The inverse of filter()\r\n * @param {*} array\r\n * @param {*} filteringFunction\r\n * @returns\r\n */\r\n prune(array, filteringFunction) {\r\n return array.filter(function (x) {\r\n return !filteringFunction(x);\r\n });\r\n },\r\n\r\n // # Check\r\n\r\n // .every() just sounds weird\r\n /**\r\n * Check\r\n * @param {*} array\r\n * @param {*} checkingFunction\r\n * @returns\r\n */\r\n check(array, checkingFunction) {\r\n return array.every(checkingFunction);\r\n },\r\n\r\n /**\r\n * Escape\r\n * @param { string } string\r\n * @returns\r\n */\r\n escape(string) {\r\n return string\r\n .replace(/&/g, '&')\r\n .replace(/</g, '<')\r\n .replace(/>/g, '>')\r\n .replace(/\"/g, '"')\r\n .replace(/'/g, ''');\r\n },\r\n\r\n /**\r\n * DOM-rendering template tag\r\n * @param {Array} strings\r\n * @returns {object} a DocumentFragment\r\n */\r\n html(strings) {\r\n let output = strings[0], // assumes empty string start?\r\n max = Math.max(strings.length, arguments.length - 1);\r\n for (let i = 1; i < max; i++) {\r\n output += arguments[i];\r\n output += strings[i];\r\n }\r\n return output;\r\n },\r\n\r\n /**\r\n * Basic contents updater\r\n * Assuming:\r\n * - Rendering applied event-listeners already\r\n * - You can apply state afterwards\r\n * - You can store newRender afterwards\r\n * @param {object} previousRender\r\n * @param {object} newRender\r\n * @param {object} dom\r\n */\r\n diffVDomAndUpdate(previousRender, newRender, dom) {\r\n // Assuming overwrite or insertion\r\n let $ = this;\r\n $.changedNodes = [];\r\n let leftItems = previousRender.childNodes,\r\n rightItems = newRender.childNodes,\r\n domItems = dom.childNodes;\r\n if (domItems.length > rightItems.length) {\r\n let diffLength = domItems.length - rightItems.length;\r\n for (let i = 0, c = diffLength; i < c; i++) {\r\n dom.lastChild.remove();\r\n }\r\n }\r\n for (let i = 0, c = rightItems.length; i < c; i++) {\r\n if (!leftItems[i]) {\r\n let node = rightItems[i].cloneNode(true);\r\n $.changedNodes.push(node);\r\n dom.appendChild(node);\r\n } else if (\r\n leftItems[i].outerHTML !== rightItems[i].outerHTML\r\n ) {\r\n let node = rightItems[i].cloneNode(true);\r\n $.changedNodes.push(node);\r\n domItems[i].replaceWith(node);\r\n }\r\n }\r\n },\r\n\r\n // # DATA-STATE\r\n\r\n // Alternative CSS state management\r\n // - using data-attributes instead of classes\r\n // - easier to match model and vue\r\n // - dataset over classlist allows specialization\r\n // - classes work as booleans (\".walked\")\r\n // - you need to notice abscence\r\n // - data-state work as a string type you can dedicate to store state only, and more than one state\r\n\r\n /**\r\n * Add\r\n * @param { object } element\r\n * @param { string } state\r\n */\r\n addDataState(element, state) {\r\n let stateArray = [];\r\n if (\r\n element.dataset.state\r\n && element.dataset.state.indexOf(' ') > -1\r\n ) {\r\n stateArray = element.dataset.state.split(' ');\r\n } else {\r\n stateArray = [element.dataset.state];\r\n }\r\n if (stateArray.indexOf(state) === -1) {\r\n stateArray.push(state);\r\n element.dataset.state = stateArray.join(' ');\r\n }\r\n },\r\n\r\n /**\r\n * Remove\r\n * @param { object } element\r\n * @param { string } state\r\n */\r\n removeDataState(element, state) {\r\n let stateArray = [];\r\n if (\r\n element.dataset.state\r\n && element.dataset.state.indexOf(' ') > -1\r\n ) {\r\n stateArray = element.dataset.state.split(' ');\r\n } else {\r\n stateArray = [element.dataset.state];\r\n }\r\n element.dataset.state =\r\n stateArray\r\n .filter(element => (element !== state))\r\n .join(' ');\r\n },\r\n\r\n /**\r\n * Replace\r\n * @param { object } element\r\n * @param { string } stateToRemove\r\n * @param { string } stateToAdd\r\n */\r\n replaceDataState(element, stateToRemove, stateToAdd) {\r\n this.removeDataState(element, stateToRemove);\r\n this.addDataState(element, stateToAdd);\r\n },\r\n\r\n /**\r\n * Toggle\r\n * @param { object } element\r\n * @param { string } state\r\n */\r\n toggleDataState(element, state) {\r\n let stateArray = element.dataset.state.split(' ');\r\n if (stateArray.indexOf(state) == -1) {\r\n this.addDataState(element, state);\r\n } else {\r\n this.removeDataState(element, state);\r\n }\r\n },\r\n\r\n /**\r\n * Reset\r\n * @param { object } element\r\n */\r\n resetDataState(element) {\r\n element.dataset.state = '';\r\n },\r\n\r\n //# AJAX Functions\r\n\r\n /**\r\n * AJAX GET\r\n * @param {string} url The target url\r\n * @param {function} callback\r\n * @param {boolean} isJson Response contains json\r\n * @param {object} callbackContext\r\n */\r\n ajaxGet(url, callback, isJson, callbackContext) {\r\n var req = new XMLHttpRequest();\r\n req.open(\"GET\", url);\r\n req.addEventListener(\"load\", function () {\r\n if (req.status >= 200 && req.status < 400) {\r\n if (isJson) {\r\n var json = {};\r\n try {\r\n json = JSON.parse(req.responseText);\r\n } catch (error) {\r\n console.error(\"Get request returned invalid JSON.\")\r\n }\r\n callbackContext === undefined ? callback(json) : callback.apply(callbackContext, [json]);\r\n } else {\r\n callbackContext === undefined ? callback(req.responseText) : callback.apply(callbackContext, [req.responseText]);\r\n }\r\n } else {\r\n console.error(req.status + \" \" + req.statusText + \" \" + url);\r\n }\r\n });\r\n req.addEventListener(\"error\", function () {\r\n console.error(\"Network error trying to access: \" + url);\r\n });\r\n req.send(null);\r\n },\r\n\r\n /**\r\n * AJAX POST\r\n * @param {string} url\r\n * @param {string} data\r\n * @param {function} successCallback\r\n * @param {function} failureCallback\r\n * @param {boolean} isJson\r\n * @param {object} successCallbackContext\r\n * @param {object} failureCallbackContext\r\n */\r\n ajaxPost(url, data, successCallback, failureCallback, isJson, successCallbackContext, failureCallbackContext) {\r\n var req = new XMLHttpRequest();\r\n req.open(\"POST\", url);\r\n req.addEventListener(\"load\", function () {\r\n if (req.status >= 200 && req.status < 400) {\r\n successCallbackContext === undefined ? successCallback(req) : successCallback.apply(successCallbackContext, [req]);\r\n } else {\r\n failureCallbackContext === undefined ? failureCallback(req) : failureCallback.apply(failureCallbackContext, [req]);\r\n console.error(req.status + \" \" + req.statusText + \" \" + url);\r\n }\r\n });\r\n req.addEventListener(\"error\", function () {\r\n console.error(\"Network error trying to access: \" + url);\r\n });\r\n if (isJson) {\r\n req.setRequestHeader(\"Content-Type\", \"application/json\");\r\n data = JSON.stringify(data);\r\n }\r\n req.send(data);\r\n },\r\n\r\n /**\r\n * Pipe\r\n * Function piping with initial input\r\n * @param {*} functions\r\n * @param {*} input\r\n * @returns {*}\r\n */\r\n pipe(input, ...functions) {\r\n return functions.reduce((res, fun) => fun(res), input);\r\n }\r\n}\r\n", "(function () {\r\n window.yaju = require('./js-utils.js');\r\n})();\r\n"],
|
|
5
|
-
"mappings": ";;;;;;;;AAAA;AAAA;AAAA;AAAA,aAAO,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAeb,IAAI,KAAK;AACL,cACI,QAAQ,QACL,OAAO,QAAQ,aACpB;AACE,mBAAO;AAAA,UACX;AACA,iBAAO;AAAA,QACX;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAaA,KAAK,OAAO,OAAO,KAAK;AACpB,iBAAO,MAAM,MAAM,OAAO,MAAM,CAAC;AAAA,QACrC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAcA,KAAK,OAAO,iBAAiB;AACzB,iBAAO,MAAM,OAAO,eAAe;AAAA,QACvC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QASA,MAAM,OAAO,mBAAmB;AAC5B,iBAAO,MAAM,OAAO,SAAU,GAAG;AAC7B,mBAAO,CAAC,kBAAkB,CAAC;AAAA,UAC/B,CAAC;AAAA,QACL;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAWA,MAAM,OAAO,kBAAkB;AAC3B,iBAAO,MAAM,MAAM,gBAAgB;AAAA,QACvC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAOA,OAAO,QAAQ;AACX,iBAAO,OACF,QAAQ,MAAM,OAAO,EACrB,QAAQ,MAAM,MAAM,EACpB,QAAQ,MAAM,MAAM,EACpB,QAAQ,MAAM,QAAQ,EACtB,QAAQ,MAAM,QAAQ;AAAA,QAC/B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAOA,KAAK,SAAS;AACV,cAAI,SAAS,QAAQ,CAAC,GAClB,MAAM,KAAK,IAAI,QAAQ,QAAQ,UAAU,SAAS,CAAC;AACvD,mBAAS,IAAI,GAAG,IAAI,KAAK,KAAK;AAC1B,sBAAU,UAAU,CAAC;AACrB,sBAAU,QAAQ,CAAC;AAAA,UACvB;AACA,iBAAO;AAAA,QACX;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAYA,kBAAkB,gBAAgB,WAAW,KAAK;AAE9C,cAAI,IAAK;AACT,YAAE,eAAe,CAAC;AAClB,cAAI,YAAY,eAAe,YAC3B,aAAa,UAAU,YACvB,WAAW,IAAI;AACnB,cAAI,SAAS,SAAS,WAAW,QAAQ;AACrC,gBAAI,aAAa,SAAS,SAAS,WAAW;AAC9C,qBAAS,IAAI,GAAG,IAAI,YAAY,IAAI,GAAG,KAAK;AACxC,kBAAI,UAAU,OAAO;AAAA,YACzB;AAAA,UACJ;AACA,mBAAS,IAAI,GAAG,IAAI,WAAW,QAAQ,IAAI,GAAG,KAAK;AAC/C,gBAAI,CAAC,UAAU,CAAC,GAAG;AACf,kBAAI,OAAO,WAAW,CAAC,EAAE,UAAU,IAAI;AACvC,gBAAE,aAAa,KAAK,IAAI;AACxB,kBAAI,YAAY,IAAI;AAAA,YACxB,
|
|
4
|
+
"sourcesContent": ["module.exports = {\r\n // # Nil\r\n\r\n // I like the NOT operator\r\n // I like strict type checking\r\n // Hence a strictly typed equivalent:\r\n // - 3-letters name n\r\n // - single argument\r\n\r\n /**\r\n * Nil\r\n * Either null or undefined\r\n * @param { boolean } exp\r\n * @returns { boolean }\r\n */\r\n nil(exp) { // values implicitly considered functions\r\n if (\r\n exp === null\r\n || typeof exp === 'undefined'\r\n ) {\r\n return true;\r\n }\r\n return false;\r\n },\r\n\r\n // # Hack\r\n\r\n // .slice() uses a closed-open interval\r\n // the mathematical convention goes closed-closed\r\n\r\n /**\r\n * Hack\r\n * @param { number } start\r\n * @param { number } end\r\n * @returns\r\n */\r\n hack(array, start, end) {\r\n return array.slice(start, end + 1);\r\n },\r\n\r\n // # Prune/Pick\r\n\r\n // Javascript inherited spreadsheet-like .filter()\r\n // It felt confusing there\r\n // It feels confusing here too\r\n\r\n /**\r\n * Pick\r\n * @param {*} array\r\n * @param {*} pruningFunction\r\n * @returns\r\n */\r\n pick(array, pruningFunction) {\r\n return array.filter(pruningFunction);\r\n },\r\n\r\n /**\r\n * Prune\r\n * The inverse of filter()\r\n * @param {*} array\r\n * @param {*} filteringFunction\r\n * @returns\r\n */\r\n prune(array, filteringFunction) {\r\n return array.filter(function (x) {\r\n return !filteringFunction(x);\r\n });\r\n },\r\n\r\n // # Check\r\n\r\n // .every() just sounds weird\r\n /**\r\n * Check\r\n * @param {*} array\r\n * @param {*} checkingFunction\r\n * @returns\r\n */\r\n check(array, checkingFunction) {\r\n return array.every(checkingFunction);\r\n },\r\n\r\n /**\r\n * Escape\r\n * @param { string } string\r\n * @returns\r\n */\r\n escape(string) {\r\n return string\r\n .replace(/&/g, '&')\r\n .replace(/</g, '<')\r\n .replace(/>/g, '>')\r\n .replace(/\"/g, '"')\r\n .replace(/'/g, ''');\r\n },\r\n\r\n /**\r\n * DOM-rendering template tag\r\n * @param {Array} strings\r\n * @returns {object} a DocumentFragment\r\n */\r\n html(strings) {\r\n let output = strings[0], // assumes empty string start?\r\n max = Math.max(strings.length, arguments.length - 1);\r\n for (let i = 1; i < max; i++) {\r\n output += arguments[i];\r\n output += strings[i];\r\n }\r\n return output;\r\n },\r\n\r\n /**\r\n * Basic contents updater\r\n * Assuming:\r\n * - Rendering applied event-listeners already\r\n * - You can apply state afterwards\r\n * - You can store newRender afterwards\r\n * @param {object} previousRender\r\n * @param {object} newRender\r\n * @param {object} dom\r\n */\r\n diffVDomAndUpdate(previousRender, newRender, dom) {\r\n // Assuming overwrite or insertion\r\n let $ = this;\r\n $.changedNodes = [];\r\n let leftItems = previousRender.childNodes,\r\n rightItems = newRender.childNodes,\r\n domItems = dom.childNodes;\r\n if (domItems.length > rightItems.length) {\r\n let diffLength = domItems.length - rightItems.length;\r\n for (let i = 0, c = diffLength; i < c; i++) {\r\n dom.lastChild.remove();\r\n }\r\n }\r\n for (let i = 0, c = rightItems.length; i < c; i++) {\r\n if (!leftItems[i]) {\r\n let node = rightItems[i].cloneNode(true);\r\n $.changedNodes.push(node);\r\n dom.appendChild(node);\r\n } else if (leftItems[i].outerHTML !== rightItems[i].outerHTML) {\r\n let voidElementsList = [\r\n 'AREA', 'BASE', 'BR', 'COL', 'EMBED', 'HR', 'IMG', 'INPUT', 'LINK', 'META', 'PARAM', 'SOURCE',\r\n 'TRACK', 'WBR'\r\n ],\r\n closingTagLength = 0;\r\n if (voidElementsList.indexOf(rightItems[i].tagName) === -1) {\r\n closingTagLength = 3 + rightItems[i].tagName.length;\r\n }\r\n if (\r\n leftItems[i].tagName !== rightItems[i].tagName\r\n || leftItems[i].innerHTML === rightItems[i].innerHTML\r\n || (\r\n leftItems[i].outerHTML.slice((-1 * leftItems.innerHTML.length) - closingTagLength)\r\n !== rightItems[i].outerHTML.slice((-1 * rightItems.innerHTML.length) - closingTagLength)\r\n )\r\n ) {\r\n let node = rightItems[i].cloneNode(true);\r\n $.changedNodes.push(node);\r\n domItems[i].replaceWith(node);\r\n } else {\r\n // Same container, different contents\r\n this.diffVDomAndUpdate(leftItems[i], rightItems[i], domItems[i]);\r\n }\r\n }\r\n }\r\n },\r\n\r\n // # DATA-STATE\r\n\r\n // Alternative CSS state management\r\n // - using data-attributes instead of classes\r\n // - easier to match model and vue\r\n // - dataset over classlist allows specialization\r\n // - classes work as booleans (\".walked\")\r\n // - you need to notice abscence\r\n // - data-state work as a string type you can dedicate to store state only, and more than one state\r\n\r\n /**\r\n * Add\r\n * @param { object } element\r\n * @param { string } state\r\n */\r\n addDataState(element, state) {\r\n let stateArray = [];\r\n if (\r\n element.dataset.state\r\n && element.dataset.state.indexOf(' ') > -1\r\n ) {\r\n stateArray = element.dataset.state.split(' ');\r\n } else {\r\n stateArray = [element.dataset.state];\r\n }\r\n if (stateArray.indexOf(state) === -1) {\r\n stateArray.push(state);\r\n element.dataset.state = stateArray.join(' ');\r\n }\r\n },\r\n\r\n /**\r\n * Remove\r\n * @param { object } element\r\n * @param { string } state\r\n */\r\n removeDataState(element, state) {\r\n let stateArray = [];\r\n if (\r\n element.dataset.state\r\n && element.dataset.state.indexOf(' ') > -1\r\n ) {\r\n stateArray = element.dataset.state.split(' ');\r\n } else {\r\n stateArray = [element.dataset.state];\r\n }\r\n element.dataset.state =\r\n stateArray\r\n .filter(element => (element !== state))\r\n .join(' ');\r\n },\r\n\r\n /**\r\n * Replace\r\n * @param { object } element\r\n * @param { string } stateToRemove\r\n * @param { string } stateToAdd\r\n */\r\n replaceDataState(element, stateToRemove, stateToAdd) {\r\n this.removeDataState(element, stateToRemove);\r\n this.addDataState(element, stateToAdd);\r\n },\r\n\r\n /**\r\n * Toggle\r\n * @param { object } element\r\n * @param { string } state\r\n */\r\n toggleDataState(element, state) {\r\n let stateArray = element.dataset.state.split(' ');\r\n if (stateArray.indexOf(state) == -1) {\r\n this.addDataState(element, state);\r\n } else {\r\n this.removeDataState(element, state);\r\n }\r\n },\r\n\r\n /**\r\n * Reset\r\n * @param { object } element\r\n */\r\n resetDataState(element) {\r\n element.dataset.state = '';\r\n },\r\n\r\n //# AJAX Functions\r\n\r\n /**\r\n * AJAX GET\r\n * @param {string} url The target url\r\n * @param {function} callback\r\n * @param {boolean} isJson Response contains json\r\n * @param {object} callbackContext\r\n */\r\n ajaxGet(url, callback, isJson, callbackContext) {\r\n var req = new XMLHttpRequest();\r\n req.open(\"GET\", url);\r\n req.addEventListener(\"load\", function () {\r\n if (req.status >= 200 && req.status < 400) {\r\n if (isJson) {\r\n var json = {};\r\n try {\r\n json = JSON.parse(req.responseText);\r\n } catch (error) {\r\n console.error(\"Get request returned invalid JSON.\")\r\n }\r\n callbackContext === undefined ? callback(json) : callback.apply(callbackContext, [json]);\r\n } else {\r\n callbackContext === undefined ? callback(req.responseText) : callback.apply(callbackContext, [req.responseText]);\r\n }\r\n } else {\r\n console.error(req.status + \" \" + req.statusText + \" \" + url);\r\n }\r\n });\r\n req.addEventListener(\"error\", function () {\r\n console.error(\"Network error trying to access: \" + url);\r\n });\r\n req.send(null);\r\n },\r\n\r\n /**\r\n * AJAX POST\r\n * @param {string} url\r\n * @param {string} data\r\n * @param {function} successCallback\r\n * @param {function} failureCallback\r\n * @param {boolean} isJson\r\n * @param {object} successCallbackContext\r\n * @param {object} failureCallbackContext\r\n */\r\n ajaxPost(url, data, successCallback, failureCallback, isJson, successCallbackContext, failureCallbackContext) {\r\n var req = new XMLHttpRequest();\r\n req.open(\"POST\", url);\r\n req.addEventListener(\"load\", function () {\r\n if (req.status >= 200 && req.status < 400) {\r\n successCallbackContext === undefined ? successCallback(req) : successCallback.apply(successCallbackContext, [req]);\r\n } else {\r\n failureCallbackContext === undefined ? failureCallback(req) : failureCallback.apply(failureCallbackContext, [req]);\r\n console.error(req.status + \" \" + req.statusText + \" \" + url);\r\n }\r\n });\r\n req.addEventListener(\"error\", function () {\r\n console.error(\"Network error trying to access: \" + url);\r\n });\r\n if (isJson) {\r\n req.setRequestHeader(\"Content-Type\", \"application/json\");\r\n data = JSON.stringify(data);\r\n }\r\n req.send(data);\r\n },\r\n\r\n /**\r\n * Pipe\r\n * Function piping with initial input\r\n * @param {*} functions\r\n * @param {*} input\r\n * @returns {*}\r\n */\r\n pipe(input, ...functions) {\r\n return functions.reduce((res, fun) => fun(res), input);\r\n }\r\n}\r\n", "(function () {\r\n window.yaju = require('./js-utils.js');\r\n})();\r\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["element"]
|
|
7
7
|
}
|
package/package.json
CHANGED