stonewareslord/treestyletab
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge branch 'master' of github.com:piroor/treestyletab

Browse Source
This commit is contained in:
SHIMODA Hiroshi 2012-02-03 12:22:04 +09:00
commit dd275b4e24
12 changed files with 119 additions and 536 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
content/treestyletab/res/tabFx2Compatible.css
View File

@ -1,79 +0,0 @@
/*
Firefox 2 compatible tab structure library for Firefox 3 or later
Usage:
<?xul-overlay href="tabFx2Compatible.xul"?>
license: The MIT License, Copyright (c) 2009-2011 SHIMODA "Piro" Hiroshi
http://github.com/piroor/fxaddonlibs/blob/master/license.txt
original:
http://github.com/piroor/fxaddonlibs/blob/master/tabFx2Compatible.xul
http://github.com/piroor/fxaddonlibs/blob/master/tabFx2Compatible.xml
http://github.com/piroor/fxaddonlibs/blob/master/tabFx2Compatible.css
*/
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
:root[tabFx2Compatible="15"]
.tabbrowser-tab {
-moz-binding: url(tabFx2Compatible.xml#tabbrowser-tab-3) !important;
}
:root[tabFx2Compatible="15"][tabFx2Compatible-flags~="separate-tabContextMenu"]
.tabbrowser-tab {
-moz-binding: url(tabFx2Compatible.xml#tabbrowser-tab-4) !important;
}
:root[tabFx2Compatible="15"]:not([tabFx2Compatible-flags~="png-throbber"])[tabFx2Compatible-flags~="fx3"]
.tab-icon-image[busy] {
list-style-image: url("chrome://global/skin/throbber/Throbber-small.gif") !important;
opacity: 0.6;
}
:root[tabFx2Compatible="15"][tabFx2Compatible-flags~="png-throbber"][tabFx2Compatible-flags~="fx3"]
.tab-icon-image[busy] {
list-style-image: url("chrome://global/skin/icons/loading_16.png") !important;
}
:root[tabFx2Compatible="15"][tabFx2Compatible-flags~="mac"][tabFx2Compatible-flags~="png-throbber"]
.tab-icon-image {
list-style-image: url("chrome://global/skin/tree/item.png");
}
:root[tabFx2Compatible="15"][tabFx2Compatible-flags~="blank-favicon"]
.tab-icon-image {
list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
}
:root[tabFx2Compatible="15"][tabFx2Compatible-flags~="mac"]
.tabbrowser-tab:not(:hover) .tab-icon-image:not([selected="true"]) {
opacity: 0.6;
}
:root[tabFx2Compatible="15"]
.tabbrowser-tab:focus > .tab-image-middle {
outline: 1px dotted;
}
/* we must split declarations for old Gecko */
:root[tabFx2Compatible="15"]
.tabbrowser-tab:-moz-focusring > .tab-stack {
outline: 1px dotted;
}
:root[tabFx2Compatible="15"]
.tab-image-left[pinned="true"],
:root[tabFx2Compatible="15"]
.tab-image-right[pinned="true"] {
display: none !important;
}
/* Tab Utilities */
:root[tabFx2Compatible="15"]
.tabbrowser-tabs[highlightLocked][highlightSelected][highlightUnread]
> .tabbrowser-tab .tab-icon > .tab-icon-image ~ *,
:root[tabFx2Compatible="15"]
.tabbrowser-tabs[highlightlocked][highlightselected][highlightunread]
> .tabbrowser-tab .tab-icon > .tab-icon-image ~ * {
background: none !important;
}

107
content/treestyletab/res/tabFx2Compatible.xml
View File

@ -1,107 +0,0 @@
<?xml version="1.0"?>
<!--
Firefox 2 compatible tab structure library for Firefox 3 or later
Usage:
<?xul-overlay href="tabFx2Compatible.xul"?>
license: The MIT License, Copyright (c) 2009-2011 SHIMODA "Piro" Hiroshi
http://github.com/piroor/fxaddonlibs/blob/master/license.txt
original:
http://github.com/piroor/fxaddonlibs/blob/master/tabFx2Compatible.xul
http://github.com/piroor/fxaddonlibs/blob/master/tabFx2Compatible.xml
http://github.com/piroor/fxaddonlibs/blob/master/tabFx2Compatible.css
-->
<!DOCTYPE bindings [
<!ENTITY % tabBrowserDTD SYSTEM "chrome://browser/locale/tabbrowser.dtd" >
%tabBrowserDTD;
<!ENTITY % globalDTD SYSTEM "chrome://global/locale/global.dtd">
%globalDTD;
]>
<bindings id="tabFx2CompatibleBindings"
xmlns="http://www.mozilla.org/xbl"
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
xmlns:xbl="http://www.mozilla.org/xbl">
<binding id="tabbrowser-tab-3"
extends="chrome://browser/content/tabbrowser.xml#tabbrowser-tab">
<content chromedir="&locale.dir;"
closetabtext="&closeTab.label;">
<xul:hbox xbl:inherits="fadein,pinned,selected"
class="tab-image-left"/>
<xul:hbox xbl:inherits="fadein,pinned,selected"
flex="1"
align="center"
class="tab-image-middle">
<xul:stack class="tab-icon">
<xul:image xbl:inherits="validate,src=image,fadein,pinned,busy,stalled,progress,selected"
class="tab-icon-image"
role="presentation"/>
<xul:image class="tab-extra-status"/>
</xul:stack>
<xul:label xbl:inherits="value=label,crop,accesskey,fadein,pinned,selected"
flex="1"
class="tab-text"
role="presentation"/>
</xul:hbox>
<xul:toolbarbutton xbl:inherits="fadein,pinned,selected"
anonid="close-button"
tabindex="-1"
clickthrough="never"
class="tab-close-button"/>
<xul:hbox xbl:inherits="fadein,pinned,selected"
class="tab-image-right"/>
</content>
</binding>
<binding id="tabbrowser-tab-4"
extends="chrome://browser/content/tabbrowser.xml#tabbrowser-tab">
<content context="tabContextMenu"
closetabtext="&closeTab.label;">
<xul:stack class="tab-stack" flex="1">
<xul:hbox xbl:inherits="pinned,selected,titlechanged"
class="tab-background">
<xul:hbox xbl:inherits="pinned,selected,titlechanged"
class="tab-background-start"/>
<xul:hbox xbl:inherits="pinned,selected,titlechanged"
class="tab-background-middle"/>
<xul:hbox xbl:inherits="pinned,selected,titlechanged"
class="tab-background-end"/>
</xul:hbox>
<xul:hbox xbl:inherits="pinned,selected,titlechanged"
class="tab-content" align="center">
<xul:hbox xbl:inherits="fadein,pinned,selected"
class="tab-image-left"/>
<xul:hbox xbl:inherits="fadein,pinned,selected"
flex="1"
align="center"
class="tab-image-middle">
<xul:stack class="tab-icon">
<xul:image xbl:inherits="fadein,pinned,busy,progress,selected"
class="tab-throbber"
role="presentation"/>
<xul:image xbl:inherits="validate,src=image,fadein,pinned,busy,selected"
class="tab-icon-image"
role="presentation"/>
<xul:image class="tab-extra-status"/>
</xul:stack>
<xul:label xbl:inherits="value=label,crop,accesskey,fadein,pinned,selected"
flex="1"
class="tab-text tab-label"
role="presentation"/>
</xul:hbox>
<xul:toolbarbutton xbl:inherits="fadein,pinned,selected"
anonid="close-button"
tabindex="-1"
clickthrough="never"
class="tab-close-button"/>
<xul:hbox xbl:inherits="fadein,pinned,selected"
class="tab-image-right"/>
</xul:hbox>
</xul:stack>
</content>
</binding>
</bindings>

92
content/treestyletab/res/tabFx2Compatible.xul
View File

@ -1,92 +0,0 @@
<?xml version="1.0"?>
<!--
Firefox 2 compatible tab structure library for Firefox 3 or later
Usage:
<?xul-overlay href="tabFx2Compatible.xul"?>
license: The MIT License, Copyright (c) 2009-2011 SHIMODA "Piro" Hiroshi
http://github.com/piroor/fxaddonlibs/blob/master/license.txt
original:
http://github.com/piroor/fxaddonlibs/blob/master/tabFx2Compatible.xul
http://github.com/piroor/fxaddonlibs/blob/master/tabFx2Compatible.xml
http://github.com/piroor/fxaddonlibs/blob/master/tabFx2Compatible.css
-->
<?xml-stylesheet href="tabFx2Compatible.css" type="text/css"?>
<overlay xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script type="application/javascript"><![CDATA[
window.addEventListener('DOMContentLoaded', function() {
window.removeEventListener('DOMContentLoaded', arguments.callee, true);
const currentRevision = 15;
var b = document.getElementById('content');
if (!b || b.localName != 'tabbrowser') return;
var root = document.documentElement;
var loadedRevision = root.getAttribute('tabFx2Compatible');
if (loadedRevision) {
loadedRevision = Number(loadedRevision);
if (loadedRevision >= currentRevision) {
return;
}
else if (loadedRevision < currentRevision) {
root.setAttribute('tabFx2Compatible', currentRevision);
return;
}
}
const Cc = Components.classes;
const Ci = Components.interfaces;
const XULAppInfo = Cc['@mozilla.org/xre/app-info;1']
.getService(Ci.nsIXULAppInfo)
.QueryInterface(Ci.nsIXULRuntime);
const Comparator = Cc['@mozilla.org/xpcom/version-comparator;1']
.getService(Ci.nsIVersionComparator);
var url = window.getComputedStyle(b.selectedTab, '').getPropertyValue('-moz-binding');
url = url.match(/url\((.+)\)/);
if (url) {
url = url[1];
if (url && url.indexOf('"') == 0)
url = url.replace(/^"|"$/g, '');
else if (url && url.indexOf("'") == 0)
url = url.replace(/^'|'$/g, '');
}
switch (url)
{
case 'chrome://browser/skin/browser.xml#tabbrowser-tab': // defied by theme
const Pref = Components.classes['@mozilla.org/preferences;1']
.getService(Components.interfaces.nsIPrefBranch);
var skin = decodeURIComponent(escape(Pref.getCharPref('general.skins.selectedSkin')));
switch (skin.toLowerCase())
{
case 'classic/1.0': // Default
case 'chromifox': // Chromifox Basic: https://addons.mozilla.org/firefox/addon/8782
break;
default:
return;
}
case 'chrome://browser/content/tabbrowser.xml#tabbrowser-tab': // built-in
root.setAttribute('tabFx2Compatible', currentRevision);
var flags = [];
if (XULAppInfo.OS.toLowerCase().indexOf('darwin') > -1)
flags.push('mac');
if (Comparator.compare(XULAppInfo.version, '3.1') >= 0)
flags.push('png-throbber');
if (Comparator.compare(XULAppInfo.version, '4.0b1') >= 0)
flags.push('separate-tabContextMenu');
if (Comparator.compare(XULAppInfo.version, '7.0') > 0)
flags.push('blank-favicon');
else
flags.push('fx3');
root.setAttribute('tabFx2Compatible-flags', flags.join(' '));
break;
}
}, true);
]]></script>
</overlay>

24
content/treestyletab/treestyletab.css
View File

@ -5,15 +5,19 @@
/* twisty in tabs */ /* twisty in tabs */
.treestyletab-twisty, .treestyletab-twisty,
.tabbrowser-tabs[treestyletab-twisty-style="none"] .tabbrowser-tabs[treestyletab-twisty-style="none"]
.treestyletab-twisty-container, .treestyletab-twisty,
.tabbrowser-tabs:not([treestyletab-allow-subtree-collapse="true"]) .tabbrowser-tabs:not([treestyletab-allow-subtree-collapse="true"])
.treestyletab-twisty-container { .treestyletab-twisty {
display: none; visibility: hidden;
} }
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"] .tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"]
.tabbrowser-tab[treestyletab-children][treestyletab-allow-subtree-collapse="true"] .tabbrowser-tab[treestyletab-children][treestyletab-allow-subtree-collapse="true"]
.treestyletab-twisty { .treestyletab-twisty {
display: -moz-box; visibility: visible;
}
.tabbrowser-tab[pinned="true"]
.treestyletab-twisty {
visibility: collapse;
} }
/* collapsed children counter */ /* collapsed children counter */
@ -44,6 +48,14 @@
position: relative; position: relative;
} }
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"] .tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"]
.tabbrowser-tab[treestyletab-collapsed="true"][fadein],
/**
* Tab Mix Plus dynamically inserts a CSS rule like
* "#tabbrowser-tabs > .tabbrowser-tab { ... }" and it unexpectedly
* expands width of "collapsed" tabs. So, to apply our rule prior than
* TMP's one, I put the "#tabbrowser-tabs" version also.
*/
#tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"]
.tabbrowser-tab[treestyletab-collapsed="true"][fadein] { .tabbrowser-tab[treestyletab-collapsed="true"][fadein] {
visibility: visible; visibility: visible;
max-width: 20px; max-width: 20px;
@ -52,12 +64,8 @@
-moz-box-flex: 0; -moz-box-flex: 0;
mask: url("res/tabEffects.svg#fadein-mask"); mask: url("res/tabEffects.svg#fadein-mask");
} }
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"]
.tabbrowser-tab[treestyletab-collapsed-done="true"] .tab-image-left > *,
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"] .tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"]
.tabbrowser-tab[treestyletab-collapsed-done="true"] .tab-image-middle > *, .tabbrowser-tab[treestyletab-collapsed-done="true"] .tab-image-middle > *,
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"]
.tabbrowser-tab[treestyletab-collapsed-done="true"] .tab-image-right > *,
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"] .tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"]
.tabbrowser-tab[treestyletab-collapsed-done="true"] .tab-close-button { .tabbrowser-tab[treestyletab-collapsed-done="true"] .tab-close-button {
visibility: collapse; visibility: collapse;

2
content/treestyletab/treestyletab.xul
View File

@ -10,8 +10,6 @@
<?xml-stylesheet href="chrome://treestyletab/skin/platform-base.css" type="text/css"?> <?xml-stylesheet href="chrome://treestyletab/skin/platform-base.css" type="text/css"?>
<?xml-stylesheet href="chrome://treestyletab/skin/pseudo-tree.css" type="text/css"?> <?xml-stylesheet href="chrome://treestyletab/skin/pseudo-tree.css" type="text/css"?>
<?xul-overlay href="res/tabFx2Compatible.xul"?>
<!DOCTYPE overlay SYSTEM "chrome://treestyletab/locale/treestyletab.dtd"> <!DOCTYPE overlay SYSTEM "chrome://treestyletab/locale/treestyletab.dtd">
<overlay id="treestyletab-overlay" <overlay id="treestyletab-overlay"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

108
modules/browser.js
View File

@ -893,33 +893,25 @@ TreeStyleTabBrowser.prototype = {
} }
}, },
initTabContents : function TSTBrowser_initTabContents(aTab) initTabContents : function TSTBrowser_initTabContents(aTab, aForce)
{ {
var d = this.document; var d = this.document;
var icon = d.getAnonymousElementByAttribute(aTab, 'class', 'tab-icon'); var throbber = d.getAnonymousElementByAttribute(aTab, 'class', 'tab-throbber');
var twisty = d.getAnonymousElementByAttribute(aTab, 'class', this.kTWISTY); var twisty = d.getAnonymousElementByAttribute(aTab, 'class', this.kTWISTY);
if (icon && !twisty) { if (throbber && !twisty) {
twisty = d.createElement('image');
twisty.setAttribute('class', this.kTWISTY);
let container = d.createElement('hbox');
container.setAttribute('class', this.kTWISTY_CONTAINER);
container.appendChild(twisty);
icon.appendChild(container);
let marker = d.createElement('image'); let marker = d.createElement('image');
marker.setAttribute('class', this.kDROP_MARKER); marker.setAttribute('class', this.kDROP_MARKER);
container = d.createElement('hbox'); throbber.parentNode.appendChild(marker);
container.setAttribute('class', this.kDROP_MARKER_CONTAINER);
container.appendChild(marker);
icon.appendChild(container); twisty = d.createElement('image');
twisty.setAttribute('class', this.kTWISTY);
throbber.parentNode.appendChild(twisty);
} }
var label = this.getTabLabel(aTab); var label = this.getTabLabel(aTab);
var counter = d.getAnonymousElementByAttribute(aTab, 'class', this.kCOUNTER_CONTAINER); var counter = d.getAnonymousElementByAttribute(aTab, 'class', this.kCOUNTER_CONTAINER);
if (label && label.parentNode != aTab && !counter) { if (label && !counter) {
counter = d.createElement('hbox'); counter = d.createElement('hbox');
counter.setAttribute('class', this.kCOUNTER_CONTAINER); counter.setAttribute('class', this.kCOUNTER_CONTAINER);
@ -946,76 +938,82 @@ TreeStyleTabBrowser.prototype = {
label.parentNode.appendChild(counter); label.parentNode.appendChild(counter);
} }
var tabContentBox = d.getAnonymousElementByAttribute(aTab, 'class', 'tab-content'); this.initTabContentsOrder(aTab, aForce);
if (tabContentBox &&
(tabContentBox.firstChild.className || '').indexOf('tab-image-') > -1) {
// Set stretched only if the tabFx2Compatible.xml is applied.
// Tab Mix Plus overrides the binding so icons are wrongly stretched.
tabContentBox.setAttribute('align', this.isVertical ? 'stretch' : 'center' );
}
this.initTabContentsOrder(aTab);
}, },
initTabContentsOrder : function TSTBrowser_initTabContentsOrder(aTab) initTabContentsOrder : function TSTBrowser_initTabContentsOrder(aTab, aForce)
{ {
var d = this.document; var d = this.document;
var label = this.getTabLabel(aTab); var label = this.getTabLabel(aTab);
var close = this.getTabClosebox(aTab); var close = this.getTabClosebox(aTab);
var inverted = this.mTabBrowser.getAttribute(this.kTAB_CONTENTS_INVERTED) == 'true'; var throbber = d.getAnonymousElementByAttribute(aTab, 'class', 'tab-throbber');
var twisty = d.getAnonymousElementByAttribute(aTab, 'class', this.kTWISTY);
var marker = d.getAnonymousElementByAttribute(aTab, 'class', this.kDROP_MARKER);
var counter = d.getAnonymousElementByAttribute(aTab, 'class', this.kCOUNTER_CONTAINER);
var nodesContainer = d.getAnonymousElementByAttribute(aTab, 'class', 'tab-content') || aTab; var nodesContainer = d.getAnonymousElementByAttribute(aTab, 'class', 'tab-content') || aTab;
var nodes = Array.slice(d.getAnonymousNodes(nodesContainer) || nodesContainer.childNodes); var nodes = Array.slice(d.getAnonymousNodes(nodesContainer) || nodesContainer.childNodes);
// reset order // reset order at first!
nodes.forEach(function(aNode, aIndex) { nodes.forEach(function(aNode, aIndex) {
if (aNode.getAttribute('class') == 'informationaltab-thumbnail-container')
return;
aNode.setAttribute('ordinal', aIndex); aNode.setAttribute('ordinal', aIndex);
}, this); }, this);
// rearrange top-level contents // after that, rearrange contents
nodes.splice(nodes.indexOf(close), 1); nodes.splice(nodes.indexOf(close), 1);
if (inverted) {
if (this.mTabBrowser.getAttribute(this.kCLOSEBOX_INVERTED) == 'true') if (this.mTabBrowser.getAttribute(this.kCLOSEBOX_INVERTED) == 'true')
nodes.splice(nodes.indexOf(label.parentNode)+1, 0, close); nodes.splice(nodes.indexOf(label), 0, close);
else else
nodes.splice(nodes.indexOf(label.parentNode), 0, close); nodes.splice(nodes.indexOf(label)+1, 0, close);
}
else {
if (this.mTabBrowser.getAttribute(this.kCLOSEBOX_INVERTED) == 'true')
nodes.splice(nodes.indexOf(label.parentNode), 0, close);
else
nodes.splice(nodes.indexOf(label.parentNode)+1, 0, close);
}
var count = nodes.length;
Array.slice(nodes).reverse()
.forEach(function(aNode, aIndex) {
aNode.setAttribute('ordinal', (count - aIndex + 1) * 100);
}, this);
// rearrange contents in "tab-image-middle" if (marker) {
nodes = Array.slice(label.parentNode.childNodes); nodes.splice(nodes.indexOf(marker), 1);
nodes.splice(nodes.indexOf(throbber), 0, marker);
}
if (twisty) {
nodes.splice(nodes.indexOf(twisty), 1);
nodes.splice(nodes.indexOf(throbber), 0, twisty);
}
if (inverted) if (this.mTabBrowser.getAttribute(this.kTAB_CONTENTS_INVERTED) == 'true')
nodes.reverse(); nodes.reverse();
var counter = d.getAnonymousElementByAttribute(aTab, 'class', this.kCOUNTER_CONTAINER); if (counter) { // counter must rightside of the label!
if (counter) {
nodes.splice(nodes.indexOf(counter), 1); nodes.splice(nodes.indexOf(counter), 1);
nodes.splice(nodes.indexOf(label)+1, 0, counter); nodes.splice(nodes.indexOf(label)+1, 0, counter);
} }
count = nodes.length; var count = nodes.length;
nodes.reverse().forEach(function(aNode, aIndex) { nodes.reverse()
.forEach(function(aNode, aIndex) {
if (aNode.getAttribute('class') == 'informationaltab-thumbnail-container') if (aNode.getAttribute('class') == 'informationaltab-thumbnail-container')
return; return;
aNode.setAttribute('ordinal', (count - aIndex + 1) * 100); aNode.setAttribute('ordinal', (count - aIndex + 1) * 100);
}, this); });
if (aForce) {
/**
* After the order of contents are changed dynamically,
* Gecko doesn't re-render them in the new order.
* Changing of "display" or "position" can fix this problem.
*/
nodes.forEach(function(aNode) {
aNode.style.position = 'fixed';
});
this.Deferred.wait(0.1).next(function() {
nodes.forEach(function(aNode) {
aNode.style.position = '';
});
});
}
}, },
updateInvertedTabContentsOrder : function TSTBrowser_updateInvertedTabContentsOrder(aTarget) updateInvertedTabContentsOrder : function TSTBrowser_updateInvertedTabContentsOrder(aTarget)
{ {
if (!this.getTreePref('tabbar.invertTabContents')) return;
var self = this; var self = this;
this.Deferred.next(function() { this.Deferred.next(function() {
var b = self.mTabBrowser; var b = self.mTabBrowser;
@ -2109,14 +2107,14 @@ TreeStyleTabBrowser.prototype = {
case 'extensions.treestyletab.tabbar.invertTabContents': case 'extensions.treestyletab.tabbar.invertTabContents':
this.setTabbrowserAttribute(this.kTAB_CONTENTS_INVERTED, value); this.setTabbrowserAttribute(this.kTAB_CONTENTS_INVERTED, value);
tabs.forEach(function(aTab) { tabs.forEach(function(aTab) {
this.initTabContents(aTab); this.initTabContents(aTab, true);
}, this); }, this);
return; return;
case 'extensions.treestyletab.tabbar.invertClosebox': case 'extensions.treestyletab.tabbar.invertClosebox':
this.setTabbrowserAttribute(this.kCLOSEBOX_INVERTED, value); this.setTabbrowserAttribute(this.kCLOSEBOX_INVERTED, value);
tabs.forEach(function(aTab) { tabs.forEach(function(aTab) {
this.initTabContents(aTab); this.initTabContents(aTab, true);
}, this); }, this);
return; return;

31
modules/utils.js
View File

@ -144,9 +144,7 @@ var TreeStyleTabUtils = {
/* classes */ /* classes */
kTWISTY : 'treestyletab-twisty', kTWISTY : 'treestyletab-twisty',
kTWISTY_CONTAINER : 'treestyletab-twisty-container',
kDROP_MARKER : 'treestyletab-drop-marker', kDROP_MARKER : 'treestyletab-drop-marker',
kDROP_MARKER_CONTAINER : 'treestyletab-drop-marker-container',
kCOUNTER : 'treestyletab-counter', kCOUNTER : 'treestyletab-counter',
kCOUNTER_CONTAINER : 'treestyletab-counter-container', kCOUNTER_CONTAINER : 'treestyletab-counter-container',
kCOUNTER_PAREN : 'treestyletab-counter-paren', kCOUNTER_PAREN : 'treestyletab-counter-paren',
@ -869,23 +867,30 @@ var TreeStyleTabUtils = {
var minY = box.screenY; var minY = box.screenY;
var maxX = minX + box.width; var maxX = minX + box.width;
var maxY = minY + box.height; var maxY = minY + box.height;
var icon = tab.ownerDocument.getAnonymousElementByAttribute(tab, 'class', 'tab-icon');
var icon = tab.ownerDocument.getAnonymousElementByAttribute(tab, 'class', 'tab-icon-image');
var iconBox = icon.boxObject; var iconBox = icon.boxObject;
var throbber = tab.ownerDocument.getAnonymousElementByAttribute(tab, 'class', 'tab-throbber');
var throbberBox = throbber.boxObject;
var extraMinX = Math.min(throbberBox.screenX, iconBox.screenX);
var extraMinY = Math.min(throbberBox.screenY, iconBox.screenY);
var extraMaxX = Math.max(throbberBox.screenX + throbberBox.width, iconBox.screenX + iconBox.width);
var extraMaxY = Math.max(throbberBox.screenY + throbberBox.height, iconBox.screenY + iconBox.height);
if (!box.width || !box.height) { if (!box.width || !box.height) {
minX = iconBox.screenX; minX = extraMinX;
minY = iconBox.screenY; minY = extraMinY;
maxX = minX + iconBox.width; maxX = extraMaxX;
maxY = minY + iconBox.height; maxY = extraMaxY;
} }
if ( else if (
box.width && box.height &&
this.shouldExpandTwistyArea && this.shouldExpandTwistyArea &&
!this._expandTwistyAreaBlockers.length !this._expandTwistyAreaBlockers.length
) { ) {
minX = Math.min(minX, iconBox.screenX); minX = Math.min(minX, extraMinX);
minY = Math.min(minY, iconBox.screenY); minY = Math.min(minY, extraMinY);
maxX = Math.max(maxX, iconBox.screenX + iconBox.width); maxX = Math.max(maxX, extraMaxX);
maxY = Math.max(maxY, iconBox.screenY + iconBox.height); maxY = Math.max(maxY, extraMaxY);
} }
var x = aEvent.screenX; var x = aEvent.screenX;

52
skin/classic/treestyletab/Darwin-styled.css
View File

@ -12,18 +12,10 @@
background: #777; background: #777;
} }
#main-window
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"]
.tabbrowser-tab:not([selected="true"])
.tab-image-middle,
#main-window #main-window
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] .tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"]
.tabbrowser-tab:not([selected="true"]) .tabbrowser-tab:not([selected="true"])
.tab-close-button, .tab-close-button,
#main-window
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"]
.tabbrowser-tab[selected="true"]
.tab-image-middle,
#main-window #main-window
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] .tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"]
.tabbrowser-tab[selected="true"] .tabbrowser-tab[selected="true"]
@ -32,30 +24,6 @@
background-repeat: repeat-x; background-repeat: repeat-x;
} }
#main-window
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"]
.tabbrowser-tab:not([selected="true"])
.tab-image-left,
#main-window
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"]
.tabbrowser-tab:not([selected="true"])
.tab-image-right,
#main-window
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"]
.tabbrowser-tab[selected="true"]
.tab-image-left,
#main-window
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"]
.tabbrowser-tab[selected="true"]
.tab-image-right {
background-position: left bottom;
background-repeat: no-repeat;
}
#main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"]
.tabbrowser-tab:not([selected="true"])
.tab-image-middle,
#main-window:-moz-window-inactive #main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] .tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"]
.tabbrowser-tab:not([selected="true"]) .tabbrowser-tab:not([selected="true"])
@ -72,23 +40,3 @@
background-repeat: repeat-x; background-repeat: repeat-x;
} }
#main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"]
.tabbrowser-tab:not([selected="true"])
.tab-image-right,
#main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"]
.tabbrowser-tab:not([selected="true"])
.tab-image-right,
#main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"]
.tabbrowser-tab[selected="true"]
.tab-image-right,
#main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"]
.tabbrowser-tab[selected="true"]
.tab-image-right {
background-position: left bottom;
background-repeat: no-repeat;
}

17
skin/classic/treestyletab/metal/tab-base.css
View File

@ -72,18 +72,17 @@
.tab-background { .tab-background {
margin: 0 !important; margin: 0 !important;
} }
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tab-content {
margin-left: 0 !important;
margin-right: 0 !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tabs[treestyletab-mode="vertical"]
.tab-content { .tab-content {
border: 10px solid transparent; border: 10px solid transparent;
margin: 0 !important; margin: 0 !important;
padding: 0 5px 0 10px;
-moz-appearance: none !important; -moz-appearance: none !important;
} }
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]
.tab-content {
padding: 0 10px 0 5px;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]:not([treestyletab-tab-inverted="true"]) .tabbrowser-tabs[treestyletab-mode="vertical"]:not([treestyletab-tab-inverted="true"])
@ -96,12 +95,6 @@
border-left: 0 none !important; border-left: 0 none !important;
-moz-border-left-colors: none !important; -moz-border-left-colors: none !important;
} }
.tabbrowser-tabs[treestyletab-mode="vertical"]:not([treestyletab-tab-inverted="true"])
.tabbrowser-tab:not([treestyletab-drop-position="self"]) .tab-image-right,
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]
.tabbrowser-tab:not([treestyletab-drop-position="self"]) .tab-image-left {
padding-right: 2px !important;
}

16
skin/classic/treestyletab/square/Darwin.css
View File

@ -22,34 +22,18 @@ tabbrowser:not([treestyletab-style="vertigo"])[treestyletab-mode="vertical"]
position: relative !important; position: relative !important;
} }
#main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab
.tab-image-middle,
#main-window:-moz-window-inactive #main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab .tabbrowser-tab
.tab-close-button, .tab-close-button,
#main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[selected="true"]
.tab-image-middle,
#main-window:-moz-window-inactive #main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[selected="true"] .tabbrowser-tab[selected="true"]
.tab-close-button, .tab-close-button,
#main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-tabbar-position="bottom"]
.tabbrowser-tab
.tab-image-middle,
#main-window:-moz-window-inactive #main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-tabbar-position="bottom"] .tabbrowser-tabs[treestyletab-tabbar-position="bottom"]
.tabbrowser-tab .tabbrowser-tab
.tab-close-button, .tab-close-button,
#main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-tabbar-position="bottom"]
.tabbrowser-tab[selected="true"]
.tab-image-middle,
#main-window:-moz-window-inactive #main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-tabbar-position="bottom"] .tabbrowser-tabs[treestyletab-tabbar-position="bottom"]
.tabbrowser-tab[selected="true"] .tabbrowser-tab[selected="true"]

32
skin/classic/treestyletab/square/base.css
View File

@ -161,47 +161,15 @@
background-color: ThreeDHighlight !important; background-color: ThreeDHighlight !important;
} }
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"])
.tabbrowser-tab
.tab-image-left,
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"])
.tabbrowser-tab
.tab-image-right,
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"])
.tabbrowser-tab:not([selected="true"])
.tab-image-left,
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"])
.tabbrowser-tab:not([selected="true"])
.tab-image-right {
height: auto;
margin: 0 !important;
padding: 0 !important;
background: transparent;
width: 0;
}
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tabs:not([treestyletab-tabbar-position="top"])
.tabbrowser-tab .tabbrowser-tab
.tab-image-middle,
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"])
.tabbrowser-tab
.tab-close-button,
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"])
.tabbrowser-tab:not([selected="true"]):not(:hover)
.tab-image-middle,
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"])
.tabbrowser-tab:not([selected="true"]):not(:hover)
.tab-image-middle
.tab-close-button { .tab-close-button {
height: auto; height: auto;
margin: 0 !important; margin: 0 !important;
padding: 0 !important; padding: 0 !important;
background: transparent; background: transparent;
} }
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"])
.tabbrowser-tab[selected="true"]
.tab-image-middle,
.tabbrowser-tabs:not([treestyletab-tabbar-position="top"]) .tabbrowser-tabs:not([treestyletab-tabbar-position="top"])
.tabbrowser-tab[selected="true"] .tabbrowser-tab[selected="true"]
.tab-close-button { .tab-close-button {

81
skin/classic/treestyletab/twisty/twisty.css
View File

@ -2,96 +2,55 @@
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:not([pinned="true"]) .tabbrowser-tab:not([pinned="true"])
.treestyletab-twisty-container, .treestyletab-twisty,
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"] .tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"]
.tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"]) .tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"])
.treestyletab-twisty-container { .treestyletab-twisty {
margin: 0 3px 0 -3px; position: relative;
margin: 0 -13px 0 -3px;
max-height: 16px;
max-width: 16px;
min-height: 16px;
min-width: 16px;
-moz-box-pack: start; -moz-box-pack: start;
-moz-box-align: center; -moz-box-align: center;
-moz-box-flex: 1; -moz-box-flex: 1;
} }
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-contents-inverted="true"]
.tabbrowser-tab:not([pinned="true"])
.treestyletab-twisty-container,
.tabbrowser-tabs[treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"][treestyletab-tab-contents-inverted="true"]
.tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"])
.treestyletab-twisty-container {
margin: 0 -3px 0 3px;
}
.tabbrowser-tabs[treestyletab-twisty-style^="modern"][treestyletab-mode="vertical"] .tabbrowser-tabs[treestyletab-twisty-style^="modern"][treestyletab-mode="vertical"]
.tabbrowser-tab:not([pinned="true"]) .tabbrowser-tab:not([pinned="true"])
.treestyletab-twisty-container, .treestyletab-twisty,
.tabbrowser-tabs[treestyletab-twisty-style^="osx"][treestyletab-mode="vertical"] .tabbrowser-tabs[treestyletab-twisty-style^="osx"][treestyletab-mode="vertical"]
.tabbrowser-tab:not([pinned="true"]) .tabbrowser-tab:not([pinned="true"])
.treestyletab-twisty-container, .treestyletab-twisty,
.tabbrowser-tabs[treestyletab-twisty-style^="modern"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"] .tabbrowser-tabs[treestyletab-twisty-style^="modern"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"]
.tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"]) .tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"])
.treestyletab-twisty-container, .treestyletab-twisty,
.tabbrowser-tabs[treestyletab-twisty-style^="osx"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"] .tabbrowser-tabs[treestyletab-twisty-style^="osx"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"]
.tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"]) .tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"])
.treestyletab-twisty-container { .treestyletab-twisty {
position: relative; margin: 0 -2px 0 -5px;
margin: 0 14px 0 -14px;
} }
.tabbrowser-tabs[treestyletab-twisty-style^="modern"][treestyletab-mode="vertical"][treestyletab-tab-contents-inverted="true"] .tabbrowser-tabs[treestyletab-twisty-style^="modern"][treestyletab-mode="vertical"][treestyletab-tab-contents-inverted="true"]
.tabbrowser-tab:not([pinned="true"]) .tabbrowser-tab:not([pinned="true"])
.treestyletab-twisty-container, .treestyletab-twisty,
.tabbrowser-tabs[treestyletab-twisty-style^="osx"][treestyletab-mode="vertical"][treestyletab-tab-contents-inverted="true"] .tabbrowser-tabs[treestyletab-twisty-style^="osx"][treestyletab-mode="vertical"][treestyletab-tab-contents-inverted="true"]
.tabbrowser-tab:not([pinned="true"]) .tabbrowser-tab:not([pinned="true"])
.treestyletab-twisty-container, .treestyletab-twisty,
.tabbrowser-tabs[treestyletab-twisty-style^="modern"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"][treestyletab-tab-contents-inverted="true"] .tabbrowser-tabs[treestyletab-twisty-style^="modern"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"][treestyletab-tab-contents-inverted="true"]
.tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"]) .tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"])
.treestyletab-twisty-container, .treestyletab-twisty,
.tabbrowser-tabs[treestyletab-twisty-style^="osx"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"][treestyletab-tab-contents-inverted="true"] .tabbrowser-tabs[treestyletab-twisty-style^="osx"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"][treestyletab-tab-contents-inverted="true"]
.tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"]) .tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"])
.treestyletab-twisty-container { .treestyletab-twisty {
margin: 0 -14px 0 14px; margin: 0 -5px 0 -2px;
} }
.tabbrowser-tabs[treestyletab-twisty-style="retro"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"] .tabbrowser-tabs[treestyletab-twisty-style="retro"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"]
.tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"]) .tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"])
.treestyletab-twisty-container { .treestyletab-twisty {
position: relative; margin: 0 -16px 0 0;
margin: 0 16px 0 -16px;
}
.tabbrowser-tabs[treestyletab-twisty-style="retro"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"]
.tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"])
.tab-icon {
margin-left: 16px;
}
.tabbrowser-tabs[treestyletab-twisty-style^="modern"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"]
.tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"])
.tab-icon,
.tabbrowser-tabs[treestyletab-twisty-style^="osx"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"]
.tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"])
.tab-icon {
margin-left: 12px;
}
.tabbrowser-tabs[treestyletab-twisty-style^="modern"][treestyletab-mode="vertical"][treestyletab-allow-subtree-collapse="true"]:not([treestyletab-tab-contents-inverted="true"])
.tabbrowser-tab:not([pinned="true"])
.tab-icon,
.tabbrowser-tabs[treestyletab-twisty-style^="osx"][treestyletab-mode="vertical"][treestyletab-allow-subtree-collapse="true"]:not([treestyletab-tab-contents-inverted="true"])
.tabbrowser-tab:not([pinned="true"])
.tab-icon,
.tabbrowser-tabs[treestyletab-twisty-style^="modern"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"]
.tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"])
.tab-icon,
.tabbrowser-tabs[treestyletab-twisty-style^="osx"][treestyletab-mode="horizontal"][treestyletab-allow-subtree-collapse="true"]
.tabbrowser-tab[treestyletab-allow-subtree-collapse="true"][treestyletab-children]:not([pinned="true"])
.tab-icon {
margin-left: 9px;
}
.tabbrowser-tabs[treestyletab-twisty-style^="modern"][treestyletab-mode="vertical"][treestyletab-allow-subtree-collapse="true"][treestyletab-tab-contents-inverted="true"]
.tabbrowser-tab:not([pinned="true"])
.tab-icon,
.tabbrowser-tabs[treestyletab-twisty-style^="osx"][treestyletab-mode="vertical"][treestyletab-allow-subtree-collapse="true"][treestyletab-tab-contents-inverted="true"]
.tabbrowser-tab:not([pinned="true"])
.tab-icon {
margin-right: 9px;
} }
.treestyletab-twisty { .treestyletab-twisty {