build/bbtreeview.min.js

@@ -1,20 +1,18 @@
 /**
  * BBTreeview
- * @version v0.1.2.011 (2024/01/07 0208)
+ * @version v0.1.2.044 (2024/01/09 2118)
  */
-class BBTreeview{constructor(a){this.Options=null;this.initialiseComponents(a)}initialiseComponents(a){this.Options=Object.assign({ID:null,ShowCheckbox:!1,ShowSelection:!0,EnablePullUp:!1,ShowIcon:!0},a);this.createContainer()}get Container(){let a=document.getElementsByTagName("body");if(0>=a.length)return null;a=a[0].querySelectorAll(this.Options.ID);if(0>=a.length)return null;0>=a[0].querySelectorAll("ul.bbtreeview").length&&(a[0].innerHTML='<ul class="bbtreeview"></ul>');a=a[0].querySelectorAll("ul.bbtreeview");
+class BBTreeview{constructor(a){this.Options={};this.initialiseComponents(a)}initialiseComponents(a){this.Options=Object.assign({ID:null,ShowCheckbox:!1,ShowSelection:!0,EnablePullUp:!1,ShowIcon:!0},a);this.createTreeview()}get Container(){return this.getTreeview()}AddItem(a){a=Object.assign({ID:null,ParentID:null,Name:"",Hint:"",Value:"",Icon:"folder",Checked:!1,Tag:null},a);null==a.ID&&(a.ID=this.generateID());null==a.Tag&&(a.Tag="");if(null!=this.Find(a.ID))return!1;let b=null;if(null!=a.ParentID&&
-return 0>=a.length?null:a[0]}AddItem(a){var b=this.getOptions(a);if(null!=this.Find(b.ID))return!1;a=null;if(null!=b.ParentID&&(a=this.Find(b.ParentID),null==a))return!1;a=null==a?this.Container:a.GetChildNode();if(null==a)return!1;b=this.generateNodeHtml(b);this.appendHtml(a,b);return!0}Remove(a){a=this.Find(a);if(null==a)return!1;a.Remove();return!0}Clear(){this.initialiseComponents(this.Options)}CollapseAll(){this.GetAllNodes().forEach(function(a){a.Collapse()})}ExpandAll(){this.GetAllNodes().forEach(function(a){a.Expand()})}CheckAll(a){this.Options.ShowCheckbox&&
+(b=this.Find(a.ParentID),null==b))return!1;b=null==b?this.Container:b.ChildNode;const c=this.generateNodeHtml(a);this.appendHtml(b,c);this.Find(a.ID).InvalidateEvents();return!0}Remove(a){a=this.Find(a);if(null==a)return!1;a.Remove();return!0}Clear(){this.initialiseComponents(this.Options)}CollapseAll(){this.GetAllNodes().forEach(function(a){a.Collapse()})}ExpandAll(){this.GetAllNodes().forEach(function(a){a.Expand()})}CheckAll(a){this.Options.ShowCheckbox&&this.GetAllNodes().forEach(function(b){b.Check(a)})}Find(a){if(null==
-this.GetAllNodes().forEach(function(b){b.IsChecked=a})}Find(a){if(null==this.Container)console.log("BBTreeview container not found");else{a=this.Container.querySelectorAll("li[data-bbtv-id='"+a+"']");if(0>=a.length)return null;var b=new BBTreeviewNode(this);b.Load(a[0]);return b}}FindByName(a){let b=[];this.GetAllNodes().forEach(function(c){c.Name==a&&b.push(c)});return b}FindByValue(a){let b=[];this.GetAllNodes().forEach(function(c){c.Value==a&&b.push(c)});return b}GetAllNodes(){const a=this,b=a.Container.querySelectorAll("li");
+this.Container)console.log("BBTreeview container not found");else return a=this.Container.querySelectorAll("li[data-bbtv-id='"+a+"']"),0>=a.length?null:new BBTreeviewNode(this,a[0])}FindByName(a){let b=[];this.GetAllNodes().forEach(function(c){c.Name==a&&b.push(c)});return b}FindByValue(a){let b=[];this.GetAllNodes().forEach(function(c){c.Value==a&&b.push(c)});return b}GetAllNodes(){const a=this,b=a.Container.querySelectorAll("li");if(0>=b.length)return[];let c=[];b.forEach(function(d){d=d.getAttribute("data-bbtv-id");
-if(0>=b.length)return[];let c=[];b.forEach(function(d){d=d.getAttribute("data-bbtv-id");a.isNullOrWhitespace(d)||(d=a.Find(d),null!=d&&c.push(d))});return c}GetCheckedNodes(){let a=[];this.GetAllNodes().forEach(function(b){b.Checked&&a.push(b)});return a}GetCheckedValues(){let a=[];this.GetCheckedNodes().map(function(b){a.push(b.Value)});return a}GetCheckedTags(){let a=[];this.GetCheckedNodes().map(function(b){a.push(b.Tag)});return a}GetSelectedNode(){let a=null;this.GetAllNodes().forEach(function(b){if(b.Highlighted)return a=
+a.isNullOrWhitespace(d)||(d=a.Find(d),null!=d&&c.push(d))});return c}GetCheckedNodes(){let a=[];this.GetAllNodes().forEach(function(b){b.IsChecked&&a.push(b)});return a}GetCheckedValues(){let a=[];this.GetCheckedNodes().map(function(b){a.push(b.Value)});return a}GetCheckedTags(){let a=[];this.GetCheckedNodes().map(function(b){a.push(b.Tag)});return a}GetSelectedNode(){let a=null;this.GetAllNodes().forEach(function(b){if(b.IsHighlighted)return a=b,!1});return a}appendHtml(a,b){let c=document.createElement("template");
-b,!1});return a}appendHtml(a,b){let c=document.createElement("template");c.innerHTML=b;c=c.content.firstChild;console.log(a);console.log(c);a.appendChild(c)}createContainer(){let a=document.getElementsByTagName("body");0>=a.length||(a=a[0].querySelectorAll(this.Options.ID),0>=a.length||(a[0].innerHTML='<ul class="bbtreeview"></ul>'))}generateID(){return"treeviewItem"+(Math.floor(1000001*Math.random())+100).toString()}generateNodeHtml(a){var b="";this.isNullOrWhitespace(a.Tag)||(b=encodeURIComponent(JSON.stringify(a.Tag)));
+c.innerHTML=b;c=c.content.firstChild;a.appendChild(c)}createTreeview(){let a=this.getContainer();null!=a&&(a.innerHTML='<ul class="bbtreeview"></ul>')}generateID(){return"treeviewItem"+(Math.floor(1000001*Math.random())+100).toString()}generateNodeHtml(a){var b="";this.isNullOrWhitespace(a.Tag)||(b=encodeURIComponent(JSON.stringify(a.Tag)));b='<li data-bbtv-id="'+a.ID+'" data-bbtv-value="'+a.Value+'" data-bbtv-tag="'+b+'">';b+='<div class="li">';this.Options.ShowCheckbox&&(b+='<div class="icon checkbox"></div>');
-b='<li data-bbtv-id="'+a.ID+'" data-bbtv-value="'+a.Value+'" data-bbtv-tag="'+b+'">';b+='<div class="li">';this.Options.ShowCheckbox&&(b+='<div class="icon checkbox"></div>');this.Options.ShowIcon?(b+='<div class="icon '+a.Icon+'"></div>',b+='<span title="'+a.Hint+'">'+a.Name+"</span>"):b+='<span class="noicon" title="'+a.Hint+'">'+a.Name+"</span>";return b+"</div><ul></ul></li>"}getNode(a){a=(this.isTag(a,"li")?a:this.parentsUntilTagName(a,"li")).getAttribute("data-bbtv-id");return this.isNullOrWhitespace(a)?
+this.Options.ShowIcon?(b+='<div class="icon '+a.Icon+'"></div>',b+='<span title="'+a.Hint+'">'+a.Name+"</span>"):b+='<span class="noicon" title="'+a.Hint+'">'+a.Name+"</span>";return b+"</div><ul></ul></li>"}getContainer(){let a=document.getElementsByTagName("body");if(!(0>=a.length||(a=a[0],a=a.querySelectorAll(this.Options.ID),0>=a.length)))return a=a[0]}getNode(a){a=(this.isTag(a,"li")?a:this.parentsUntilTagName(a,"li")).getAttribute("data-bbtv-id");return this.isNullOrWhitespace(a)?null:this.Find(a)}getTreeview(){let a=
-null:this.Find(a)}getOptions(a){a=Object.assign({ID:null,ParentID:null,Name:"",Hint:"",Value:"",Icon:"folder",Checked:!1,Tag:null},a);null==a.ID&&(a.ID=this.generateID());null==a.Tag&&(a.Tag="");return a}isNullOrWhitespace(a){return"undefined"==typeof a||null==a?!0:0>=a.toString().trim().length}isTag(a,b){return a.tagName.toLowerCase()==b}parentsUntilTagName(a,b){for(;"undefined"!=typeof a.parentNode;){a=a.parentNode;if("undefined"==typeof a)break;if(this.isTag(a,"ul")&&a.classList.contains("bbtreeview"))return null;
+this.getContainer();if(null!=a&&(a=a.querySelectorAll("ul.bbtreeview"),!(0>=a.length)))return a=a[0]}isNullOrWhitespace(a){return"undefined"==typeof a||null==a?!0:0>=a.toString().trim().length}isTag(a,b){return a.tagName.toLowerCase()==b}parentsUntilTagName(a,b){for(;"undefined"!=typeof a.parentNode;){a=a.parentNode;if("undefined"==typeof a)break;if(this.isTag(a,"ul")&&a.classList.contains("bbtreeview"))return null;if(this.isTag(a,b))break}return a}};class BBTreeviewNode{constructor(a,b){this.Treeview=a;this.Node=b}get Checkbox(){if(!this.Treeview.Options.ShowCheckbox)return null;const a=this.Node.querySelectorAll("div.icon.checkbox");return"undefined"==typeof a?null:a[0]}get ChildNode(){let a=this.Node.querySelectorAll("ul");return 0>=a.length?null:a[0]}get ChildNodes(){const a=this.ChildNode;if(null==a)return[];let b=a.querySelectorAll("li");if(0>=b.length)return[];let c=[];b.forEach(function(d){"undefined"!=typeof d.parentNode&&d.parentNode==
-if(this.isTag(a,b))break}return a}};class BBTreeviewNode{constructor(a){this.Treeview=a;this.Value=this.Label=this.Container=this.Node=this.ID=null;this.Hint=this.Name="";this.initialiseComponents()}initialiseComponents(){}get IsChecked(){return this.Treeview.Options.ShowCheckbox?this.Node.classList.contains("x"):!1}set IsChecked(a){const b=this;b.setCheckbox(b.Node,a);b.Node.querySelectorAll("li").forEach(function(d){b.setCheckbox(d,a)});let c=b.ParentNode;if(null!=c)if(b.Treeview.Options.EnablePullUp)for(;;){const d=0<c.querySelectorAll("li.x").length;
+a&&c.push(d)});return c}get IsChecked(){return this.Treeview.Options.ShowCheckbox?this.Node.classList.contains("x"):!1}get Container(){return this.Node.querySelectorAll("div.li")[0]}get Hint(){return this.Label.getAttribute("title")}get ID(){return this.Node.getAttribute("data-bbtv-id")}get IsExpanded(){return this.Node.classList.contains("e")?!0:this.Node.classList.contains("c")?!1:null}get IsHighlighted(){return this.Container.classList.contains("highlighted")}get Label(){return this.Node.querySelectorAll("span")[0]}get Name(){return this.Label.textContent}get ParentID(){const a=
-b.setCheckbox(c,d);c=b.Treeview.getNode(c);c=c.ParentNode;if(null==c)break}else{let d=0;c.querySelectorAll("li").forEach(function(e){e.classList.contains("x")||d++});b.setCheckbox(c,0>=d)}}get IsExpanded(){return this.Node.classList.contains("e")?!0:this.Node.classList.contains("c")?!1:null}get IsHighlighted(){return this.Container.classList.contains("highlighted")}get Tag(){let a=this.Node.getAttribute("data-bbtv-tag");return this.Treeview.isNullOrWhitespace(a)?null:JSON.parse(decodeURIComponent(a))}get ParentID(){return this.ParentNodeID}get ParentNodeID(){const a=
+this.ParentNode;return null==a?null:a.getAttribute("data-bbtv-id")}get ParentNode(){return this.parentsUntilTagName(this.Node,"li")}get Tag(){let a=this.Node.getAttribute("data-bbtv-tag");return this.Treeview.isNullOrWhitespace(a)?null:JSON.parse(decodeURIComponent(a))}get Value(){return this.Node.getAttribute("data-bbtv-value")}Check(a){const b=this;b.setCheckbox(b.Node,a);b.Node.querySelectorAll("li").forEach(function(d){b.setCheckbox(d,a)});let c=b.ParentNode;if(null!=c)if(b.Treeview.Options.EnablePullUp)for(;;){const d=
-this.ParentNode;return null==a?null:a.getAttribute("data-bbtv-id")}get ParentNode(){return this.parentsUntilTagName(this.Node,"li")}Load(a){this.ID=a.getAttribute("data-bbtv-id");this.Node=a;this.Container=a.querySelectorAll("div.li")[0];this.Label=a.querySelectorAll("span")[0];this.Value=a.getAttribute("data-bbtv-value");this.Name=this.Label.textContent;this.Hint=this.Label.getAttribute("title");this.initialiseComponents_Events()}Collapse(){this.Node.classList.contains("e")&&(this.Node.classList.remove("e"),
+0<c.querySelectorAll("li.x").length;b.setCheckbox(c,d);c=b.Treeview.getNode(c);c=c.ParentNode;if(null==c)break}else{let d=0;c.querySelectorAll("li").forEach(function(e){e.classList.contains("x")||d++});b.setCheckbox(c,0>=d)}}Collapse(){this.Node.classList.contains("e")&&(this.Node.classList.remove("e"),this.Node.classList.add("c"));this.ChildNodes.forEach(function(a){a.classList.add("hidden")})}Expand(){this.Node.classList.contains("c")&&(this.Node.classList.remove("c"),this.Node.classList.add("e"));
-this.Node.classList.add("c"));this.GetChildNodes().forEach(function(a){a.classList.add("hidden")})}Expand(){this.Node.classList.contains("c")&&(this.Node.classList.remove("c"),this.Node.classList.add("e"));this.GetChildNodes().forEach(function(a){a.classList.remove("hidden")})}GetCheckbox(){if(!this.Treeview.Options.ShowCheckbox)return null;const a=this.Node.querySelectorAll("div.icon.checkbox");return"undefined"==typeof a?null:a[0]}GetChildNode(){let a=this.Node.querySelectorAll("ul");return 0>=
+this.ChildNodes.forEach(function(a){a.classList.remove("hidden")})}Remove(){null!=this.ParentNode&&(this.ParentNode.classList.contains("e")&&this.ParentNode.classList.remove("e"),this.ParentNode.classList.contains("c")&&this.ParentNode.classList.remove("c"));this.Node.parentNode.removeChild(this.Node)}InvalidateEvents(){const a=this;a.Node.addEventListener("click",function(b){b.stopPropagation();b.preventDefault();!a.isTag(b.target,"li")||0>b.offsetX||16<b.offsetX||0>b.offsetY||16<b.offsetY||(b=a.Treeview.getNode(b.target),
-a.length?null:a[0]}GetChildNodes(){const a=this.GetChildNode();if(null==a)return[];let b=a.querySelectorAll("li");if(0>=b.length)return[];let c=[];b.forEach(function(d){"undefined"!=typeof d.parentNode&&d.parentNode==a&&c.push(d)});return c}Remove(){null!=this.ParentNode&&(this.ParentNode.classList.contains("e")&&this.ParentNode.classList.remove("e"),this.ParentNode.classList.contains("c")&&this.ParentNode.classList.remove("c"));this.Node.parentNode.removeChild(this.Node)}Toggle(){switch(this.IsExpanded){case !0:this.Collapse();
+null!=b&&b.Toggle())});a.Container.addEventListener("dblclick",function(b){b.stopPropagation();b.preventDefault();b=a.Treeview.getNode(b.target);null!=b&&b.Toggle()});a.Treeview.Options.ShowCheckbox&&(a.Checkbox.addEventListener("mousedown",function(b){b.stopPropagation();b.preventDefault();a.Check(!a.IsChecked)}),a.Checkbox.addEventListener("click",function(b){b.stopPropagation();b.preventDefault()}),a.Checkbox.addEventListener("dblclick",function(b){b.stopPropagation();b.preventDefault()}));a.Container.addEventListener("mousedown",
-break;case !1:this.Expand()}}initialiseComponents_Events(){const a=this;a.Node.addEventListener("click",function(b){b.stopPropagation();b.preventDefault();!a.isTag(b.target,"li")||0>b.offsetX||16<b.offsetX||0>b.offsetY||16<b.offsetY||(b=a.Treeview.getNode(b.target),null!=b&&b.Toggle())});a.Container.addEventListener("dblclick",function(b){b.stopPropagation();b.preventDefault();b=a.Treeview.getNode(b.target);null!=b&&b.Toggle()});a.Treeview.Options.ShowCheckbox&&(a.GetCheckbox().addEventListener("mousedown",
+function(b){b.stopPropagation();b.preventDefault();b=a.Treeview.getNode(b.target);null!=b&&(a.Treeview.Container.querySelectorAll("div.highlighted").forEach(function(c){c.classList.remove("highlighted")}),a.Treeview.Options.ShowSelection&&b.Container.classList.add("highlighted"))});a.invalidateCollapsible()}Toggle(){switch(this.IsExpanded){case !0:this.Collapse();break;case !1:this.Expand()}}invalidateCollapsible(){null!=this.ParentNode&&(this.ParentNode.classList.contains("c")?this.Node.classList.add("hidden"):
-function(b){b.stopPropagation();b.preventDefault();a.IsChecked=!a.IsChecked}),a.GetCheckbox().addEventListener("click",function(b){b.stopPropagation();b.preventDefault()}),a.GetCheckbox().addEventListener("dblclick",function(b){b.stopPropagation();b.preventDefault()}));a.Container.addEventListener("mousedown",function(b){b.stopPropagation();b.preventDefault();b=a.Treeview.getNode(b.target);null!=b&&(a.Treeview.Container.querySelectorAll("div.highlighted").forEach(function(c){c.classList.remove("highlighted")}),
+(this.ParentNode.classList.contains("e")||this.ParentNode.classList.add("e"),this.Node.classList.remove("hidden")))}isTag(a,b){return a.tagName.toLowerCase()==b}parentsUntilTagName(a,b){for(;"undefined"!=typeof a.parentNode;){a=a.parentNode;if("undefined"==typeof a)break;if(this.isTag(a,"ul")&&a.classList.contains("bbtreeview"))return null;if(this.isTag(a,b))break}return a}setCheckbox(a,b){b?a.classList.contains("x")||a.classList.add("x"):a.classList.contains("x")&&a.classList.remove("x")}};
-a.Treeview.Options.ShowSelection&&b.Container.classList.add("highlighted"))});a.invalidateCollapsible()}invalidateCollapsible(){null!=this.ParentNode&&(this.ParentNode.classList.contains("c")?this.Node.classList.add("hidden"):(this.ParentNode.classList.contains("e")||this.ParentNode.classList.add("e"),this.Node.classList.remove("hidden")))}isTag(a,b){return a.tagName.toLowerCase()==b}parentsUntilTagName(a,b){for(;"undefined"!=typeof a.parentNode;){a=a.parentNode;if("undefined"==typeof a)break;if(this.isTag(a,
-"ul")&&a.classList.contains("bbtreeview"))return null;if(this.isTag(a,b))break}return a}setCheckbox(a,b){console.log(a);b?a.classList.contains("x")||a.classList.add("x"):a.classList.contains("x")&&a.classList.remove("x")}};

src/bbtreeview.js

@@ -1,17 +1,10 @@
-/**
- * BBTreeview
- *
- * @suppress {missingProperties}
- * @suppress {undefinedVars}
- */
 class BBTreeview {
   constructor(options) {
-    this.Options = null;
+    this.Options = {};
 
     this.initialiseComponents(options);
   }
 
-
   initialiseComponents(options) {
     var a = this;
 
@@ -23,38 +16,33 @@ class BBTreeview {
       ShowIcon: true
     }, options);
 
-    a.createContainer();
+    // Replace treeview
+    a.createTreeview();
+
+    // a.Container = a.getTreeview();
   }
 
 
   get Container() {
-    const a = this;
+    return this.getTreeview();
-
-    let result = document.getElementsByTagName("body");
-    if (result.length <= 0) {
-      return null;
-    }
-
-    result = result[0].querySelectorAll(a.Options.ID);
-    if (result.length <= 0) {
-      return null;
-    }
-
-    if (result[0].querySelectorAll("ul.bbtreeview").length <= 0) {
-      result[0].innerHTML = "<ul class=\"bbtreeview\"></ul>";
-    }
-
-    result = result[0].querySelectorAll("ul.bbtreeview");
-    if (result.length <= 0) {
-      return null;
-    }
-
-    return result[0];
   }
 
+
   AddItem(options) {
     const a = this;
-    const _options = a.getOptions(options);
+    const _options = Object.assign({
+      ID: null,
+      ParentID: null,
+      Name: "",
+      Hint: "",
+      Value: "",
+      Icon: "folder",
+      Checked: false,
+      Tag: null
+    }, options);
+
+    if (_options.ID == null) _options.ID = a.generateID();
+    if (_options.Tag == null) _options.Tag = "";
 
     // Don't add duplicate
     if (a.Find(_options.ID) != null) {
@@ -73,11 +61,7 @@ class BBTreeview {
     if (parentNode == null) {
       parentNode = a.Container;
     } else {
-      parentNode = parentNode.GetChildNode();
+      parentNode = parentNode.ChildNode;
-    }
-
-    if (parentNode == null) {
-      return false;
     }
 
     const nodeHtml = a.generateNodeHtml(_options);
@@ -85,7 +69,10 @@ class BBTreeview {
     // Add node
     a.appendHtml(parentNode, nodeHtml);
 
-    // const node = a.Find(_options.ID);
+    const node = a.Find(_options.ID);
+
+    // Setup events
+    node.InvalidateEvents();
 
     return true;
   }
@@ -133,7 +120,7 @@ class BBTreeview {
     }
 
     a.GetAllNodes().forEach(function(e) {
-      e.IsChecked = value;
+      e.Check(value);
     });
   }
 
@@ -150,8 +137,7 @@ class BBTreeview {
       return null;
     }
 
-    let treenode = new BBTreeviewNode(this);
+    const treenode = new BBTreeviewNode(this, node[0]);
-    treenode.Load(node[0]);
 
     return treenode;
   }
@@ -217,7 +203,7 @@ class BBTreeview {
 
     let response = [];
     a.GetAllNodes().forEach(function(e) {
-      if (!e.Checked) {
+      if (!e.IsChecked) {
         return;
       }
 
@@ -238,7 +224,6 @@ class BBTreeview {
     return response;
   }
 
-
   GetCheckedTags() {
     const a = this;
 
@@ -255,7 +240,7 @@ class BBTreeview {
 
     let response = null;
     a.GetAllNodes().forEach(function(e) {
-      if (e.Highlighted) {
+      if (e.IsHighlighted) {
         response = e;
 
         return false;
@@ -265,45 +250,23 @@ class BBTreeview {
     return response;
   }
 
+
   appendHtml(el, html) {
     let node = document.createElement('template');
     node.innerHTML = html;
 
     node = node.content.firstChild;
 
-        console.log(el);
-    console.log(node);
-
     el.appendChild(node);
-
-    // const frag = document.createDocumentFragment();
-    // const span = document.createElement("span");
-    // span.innerHTML = html;
-
-    // for (var i = 0; i < span.childNodes.length; i++) {
-    //   frag.appendChild(span.childNodes[i]);
-    // }
-
-    // console.log(el);
-    // console.log(frag);
-
-    // el.appendChild(frag);
   }
 
-  createContainer() {
+  createTreeview() {
     const a = this;
 
-    let result = document.getElementsByTagName("body");
+    let container = a.getContainer();
-    if (result.length <= 0) {
+    if (container != null) {
-      return;
+      container.innerHTML = "<ul class=\"bbtreeview\"></ul>";
     }
-
-    result = result[0].querySelectorAll(a.Options.ID);
-    if (result.length <= 0) {
-      return;
-    }
-
-    result[0].innerHTML = "<ul class=\"bbtreeview\"></ul>";
   }
 
   generateID() {
@@ -339,6 +302,26 @@ class BBTreeview {
     return html;
   }
 
+  getContainer() {
+    const a = this;
+
+    let result = document.getElementsByTagName("body");
+    if (result.length <= 0) {
+      return;
+    }
+
+    result = result[0];
+
+    result = result.querySelectorAll(a.Options.ID);
+    if (result.length <= 0) {
+      return;
+    }
+
+    result = result[0];
+
+    return result;
+  }
+
   getNode(el) {
     const a = this;
 
@@ -358,29 +341,26 @@ class BBTreeview {
     return a.Find(id);
   }
 
-  getOptions(options) {
+  getTreeview() {
     const a = this;
 
-    let _options = Object.assign({
+    let container = a.getContainer();
-      ID: null,
+    if (container == null) {
-      ParentID: null,
+      return;
-      Name: "",
-      Hint: "",
-      Value: "",
-      Icon: "folder",
-      Checked: false,
-      Tag: null
-    }, options);
-
-    if (_options.ID == null) {
-      _options.ID = a.generateID();
     }
 
-    if (_options.Tag == null) {
+    // if (container.querySelectorAll("ul.bbtreeview").length <= 0) {
-      _options.Tag = "";
+    //   container.innerHTML = "<ul class=\"bbtreeview\"></ul>";
+    // }
+
+    container = container.querySelectorAll("ul.bbtreeview");
+    if (container.length <= 0) {
+      return;
     }
 
-    return _options;
+    container = container[0];
+
+    return container;
   }
 
   isNullOrWhitespace(value) {

src/bbtreeviewnode.js

@@ -1,34 +1,71 @@
-/***
- * BBTreeviewNode
- *
- * @suppress {missingProperties}
- */
 class BBTreeviewNode {
-  constructor(treeview) {
+  constructor(treeview, node) {
     this.Treeview = treeview;
+    this.Node = node;
 
-    this.ID = null;
+    // this.initialiseComponents();
-    this.Node = null;
-
-    this.Container = null;
-    this.Label = null;
-    this.Value = null;
-
-    this.Name = "";
-    this.Hint = "";
-
-    // this.ParentID = null;
-    // this.IsChecked = false;
-    // this.Highlighted = false;
-
-    this.initialiseComponents();
   }
 
+  // initialiseComponents() {
+  //   const a = this;
 
-  initialiseComponents() {
+  // }
+
+
+  get Checkbox() {
     const a = this;
+
+    if (!a.Treeview.Options.ShowCheckbox) {
+      return null;
+    }
+
+    const checkboxes = a.Node.querySelectorAll("div.icon.checkbox");
+    if (typeof(checkboxes) == "undefined") {
+      return null;
+    }
+
+    return checkboxes[0];
   }
 
+  get ChildNode() {
+    const a = this;
+
+    let result = a.Node.querySelectorAll("ul");
+    if (result.length <= 0) {
+      return null;
+    }
+
+    return result[0];
+  }
+
+  get ChildNodes() {
+    const a = this;
+
+    const childNode = a.ChildNode;
+    if (childNode == null) {
+      return [];
+    }
+
+    let nodes = childNode.querySelectorAll("li");
+    if (nodes.length <= 0) {
+      return [];
+    }
+
+    let result = [];
+    nodes.forEach(function(e) {
+      if (typeof(e.parentNode) == "undefined") {
+        return;
+      }
+
+      if (e.parentNode != childNode) {
+        return;
+      }
+
+      result.push(e);
+    });
+
+    return result;
+  }
 
   get IsChecked() {
     const a = this;
@@ -40,7 +77,80 @@ class BBTreeviewNode {
     return a.Node.classList.contains("x");
   }
 
-  set IsChecked(value) {
+  get Container() {
+    return this.Node.querySelectorAll("div.li")[0];
+  }
+
+  get Hint() {
+    return this.Label.getAttribute("title");
+  }
+
+  get ID() {
+    return this.Node.getAttribute("data-bbtv-id");
+  }
+
+  get IsExpanded() {
+    const a = this;
+
+    if (a.Node.classList.contains("e")) {
+      return true;
+    }
+
+    if (a.Node.classList.contains("c")) {
+      return false;
+    }
+
+    return null;
+  }
+
+  get IsHighlighted() {
+    const a = this;
+
+    return a.Container.classList.contains("highlighted");
+  }
+
+  get Label() {
+    return this.Node.querySelectorAll("span")[0];
+  }
+
+  get Name() {
+    return this.Label.textContent;
+  }
+
+  get ParentID() {
+    const a = this;
+
+    const parentNode = a.ParentNode;
+    if (parentNode == null) {
+      return null;
+    }
+
+    return parentNode.getAttribute("data-bbtv-id");
+  }
+
+  get ParentNode() {
+    const a = this;
+
+    return a.parentsUntilTagName(a.Node, "li");
+  }
+
+  get Tag() {
+    const a = this;
+
+    let tag = a.Node.getAttribute("data-bbtv-tag");
+    if (a.Treeview.isNullOrWhitespace(tag)) {
+      return null;
+    }
+
+    return JSON.parse(decodeURIComponent(tag));
+  }
+
+  get Value() {
+    return this.Node.getAttribute("data-bbtv-value");
+  }
+
+
+  Check(value) {
     const a = this;
 
     a.setCheckbox(a.Node, value);
@@ -85,78 +195,6 @@ class BBTreeviewNode {
     }
   }
 
-  get IsExpanded() {
-    const a = this;
-
-    if (a.Node.classList.contains("e")) {
-      return true;
-    }
-
-    if (a.Node.classList.contains("c")) {
-      return false;
-    }
-
-    return null;
-  }
-
-  get IsHighlighted() {
-    const a = this;
-
-    return (a.Container.classList.contains("highlighted"));
-  }
-
-  get Tag() {
-    const a = this;
-
-    let tag = a.Node.getAttribute("data-bbtv-tag");
-    if (a.Treeview.isNullOrWhitespace(tag)) {
-      return null;
-    }
-
-    return JSON.parse(decodeURIComponent(tag));
-  }
-
-  get ParentID() { return this.ParentNodeID; }
-
-  get ParentNodeID() {
-    const a = this;
-
-    const parentNode = a.ParentNode;
-    if (parentNode == null) {
-      return null;
-    }
-
-    return parentNode.getAttribute("data-bbtv-id");
-  }
-
-  get ParentNode() {
-    const a = this;
-
-    return a.parentsUntilTagName(a.Node, "li");
-  }
-
-
-  Load(node) {
-    const a = this;
-
-    a.ID = node.getAttribute("data-bbtv-id");
-    a.Node = node;
-
-    a.Container = node.querySelectorAll("div.li")[0];
-    a.Label = node.querySelectorAll("span")[0];
-    a.Value = node.getAttribute("data-bbtv-value");
-
-    a.Name = a.Label.textContent;
-    a.Hint = a.Label.getAttribute("title");
-
-    // a.ParentID = a.ParentNodeID;
-    // a.IsChecked = a.IsChecked;
-    // a.Highlighted = a.IsHighlighted;
-    // a.Tag = a.Tag;
-
-    a.initialiseComponents_Events();
-  }
-
   Collapse() {
     const a = this;
 
@@ -165,7 +203,7 @@ class BBTreeviewNode {
       a.Node.classList.add("c");
     }
 
-    a.GetChildNodes().forEach(function(e) {
+    a.ChildNodes.forEach(function(e) {
       e.classList.add("hidden");
     });
   }
@@ -178,66 +216,11 @@ class BBTreeviewNode {
       a.Node.classList.add("e");
     }
 
-    a.GetChildNodes().forEach(function(e) {
+    a.ChildNodes.forEach(function(e) {
       e.classList.remove("hidden");
     });
   }
 
-  GetCheckbox() {
-    const a = this;
-
-    if (!a.Treeview.Options.ShowCheckbox) {
-      return null;
-    }
-
-    const checkboxes = a.Node.querySelectorAll("div.icon.checkbox");
-    if (typeof(checkboxes) == "undefined") {
-      return null;
-    }
-
-    return checkboxes[0];
-  }
-
-  GetChildNode() {
-    const a = this;
-
-    let result = a.Node.querySelectorAll("ul");
-    if (result.length <= 0) {
-      return null;
-    }
-
-    return result[0];
-  }
-
-  GetChildNodes() {
-    const a = this;
-
-    const childNode = a.GetChildNode();
-    if (childNode == null) {
-      return [];
-    }
-
-    let nodes = childNode.querySelectorAll("li");
-    if (nodes.length <= 0) {
-      return [];
-    }
-
-    let result = [];
-    nodes.forEach(function(e) {
-      if (typeof(e.parentNode) == "undefined") {
-        return;
-      }
-
-      if (e.parentNode != childNode) {
-        return;
-      }
-
-      result.push(e);
-    });
-
-    return result;
-  }
-
   Remove() {
     const a = this;
 
@@ -254,22 +237,7 @@ class BBTreeviewNode {
     a.Node.parentNode.removeChild(a.Node);
   }
 
-  Toggle() {
+  InvalidateEvents() {
-    const a = this;
-
-    switch (a.IsExpanded) {
-      case true:
-        a.Collapse();
-        break;
-      case false:
-        a.Expand();
-        break;
-      default: break;
-    }
-  }
-
-
-  initialiseComponents_Events() {
     const a = this;
 
     // collapsible icon behaviour
@@ -308,21 +276,21 @@ class BBTreeviewNode {
 
     // checkbox behaviour
     if (a.Treeview.Options.ShowCheckbox) {
-      a.GetCheckbox().addEventListener("mousedown", function(e){
+      a.Checkbox.addEventListener("mousedown", function(e){
         e.stopPropagation();
         e.preventDefault();
 
-        a.IsChecked = !a.IsChecked;
+        a.Check(!a.IsChecked);
       });
 
-      a.GetCheckbox().addEventListener("click", function(e){
+      a.Checkbox.addEventListener("click", function(e){
         e.stopPropagation();
         e.preventDefault();
 
         // do nothing
       });
 
-      a.GetCheckbox().addEventListener("dblclick", function(e){
+      a.Checkbox.addEventListener("dblclick", function(e){
         e.stopPropagation();
         e.preventDefault();
 
@@ -355,6 +323,21 @@ class BBTreeviewNode {
     a.invalidateCollapsible();
   }
 
+  Toggle() {
+    const a = this;
+
+    switch (a.IsExpanded) {
+      case true:
+        a.Collapse();
+        break;
+      case false:
+        a.Expand();
+        break;
+      default: break;
+    }
+  }
+
+
   invalidateCollapsible() {
     const a = this;
 
@@ -408,9 +391,6 @@ class BBTreeviewNode {
   }
 
   setCheckbox(el, value) {
-
-    console.log(el);
-
     if (value) {
       if (!el.classList.contains("x")) {
         el.classList.add("x");

src/version.txt

@@ -1,4 +1,4 @@
 /**
  * BBTreeview
- * @version v0.1.2.011 (2024/01/07 0208)
+ * @version v0.1.2.044 (2024/01/09 2118)
  */