From 1e8daf3deda9f661ae526bb315f17328f84e7e4e Mon Sep 17 00:00:00 2001 From: SHIMODA Hiroshi Date: Fri, 9 Dec 2011 20:10:04 +0900 Subject: [PATCH] draw links in the "dummy" tab --- content/treestyletab/group.xul | 59 ++++++++++ content/treestyletab/treestyletab.css | 18 --- content/treestyletab/treestyletab.xul | 1 + modules/fullTooltip.js | 75 +++---------- modules/pseudoTreeBuilder.js | 131 ++++++++++++++++++++++ skin/classic/treestyletab/group/group.css | 12 ++ skin/classic/treestyletab/pseudo-tree.css | 20 ++++ 7 files changed, 239 insertions(+), 77 deletions(-) create mode 100644 modules/pseudoTreeBuilder.js create mode 100644 skin/classic/treestyletab/pseudo-tree.css diff --git a/content/treestyletab/group.xul b/content/treestyletab/group.xul index b36cefb0..2d3a3171 100644 --- a/content/treestyletab/group.xul +++ b/content/treestyletab/group.xul @@ -1,5 +1,6 @@ + + diff --git a/content/treestyletab/treestyletab.css b/content/treestyletab/treestyletab.css index 96330cfb..09d8b392 100644 --- a/content/treestyletab/treestyletab.css +++ b/content/treestyletab/treestyletab.css @@ -519,24 +519,6 @@ window[chromehidden~="toolbar"] opacity: 1; } -#treestyletab-full-tree-tooltip .treestyletab-full-tree-tooltip-favicon { - max-width: 16px; - max-height: 16px; -} - -#treestyletab-full-tree-tooltip .treestyletab-full-tree-tooltip-treerow { - -moz-box-align: center; -} - -#treestyletab-full-tree-tooltip .treestyletab-full-tree-tooltip-treerow .text-link { - -moz-box-crop: end; -} - -#treestyletab-full-tree-tooltip .treestyletab-full-tree-tooltip-treechildren { - margin-left: 1.5em; - -moz-box-align: stretch; -} - /* addon compatibility */ diff --git a/content/treestyletab/treestyletab.xul b/content/treestyletab/treestyletab.xul index 57e18e7c..c37b57b3 100644 --- a/content/treestyletab/treestyletab.xul +++ b/content/treestyletab/treestyletab.xul @@ -8,6 +8,7 @@ + diff --git a/modules/fullTooltip.js b/modules/fullTooltip.js index 6ea175e2..dc0c0707 100644 --- a/modules/fullTooltip.js +++ b/modules/fullTooltip.js @@ -39,6 +39,7 @@ const Cc = Components.classes; const Ci = Components.interfaces; Components.utils.import('resource://treestyletab-modules/utils.js'); +Components.utils.import('resource://treestyletab-modules/pseudoTreeBuilder.js'); function FullTooltipManager(aOwner) { @@ -51,10 +52,6 @@ FullTooltipManager.prototype = { kTOOLTIP_MODE_COLLAPSED : 1, kTOOLTIP_MODE_ALWAYS : 2, - kFAVICON : 'treestyletab-full-tree-tooltip-favicon', - kTREEROW : 'treestyletab-full-tree-tooltip-treerow', - kTREECHILDREN : 'treestyletab-full-tree-tooltip-treechildren', - get window() { return this.owner.window; @@ -84,7 +81,8 @@ FullTooltipManager.prototype = { this.tabTooltip.addEventListener('popupshowing', this, true); this.tabTooltip.addEventListener('popuphiding', this, true); - this.tabFullTooltip.addEventListener('click', this, true); + this.tabFullTooltip.addEventListener('click', this, false); + this.tabFullTooltip.addEventListener(PseudoTreeBuilder.kTAB_LINK_CLICK, this, false); this.tabFullTooltip.addEventListener('popupshown', this, true); this.tabFullTooltip.addEventListener('popuphidden', this, true); }, @@ -97,7 +95,8 @@ FullTooltipManager.prototype = { this.tabTooltip.removeEventListener('popupshowing', this, true); this.tabTooltip.removeEventListener('popuphiding', this, true); - this.tabFullTooltip.removeEventListener('click', this, true); + this.tabFullTooltip.removeEventListener('click', this, false); + this.tabFullTooltip.removeEventListener(PseudoTreeBuilder.kTAB_LINK_CLICK, this, false); this.tabFullTooltip.removeEventListener('popupshown', this, true); this.tabFullTooltip.removeEventListener('popuphidden', this, true); @@ -111,6 +110,9 @@ FullTooltipManager.prototype = { case 'click': return this.onClick(aEvent); + case PseudoTreeBuilder.kTAB_LINK_CLICK: + return this.onItemClick(aEvent); + case 'popupshowing': return this.onDefaultTooltipShowing(aEvent); @@ -148,18 +150,17 @@ FullTooltipManager.prototype = { onClick : function FTM_onClick(aEvent) { - var label = this.evaluateXPath( - 'ancestor-or-self::xul:label[@class="text-link"][1]', - aEvent.target, - Ci.nsIDOMXPathResult.FIRST_ORDERED_NODE_TYPE - ).singleNodeValue; - if (label) { - let id = label.getAttribute(this.kID); + this.tabFullTooltip.hidePopup(); + }, + + onItemClick : function FTM_onItemClick(aEvent) + { + var id = aEvent.getData('id'); + if (id) { let tab = this.getTabById(id, this.owner.browser); if (tab) this.owner.browser.selectedTab = tab; } - this.tabFullTooltip.hidePopup(); }, @@ -399,7 +400,7 @@ FullTooltipManager.prototype = { { this.clear(); - var tree = this.createTabItem(aTab); + var tree = PseudoTreeBuilder.build(aTab); var root = this.document.createElement('arrowscrollbox'); root.setAttribute('orient', 'vertical'); root.setAttribute('flex', 1); @@ -427,49 +428,5 @@ FullTooltipManager.prototype = { range.selectNodeContents(this.tabFullTooltip); range.deleteContents(); range.detach(); - }, - - createTabItem : function FTM_createTabItem(aTab) - { - var item = this.document.createElement('hbox'); - item.setAttribute('class', this.kTREEROW); - - var favicon = item.appendChild(this.document.createElement('image')); - favicon.setAttribute('src', aTab.getAttribute('image') || 'chrome://mozapps/skin/places/defaultFavicon.png'); - favicon.setAttribute('class', this.kFAVICON); - - var label = item.appendChild(this.document.createElement('label')); - label.setAttribute('value', aTab.label); - var tooltip = aTab.label; - var uri = aTab.linkedBrowser.currentURI.spec; - if (uri != 'about:blank') tooltip += '\n' + uri; - label.setAttribute('tooltiptext', tooltip); - label.setAttribute('class', 'text-link'); - label.setAttribute(this.kID, this.getTabValue(aTab, this.kID)); - - var children = this.createTabChildren(aTab); - if (children) { - let container = this.document.createElement('vbox'); - container.appendChild(item); - container.appendChild(children); - return container; - } - else { - return item; - } - }, - - createTabChildren : function FTM_createTabChildren(aTab) - { - var children = this.getChildTabs(aTab); - if (!children.length) - return null; - - var container = this.document.createElement('vbox'); - children.forEach(function(aChild) { - container.appendChild(this.createTabItem(aChild)); - }, this); - container.setAttribute('class', this.kTREECHILDREN); - return container; } }; diff --git a/modules/pseudoTreeBuilder.js b/modules/pseudoTreeBuilder.js new file mode 100644 index 00000000..cd7fc33a --- /dev/null +++ b/modules/pseudoTreeBuilder.js @@ -0,0 +1,131 @@ +/* ***** BEGIN LICENSE BLOCK ***** + * Version: MPL 1.1/GPL 2.0/LGPL 2.1 + * + * The contents of this file are subject to the Mozilla Public License Version + * 1.1 (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * http://www.mozilla.org/MPL/ + * + * Software distributed under the License is distributed on an "AS IS" basis, + * WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License + * for the specific language governing rights and limitations under the + * License. + * + * The Original Code is the Tree Style Tab. + * + * The Initial Developer of the Original Code is SHIMODA Hiroshi. + * Portions created by the Initial Developer are Copyright (C) 2011 + * the Initial Developer. All Rights Reserved. + * + * Contributor(s): SHIMODA Hiroshi + * + * Alternatively, the contents of this file may be used under the terms of + * either the GNU General Public License Version 2 or later (the "GPL"), or + * the GNU Lesser General Public License Version 2.1 or later (the "LGPL"), + * in which case the provisions of the GPL or the LGPL are applicable instead + * of those above. If you wish to allow use of your version of this file only + * under the terms of either the GPL or the LGPL, and not to allow others to + * use your version of this file under the terms of the MPL, indicate your + * decision by deleting the provisions above and replace them with the notice + * and other provisions required by the GPL or the LGPL. If you do not delete + * the provisions above, a recipient may use your version of this file under + * the terms of any one of the MPL, the GPL or the LGPL. + * + * ***** END LICENSE BLOCK ******/ + +const EXPORTED_SYMBOLS = ['PseudoTreeBuilder']; + +const Cc = Components.classes; +const Ci = Components.interfaces; + +Components.utils.import('resource://treestyletab-modules/utils.js'); + +var PseudoTreeBuilder = { + __proto__ : TreeStyleTabUtils, + + kFAVICON : 'treestyletab-pseudo-tree-favicon', + kROOTITEM : 'treestyletab-pseudo-tree-root-item', + kTREEITEM : 'treestyletab-pseudo-tree-item', + kTREEROW : 'treestyletab-pseudo-tree-row', + kTREECHILDREN : 'treestyletab-pseudo-tree-children', + + kTAB_LINK_CLICK : 'nsDOMTSTPseudoTreeItemClick', + + build : function TB_build(aTab) + { + if (!aTab) + return null; + + var tree = this.createTabItem(aTab); + + tree.querySelector("."+this.kTREEROW) + .className += " "+this.kROOTITEM; + + tree.setAttribute('onclick', .toString().replace('%EVENT_TYPE%', this.kTAB_LINK_CLICK.quote())); + + return tree; + }, + + createTabItem : function TB_createTabItem(aTab) + { + var doc = aTab.ownerDocument; + + var item = doc.createElement('hbox'); + item.setAttribute('class', this.kTREEROW); + + var favicon = item.appendChild(doc.createElement('image')); + favicon.setAttribute('src', aTab.getAttribute('image') || 'chrome://mozapps/skin/places/defaultFavicon.png'); + favicon.setAttribute('class', this.kFAVICON); + + var label = item.appendChild(doc.createElement('label')); + label.setAttribute('value', aTab.label); + var tooltip = aTab.label; + var uri = aTab.linkedBrowser.currentURI.spec; + if (uri != 'about:blank') tooltip += '\n' + uri; + label.setAttribute('tooltiptext', tooltip); + label.setAttribute('class', 'text-link '+this.kTREEITEM); + label.setAttribute('tab-id', this.getTabValue(aTab, this.kID)); + + var children = this.createTabChildren(aTab); + if (children) { + let container = doc.createElement('vbox'); + container.appendChild(item); + container.appendChild(children); + return container; + } + else { + return item; + } + }, + + createTabChildren : function TB_createTabChildren(aTab) + { + var doc = aTab.ownerDocument; + + var children = this.getChildTabs(aTab); + if (!children.length) + return null; + + var container = doc.createElement('vbox'); + children.forEach(function(aChild) { + container.appendChild(this.createTabItem(aChild)); + }, this); + container.setAttribute('class', this.kTREECHILDREN); + return container; + } +}; diff --git a/skin/classic/treestyletab/group/group.css b/skin/classic/treestyletab/group/group.css index 91568302..97fd5747 100644 --- a/skin/classic/treestyletab/group/group.css +++ b/skin/classic/treestyletab/group/group.css @@ -57,3 +57,15 @@ bottom: 0; left: auto; } + + +#tree { + margin-top: 1em; + max-height: 80%; + overflow: auto; + -moz-box-flex: 1; +} + +.treestyletab-pseudo-tree-root-item { + display: none; +} diff --git a/skin/classic/treestyletab/pseudo-tree.css b/skin/classic/treestyletab/pseudo-tree.css new file mode 100644 index 00000000..28b82789 --- /dev/null +++ b/skin/classic/treestyletab/pseudo-tree.css @@ -0,0 +1,20 @@ +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +.treestyletab-pseudo-tree-favicon { + max-width: 16px; + max-height: 16px; +} + +.treestyletab-pseudo-tree-row { + -moz-box-align: center; +} + +.treestyletab-pseudo-tree-row label.text-link { + -moz-box-crop: end; +} + +.treestyletab-pseudo-tree-children { + margin-left: 1.5em; + -moz-box-align: stretch; +} +