als-document 0.6.0 → 0.6.11

package/document.js

@@ -317,9 +317,10 @@ class HtmlParser {
       });
       this.styles = styles
    }
-   
+
    removeEventStrings() {
-      let eventsWithHtml = this.htmlString.match(/on\w*\s*?\=\s*?["|'|`](.*?(<[^>]*>)(\'|\`).*?)["|'|`]/g)
+      // let eventsWithHtml = this.htmlString.match(/on\w*\s*?\=\s*?["|'|`](.*?(<[^>]*>)(\'|\`).*?)["|'|`]/g)
+      let eventsWithHtml = this.htmlString.match(/\son\w*\s*?\=\s*?\"(.*?)\"/g)
       if(eventsWithHtml !== null) {
          eventsWithHtml.forEach(event => {
             let array = event.split('=')
@@ -334,7 +335,8 @@ class HtmlParser {
 
    parse(htmlString=this.htmlString) {
    // Parse tags
-      let elements = htmlString.match(/<[^>]*>/g)
+      // let elements = htmlString.match(/<[^>]*>/g)
+      let elements = htmlString.match(/<("[^"]*"|'[^']*'|[^'">])*>/g)
       elements.forEach((tag,index) => {
          elements[index] = this.parseElement(tag)
          htmlString = htmlString.replace(tag,`<tag${index}>`)
@@ -568,8 +570,10 @@ class HtmlParser {
       let text = tagString
       let attributes = tagString.match(/(?<=\s)(\w*\-?)*(\s*?\=\s*?\"[\s\S]*?\")?/g)
       if(attributes) attributes.forEach(attribString => {
-         let [name,value] = attribString.split('=')
-         if(value !== undefined && name !== '') {
+         let array = attribString.split('=')
+         let name = array[0]
+         if(array.length>1 && name !== '') {
+            let value = array.filter((v,i) => i>0).join('=')
             value = value.trim().replace(/^\"/,'').replace(/\"$/m,'')
             let eventIndex = value.match(/(?<=\{\{\{\{event\s)(\d*)?/)
             if(eventIndex !== null) {
@@ -601,7 +605,6 @@ class HtmlParser {
       return styles
    }
 }
-
 class Document extends HtmlSelector {
    constructor(html) {
       super(html)

package/document.min.js

@@ -1 +1 @@
-class HtmlSelector{constructor(e){"string"==typeof e?(this.html=new HtmlParser(e),this.elements.forEach((e,t)=>{this.makeSelectable(e)})):console.log("Parameter is not string")}get elements(){return this.html.elements}makeSelectable(e){"tag"==e.type&&"close"!==e.status&&(e.$$=t=>this.$$(t,e.index,e.endIndex),e.$=t=>this.$(t,e.index,e.endIndex))}$(e,t=0,s=this.elements.length){return this.$$(e,t,s,!0)}$$(e,t=0,s=this.elements.length,i=!1){let l=[];return(this.selectors=new Query(e).selectors,this.query=e,this.selectors.forEach(e=>{for(let r=t;r<s;r++){let n=this.elements[r];if(this.checkElement(n,e)&&!l.includes(n)&&l.push(n),i&&1==l.length)break}}),i&&1==l.length)?l[0]:i&&0==l.length?null:l}checkElement(e,t){if(void 0==t)return!0;if(null==e)return!1;let{tag:s,classList:i,attribs:l,id:r,prev:n,ancestors:h,parents:a,prevAny:c}=t;return"close"!=e.status&&"text"!=e.type&&(void 0===r||void 0!=e.id)&&(!r||r===e.id)&&(!s||void 0!=e.tag)&&(!s||s===e.tag)&&(void 0===i||void 0!=e.classList)&&(!(void 0!==i&&Array.isArray(e.classList))||!1!=i.every(t=>e.classList.includes(t)))&&!1!=this.checkAttribs(l,e)&&!1!=this.checkElement(e.prev,n)&&!1!=this.checkAncestors(e.ancestors,h)&&!1!=this.checkParents(e.ancestors,a)&&(!e.parent||!1!=this.prevAny(e.parent.children,e.childIndex,c))}prevAny(e=[],t,s){if((0==e.length||0==t)&&s)return!1;for(let i=t;i>=0;i--)if(this.checkElement(e[i],s))return!0;return!1}checkAncestors(e=[],t=[]){let s=0;if(0==t.length)return!0;let i=e.length-1,l=t.length-1;for(;l>=0;){for(let r=i;r>=0;r--)if(i=r-1,!0==this.checkElement(e[r],t[l])){s++;break}l--}return s==t.length}checkParents(e=[],t=[]){if(0==t.length)return!0;if(e.length<t.length)return!1;let s=e.length-1;for(let i=t.length-1;i>=0;i--){if(!1==this.checkElement(e[s],t[i]))return!1;s--}return!0}checkAttribs(e=[],t){let s=t.attribs,i=Object.keys(s),l=0;if(e)for(let r=0;r<e.length;r++){let{name:n,value:h,check:a}=e[r];if("inner"==n&&void 0!==h&&a&&t.innerText&&a(t.innerText)&&l++,i.includes(n)){if(void 0==h)l++;else if(h&&s[n]){if(!1==a(s[n]))continue;l++}}}return l==e.length}}class Query{static get(e){return new Query(e).selectors}constructor(e){this.query=e,this.selectors=[],this.getQueries(e.split(","))}getQueries(e){e.forEach(e=>{let t=e;e=this.removeSpaces(e),this.stringValues=[],e=e.replace(/\[.*?\]/g,e=>(this.stringValues.push(e),`[${this.stringValues.length-1}]`));let[s,i]=this.splitAndCutLast(e," ");s=this.getFamily(s),i.length>0&&(s.ancestors=i.map(e=>this.getFamily(e))),s.group=t,this.selectors.push(s)})}splitAndCutLast(e,t){let s=e.split(t),i;return 1==s.length?(i=s[0],s=[]):i=s.splice(s.length-1,s.length-1)[0],[i,s]}getFamily(e,t,s,i,l){if(null!==e.match(/\~|\+/)){let[r,n]=this.splitAndCutLast(e,/\~|\+/),h=e.replace(r,"");n.forEach(e=>h=h.replace(e,"")),1==(h=h.match(/\~|\+/g)).length?l=h[0]:h.length>1&&(l=h.splice(h.length-1,h.length-1)[0],n[0]=n.map((e,t)=>(t<n.length-1&&(e+=h[t]),e)).join(""),n[0]=this.getFamily(n[0])),"~"==l?i=n[0]:"+"==l&&(s=n[0]),t=r}else t=e;let a;return s||i?(a=this.getParents(t),s&&(a.prev=this.getParents(s)),i&&(a.prevAny=this.getParents(i))):a=this.getParents(t),a.query!==e&&(a.group=e),a}getParents(e){if("string"!=typeof e)return e;{let[t,s]=this.splitAndCutLast(e,">");return t=this.buildElement(t),(s=s.map(e=>this.buildElement(e))).length>0&&(t.parents=s),t}}buildElement(e,t=null,s=null,i=[]){let l=e;e=(e=(e=e.replace(/\#(\w-?)*/,e=>(t=e.replace(/^\#/,""),""))).replace(/\.(\w-?)*/,e=>(i.push(e.replace(/^\./,"")),""))).replace(/(\w-?)*/,e=>(s=""==e?null:e,""));let r=this.getAttributes(e);return e={query:l},t&&(e.id=t),s&&(e.tag=s),i.length>0&&(e.classList=i),r.length>0&&(e.attribs=r),e}getAttributes(e){let t=this.stringValues.filter((t,s)=>{let i=`[${s}]`;return!!e.match(i)});return t.map(e=>{let t=e,[s,i]=(e=e.replace("[","").replace("]","")).split(/[\~\|\^\$\*]?\=/),l=e.replace(s,"").replace(i,"");return e={query:t},s&&(e.name=s),i&&(e.value=i.trim().replace(/^\"/,"").replace(/\"$/,"")),l&&(e.sign=l,e.check=this.getAttribFn(l).bind(e)),e})}getAttribFn(e){return"="==e?function(e){return e==this.value}:"*="==e?function(e){return!!e.includes(this.value)}:"^="==e?function(e){return!!e.startsWith(this.value)}:"$="==e?function(e){return!!e.endsWith(this.value)}:"|="==e?function(e){return!!(1==e.trim().split(" ").length&&(e.startsWith(this.value)||e.startsWith(this.value+"-")))}:"~="==e?function(e){return!!(1==this.value.trim().split(" ").length&&e.includes(this.value))}:void 0}removeSpaces(e){return e=(e=(e=e.replace(/\s{2}/g," ")).replace(/\s?\^?\$?\|?\~?\*?\=\s*/g,e=>e.trim())).replace(/\s?(\+|\~|\>)\s?/g,e=>e.trim())}}class HtmlParser{static parse(e){return new HtmlParser(e).root}constructor(e=""){this.checkHtml(e)&&(this.indexes=[],this.events=[],this.html=this.htmlString=e,this.htmlString=this.htmlString.replace(/\<\!\-\-([\S\s]*?)\-\-\>/gm,""),this.removeScripts(),this.removeStyles(),this.removeEventStrings(),this.root=this.parse(),this.clean())}clean(){["events","indexes","scripts","styles","htmlString","html"].forEach(e=>{delete this[e]})}checkHtml(e,t=!1){return""==e?console.log("html parameter is empty"):"string"!=typeof e?console.log(`html parameter has to be string. Recieved ${typeof e}`):t=!0,t}removeScripts(e=[]){let t=this.htmlString.match(/\<script(.*?)\>[\S\s]*?\<\/script\>/gm);null!==t&&t.forEach((t,s)=>{let i=t.replace(/^\<script(.*?)\>/,"").replace(/\<\/script\>$/,"");e.push(i),this.htmlString=this.htmlString.replace(i,`{{{{script ${e.length-1}`)}),this.scripts=e}removeStyles(e=[]){let t=this.htmlString.match(/\<style\>[\S\s]*?\<\/style\>/gm);null!==t&&t.forEach((t,s)=>{let i=t.replace(/^\<style\>/,"").replace(/\<\/style\>$/,"");e.push(i),this.htmlString=this.htmlString.replace(i,`{{{{style ${e.length-1}`)}),this.styles=e}removeEventStrings(){let e=this.htmlString.match(/on\w*\s*?\=\s*?["|'|`](.*?(<[^>]*>)(\'|\`).*?)["|'|`]/g);null!==e&&e.forEach(e=>{let t=e.split("=").filter((e,t)=>t>0&&""!==t).join("=");t=t.replace(/^\"/,"").replace(/\"$/,""),this.events.push(t);let s=e.replace(t,`{{{{event ${this.events.length-1}`);this.htmlString=this.htmlString.replace(e,s)})}parse(e=this.htmlString){let t=e.match(/<[^>]*>/g);t.forEach((s,i)=>{t[i]=this.parseElement(s),e=e.replace(s,`<tag${i}>`)});let s=e.match(/tag[\s\S]*?\</g);for(let i=s.length-1;i>=0;i--){let l=s[i],r=l.match(/(\d*)\>/)[1];(l=l.replace(/tag.*\>/,"").slice(0,-1).trim()).length>0&&t.splice(parseInt(r)+1,0,l)}this.elements=t;let n=this.getPairs();return n.level=0,n.elements=this.elements,this.innerHTML(n),n}lookForPair(e,t,s,i){e.parent=s,e.children=[];let{tag:l}=e,r=0,n;for(let h=t+1;h<this.elements.length;h++){let a=this.elements[h];if(a.tag==l){if("close"==a.status){if(0==r){n=h,a.level=i;break}r--}else"open"==a.status&&r++}}return n||(n=t+1),e.endIndex=n,this.getPairs(e,t+1,n,i+1)}getPairs(e={type:"root",children:[]},t=0,s=this.elements.length,i=0,l=0){for(let r=t;r<s;r++){if(this.indexes.includes(r))continue;let n=this.elements[r],h;"string"==typeof n?h=n:"tag"==n.type&&("single"==n.status?(h=n).parent=e:"open"==n.status?h=this.lookForPair(n,r,e,i):n.index=r),this.addChild(e,h,r,i),l++}return e}addScriptsAndStyles(e,t,s){if("script"==e.tag){let i=t.match(/(?<=\{\{\{\{script\s)(\d*)?/);if(null!==i){let l=parseInt(i[0]);"number"==typeof l&&(t=this.scripts[l])}}if("style"==e.tag){let r=t.match(/(?<=\{\{\{\{style\s)(\d*)?/);if(null!==r){let n=parseInt(r[0]);"number"==typeof n&&(t=this.styles[n])}}return this.elements[s]=t,t}addChild(e,t,s,i){"string"==typeof t&&(t={type:"text",text:t=this.addScriptsAndStyles(e,t,s),parent:e},this.elements[s]=t),t&&(delete t.status,"text"!==t.type&&(this.innerHTML(t),this.outerHTML(t),this.innerText(t)),this.getElements(t),this.getAncestors(t),this.getAttribute(t),this.nextAndPrev(t),t.index=s,t.level=i,e.children.push(t)),this.indexes.push(s)}getAttribute(e){e.getAttribute=function(e){let t=Object.keys(this.attribs).filter(t=>t==e);return t.length>0?this.attribs[t[0]]:null}}getAncestors(e){Object.defineProperty(e,"ancestors",{get(){let e=[],t=this.parent;if(t)for(;t.parent;)e.unshift(t),t=t.parent;return e}})}nextAndPrev(e){Object.defineProperty(e,"childIndex",{get(){return this.parent.children.map(e=>e.index).indexOf(this.index)}}),Object.defineProperty(e,"prev",{get(){let e=this.childIndex,t=this.parent.children;return 0==e?null:t[e-1]}}),Object.defineProperty(e,"next",{get(){let e=this.childIndex,t=this.parent.children;return e==t.length-1?null:t[e+1]}})}getElements(e,t=this){"text"!==e.type&&Object.defineProperty(e,"elements",{configurable:!0,get(){let e=isNaN(this.endIndex)?this.index+1:this.endIndex+1;return t.elements.slice(this.index,e)}}),Object.defineProperty(e,"$elements",{configurable:!0,get:()=>t.elements}),Object.defineProperty(e,"root",{configurable:!0,get:()=>t.root}),Object.defineProperty(e,"html",{configurable:!0,get:()=>t})}outerHTML(e){Object.defineProperty(e,"outerHTML",{get(){let{elements:e}=this;return e[0].text+this.innerHTML+e[e.length-1].text}})}innerText(e){Object.defineProperty(e,"innerText",{get:()=>e.children?e.children.map(e=>"text"==e.type?e.text:"").join(""):""})}innerHTML(e){e.tab="   ",e.n="\n",Object.defineProperty(e,"innerHTML",{get(){let{tab:e,n:t}=this,s="",i,l="",{elements:r}=this,n=r.length,h=n-1,a=1;"root"==this.type&&(h=n,a=0);for(let c=a;c<h;c++){let{level:d,text:o}=r[c];void 0==i&&(i=d),c==h?l="":d&&(l=Array.from(Array(d-i).keys()).map(t=>e).join("")),s+=l+o,n>3&&(s+=t)}return s}})}parseElement(e){if("<!DOCTYPE html>"==e)return{tag:"!DOCTYPE html",status:"single",attribs:{},type:"tag",text:e};let t="close",s=e.match(/(?<=\<\/)(\w*\-?)*/);null==s?(s=e.match(/(?<=\<)(\w*\-?)*/))&&(s=s[0],t=HtmlParser.singleTags.includes(s)?"single":"open"):s=s[0];let{classList:i,attribs:l,style:r,id:n,text:h}=this.parseAttributes(e);return{tag:s,status:t,attribs:l,type:"tag",classList:i,text:h,style:r,id:n}}static singleTags=["comment","area","base","br","col","command","embed","hr","img","input","keygen","link","meta","param","source","track","wbr"];parseAttributes(e,t=[],s={},i={},l=null){let r=e,n=e.match(/(?<=\s)(\w*\-?)*(\s*?\=\s*?\"[\s\S]*?\")?/g);return n&&n.forEach(n=>{let[h,a]=n.split("=");if(void 0!==a&&""!==h){let c=(a=a.trim().replace(/^\"/,"").replace(/\"$/m,"")).match(/(?<=\{\{\{\{event\s)(\d*)?/);null!==c&&(a=this.events[c[0]],r=e.replace(`{{{{event ${c[0]}`,a)),"class"==h?t=a.split(/\s\s?\s?/):"style"==h?i=this.parseInlineCss(a):"id"==h&&(l=a),s[h]=a}else""!==h&&(s[h]=void 0)}),{classList:t,attribs:s,style:i,id:l,text:r}}parseInlineCss(e){let t=e.split(";"),s={};return t.forEach(e=>{let[t,i]=e.trim().split(":");""!==e&&(null!==t.match(/\w*\-\w*(-\w*)?/)&&(t=t.split("-").map((e,t)=>0==t?e:e[0].toUpperCase()+e.slice(1)).join("")),s[t]=i.trim())}),s}}class Document extends HtmlSelector{constructor(e){super(e),this.elements.forEach(e=>{this.addMethods(e)})}addMethods(e){"tag"==e.type&&"close"!==e.status&&(this.insert(e),this.buildAttribs(e),this.classlistMethods(e),this.style(e),this.id(e))}id(e,t=this){(void 0===e.id||!Object.getOwnPropertyDescriptor(e,"id").get)&&(null==e.id||void 0!==e.id)&&("string"==typeof e.id&&delete e.id,Object.defineProperty(e,"id",{get(){return this.attribs.id?this.attribs.id:null},set(e){this.attribs.id=e,t.changeElementText(this)}}))}style(e,t={},s=this){void 0!==e.style&&(t={...e.style});let i=e=>e.replace(/[A-Z]/g,e=>`-${e.toLowerCase()}`);e.style=new Proxy(t,{get(e,t,s){return"target"===t?e:Reflect.get(...arguments)},set(t,l,r){t[l]=r,e.attribs.style=Object.keys(t).map(e=>`${i(e)}:${t[e]};`).join(""),s.changeElementText(this)},deleteProperty(t,l){l in t&&(delete t[l],e.attribs.style=Object.keys(t).map(e=>`${i(e)}:${t[e]};`).join("")),s.changeElementText(this)}})}classlistMethods(e,t=this){void 0==e.classList&&(e.classList=[]),e.classList.add=function(s){void 0==e.attribs.class&&(e.attribs.class=""),this.push(s),e.attribs.class+=" "+s,t.changeElementText(this)},e.classList.remove=function(s){this.splice(this.indexOf(s),1),e.attribs.class=this.filter(e=>void 0!==e).join(" "),t.changeElementText(this)},e.classList.toggle=function(e){this.includes(e)?this.remove(e):this.add(e),t.changeElementText(this)}}buildAttribs(e,t=this){e.attr||(e.attr=function(e,s){if(e&&void 0===s)return this.attribs[e];e&&null===s&&!["class","style","id"].includes(e)?delete this.attribs[e]:e&&null!=s&&!["style","id"].includes(e)&&(this.attribs[e]=s,"class"==e&&(this.classList=s.split(" ").filter(e=>" "!==e),t.classlistMethods(this))),t.changeElementText(this)})}insert(e){let t=this;e.insert=function(e,s=0){let i,l=this.$elements;if("string"==typeof e)(e=new HtmlParser(e)).elements.forEach(e=>{t.html.getElements(e),t.makeSelectable(e),t.addMethods(e)}),i=e.elements,e=e.root.children[0];else{let{index:r,endIndex:n}=e,h=isNaN(n-r)?1:n-r+1;i=l.splice(r,h);let{parent:a,childIndex:c}=e;a.children.splice(c,1)}t.rebildElements(l),t.addElement(this,l,e,i,s)},e.remove=function(){let{$elements:e,elements:s,parent:i,childIndex:l,index:r}=this;e.splice(r,s.length),i.children.splice(l,1),i.endIndex=i.endIndex-s.length,t.rebildElements(e)},Object.defineProperty(e,"before",{set(e){this.insert(e,0)}}),Object.defineProperty(e,"after",{set(e){this.insert(e,3)}}),Object.defineProperty(e,"last",{set(e){this.insert(e,2)}}),Object.defineProperty(e,"first",{set(e){this.insert(e,1)}})}addElement(e,t,s,i,l){let{parent:r,level:n,index:h,endIndex:a}=e;0==l?(t.splice(h,0,...i),r.children.splice(e.childIndex,0,s)):3==l?(t.splice(a+1,0,...i),r.children.splice(e.childIndex+1,0,s)):(1==l||2==l)&&(n+=1,r=e,1==l?(t.splice(h+1,0,...i),e.children.unshift(s)):2==l&&(t.splice(a-1,0,...i),e.children.push(s)),e.endIndex=e.endIndex+i.length),this.rebildElements(t),this.rebuildChild(i[0],r,e.html,n)}rebildElements(e){for(let t=0;t<e.length;t++){let{endIndex:s,index:i}=e[t];if(s){let l=s-i;e[t].endIndex=t+l}e[t].index=t}}rebuildChild(e,t,s,i){void 0!==e.endIndex&&(e.elements[e.elements.length-1].level=i),s.getElements(e,s),e.parent=t,e.level=i,e.children&&e.children.length>0&&e.children.forEach(t=>{this.rebuildChild(t,e,s,i+1)})}changeElementText(e){let{type:t,status:s,attribs:i,tag:l}=e;if("tag"==t&&"close"!==s){let r=Object.keys(i);r=r.length>0?" "+r.map(e=>`${e}${i[e]?`="${i[e]}"`:""}`).join(" "):"",e.text=`<${l}${r}>`}}}
+class HtmlSelector{constructor(e){"string"==typeof e?(this.html=new HtmlParser(e),this.elements.forEach((e,t)=>{this.makeSelectable(e)})):console.log("Parameter is not string")}get elements(){return this.html.elements}makeSelectable(e){"tag"==e.type&&"close"!==e.status&&(e.$$=t=>this.$$(t,e.index,e.endIndex),e.$=t=>this.$(t,e.index,e.endIndex))}$(e,t=0,s=this.elements.length){return this.$$(e,t,s,!0)}$$(e,t=0,s=this.elements.length,i=!1){let l=[];return(this.selectors=new Query(e).selectors,this.query=e,this.selectors.forEach(e=>{for(let r=t;r<s;r++){let n=this.elements[r];if(this.checkElement(n,e)&&!l.includes(n)&&l.push(n),i&&1==l.length)break}}),i&&1==l.length)?l[0]:i&&0==l.length?null:l}checkElement(e,t){if(void 0==t)return!0;if(null==e)return!1;let{tag:s,classList:i,attribs:l,id:r,prev:n,ancestors:h,parents:a,prevAny:c}=t;return"close"!=e.status&&"text"!=e.type&&(void 0===r||void 0!=e.id)&&(!r||r===e.id)&&(!s||void 0!=e.tag)&&(!s||s===e.tag)&&(void 0===i||void 0!=e.classList)&&(!(void 0!==i&&Array.isArray(e.classList))||!1!=i.every(t=>e.classList.includes(t)))&&!1!=this.checkAttribs(l,e)&&!1!=this.checkElement(e.prev,n)&&!1!=this.checkAncestors(e.ancestors,h)&&!1!=this.checkParents(e.ancestors,a)&&(!e.parent||!1!=this.prevAny(e.parent.children,e.childIndex,c))}prevAny(e=[],t,s){if((0==e.length||0==t)&&s)return!1;for(let i=t;i>=0;i--)if(this.checkElement(e[i],s))return!0;return!1}checkAncestors(e=[],t=[]){let s=0;if(0==t.length)return!0;let i=e.length-1,l=t.length-1;for(;l>=0;){for(let r=i;r>=0;r--)if(i=r-1,!0==this.checkElement(e[r],t[l])){s++;break}l--}return s==t.length}checkParents(e=[],t=[]){if(0==t.length)return!0;if(e.length<t.length)return!1;let s=e.length-1;for(let i=t.length-1;i>=0;i--){if(!1==this.checkElement(e[s],t[i]))return!1;s--}return!0}checkAttribs(e=[],t){let s=t.attribs,i=Object.keys(s),l=0;if(e)for(let r=0;r<e.length;r++){let{name:n,value:h,check:a}=e[r];if("inner"==n&&void 0!==h&&a&&t.innerText&&a(t.innerText)&&l++,i.includes(n)){if(void 0==h)l++;else if(h&&s[n]){if(!1==a(s[n]))continue;l++}}}return l==e.length}}class Query{static get(e){return new Query(e).selectors}constructor(e){this.query=e,this.selectors=[],this.getQueries(e.split(","))}getQueries(e){e.forEach(e=>{let t=e;e=this.removeSpaces(e),this.stringValues=[],e=e.replace(/\[.*?\]/g,e=>(this.stringValues.push(e),`[${this.stringValues.length-1}]`));let[s,i]=this.splitAndCutLast(e," ");s=this.getFamily(s),i.length>0&&(s.ancestors=i.map(e=>this.getFamily(e))),s.group=t,this.selectors.push(s)})}splitAndCutLast(e,t){let s=e.split(t),i;return 1==s.length?(i=s[0],s=[]):i=s.splice(s.length-1,s.length-1)[0],[i,s]}getFamily(e,t,s,i,l){if(null!==e.match(/\~|\+/)){let[r,n]=this.splitAndCutLast(e,/\~|\+/),h=e.replace(r,"");n.forEach(e=>h=h.replace(e,"")),1==(h=h.match(/\~|\+/g)).length?l=h[0]:h.length>1&&(l=h.splice(h.length-1,h.length-1)[0],n[0]=n.map((e,t)=>(t<n.length-1&&(e+=h[t]),e)).join(""),n[0]=this.getFamily(n[0])),"~"==l?i=n[0]:"+"==l&&(s=n[0]),t=r}else t=e;let a;return s||i?(a=this.getParents(t),s&&(a.prev=this.getParents(s)),i&&(a.prevAny=this.getParents(i))):a=this.getParents(t),a.query!==e&&(a.group=e),a}getParents(e){if("string"!=typeof e)return e;{let[t,s]=this.splitAndCutLast(e,">");return t=this.buildElement(t),(s=s.map(e=>this.buildElement(e))).length>0&&(t.parents=s),t}}buildElement(e,t=null,s=null,i=[]){let l=e;e=(e=(e=e.replace(/\#(\w-?)*/,e=>(t=e.replace(/^\#/,""),""))).replace(/\.(\w-?)*/,e=>(i.push(e.replace(/^\./,"")),""))).replace(/(\w-?)*/,e=>(s=""==e?null:e,""));let r=this.getAttributes(e);return e={query:l},t&&(e.id=t),s&&(e.tag=s),i.length>0&&(e.classList=i),r.length>0&&(e.attribs=r),e}getAttributes(e){let t=this.stringValues.filter((t,s)=>{let i=`[${s}]`;return!!e.match(i)});return t.map(e=>{let t=e,[s,i]=(e=e.replace("[","").replace("]","")).split(/[\~\|\^\$\*]?\=/),l=e.replace(s,"").replace(i,"");return e={query:t},s&&(e.name=s),i&&(e.value=i.trim().replace(/^\"/,"").replace(/\"$/,"")),l&&(e.sign=l,e.check=this.getAttribFn(l).bind(e)),e})}getAttribFn(e){return"="==e?function(e){return e==this.value}:"*="==e?function(e){return!!e.includes(this.value)}:"^="==e?function(e){return!!e.startsWith(this.value)}:"$="==e?function(e){return!!e.endsWith(this.value)}:"|="==e?function(e){return!!(1==e.trim().split(" ").length&&(e.startsWith(this.value)||e.startsWith(this.value+"-")))}:"~="==e?function(e){return!!(1==this.value.trim().split(" ").length&&e.includes(this.value))}:void 0}removeSpaces(e){return e=(e=(e=e.replace(/\s{2}/g," ")).replace(/\s?\^?\$?\|?\~?\*?\=\s*/g,e=>e.trim())).replace(/\s?(\+|\~|\>)\s?/g,e=>e.trim())}}class HtmlParser{static parse(e){return new HtmlParser(e).root}constructor(e=""){this.checkHtml(e)&&(this.indexes=[],this.events=[],this.html=this.htmlString=e,this.htmlString=this.htmlString.replace(/\<\!\-\-([\S\s]*?)\-\-\>/gm,""),this.removeScripts(),this.removeStyles(),this.removeEventStrings(),this.root=this.parse(),this.clean())}clean(){["events","indexes","scripts","styles","htmlString","html"].forEach(e=>{delete this[e]})}checkHtml(e,t=!1){return""==e?console.log("html parameter is empty"):"string"!=typeof e?console.log(`html parameter has to be string. Recieved ${typeof e}`):t=!0,t}removeScripts(e=[]){let t=this.htmlString.match(/\<script(.*?)\>[\S\s]*?\<\/script\>/gm);null!==t&&t.forEach((t,s)=>{let i=t.replace(/^\<script(.*?)\>/,"").replace(/\<\/script\>$/,"");e.push(i),this.htmlString=this.htmlString.replace(i,`{{{{script ${e.length-1}`)}),this.scripts=e}removeStyles(e=[]){let t=this.htmlString.match(/\<style\>[\S\s]*?\<\/style\>/gm);null!==t&&t.forEach((t,s)=>{let i=t.replace(/^\<style\>/,"").replace(/\<\/style\>$/,"");e.push(i),this.htmlString=this.htmlString.replace(i,`{{{{style ${e.length-1}`)}),this.styles=e}removeEventStrings(){let e=this.htmlString.match(/\son\w*\s*?\=\s*?\"(.*?)\"/g);null!==e&&e.forEach(e=>{let t=e.split("=").filter((e,t)=>t>0&&""!==t).join("=");t=t.replace(/^\"/,"").replace(/\"$/,""),this.events.push(t);let s=e.replace(t,`{{{{event ${this.events.length-1}`);this.htmlString=this.htmlString.replace(e,s)})}parse(e=this.htmlString){let t=e.match(/<("[^"]*"|'[^']*'|[^'">])*>/g);t.forEach((s,i)=>{t[i]=this.parseElement(s),e=e.replace(s,`<tag${i}>`)});let s=e.match(/tag[\s\S]*?\</g);for(let i=s.length-1;i>=0;i--){let l=s[i],r=l.match(/(\d*)\>/)[1];(l=l.replace(/tag.*\>/,"").slice(0,-1).trim()).length>0&&t.splice(parseInt(r)+1,0,l)}this.elements=t;let n=this.getPairs();return n.level=0,n.elements=this.elements,this.innerHTML(n),n}lookForPair(e,t,s,i){e.parent=s,e.children=[];let{tag:l}=e,r=0,n;for(let h=t+1;h<this.elements.length;h++){let a=this.elements[h];if(a.tag==l){if("close"==a.status){if(0==r){n=h,a.level=i;break}r--}else"open"==a.status&&r++}}return n||(n=t+1),e.endIndex=n,this.getPairs(e,t+1,n,i+1)}getPairs(e={type:"root",children:[]},t=0,s=this.elements.length,i=0,l=0){for(let r=t;r<s;r++){if(this.indexes.includes(r))continue;let n=this.elements[r],h;"string"==typeof n?h=n:"tag"==n.type&&("single"==n.status?(h=n).parent=e:"open"==n.status?h=this.lookForPair(n,r,e,i):n.index=r),this.addChild(e,h,r,i),l++}return e}addScriptsAndStyles(e,t,s){if("script"==e.tag){let i=t.match(/(?<=\{\{\{\{script\s)(\d*)?/);if(null!==i){let l=parseInt(i[0]);"number"==typeof l&&(t=this.scripts[l])}}if("style"==e.tag){let r=t.match(/(?<=\{\{\{\{style\s)(\d*)?/);if(null!==r){let n=parseInt(r[0]);"number"==typeof n&&(t=this.styles[n])}}return this.elements[s]=t,t}addChild(e,t,s,i){"string"==typeof t&&(t={type:"text",text:t=this.addScriptsAndStyles(e,t,s),parent:e},this.elements[s]=t),t&&(delete t.status,"text"!==t.type&&(this.innerHTML(t),this.outerHTML(t),this.innerText(t)),this.getElements(t),this.getAncestors(t),this.getAttribute(t),this.nextAndPrev(t),t.index=s,t.level=i,e.children.push(t)),this.indexes.push(s)}getAttribute(e){e.getAttribute=function(e){let t=Object.keys(this.attribs).filter(t=>t==e);return t.length>0?this.attribs[t[0]]:null}}getAncestors(e){Object.defineProperty(e,"ancestors",{get(){let e=[],t=this.parent;if(t)for(;t.parent;)e.unshift(t),t=t.parent;return e}})}nextAndPrev(e){Object.defineProperty(e,"childIndex",{get(){return this.parent.children.map(e=>e.index).indexOf(this.index)}}),Object.defineProperty(e,"prev",{get(){let e=this.childIndex,t=this.parent.children;return 0==e?null:t[e-1]}}),Object.defineProperty(e,"next",{get(){let e=this.childIndex,t=this.parent.children;return e==t.length-1?null:t[e+1]}})}getElements(e,t=this){"text"!==e.type&&Object.defineProperty(e,"elements",{configurable:!0,get(){let e=isNaN(this.endIndex)?this.index+1:this.endIndex+1;return t.elements.slice(this.index,e)}}),Object.defineProperty(e,"$elements",{configurable:!0,get:()=>t.elements}),Object.defineProperty(e,"root",{configurable:!0,get:()=>t.root}),Object.defineProperty(e,"html",{configurable:!0,get:()=>t})}outerHTML(e){Object.defineProperty(e,"outerHTML",{get(){let{elements:e}=this;return e[0].text+this.innerHTML+e[e.length-1].text}})}innerText(e){Object.defineProperty(e,"innerText",{get:()=>e.children?e.children.map(e=>"text"==e.type?e.text:"").join(""):""})}innerHTML(e){e.tab="   ",e.n="\n",Object.defineProperty(e,"innerHTML",{get(){let{tab:e,n:t}=this,s="",i,l="",{elements:r}=this,n=r.length,h=n-1,a=1;"root"==this.type&&(h=n,a=0);for(let c=a;c<h;c++){let{level:d,text:o}=r[c];void 0==i&&(i=d),c==h?l="":d&&(l=Array.from(Array(d-i).keys()).map(t=>e).join("")),s+=l+o,n>3&&(s+=t)}return s}})}parseElement(e){if("<!DOCTYPE html>"==e)return{tag:"!DOCTYPE html",status:"single",attribs:{},type:"tag",text:e};let t="close",s=e.match(/(?<=\<\/)(\w*\-?)*/);null==s?(s=e.match(/(?<=\<)(\w*\-?)*/))&&(s=s[0],t=HtmlParser.singleTags.includes(s)?"single":"open"):s=s[0];let{classList:i,attribs:l,style:r,id:n,text:h}=this.parseAttributes(e);return{tag:s,status:t,attribs:l,type:"tag",classList:i,text:h,style:r,id:n}}static singleTags=["comment","area","base","br","col","command","embed","hr","img","input","keygen","link","meta","param","source","track","wbr"];parseAttributes(e,t=[],s={},i={},l=null){let r=e,n=e.match(/(?<=\s)(\w*\-?)*(\s*?\=\s*?\"[\s\S]*?\")?/g);return n&&n.forEach(n=>{let h=n.split("="),a=h[0];if(h.length>1&&""!==a){let c=h.filter((e,t)=>t>0).join("="),d=(c=c.trim().replace(/^\"/,"").replace(/\"$/m,"")).match(/(?<=\{\{\{\{event\s)(\d*)?/);null!==d&&(c=this.events[d[0]],r=e.replace(`{{{{event ${d[0]}`,c)),"class"==a?t=c.split(/\s\s?\s?/):"style"==a?i=this.parseInlineCss(c):"id"==a&&(l=c),s[a]=c}else""!==a&&(s[a]=void 0)}),{classList:t,attribs:s,style:i,id:l,text:r}}parseInlineCss(e){let t=e.split(";"),s={};return t.forEach(e=>{let[t,i]=e.trim().split(":");""!==e&&(null!==t.match(/\w*\-\w*(-\w*)?/)&&(t=t.split("-").map((e,t)=>0==t?e:e[0].toUpperCase()+e.slice(1)).join("")),s[t]=i.trim())}),s}}class Document extends HtmlSelector{constructor(e){super(e),this.elements.forEach(e=>{this.addMethods(e)})}addMethods(e){"tag"==e.type&&"close"!==e.status&&(this.insert(e),this.buildAttribs(e),this.classlistMethods(e),this.style(e),this.id(e))}id(e,t=this){(void 0===e.id||!Object.getOwnPropertyDescriptor(e,"id").get)&&(null==e.id||void 0!==e.id)&&("string"==typeof e.id&&delete e.id,Object.defineProperty(e,"id",{get(){return this.attribs.id?this.attribs.id:null},set(e){this.attribs.id=e,t.changeElementText(this)}}))}style(e,t={},s=this){void 0!==e.style&&(t={...e.style});let i=e=>e.replace(/[A-Z]/g,e=>`-${e.toLowerCase()}`);e.style=new Proxy(t,{get(e,t,s){return"target"===t?e:Reflect.get(...arguments)},set(t,l,r){t[l]=r,e.attribs.style=Object.keys(t).map(e=>`${i(e)}:${t[e]};`).join(""),s.changeElementText(this)},deleteProperty(t,l){l in t&&(delete t[l],e.attribs.style=Object.keys(t).map(e=>`${i(e)}:${t[e]};`).join("")),s.changeElementText(this)}})}classlistMethods(e,t=this){void 0==e.classList&&(e.classList=[]),e.classList.add=function(s){void 0==e.attribs.class&&(e.attribs.class=""),this.push(s),e.attribs.class+=" "+s,t.changeElementText(this)},e.classList.remove=function(s){this.splice(this.indexOf(s),1),e.attribs.class=this.filter(e=>void 0!==e).join(" "),t.changeElementText(this)},e.classList.toggle=function(e){this.includes(e)?this.remove(e):this.add(e),t.changeElementText(this)}}buildAttribs(e,t=this){e.attr||(e.attr=function(e,s){if(e&&void 0===s)return this.attribs[e];e&&null===s&&!["class","style","id"].includes(e)?delete this.attribs[e]:e&&null!=s&&!["style","id"].includes(e)&&(this.attribs[e]=s,"class"==e&&(this.classList=s.split(" ").filter(e=>" "!==e),t.classlistMethods(this))),t.changeElementText(this)})}insert(e){let t=this;e.insert=function(e,s=0){let i,l=this.$elements;if("string"==typeof e)(e=new HtmlParser(e)).elements.forEach(e=>{t.html.getElements(e),t.makeSelectable(e),t.addMethods(e)}),i=e.elements,e=e.root.children[0];else{let{index:r,endIndex:n}=e,h=isNaN(n-r)?1:n-r+1;i=l.splice(r,h);let{parent:a,childIndex:c}=e;a.children.splice(c,1)}t.rebildElements(l),t.addElement(this,l,e,i,s)},e.remove=function(){let{$elements:e,elements:s,parent:i,childIndex:l,index:r}=this;e.splice(r,s.length),i.children.splice(l,1),i.endIndex=i.endIndex-s.length,t.rebildElements(e)},Object.defineProperty(e,"before",{set(e){this.insert(e,0)}}),Object.defineProperty(e,"after",{set(e){this.insert(e,3)}}),Object.defineProperty(e,"last",{set(e){this.insert(e,2)}}),Object.defineProperty(e,"first",{set(e){this.insert(e,1)}})}addElement(e,t,s,i,l){let{parent:r,level:n,index:h,endIndex:a}=e;0==l?(t.splice(h,0,...i),r.children.splice(e.childIndex,0,s)):3==l?(t.splice(a+1,0,...i),r.children.splice(e.childIndex+1,0,s)):(1==l||2==l)&&(n+=1,r=e,1==l?(t.splice(h+1,0,...i),e.children.unshift(s)):2==l&&(t.splice(a-1,0,...i),e.children.push(s)),e.endIndex=e.endIndex+i.length),this.rebildElements(t),this.rebuildChild(i[0],r,e.html,n)}rebildElements(e){for(let t=0;t<e.length;t++){let{endIndex:s,index:i}=e[t];if(s){let l=s-i;e[t].endIndex=t+l}e[t].index=t}}rebuildChild(e,t,s,i){void 0!==e.endIndex&&(e.elements[e.elements.length-1].level=i),s.getElements(e,s),e.parent=t,e.level=i,e.children&&e.children.length>0&&e.children.forEach(t=>{this.rebuildChild(t,e,s,i+1)})}changeElementText(e){let{type:t,status:s,attribs:i,tag:l}=e;if("tag"==t&&"close"!==s){let r=Object.keys(i);r=r.length>0?" "+r.map(e=>`${e}${i[e]?`="${i[e]}"`:""}`).join(" "):"",e.text=`<${l}${r}>`}}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "als-document",
-  "version": "0.6.0",
+  "version": "0.6.11",
   "description": "Build virtual dom from string and manage it, similar you do it on browser",
   "main": "index.js",
   "scripts": {

package/parser/parser.js

@@ -49,9 +49,10 @@ class HtmlParser {
       });
       this.styles = styles
    }
-   
+
    removeEventStrings() {
-      let eventsWithHtml = this.htmlString.match(/on\w*\s*?\=\s*?["|'|`](.*?(<[^>]*>)(\'|\`).*?)["|'|`]/g)
+      // let eventsWithHtml = this.htmlString.match(/on\w*\s*?\=\s*?["|'|`](.*?(<[^>]*>)(\'|\`).*?)["|'|`]/g)
+      let eventsWithHtml = this.htmlString.match(/\son\w*\s*?\=\s*?\"(.*?)\"/g)
       if(eventsWithHtml !== null) {
          eventsWithHtml.forEach(event => {
             let array = event.split('=')
@@ -66,7 +67,8 @@ class HtmlParser {
 
    parse(htmlString=this.htmlString) {
    // Parse tags
-      let elements = htmlString.match(/<[^>]*>/g)
+      // let elements = htmlString.match(/<[^>]*>/g)
+      let elements = htmlString.match(/<("[^"]*"|'[^']*'|[^'">])*>/g)
       elements.forEach((tag,index) => {
          elements[index] = this.parseElement(tag)
          htmlString = htmlString.replace(tag,`<tag${index}>`)
@@ -300,8 +302,10 @@ class HtmlParser {
       let text = tagString
       let attributes = tagString.match(/(?<=\s)(\w*\-?)*(\s*?\=\s*?\"[\s\S]*?\")?/g)
       if(attributes) attributes.forEach(attribString => {
-         let [name,value] = attribString.split('=')
-         if(value !== undefined && name !== '') {
+         let array = attribString.split('=')
+         let name = array[0]
+         if(array.length>1 && name !== '') {
+            let value = array.filter((v,i) => i>0).join('=')
             value = value.trim().replace(/^\"/,'').replace(/\"$/m,'')
             let eventIndex = value.match(/(?<=\{\{\{\{event\s)(\d*)?/)
             if(eventIndex !== null) {

package/readme.md

@@ -13,6 +13,7 @@ Als-document is a library which includes 4 instruments:
 
 - [als-document](#als-document)
   - [About](#about)
+  - [Update](#update)
   - [Basics](#basics)
     - [Example](#example)
   - [Element properties and methods](#element-properties-and-methods)
@@ -33,7 +34,11 @@ Als-document is a library which includes 4 instruments:
     - [Example](#example-2)
     - [Attribs and check function](#attribs-and-check-function)
 
-
+## Update
+**new in 0.6.1**
+  * attribute parsing bug with '=' inside value, fixed
+  * tag parsing improved
+  * events parsing fixed
 
 ## Basics
 You can use als-document on node.js and in browser.
@@ -122,7 +127,7 @@ Each element (except root and text elements, which has no all) has:
 
 
 ## Selecting elements
-For select elements inside virtual dom, you can use ``HtmlSelector`` or ``Document``. 
+For selecting elements inside virtual dom, use ``HtmlSelector`` or ``Document``. 
 If you need only selecting, use ``HtmlSelector``, otherwise use ``Document``.
 Document is extended HtmlSelector.