als-document 1.0.7-alpha → 1.1.0

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/document.js CHANGED
@@ -1,5 +1,5 @@
1
1
  const alsDocument = (function(){
2
- class Query{
3
2
  static get(query){
4
3
  let q=new Query(query)
5
4
  return q.selectors
6
5
  }
7
6
  constructor(query){
8
7
  this.query=query
9
8
  this.selectors=[]
10
9
  this.stringValues=[];
11
10
  this.parseSelectors(query.split(','))
12
11
  }
13
12
  parseSelectors(selectors){
14
13
  selectors.forEach(selector=>{
15
14
  let originalSelector=selector.trim()
16
15
  selector=this.removeSpaces(selector)
17
16
  this.stringValues=[]
18
17
  selector=selector.replace(/\[.*?\]/g,(value)=>{
19
18
  this.stringValues.push(value)
20
19
  return `[${this.stringValues.length-1}]`
21
20
  })
22
21
  let [element,ancestors]=this.splitAndCutLast(selector,' ')
23
22
  element=this.getFamily(element)
24
23
  if (ancestors.length>0)
25
24
  element.ancestors=ancestors.map(ancestor=>this.getFamily(ancestor))
26
25
  element.group=originalSelector
27
26
  this.selectors.push(element)
28
27
  });
29
28
  }
30
29
  splitAndCutLast(string,splitBy){
31
30
  const array=string.split(splitBy);
32
31
  const last=array.pop();
33
32
  return [last,array];
34
33
  }
35
34
  getFamily(group,element,prev,prevAny,sign){
36
35
  if (group.match(/\~|\+/)!==null){
37
36
  let [last,prevBrothers]=this.splitAndCutLast(group,/\~|\+/)
38
37
  let signs=group.replace(last,'')
39
38
  prevBrothers.forEach(el=>signs=signs.replace(el,''))
40
39
  signs=signs.match(/\~|\+/g)
41
40
  if (signs.length==1){
42
41
  sign=signs[0]
43
42
  } else if (signs.length>1){
44
43
  sign=signs.splice(signs.length-1,signs.length-1)[0]
45
44
  prevBrothers[0]=prevBrothers.map((b,i)=>{
46
45
  if (i< prevBrothers.length-1) b+=signs[i]
47
46
  return b
48
47
  }).join('')
49
48
  prevBrothers[0]=this.getFamily(prevBrothers[0])
50
49
  }
51
50
  if (sign=='~') prevAny=prevBrothers[0]
52
51
  else if (sign=='+') prev=prevBrothers[0]
53
52
  element=last
54
53
  } else element=group
55
54
  let family
56
55
  if (prev || prevAny){
57
56
  family=this.getParents(element)
58
57
  if (prev) family.prev=this.getParents(prev)
59
58
  if (prevAny) family.prevAny=this.getParents(prevAny)
60
59
  } else family=this.getParents(element)
61
60
  if (family.query!==group) family.group=group
62
61
  return family
63
62
  }
64
63
  getParents(selector){
65
64
  if (typeof selector=='string'){
66
65
  let [element,parents]=this.splitAndCutLast(selector,'>')
67
66
  element=this.buildElement(element)
68
67
  parents=parents.map(parent=>this.buildElement(parent))
69
68
  if (parents.length>0) element.parents=parents
70
69
  return element
71
70
  } else return selector
72
71
  }
73
72
  buildElement(element,id=null,tag=null,classList=[]){
74
73
  let query=element
75
74
  element=element.replace(/\#(\w-?)*/,$id=>{
76
75
  id=$id.replace(/^\#/,''); return ''
77
76
  })
78
77
  element=element.replace(/\.(\w-?)*/,$class=>{
79
78
  classList.push($class.replace(/^\./,'')); return ''
80
79
  })
81
80
  element=element.replace(/(\w\:?-?)*/,$tag=>{
82
81
  tag=$tag=='' ? null : $tag; return ''
83
82
  })
84
83
  let attribs=this.getAttributes(element)
85
84
  element={ query }
86
85
  if (id) element.id=id
87
86
  if (tag) element.tag=tag
88
87
  if (classList.length>0) element.classList=classList
89
88
  if (attribs.length>0) element.attribs=attribs
90
89
  return element
91
90
  }
92
91
  getAttributes(element){
93
92
  let attribs=this.stringValues.filter((value,index)=>{
94
93
  let searchValue=`[${index}]`
95
94
  if (element.match(searchValue)) return true
96
95
  else return false
97
96
  })
98
97
  attribs=attribs.map(attrib=>{
99
98
  let query=attrib
100
99
  attrib=attrib.replace('[','').replace(']','')
101
100
  let [name,value]=attrib.split(/[\~\|\^\$\*]?\=/)
102
101
  let sign=attrib.replace(name,'').replace(value,'')
103
102
  attrib={ query }
104
103
  if (name) attrib.name=name
105
104
  if (value) attrib.value=value.trim().replace(/^\"/,'').replace(/\"$/,'')
106
105
  if (sign){
107
106
  attrib.sign=sign
108
107
  attrib.check=this.getAttribFn(sign).bind(attrib)
109
108
  }
110
109
  return attrib
111
110
  });
112
111
  return attribs
113
112
  }
114
113
  getAttribFn(sign){
115
114
  if (sign=='=') return function (value){ return value===this.value }
116
115
  if (sign=='*=') return function (value){ return value.includes(this.value) }
117
116
  if (sign=='^=') return function (value){ return value.startsWith(this.value) }
118
117
  if (sign=='$=') return function (value){ return value.endsWith(this.value) }
119
118
  if (sign=='|=') return function (value){
120
119
  return value.trim().split(' ').length==1
121
120
  && (value.startsWith(this.value) || value.startsWith(this.value+'-'))
122
121
  ? true : false
123
122
  }
124
123
  if (sign=='~=') return function (value){
125
124
  return this.value.trim().split(' ').length==1 && value.includes(this.value) ? true : false
126
125
  }
127
126
  }
128
127
  removeSpaces(selector){
129
128
  selector=selector.replace(/\s{2}/g,' ')
130
129
  selector=selector.replace(/\s?\^?\$?\|?\~?\*?\=\s*/g,(m)=>m.trim())
131
130
  selector=selector.replace(/\s?(\+|\~|\>)\s?/g,(m)=>m.trim())
132
131
  return selector
133
132
  }
133
+ class Query{
134
134
  static get(query){
135
135
  let q=new Query(query)
136
136
  return q.selectors
137
137
  }
138
138
  constructor(query){
139
139
  this.query=query
140
140
  this.selectors=[]
141
141
  this.stringValues=[];
142
142
  this.parseSelectors(query.split(','))
143
143
  }
144
144
  parseSelectors(selectors){
145
145
  selectors.forEach(selector=>{
146
146
  let originalSelector=selector.trim()
147
147
  selector=this.removeSpaces(selector)
148
148
  this.stringValues=[]
149
149
  selector=selector.replace(/\[.*?\]/g,(value)=>{
150
150
  this.stringValues.push(value)
151
151
  return `[${this.stringValues.length-1}]`
152
152
  })
153
153
  let [element,ancestors]=this.splitAndCutLast(selector,' ')
154
154
  element=this.getFamily(element)
155
155
  if (ancestors.length>0)
156
156
  element.ancestors=ancestors.map(ancestor=>this.getFamily(ancestor))
157
157
  element.group=originalSelector
158
158
  this.selectors.push(element)
159
159
  });
160
160
  }
161
161
  splitAndCutLast(string,splitBy){
162
162
  const array=string.split(splitBy);
163
163
  const last=array.pop();
164
164
  return [last,array];
165
165
  }
166
166
  getFamily(group,element,prev,prevAny,sign){
167
167
  if (group.match(/\~|\+/)!==null){
168
168
  let [last,prevBrothers]=this.splitAndCutLast(group,/\~|\+/)
169
169
  let signs=group.replace(last,'')
170
170
  prevBrothers.forEach(el=>signs=signs.replace(el,''))
171
171
  signs=signs.match(/\~|\+/g)
172
172
  if (signs.length==1){
173
173
  sign=signs[0]
174
174
  } else if (signs.length>1){
175
175
  sign=signs.splice(signs.length-1,signs.length-1)[0]
176
176
  prevBrothers[0]=prevBrothers.map((b,i)=>{
177
177
  if (i< prevBrothers.length-1) b+=signs[i]
178
178
  return b
179
179
  }).join('')
180
180
  prevBrothers[0]=this.getFamily(prevBrothers[0])
181
181
  }
182
182
  if (sign=='~') prevAny=prevBrothers[0]
183
183
  else if (sign=='+') prev=prevBrothers[0]
184
184
  element=last
185
185
  } else element=group
186
186
  let family
187
187
  if (prev || prevAny){
188
188
  family=this.getParents(element)
189
189
  if (prev) family.prev=this.getParents(prev)
190
190
  if (prevAny) family.prevAny=this.getParents(prevAny)
191
191
  } else family=this.getParents(element)
192
192
  if (family.query!==group) family.group=group
193
193
  return family
194
194
  }
195
195
  getParents(selector){
196
196
  if (typeof selector=='string'){
197
197
  let [element,parents]=this.splitAndCutLast(selector,'>')
198
198
  element=this.buildElement(element)
199
199
  parents=parents.map(parent=>this.buildElement(parent))
200
200
  if (parents.length>0) element.parents=parents
201
201
  return element
202
202
  } else return selector
203
203
  }
204
204
  buildElement(element,id=null,tag=null,classList=[]){
205
205
  let query=element
206
206
  element=element.replace(/\#(\w-?)*/,$id=>{
207
207
  id=$id.replace(/^\#/,''); return ''
208
208
  })
209
209
  element=element.replace(/\.(\w-?)*/,$class=>{
210
210
  classList.push($class.replace(/^\./,'')); return ''
211
211
  })
212
212
  element=element.replace(/(\w\:?-?)*/,$tag=>{
213
213
  tag=$tag=='' ? null : $tag; return ''
214
214
  })
215
215
  let attribs=this.getAttributes(element)
216
216
  element={ query }
217
217
  if (id) element.id=id
218
218
  if (tag) element.tag=tag
219
219
  if (classList.length>0) element.classList=classList
220
220
  if (attribs.length>0) element.attribs=attribs
221
221
  return element
222
222
  }
223
223
  getAttributes(element){
224
224
  let attribs=this.stringValues.filter((value,index)=>{
225
225
  let searchValue=`[${index}]`
226
226
  if (element.match(searchValue)) return true
227
227
  else return false
228
228
  })
229
229
  attribs=attribs.map(attrib=>{
230
230
  let query=attrib
231
231
  attrib=attrib.replace('[','').replace(']','')
232
232
  let [name,...values]=attrib.split('=')
233
233
  const value=values.join('=').trim().replace(/^\"/,'').replace(/\"$/,'')
234
234
  let sign
235
235
  attrib={query,name}
236
236
  if(value){
237
237
  sign='='
238
238
  attrib.name=attrib.name.replace(/[\~\|\^\$\*]$/,(match=>{
239
239
  sign=match+sign
240
240
  return ''
241
241
  }))
242
242
  attrib.value=value
243
243
  }
244
244
  if (sign){
245
245
  attrib.sign=sign
246
246
  attrib.check=this.getAttribFn(sign).bind(attrib)
247
247
  }
248
248
  return attrib
249
249
  });
250
250
  return attribs
251
251
  }
252
252
  getAttribFn(sign){
253
253
  if (sign=='=') return function (value){ return value===this.value }
254
254
  if (sign=='*=') return function (value){ return value.includes(this.value) }
255
255
  if (sign=='^=') return function (value){ return value.startsWith(this.value) }
256
256
  if (sign=='$=') return function (value){ return value.endsWith(this.value) }
257
257
  if (sign=='|=') return function (value){
258
258
  return value.trim().split(' ').length==1
259
259
  && (value.startsWith(this.value) || value.startsWith(this.value+'-'))
260
260
  ? true : false
261
261
  }
262
262
  if (sign=='~=') return function (value){
263
263
  return this.value.trim().split(' ').length==1 && value.includes(this.value) ? true : false
264
264
  }
265
265
  }
266
266
  removeSpaces(selector){
267
267
  selector=selector.replace(/\s{2}/g,' ')
268
268
  selector=selector.replace(/\s?\^?\$?\|?\~?\*?\=\s*/g,(m)=>m.trim())
269
269
  selector=selector.replace(/\s?(\+|\~|\>)\s?/g,(m)=>m.trim())
270
270
  return selector
271
271
  }
272
272
  }
273
273
  function checkElement(el,selector){
274
274
  if(selector==undefined) return true
275
275
  if(el==null) return false
276
276
  let{tag,classList,attribs:attributes,id,prev,ancestors,parents,prevAny}=selector
277
277
  if(typeof el==='string') return false
278
278
  if(id!==undefined && el.id===null) return false
279
279
  if(id && id!==el.id) return false
280
280
  if(tag && el.tagName===undefined) return false
281
281
  else if(tag && tag!==el.tagName) return false
282
282
  const clas=el.attributes.class
283
283
  if(classList!==undefined && (clas===undefined || clas==='')) return false
284
284
  else if(classList!==undefined){
285
285
  if(classList.every(e=>el.classList.contains(e))===false) return false
286
286
  }
287
287
  if(checkattributes(attributes,el)===false) return false
288
288
  if(checkElement(el.prev,prev)===false) return false
289
289
  if(checkAncestors(el.ancestors,ancestors)===false) return false
290
290
  if(checkParents(el.ancestors,parents)===false) return false
291
291
  if(el.parent){
292
292
  if(checkPrevAny(el.parent.children,el.childIndex,prevAny)==false) return false
293
293
  }
294
294
  return true
295
295
  }
296
296
  function checkattributes(attributes=[],el){
297
297
  let elattributes=el.attributes
298
298
  let names=Object.keys(elattributes)
299
299
  let passedTests=0
300
300
  if(attributes) for(let i=0; i<attributes.length; i++){
301
301
  let{name,value,check}=attributes[i]
302
302
  if(name=='inner' && value!==undefined && check && el.inner){
303
303
  if(check(el.inner)) passedTests++
304
304
  }
305
305
  if(!names.includes(name)) continue
306
306
  else if(value==undefined) passedTests++
307
307
  else if(value && elattributes[name]){
308
308
  if(check(elattributes[name])==false) continue
309
309
  else passedTests++
310
310
  }
311
311
  }
312
312
  if(passedTests==attributes.length) return true
313
313
  else return false
@@ -22,14 +22,21 @@ function buildStyle(attributes){
22
22
  const styles=attributes.style || "";
23
23
  con
24
24
  class NodeClassList{
25
25
  constructor(node){ this.node=node }
26
26
  get classes(){ return (this.node.attributes.class || "").split(" ").filter(Boolean) }
27
27
  set classes(val){ this.node.attributes.class=val.join(" ") }
28
28
  contains(className){ return this.classes.includes(className) }
29
29
  add(className){
30
30
  const currentClasses=this.classes;
31
31
  if (!currentClasses.includes(className)) this.classes=[...currentClasses,className];
32
32
  }
33
33
  remove(className){ this.classes=this.classes.filter(cls=>cls!==className); }
34
34
  toggle(className){
35
35
  if (this.classes.includes(className)) this.remove(className);
36
36
  else this.add(className);
37
37
  }
38
38
  replace(oldClass,newClass){
39
39
  if (this.classes.includes(oldClass)){
40
40
  this.remove(oldClass);
41
41
  this.add(newClass);
42
42
  }
43
43
  }
44
44
  }
45
45
  function insertBefore(arr,index,newItem){
46
46
  const existingIndex=arr.indexOf(newItem);
47
47
  if (existingIndex!==-1) arr.splice(existingIndex,1);
48
48
  arr.splice(index,0,newItem);
49
- }
50
49
  class Node{
51
50
  constructor(tagName,attributes={},parent=null){
52
51
  this.isSingle=false;
53
52
  this.tagName=tagName;
54
53
  this.attributes=attributes;
55
54
  this.childNodes=[];
56
55
  if (parent!==null) parent.childNodes.push(this)
57
56
  this.parent=parent;
58
57
  this._classList=null;
59
58
  this.__style=null;
60
59
  this._dataset=null
61
60
  }
62
61
  get id(){ return this.attributes.id ? this.attributes.id : null; }
63
62
  set id(newValue){ this.attributes.id=newValue; }
64
63
  get className(){return this.attributes.class || null}
65
64
  get parentNode(){ return this.parent }
66
65
  get ancestors(){
67
66
  if(!this.parent) return []
68
67
  const ancestors=[]
69
68
  let element=this.parent
70
69
  while (element.tagName!=='ROOT'){
71
70
  ancestors.push(element)
72
71
  element=element.parent
73
72
  }
74
73
  return ancestors.reverse()
75
74
  }
76
75
  get childNodeIndex(){
77
76
  if(!this.parent) return null
78
77
  return this.parent.childNodes ? this.parent.childNodes.indexOf(this) : null
79
78
  }
80
79
  get childIndex(){
81
80
  if(!this.parent) return null
82
81
  return this.parent.children ? this.parent.children.indexOf(this) : null
83
82
  }
84
83
  get previousElementSibling(){ return this.prev }
85
84
  get prev(){
86
85
  if (!this.childIndex) return null
87
86
  return this.parent.children[this.childIndex-1]
88
87
  }
89
88
  get nextElementSibling(){ return this.next }
90
89
  get next(){
91
90
  if (!this.childIndex) return null
92
91
  return this.parent.children[this.childIndex+1] || null
93
92
  }
94
93
  get dataset(){
95
94
  if (!this._dataset) this._dataset=getDataset(this);
96
95
  return this._dataset;
97
96
  }
98
97
  get classList(){
99
98
  if (!this._classList) this._classList=new NodeClassList(this);
100
99
  return this._classList;
101
100
  }
102
101
  get style(){
103
102
  if (!this.__style) this.__style=buildStyle(this.attributes)
104
103
  return this.__style
105
104
  }
106
105
  get outerHTML(){
107
106
  const attrs=Object.entries(this.attributes).map(([key,val])=>`${key}="${val}"`).join(" ");
108
107
  return `<${this.tagName}${attrs ? ' '+attrs : ''}>${this.innerHTML}</${this.tagName}>`;
109
108
  }
110
109
  getAttribute(attrName){ return this.attributes[attrName] || null }
111
110
  setAttribute(attrName,value){ this.attributes[attrName]=value }
112
111
  removeAttribute(attrName){ delete this.attributes[attrName] }
113
112
  remove(){
114
113
  if (!this.parent) return
115
114
  const index=this.childNodeIndex;
116
115
  if (index!==null) this.parent.childNodes.splice(index,1);
117
116
  }
118
117
  get innerHTML(){
119
118
  return this.childNodes.map(child=>{
120
119
  if (child instanceof Node || child instanceof SingleNode) return child.outerHTML;
121
120
  else if (child instanceof TextNode) return child.textContent;
122
121
  else return child
123
122
  }).join("");
124
123
  }
125
124
  $$(query){return this.querySelectorAll(query)}
126
125
  querySelectorAll(query){
127
126
  const selectors=Query.get(query)
128
127
  return find(selectors,this,new Set())
129
128
  }
130
129
  $(query){return this.querySelector(query)}
131
130
  querySelector(query){
132
131
  const selectors=Query.get(query)
133
132
  return find(selectors,this,new Set(),true)[0] || null
134
133
  }
135
134
  getElementsByClassName(query){ return this.querySelectorAll('.'+query) }
136
135
  getElementsByTagName(query){ return this.querySelectorAll(query) }
137
136
  getElementById(query){ return this.querySelector('#'+query) }
138
137
  get children(){
139
138
  return this.childNodes.filter(child=>{
140
139
  if (!(child instanceof Node)) return false
141
140
  if (child.tagName==='#comment') return false
142
141
  return true
143
142
  });
144
143
  }
145
144
  insertAdjacentElement(position,newElement){
146
145
  if(newElement.tagName==='ROOT' && newElement.childNodes.length>0) newElement=newElement.childNodes[0]
147
146
  const pos=position.toLowerCase();
148
147
  if (pos==="afterbegin") this.childNodes.unshift(newElement);
149
148
  else if (pos==="beforeend") this.childNodes.push(newElement);
150
149
  newElement.parent=this
151
150
  if (!this.parent) return newElement
152
151
  if (pos==="beforebegin") insertBefore(this.parent.childNodes,this.childNodeIndex,newElement)
153
152
  else if (pos==="afterend") this.parent.childNodes.splice(this.childNodeIndex+1,0,newElement);
154
153
  newElement.parent=this.parent
155
154
  return newElement
156
155
  }
157
156
  insertAdjacentHTML(position,html){
158
157
  const newNode=parseHTML(html);
159
158
  newNode.childNodes.reverse().forEach(node=>{
160
159
  this.insertAdjacentElement(position,node);
161
160
  });
162
161
  return newNode
163
162
  }
164
163
  insertAdjacentText(position,text){
165
164
  return this.insertAdjacentElement(position,new TextNode(text));
166
165
  }
167
166
  set innerHTML(html){
168
167
  const parsed=parseHTML(html);
169
168
  this.childNodes=parsed.childNodes;
170
169
  }
171
170
  set outerHTML(html){
172
171
  const parsed=parseHTML(html);
173
172
  if (!this.parent) return console.log('element has no parent node')
174
173
  const index=this.childIndex
175
174
  if (index!==null) this.parent.childNodes.splice(index,1,...parsed.childNodes);
176
175
  }
177
176
  appendChild(newChild){
178
177
  if (newChild instanceof Node || newChild instanceof TextNode || newChild instanceof SingleNode){
179
178
  if (newChild.parent) newChild.parent.childNodes=newChild.parent.childNodes.filter(child=>child!==newChild);
180
179
  } else if(typeof newChild==='string') newChild=new TextNode(newChild)
181
180
  else return newChild
182
181
  this.childNodes.push(newChild);
183
182
  newChild.parent=this;
184
183
  return newChild;
185
184
  }
186
185
  get textContent(){
187
186
  if (this.childNodes.length===0) return this.nodeName==='#text' ? this.nodeValue : '';
188
187
  return this.childNodes.map(child=>{
189
188
  if(child instanceof SingleNode) return ''
190
189
  if(child instanceof TextNode) return child.nodeValue
191
190
  if(child instanceof Node) return child.textContent;
192
191
  else return child;
193
192
  }).join(" ");
194
193
  }
195
194
  set textContent(value){
196
195
  this.childNodes=[];
197
196
  if (value!==null && value!==undefined){
198
197
  this.childNodes.push(value.toString());
199
198
  }
200
199
  }
200
+ }
201
201
  class Node{
202
202
  constructor(tagName,attributes={},parent=null){
203
203
  this.isSingle=false;
204
204
  this.tagName=tagName;
205
205
  this.attributes=attributes;
206
206
  this.childNodes=[];
207
207
  if (parent!==null) parent.childNodes.push(this)
208
208
  this.parent=parent;
209
209
  this._classList=null;
210
210
  this.__style=null;
211
211
  this._dataset=null
212
212
  }
213
213
  get id(){ return this.attributes.id ? this.attributes.id : null; }
214
214
  set id(newValue){ this.attributes.id=newValue; }
215
215
  get className(){ return this.attributes.class || null }
216
216
  get parentNode(){ return this.parent }
217
217
  get ancestors(){
218
218
  if (!this.parent) return []
219
219
  const ancestors=[]
220
220
  let element=this.parent
221
221
  while (element.tagName!=='ROOT'){
222
222
  ancestors.push(element)
223
223
  element=element.parent
224
224
  }
225
225
  return ancestors.reverse()
226
226
  }
227
227
  get childNodeIndex(){
228
228
  if (!this.parent) return null
229
229
  return this.parent.childNodes ? this.parent.childNodes.indexOf(this) : null
230
230
  }
231
231
  get childIndex(){
232
232
  if (!this.parent) return null
233
233
  return this.parent.children ? this.parent.children.indexOf(this) : null
234
234
  }
235
235
  get previousElementSibling(){ return this.prev }
236
236
  get prev(){
237
237
  if (!this.childIndex) return null
238
238
  return this.parent.children[this.childIndex-1]
239
239
  }
240
240
  get nextElementSibling(){ return this.next }
241
241
  get next(){
242
242
  if (!this.childIndex) return null
243
243
  return this.parent.children[this.childIndex+1] || null
244
244
  }
245
245
  get dataset(){
246
246
  if (!this._dataset) this._dataset=getDataset(this);
247
247
  return this._dataset;
248
248
  }
249
249
  get classList(){
250
250
  if (!this._classList) this._classList=new NodeClassList(this);
251
251
  return this._classList;
252
252
  }
253
253
  get style(){
254
254
  if (!this.__style) this.__style=buildStyle(this.attributes)
255
255
  return this.__style
256
256
  }
257
257
  get outerHTML(){
258
258
  const attrs=Object.entries(this.attributes).map(([key,val])=>val.length ? `${key}="${val}"` : key).join(" ");
259
259
  return `<${this.tagName}${attrs ? ' '+attrs : ''}>${this.innerHTML}</${this.tagName}>`;
260
260
  }
261
261
  getAttribute(attrName){ return this.attributes[attrName] || null }
262
262
  setAttribute(attrName,value){ this.attributes[attrName]=value }
263
263
  removeAttribute(attrName){ delete this.attributes[attrName] }
264
264
  remove(){
265
265
  if (!this.parent) return
266
266
  const index=this.childNodeIndex;
267
267
  if (index!==null) this.parent.childNodes.splice(index,1);
268
268
  }
269
269
  get innerHTML(){
270
270
  return this.childNodes.map(child=>{
271
271
  if (child instanceof Node || child instanceof SingleNode) return child.outerHTML;
272
272
  else if (child instanceof TextNode) return child.textContent;
273
273
  else return child
274
274
  }).join("");
275
275
  }
276
276
  $$(query){ return this.querySelectorAll(query) }
277
277
  querySelectorAll(query){
278
278
  const selectors=Query.get(query)
279
279
  return find(selectors,this,new Set())
280
280
  }
281
281
  $(query){ return this.querySelector(query) }
282
282
  querySelector(query){
283
283
  const selectors=Query.get(query)
284
284
  return find(selectors,this,new Set(),true)[0] || null
285
285
  }
286
286
  getElementsByClassName(query){ return this.querySelectorAll('.'+query) }
287
287
  getElementsByTagName(query){ return this.querySelectorAll(query) }
288
288
  getElementById(query){ return this.querySelector('#'+query) }
289
289
  get children(){
290
290
  return this.childNodes.filter(child=>{
291
291
  if (!(child instanceof Node)) return false
292
292
  if (child.tagName==='#comment') return false
293
293
  return true
294
294
  });
295
295
  }
296
296
  insertAdjacentElement(position,newElement){
297
297
  if (newElement.tagName==='ROOT' && newElement.childNodes.length>0) newElement=newElement.childNodes[0]
298
298
  const pos=position.toLowerCase();
299
299
  if (pos==='afterbegin' || pos==='beforeend'){
300
300
  if (pos==="afterbegin") this.childNodes.unshift(newElement);
301
301
  else if (pos==="beforeend") this.childNodes.push(newElement);
302
302
  newElement.parent=this
303
303
  return newElement
304
304
  }
305
305
  if (!this.parent) throw new Error("Can't insert element to element without parent")
306
306
  if (pos==="beforebegin") insertBefore(this.parent.childNodes,this.childNodeIndex,newElement)
307
307
  else if (pos==="afterend") this.parent.childNodes.splice(this.childNodeIndex+1,0,newElement);
308
308
  newElement.parent=this.parent
309
309
  return newElement
310
310
  }
311
311
  insertAdjacentHTML(position,html){
312
312
  const newNode=parseHTML(html);
313
313
  newNode.childNodes.forEach(node=>{
314
314
  this.insertAdjacentElement(position,node);
315
315
  });
316
316
  return newNode
317
317
  }
318
318
  insertAdjacentText(position,text){
319
319
  return this.insertAdjacentElement(position,new TextNode(text));
320
320
  }
321
321
  insert(position,element){
322
322
  const positions=['beforebegin','afterbegin','beforeend','afterend']
323
323
  if (positions[position]) position=positions[position]
324
324
  if (typeof element==='string'){
325
325
  element=element.trim()
326
326
  if (element.startsWith('<') && element.endsWith('>')){
327
327
  return this.insertAdjacentHTML(position,element)
328
328
  }
329
329
  return this.insertAdjacentText(position,element)
330
330
  }
331
331
  return this.insertAdjacentElement(position,element)
332
332
  }
333
333
  set innerHTML(html){
334
334
  this.childNodes=html.trim().startsWith('<') ? parseHTML(html).childNodes : [html]
335
335
  }
336
336
  set outerHTML(html){
337
337
  const parsed=parseHTML(html);
338
338
  if (!this.parent) return console.log('element has no parent node')
339
339
  const index=this.childIndex
340
340
  if (index!==null) this.parent.childNodes.splice(index,1,...parsed.childNodes);
341
341
  }
342
342
  appendChild(newChild){
343
343
  if (newChild instanceof Node || newChild instanceof TextNode || newChild instanceof SingleNode){
344
344
  if (newChild.parent) newChild.parent.childNodes=newChild.parent.childNodes.filter(child=>child!==newChild);
345
345
  } else if (typeof newChild==='string') newChild=new TextNode(newChild)
346
346
  else return newChild
347
347
  this.childNodes.push(newChild);
348
348
  newChild.parent=this;
349
349
  return newChild;
350
350
  }
351
351
  get textContent(){
352
352
  if (this.childNodes.length===0) return this.nodeName==='#text' ? this.nodeValue : '';
353
353
  return this.childNodes.map(child=>{
354
354
  if (child instanceof SingleNode) return ''
355
355
  if (child instanceof TextNode) return child.nodeValue
356
356
  if (child instanceof Node) return child.textContent;
357
357
  else return child;
358
358
  }).join(" ");
359
359
  }
360
360
  set textContent(value){
361
361
  this.childNodes=[];
362
362
  if (value!==null && value!==undefined){
363
363
  this.childNodes.push(value.toString());
364
364
  }
365
365
  }
366
366
  }
367
- class SingleNode extends Node{
368
367
  constructor(tagName,attributes={},parent=null){
369
368
  if(attributes['?'] && tagName==='?xml') delete attributes['?']
370
369
  super(tagName,attributes,parent);
371
370
  this.isSingle=true
372
371
  }
373
372
  get outerHTML(){
374
373
  if (this.tagName==="#cdata-section") return `<![CDATA[${this.nodeValue}]]>`;
375
374
  const attrs=Object.entries(this.attributes).map(([key,val])=>`${key}="${val}"`).join(" ");
376
375
  return `<${this.tagName} ${attrs}${this.tagName==='?xml' ? '?' : ''}>`;
377
376
  }
378
377
  get innerHTML(){ return ""; }
379
378
  set innerHTML(_){ }
380
379
  $(_){return null}
381
380
  $$(_){return []}
382
381
  querySelectorAll(_){ return []; }
383
382
  querySelector(_){ return null; }
384
383
  getElementsByClassName(_){ return []; }
385
384
  getElementsByTagName(_){ return []; }
386
385
  getElementById(_){ return null; }
387
386
  get children(){ return []; }
388
387
  insertAdjacentElement(_,__){ }
389
388
  insertAdjacentHTML(_,__){ }
390
389
  insertAdjacentText(_,__){ }
391
390
  appendChild(_){ }
392
391
  get textContent(){ return ""; }
393
392
  set textContent(_){ }
393
+ class SingleNode extends Node{
394
394
  constructor(tagName,attributes={},parent=null){
395
395
  if(attributes['?'] && tagName==='?xml') delete attributes['?']
396
396
  super(tagName,attributes,parent);
397
397
  this.isSingle=true
398
398
  }
399
399
  get outerHTML(){
400
400
  if (this.tagName==="#cdata-section") return `<![CDATA[${this.nodeValue}]]>`;
401
401
  const attrs=Object.entries(this.attributes).map(([key,val])=>val.length ? `${key}="${val}"` : key).join(" ");
402
402
  return `<${this.tagName} ${attrs}${this.tagName==='?xml' ? '?' : ''}>`;
403
403
  }
404
404
  get innerHTML(){ return ""; }
405
405
  set innerHTML(_){ }
406
406
  $(_){return null}
407
407
  $$(_){return []}
408
408
  querySelectorAll(_){ return []; }
409
409
  querySelector(_){ return null; }
410
410
  getElementsByClassName(_){ return []; }
411
411
  getElementsByTagName(_){ return []; }
412
412
  getElementById(_){ return null; }
413
413
  get children(){ return []; }
414
414
  insertAdjacentElement(_,__){ }
415
415
  insertAdjacentHTML(_,__){ }
416
416
  insertAdjacentText(_,__){ }
417
417
  appendChild(_){ }
418
418
  insert(_,__){ }
419
419
  get textContent(){ return ""; }
420
420
  set textContent(_){ }
421
+ }
422
+
423
+ class Root extends Node{
421
424
  constructor(){
422
425
  super('ROOT',{},null);
423
426
  this.isSingle=false
424
427
  }
425
428
  get body(){return this.$('body')}
426
429
  get head(){return this.$('head')}
427
430
  get title(){return this.$('title')}
428
431
  set title(title){return this.$('title').innerHTML=title}
429
432
  }
430
- function parseAttributes(str){
431
433
  const attrs={};
432
434
  let key="";
433
435
  let value="";
434
436
  let isKey=true;
435
437
  let quoteChar=null;
436
438
  for (let i=0; i< str.length; i++){
437
439
  const char=str[i];
438
440
  if (isKey && (char==='=' || char===' ')){
439
441
  if (char==='=') isKey=false;
440
442
  else if (key.trim()){
441
443
  attrs[key.trim()]=true;
442
444
  key="";
443
445
  }
444
446
  continue;
445
447
  }
446
448
  if (!quoteChar && (char==='"' || char==="'")){
447
449
  quoteChar=char;
448
450
  continue;
449
451
  } else if (quoteChar && char===quoteChar){
450
452
  quoteChar=null;
451
453
  attrs[key.trim()]=value.trim();
452
454
  key=""; value=""; isKey=true;
453
455
  continue;
454
456
  }
455
457
  if (isKey) key+=char;
456
458
  else value+=char;
457
459
  }
458
460
  if (key.trim() &&!value) attrs[key.trim()]=true;
459
461
  return attrs;
462
+ function parseAttributes(str){
460
463
  const attrs={};
461
464
  let key="";
462
465
  let value="";
463
466
  let isKey=true;
464
467
  let quoteChar=null;
465
468
  for (let i=0; i< str.length; i++){
466
469
  const char=str[i];
467
470
  if (isKey && (char==='=' || char===' ')){
468
471
  if (char==='=') isKey=false;
469
472
  else if (key.trim()){
470
473
  attrs[key.trim()]=true;
471
474
  key="";
472
475
  }
473
476
  continue;
474
477
  }
475
478
  if (!quoteChar && (char==='"' || char==="'")){
476
479
  quoteChar=char;
477
480
  continue;
478
481
  } else if (quoteChar && char===quoteChar){
479
482
  quoteChar=null;
480
483
  attrs[key.trim()]=value.trim();
481
484
  key=""; value=""; isKey=true;
482
485
  continue;
483
486
  }
484
487
  if (isKey) key+=char;
485
488
  else value+=char;
486
489
  }
487
490
  if (key.trim() &&!value) attrs[key.trim()]='';
488
491
  return attrs;
489
492
  }
490
493
  const VOID_TAGS=new Set(["area","base","br","col","command","embed","hr","img","input","keygen","link","meta","param","source","track","wbr","!doctype",'?xml']);
491
- function parseHTML(html){
492
494
  const root=new Node("ROOT");
493
495
  const stack=[root];
494
496
  let currentText="",i=0;
495
497
  let max=0
496
498
  function parseScript(){
497
499
  if (!html.startsWith("<script",i)) return false;
498
500
  const openTagEnd=html.indexOf(">",i);
499
501
  if (openTagEnd===-1) return false;
500
502
  const attributesString=html.substring(i+7,openTagEnd).trim();
501
503
  const attributes=parseAttributes(attributesString);
502
504
  let closeTagStart=html.indexOf("</script>",openTagEnd);
503
505
  if (closeTagStart===-1) return false;
504
506
  const content=html.substring(openTagEnd+1,closeTagStart);
505
507
  const scriptNode=new Node('script',attributes,stack[stack.length-1]);
506
508
  if(content.length>0) scriptNode.childNodes.push(content);
507
509
  i=closeTagStart+9;
508
510
  return true;
509
511
  }
510
512
  function parseSpecial(startStr,endStr,n1,n2,tag){
511
513
  if (!html.startsWith(startStr,i)) return false
512
514
  const end=html.indexOf(endStr,i+n1);
513
515
  const strNode=new Node(tag,{},stack[stack.length-1]);
514
516
  strNode.childNodes.push(html.substring(i+n1,end));
515
517
  i=end+n2;
516
518
  return true
517
519
  }
518
520
  while (i< html.length){
519
521
  if(i>=max) max=i;
520
522
  else break;
521
523
  if (parseScript()) continue
522
524
  if (parseSpecial("<!--","-->",4,3,'#comment')) continue
523
525
  if (parseSpecial("<style","</style>",7,8,'style')) continue
524
526
  if (html.startsWith("<![CDATA[",i)){
525
527
  const end=html.indexOf("]]>",i+9);
526
528
  if (end===-1) break;
527
529
  const content=html.substring(i+9,end);
528
530
  const cdataNode=new SingleNode("#cdata-section",{},stack[stack.length-1]);
529
531
  cdataNode.nodeValue=content;
530
532
  i=end+3;
531
533
  continue;
532
534
  }
533
535
  if (html.startsWith("<",i)){
534
536
  if (currentText && stack[stack.length-1]){
535
537
  const textNode=new TextNode(currentText)
536
538
  stack[stack.length-1].childNodes.push(textNode);
537
539
  textNode.parent=stack[stack.length-1]
538
540
  currentText="";
539
541
  }
540
542
  let tagEnd=i+1;
541
543
  let insideQuotes=false;
542
544
  let quoteChar=null;
543
545
  while (tagEnd< html.length){
544
546
  const char=html[tagEnd];
545
547
  if (!insideQuotes && (char==='"' || char==="'")){
546
548
  insideQuotes=true;
547
549
  quoteChar=char;
548
550
  } else if (insideQuotes && char===quoteChar){
549
551
  insideQuotes=false;
550
552
  quoteChar=null;
551
553
  }
552
554
  if (!insideQuotes && char==='>') break;
553
555
  tagEnd++;
554
556
  }
555
557
  const tagContent=html.substring(i+1,tagEnd);
556
558
  if (tagContent.startsWith("/")) stack.pop();
557
559
  else{
558
560
  let isSelfClosing=tagContent.endsWith('/');
559
561
  const tagNameEnd=tagContent.search(/\s|>|\//);
560
562
  const tagName=tagContent.substring(0,tagNameEnd>0 ? tagNameEnd : tagEnd-i-1);
561
563
  const attributesString=tagContent.substring(tagName.length,isSelfClosing ? tagContent.length-1 : tagContent.length).trim();
562
564
  const attributes=parseAttributes(attributesString);
563
565
  if (VOID_TAGS.has(tagName.toLowerCase()) || isSelfClosing) new SingleNode(tagName,attributes,stack[stack.length-1])
564
566
  else stack.push(new Node(tagName,attributes,stack[stack.length-1]));
565
567
  }
566
568
  i=tagEnd+1;
567
569
  } else{
568
570
  currentText+=html[i];
569
571
  i++;
570
572
  }
571
573
  }
572
574
  if (currentText.trim() && stack[stack.length-1]) stack[stack.length-1].childNodes.push(new TextNode(currentText));
573
575
  return root;
576
+ function parseHTML(html){
574
577
  const root=new Root();
575
578
  const stack=[root];
576
579
  let currentText="",i=0;
577
580
  let max=0
578
581
  function parseScript(){
579
582
  if (!html.startsWith("<script",i)) return false;
580
583
  const openTagEnd=html.indexOf(">",i);
581
584
  if (openTagEnd===-1) return false;
582
585
  const attributesString=html.substring(i+7,openTagEnd).trim();
583
586
  const attributes=parseAttributes(attributesString);
584
587
  let closeTagStart=html.indexOf("</script>",openTagEnd);
585
588
  if (closeTagStart===-1) return false;
586
589
  const content=html.substring(openTagEnd+1,closeTagStart);
587
590
  const scriptNode=new Node('script',attributes,stack[stack.length-1]);
588
591
  if(content.length>0) scriptNode.childNodes.push(content);
589
592
  i=closeTagStart+9;
590
593
  return true;
591
594
  }
592
595
  function parseSpecial(startStr,endStr,n1,n2,tag){
593
596
  if (!html.startsWith(startStr,i)) return false
594
597
  const end=html.indexOf(endStr,i+n1);
595
598
  const strNode=new Node(tag,{},stack[stack.length-1]);
596
599
  strNode.childNodes.push(html.substring(i+n1,end));
597
600
  i=end+n2;
598
601
  return true
599
602
  }
600
603
  while (i< html.length){
601
604
  if(i>=max) max=i;
602
605
  else break;
603
606
  if (parseScript()) continue
604
607
  if (parseSpecial("<!--","-->",4,3,'#comment')) continue
605
608
  if (parseSpecial("<style","</style>",7,8,'style')) continue
606
609
  if (html.startsWith("<![CDATA[",i)){
607
610
  const end=html.indexOf("]]>",i+9);
608
611
  if (end===-1) break;
609
612
  const content=html.substring(i+9,end);
610
613
  const cdataNode=new SingleNode("#cdata-section",{},stack[stack.length-1]);
611
614
  cdataNode.nodeValue=content;
612
615
  i=end+3;
613
616
  continue;
614
617
  }
615
618
  if (html.startsWith("<",i)){
616
619
  if (currentText && stack[stack.length-1]){
617
620
  const textNode=new TextNode(currentText)
618
621
  stack[stack.length-1].childNodes.push(textNode);
619
622
  textNode.parent=stack[stack.length-1]
620
623
  currentText="";
621
624
  }
622
625
  let tagEnd=i+1;
623
626
  let insideQuotes=false;
624
627
  let quoteChar=null;
625
628
  while (tagEnd< html.length){
626
629
  const char=html[tagEnd];
627
630
  if (!insideQuotes && (char==='"' || char==="'")){
628
631
  insideQuotes=true;
629
632
  quoteChar=char;
630
633
  } else if (insideQuotes && char===quoteChar){
631
634
  insideQuotes=false;
632
635
  quoteChar=null;
633
636
  }
634
637
  if (!insideQuotes && char==='>') break;
635
638
  tagEnd++;
636
639
  }
637
640
  const tagContent=html.substring(i+1,tagEnd);
638
641
  if (tagContent.startsWith("/")) stack.pop();
639
642
  else{
640
643
  let isSelfClosing=tagContent.endsWith('/');
641
644
  const tagNameEnd=tagContent.search(/\s|>|\//);
642
645
  const tagName=tagContent.substring(0,tagNameEnd>0 ? tagNameEnd : tagEnd-i-1);
643
646
  const attributesString=tagContent.substring(tagName.length,isSelfClosing ? tagContent.length-1 : tagContent.length).trim();
644
647
  const attributes=parseAttributes(attributesString);
645
648
  if (VOID_TAGS.has(tagName.toLowerCase()) || isSelfClosing) new SingleNode(tagName,attributes,stack[stack.length-1])
646
649
  else stack.push(new Node(tagName,attributes,stack[stack.length-1]));
647
650
  }
648
651
  i=tagEnd+1;
649
652
  } else{
650
653
  currentText+=html[i];
651
654
  i++;
652
655
  }
653
656
  }
654
657
  if (currentText.trim() && stack[stack.length-1]) stack[stack.length-1].childNodes.push(new TextNode(currentText));
655
658
  return root;
659
+ }
660
+ function buildFromCache(cached){
656
661
  function buildNode(cache,parent=null){
657
662
  if(typeof cache==='string') return parent.childNodes.push(cache)
658
663
  const{isSingle,tagName,attributes,childNodes,textContent}=cache
659
664
  if(textContent) return parent.childNodes.push(new TextNode(textContent))
660
665
  if(isSingle) return parent.childNodes.push(new SingleNode(tagName,attributes))
661
666
  const newDoc=tagName==='ROOT' ? new Root() : new Node(tagName,attributes,parent)
662
667
  childNodes.forEach(childNode=>{
663
668
  buildNode(childNode,newDoc)
664
669
  });
665
670
  return newDoc
666
671
  }
667
672
  return buildNode(cached)
673
+ }
668
674
 
675
+ function cacheDoc(doc){
669
676
  const props=['isSingle','tagName','attributes']
670
677
  function addToCache(element,cache={}){
671
678
  if(typeof element==='string') return element
672
679
  if(element.nodeName==='#text') return{textContent:element.textContent}
673
680
  props.forEach(prop=>{
674
681
  if(element[prop]) cache[prop]=element[prop]
675
682
  });
676
683
  if(!element.childNodes) return cache
677
684
  cache.childNodes=[]
678
685
  element.childNodes.forEach(childNode=>{
679
686
  cache.childNodes.push(addToCache(childNode))
680
687
  });
681
688
  return cache
682
689
  }
683
690
  return addToCache(doc)
684
691
  }
685
- return { parseHTML, Node, Query, TextNode, SingleNode }
692
+ return { parseHTML, Node, Query, TextNode, SingleNode, buildFromCache, cacheDoc, Root }
686
693
  })()