From 8506d7e4d7f30ab776ac98b81e531131a7df93c0 Mon Sep 17 00:00:00 2001
From: YUKI Hiroshi <shimoda@clear-code.com>
Date: Fri, 4 Mar 2016 11:35:12 +0900
Subject: [PATCH] Implement pseudo tree only with XUL.

There is no need to use XHTML, just needed to apply "display:block"...
---
 content/treestyletab/treestyletab.css |  6 ++++++
 modules/pseudoTreeBuilder.js          | 12 +++++-------
 skin/classic/treestyletab/group.css   | 13 +++++++++----
 3 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/content/treestyletab/treestyletab.css b/content/treestyletab/treestyletab.css
index ecf5c546..4c505d63 100644
--- a/content/treestyletab/treestyletab.css
+++ b/content/treestyletab/treestyletab.css
@@ -690,6 +690,12 @@ window[chromehidden~="toolbar"]
 	opacity: 1;
 }
 
+/* required to apply CSS multi columns */
+#treestyletab-full-tree-tooltip .treestyletab-pseudo-tree-root,
+#treestyletab-full-tree-tooltip .treestyletab-pseudo-tree-root vbox {
+	display: block;
+}
+
 
 /* addon compatibility */
 
diff --git a/modules/pseudoTreeBuilder.js b/modules/pseudoTreeBuilder.js
index 4b364b03..95e67fe8 100644
--- a/modules/pseudoTreeBuilder.js
+++ b/modules/pseudoTreeBuilder.js
@@ -44,8 +44,6 @@ Components.utils.import('resource://gre/modules/XPCOMUtils.jsm');
 XPCOMUtils.defineLazyModuleGetter(this, 'TreeStyleTabBase', 'resource://treestyletab-modules/base.js');
 
 var PseudoTreeBuilder = {
-	XHTMLNS : 'http://www.w3.org/1999/xhtml',
-
 	kFAVICON      : 'treestyletab-pseudo-tree-favicon',
 	kROOT         : 'treestyletab-pseudo-tree-root',
 	kROOTITEM     : 'treestyletab-pseudo-tree-root-item',
@@ -98,10 +96,10 @@ var PseudoTreeBuilder = {
 		var doc = aTab.ownerDocument;
 		var w = doc.defaultView;
 
-		var item = doc.createElementNS(this.XHTMLNS, 'div');
+		var item = doc.createElement('vbox');
 		item.setAttribute('class', this.kTREEITEM);
 
-		var favicon = item.appendChild(doc.createElementNS(this.XHTMLNS, 'img'));
+		var favicon = item.appendChild(doc.createElement('image'));
 		favicon.setAttribute('src', aTab.getAttribute('image') || 'chrome://mozapps/skin/places/defaultFavicon.png');
 		favicon.setAttribute('class', this.kFAVICON);
 
@@ -115,13 +113,13 @@ var PseudoTreeBuilder = {
 		label.setAttribute('class', 'text-link');
 		label.setAttribute('tab-id', TreeStyleTabBase.getTabValue(aTab, TreeStyleTabBase.kID));
 
-		var row = doc.createElementNS(this.XHTMLNS, 'div');
+		var row = doc.createElement('vbox');
 		row.setAttribute('class', this.kTREEROW);
 		row.appendChild(item);
 
 		var children = this.createTabChildren(aTab);
 		if (children) {
-			let container = doc.createElementNS(this.XHTMLNS, 'div');
+			let container = doc.createElement('vbox');
 			container.appendChild(row);
 			container.appendChild(children);
 			return container;
@@ -139,7 +137,7 @@ var PseudoTreeBuilder = {
 		if (!children.length)
 			return null;
 
-		var container = doc.createElementNS(this.XHTMLNS, 'div');
+		var container = doc.createElement('vbox');
 		container.setAttribute('class', this.kTREECHILDREN);
 		for (let i = 0, maxi = children.length; i < maxi; i++)
 		{
diff --git a/skin/classic/treestyletab/group.css b/skin/classic/treestyletab/group.css
index 14d1d8d7..44762f02 100644
--- a/skin/classic/treestyletab/group.css
+++ b/skin/classic/treestyletab/group.css
@@ -1,5 +1,4 @@
 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
-@namespace xhtml url("http://www.w3.org/1999/xhtml");
 
 :root {
 	appearance: window;
@@ -66,10 +65,16 @@
 	-moz-box-flex: 1;
 }
 
-*|*.treestyletab-pseudo-tree-root-item {
+/* required to apply CSS multi columns */
+.treestyletab-pseudo-tree-root,
+.treestyletab-pseudo-tree-root vbox {
+	display: block;
+}
+
+.treestyletab-pseudo-tree-root-item {
 	display: none !important;
 }
-*|*.treestyletab-pseudo-tree-root-item +
-  *|*.treestyletab-pseudo-tree-children > *|* {
+.treestyletab-pseudo-tree-root-item +
+  .treestyletab-pseudo-tree-children > * {
 	margin-left: 0 !important;
 }