From 19ec005283fc1439588604abd5a77cb0bea37a78 Mon Sep 17 00:00:00 2001 From: Chris Blake Date: Tue, 22 Mar 2016 17:28:20 -0400 Subject: [PATCH] Adds the ability for child nodes to be an array of nodes. Prior, something like: l.ul([l.li(null, 'First element'), liItems.map(item => l.li(null, item))]) would not be possible. The programmer's intent is clear, but lmth did not support it without needing to concat the first li element and the array of lis manually. Now, something like the above example works automatically. This is a major change. --- dist/lmth.min.js | 28 ++++++++++++++-------------- lib/index.js | 5 ++++- package.json | 2 +- 3 files changed, 19 insertions(+), 16 deletions(-) diff --git a/dist/lmth.min.js b/dist/lmth.min.js index 7195941..9f3eb7a 100644 --- a/dist/lmth.min.js +++ b/dist/lmth.min.js @@ -1,22 +1,22 @@ !function(e,t){"function"==typeof define&&define.amd?define([],t):"object"==typeof module&&module.exports?module.exports=t():e.lmth=t()}(this,function(){"use strict" -function e(t,n,r,i,s,o,a,l,c){if(!(this instanceof e))throw new Error("Uh-oh. You're creating a new Node without using the `new` keyword. This isn't allowed because Bad Stuff happens when you do that. What you more than likely want is one of the element functions attached to the Node object like so: `lmth.div(...)`. If you actually did want to create a plain node, you should use `Node.new(name, isVoid, id, class, style, listeners, attributes, content, children)` and avoid the manual constructor call with `new` where possible. If you really, really, really did want to create a node with `new`, you can do so like this: `new Node(name, isVoid, class, style, listeners, attributes, content, children)`.") -return this.name=t,this.isVoid=n,this.id=r,this["class"]=i,this.style=s,this.listeners=o,this.attributes=a,this.content=l,this.children=c,this}function t(e){var t=typeof e -return"bool"===t||"number"===t||"string"===t}function n(e){return"[object Object]"===toString.call(e)}function r(e){return t(e)?"primitive":n(e)?"object":Array.isArray(e)?"array":void 0}function i(e){return"[object String]"===toString.call(e)}function s(e,t,n){var r=n[e] -r?r.push(t):n[e]=[].concat(t)}function o(e){var t={id:null,"class":[],style:null,listeners:{}} +function e(t,n,r,i,o,s,a,c,l){if(!(this instanceof e))throw new Error("Uh-oh. You're creating a new Node without using the `new` keyword. This isn't allowed because Bad Stuff happens when you do that. What you more than likely want is one of the element functions attached to the Node object like so: `lmth.div(...)`. If you actually did want to create a plain node, you should use `Node.new(name, isVoid, id, class, style, listeners, attributes, content, children)` and avoid the manual constructor call with `new` where possible. If you really, really, really did want to create a node with `new`, you can do so like this: `new Node(name, isVoid, class, style, listeners, attributes, content, children)`.") +return this.name=t,this.isVoid=n,this.id=r,this["class"]=i,this.style=o,this.listeners=s,this.attributes=a,this.content=c,this.children=l.reduce(function(e,t){return e.concat(t)},[]),this}function t(e){var t=typeof e +return"bool"===t||"number"===t||"string"===t}function n(e){return"[object Object]"===toString.call(e)}function r(e){return t(e)?"primitive":n(e)?"object":Array.isArray(e)?"array":void 0}function i(e){return"[object String]"===toString.call(e)}function o(e,t,n){var r=n[e] +r?r.push(t):n[e]=[].concat(t)}function s(e){var t={id:null,"class":[],style:null,listeners:{}} if(i(e)){var r=e.split(/([#\.][^#\.]+)/) r.forEach(function(e){e.startsWith("#")?t.id=e.substring(1):e.startsWith(".")&&t["class"].push(e.substring(1))})}else n(e)&&(Object.keys(e).forEach(function(n){var r=e[n] -n.startsWith("on")&&("function"==typeof r||Array.isArray(r))?s(n.slice(2),r,t.listeners):t[n]=r}),i(t["class"])?t["class"]=t["class"].split(" "):Array.isArray(t["class"])||(t["class"]=[t["class"]])) -return t}function a(e){return String(e).replace(/&|<|>|"|'/g,function(e){return"&"===e?"&":"<"===e?"<":">"===e?">":'"'===e?""":"'"===e?"'":void 0})}function l(e){return/^(?:allowfullscreen|async|autofocus|autoplay|checked|compact|controls|declare|default|defaultchecked|defaultmuted|defaultselected|defer|disabled|draggable|enabled|formnovalidate|hidden|indeterminate|inert|ismap|itemscope|loop|multiple|muted|nohref|noresize|noshade|novalidate|nowrap|open|pauseonexit|readonly|required|reversed|scoped|seamless|selected|sortable|spellcheck|translate|truespeed|typemustmatch|visible)$/i.test(e)}function c(e,t){var n=l(e) -return n&&t===!0?e+'="'+e+'"':n&&t===!1?"":e+'="'+a(t)+'"'}function u(e){return Object.keys(e).reduce(function(t,n){return t+n+":"+e[n]+";"},"")}return e.prototype.toString=function(){return JSON.stringify(this)},e["new"]=function(t,n,r,i,s,o,a,l,c){return new e(t,n,r,i,s,o,a,l,c)},e.createElement=function(t,n){var s=n.isVoid||!1 -return function(n,a,l){var c="",u={},d=[],f=r(n),h=r(a) -i(n)||"object"===f?u=n:"array"===f&&(d=n),"primitive"===h?c=a:"object"===h?u=a:"array"===h&&(d=a),"array"===r(l)&&(d=l) -var p=o(u),m=p.id,y=p["class"],b=p.style,v=p.listeners -return delete p.id,delete p["class"],delete p.style,delete p.listeners,e["new"](t,s,m,y,b,v,p,c,d)}},e.addElement=function(t,n){e[t]=e.createElement(t,n)},e.elements=["a","abbr","acronym","address","applet","article","aside","audio","b","basefont","bdi","bdo","bgsound","big","blink","blockquote","body","button","canvas","caption","center","cite","code","colgroup","command","content","data","datalist","dd","del","details","dfn","dialog","dir","div","dl","dt","element","em","fieldset","figcaption","figure","font","footer","form","frame","frameset","h1","h2","h3","h4","h5","h6","head","header","hgroup","html","i","iframe","image","ins","isindex","kbd","label","legend","li","listing","main","map","mark","marquee","menu","menuitem","meter","multicol","nav","nobr","noembed","noframes","noscript","object","ol","optgroup","option","output","p","picture","plaintext","pre","progress","q","rp","rt","rtc","ruby","s","samp","script","section","select","shadow","small","spacer","span","strike","strong","style","sub","summary","sup","table","tbody","td","template","textarea","tfoot","th","thead","time","title","tr","tt","u","ul","var","video","xmp"],e.voidElements=["area","base","br","col","embed","hr","img","input","keygen","link","meta","param","source","track","wbr"],e.elements.forEach(function(t){e.addElement(t,{isVoid:!1})}),e.voidElements.forEach(function(t){e.addElement(t,{isVoid:!0})}),e.prototype.on=function(e,t){var n=this -return s(e,t,n.listeners),n},e.freeze=function(t){return e["new"](t.name,t.isVoid,t.id,t["class"],t.style,t.listeners,t.attributes,t.content,[])},e.prototype.transform=function(t){var n=this,r=[t(e.freeze(n))],i=n.children.map(function(e){return e.transform(t)}) +n.startsWith("on")&&("function"==typeof r||Array.isArray(r))?o(n.slice(2),r,t.listeners):t[n]=r}),i(t["class"])?t["class"]=t["class"].split(" "):Array.isArray(t["class"])||(t["class"]=[t["class"]])) +return t}function a(e){return String(e).replace(/&|<|>|"|'/g,function(e){return"&"===e?"&":"<"===e?"<":">"===e?">":'"'===e?""":"'"===e?"'":void 0})}function c(e){return/^(?:allowfullscreen|async|autofocus|autoplay|checked|compact|controls|declare|default|defaultchecked|defaultmuted|defaultselected|defer|disabled|draggable|enabled|formnovalidate|hidden|indeterminate|inert|ismap|itemscope|loop|multiple|muted|nohref|noresize|noshade|novalidate|nowrap|open|pauseonexit|readonly|required|reversed|scoped|seamless|selected|sortable|spellcheck|translate|truespeed|typemustmatch|visible)$/i.test(e)}function l(e,t){var n=c(e) +return n&&t===!0?e+'="'+e+'"':n&&t===!1?"":e+'="'+a(t)+'"'}function u(e){return Object.keys(e).reduce(function(t,n){return t+n+":"+e[n]+";"},"")}return e.prototype.toString=function(){return JSON.stringify(this)},e["new"]=function(t,n,r,i,o,s,a,c,l){return new e(t,n,r,i,o,s,a,c,l)},e.createElement=function(t,n){var o=n.isVoid||!1 +return function(n,a,c){var l="",u={},d=[],f=r(n),h=r(a) +i(n)||"object"===f?u=n:"array"===f&&(d=n),"primitive"===h?l=a:"object"===h?u=a:"array"===h&&(d=a),"array"===r(c)&&(d=c) +var p=s(u),m=p.id,y=p["class"],b=p.style,v=p.listeners +return delete p.id,delete p["class"],delete p.style,delete p.listeners,e["new"](t,o,m,y,b,v,p,l,d)}},e.addElement=function(t,n){e[t]=e.createElement(t,n)},e.elements=["a","abbr","acronym","address","applet","article","aside","audio","b","basefont","bdi","bdo","bgsound","big","blink","blockquote","body","button","canvas","caption","center","cite","code","colgroup","command","content","data","datalist","dd","del","details","dfn","dialog","dir","div","dl","dt","element","em","fieldset","figcaption","figure","font","footer","form","frame","frameset","h1","h2","h3","h4","h5","h6","head","header","hgroup","html","i","iframe","image","ins","isindex","kbd","label","legend","li","listing","main","map","mark","marquee","menu","menuitem","meter","multicol","nav","nobr","noembed","noframes","noscript","object","ol","optgroup","option","output","p","picture","plaintext","pre","progress","q","rp","rt","rtc","ruby","s","samp","script","section","select","shadow","small","spacer","span","strike","strong","style","sub","summary","sup","table","tbody","td","template","textarea","tfoot","th","thead","time","title","tr","tt","u","ul","var","video","xmp"],e.voidElements=["area","base","br","col","embed","hr","img","input","keygen","link","meta","param","source","track","wbr"],e.elements.forEach(function(t){e.addElement(t,{isVoid:!1})}),e.voidElements.forEach(function(t){e.addElement(t,{isVoid:!0})}),e.prototype.on=function(e,t){var n=this +return o(e,t,n.listeners),n},e.freeze=function(t){return e["new"](t.name,t.isVoid,t.id,t["class"],t.style,t.listeners,t.attributes,t.content,[])},e.prototype.transform=function(t){var n=this,r=[t(e.freeze(n))],i=n.children.map(function(e){return e.transform(t)}) return r.concat(i)},e.prototype.toList=function(){var e=this return e.transform(function(e){return e})},e.prototype.traverse=function(t){var n=this,r=t(e.freeze(n)),i=n.children.map(function(e){return e.traverse(t)}) -return r.children=i,r},e.prototype.render=function(){var e=this,t=Object.keys(e.attributes).reduce(function(t,n){return t+" "+c(n,e.attributes[n])},""),n=a(e.content)+e.children.reduce(function(e,t){return e+(i(t)?a(t):t.render())},"") +return r.children=i,r},e.prototype.render=function(){var e=this,t=Object.keys(e.attributes).reduce(function(t,n){return t+" "+l(n,e.attributes[n])},""),n=a(e.content)+e.children.reduce(function(e,t){return e+(i(t)?a(t):t.render())},"") return"<"+e.name+(e.id?' id="'+e.id+'"':"")+(0!==e["class"].length?' class="'+e["class"].join(" ")+'"':"")+(e.style?' style="'+u(e.style)+'"':"")+t+">"+(e.isVoid&&0===e.children.length?"":n+"")},e.renderList=function(e){return e.map(function(e){return e.render()}).join("")},e.prototype.toDOM=function(e){e=e||document var t=this,n=e.createElement(t.name) -return Object.keys(t.attributes).forEach(function(e){var r=t.attributes[e],i=l(e) +return Object.keys(t.attributes).forEach(function(e){var r=t.attributes[e],i=c(e) i&&r===!0?n.setAttribute(e,e):i&&r===!1||n.setAttribute(e,r)}),t.id&&(n.id=t.id),t["class"].length>0&&(n.className=t["class"].join(" ")),t.style&&n.setAttribute("style",u(t.style)),t.listeners&&Object.keys(t.listeners).forEach(function(e){t.listeners[e].forEach(function(t){n.addEventListener(e,t)})}),null!=t.content&&n.appendChild(e.createTextNode(t.content)),t.children.forEach(function(t){n.appendChild(i(t)?e.createTextNode(t):t.toDOM(e))}),n},e.appendListToDOM=function(e,t,n){t.forEach(function(t){e.appendChild(t.toDOM(n))})},e}) diff --git a/lib/index.js b/lib/index.js index 5e90b5f..479b01a 100644 --- a/lib/index.js +++ b/lib/index.js @@ -30,7 +30,10 @@ function Node(name, isVoid, id, class_, style, listeners, attributes, content, c this.listeners = listeners; this.attributes = attributes; this.content = content; - this.children = children; + // Merge child nodes with arrays of child nodes. + this.children = children.reduce(function concatChild(children_, child) { + return children_.concat(child); + }, []); return this; } diff --git a/package.json b/package.json index 0618462..65e2d93 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "lmth", - "version": "6.3.0", + "version": "7.0.0", "description": "A \"type-safe\" HTML DSL for JavaScript environments.", "main": "lib/index.js", "scripts": {