Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-10-23 18:26:15 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix for bug #342900

Browse Source 
improve indication that open tab in background opened tab in overflow area.

instead of flashing the "all tabs" button, provide a smoother animation.

note, this will not work on mac trunk (but it will work on the mac branch)
due to bug #346738 (aka #325296), so for now, there is no animation on the mac.

r=mconnor
This commit is contained in:
sspitzer%mozilla.org 2006-08-01 01:33:18 +00:00
parent d264b05e10
commit 81a8257967
4 changed files with 98 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
toolkit/content/widgets/tabbrowser.xml
View File

@ -2468,14 +2468,28 @@
<xul:arrowscrollbox anonid="arrowscrollbox" orient="horizontal" flex="1" style="min-width: 1px;" clicktoscroll="true"> <xul:arrowscrollbox anonid="arrowscrollbox" orient="horizontal" flex="1" style="min-width: 1px;" clicktoscroll="true">
<children includes="tab"/> <children includes="tab"/>
</xul:arrowscrollbox> </xul:arrowscrollbox>
<xul:hbox class="tabs-alltabs-box" align="center" pack="end" <xul:stack align="center" pack="end">
anonid="alltabs-box"> <!-- XXXsspitzer hack
this extra hbox with position: relative
is needed to work around two bugs.
see bugs #346307 and #346035
-->
<xul:hbox style="position: relative;">
<xul:hbox flex="1" class="tabs-alltabs-box" anonid="alltabs-box"/>
</xul:hbox>
<!-- XXXsspitzer hack
this extra hbox with position: relative
is needed to work around two bugs.
see bugs #346307 and #346035
-->
<xul:hbox style="position: relative;">
<xul:toolbarbutton class="tabs-alltabs-button" type="menu"> <xul:toolbarbutton class="tabs-alltabs-button" type="menu">
<xul:menupopup class="tabs-alltabs-popup" <xul:menupopup class="tabs-alltabs-popup"
anonid="alltabs-popup" anonid="alltabs-popup"
position="after_end"/> position="after_end"/>
</xul:toolbarbutton> </xul:toolbarbutton>
</xul:hbox> </xul:hbox>
</xul:stack>
<xul:hbox class="tabs-closebutton-box" align="center" pack="end" anonid="tabstrip-closebutton"> <xul:hbox class="tabs-closebutton-box" align="center" pack="end" anonid="tabstrip-closebutton">
<xul:toolbarbutton class="close-button tabs-closebutton"/> <xul:toolbarbutton class="close-button tabs-closebutton"/>
</xul:hbox> </xul:hbox>
@ -2522,9 +2536,9 @@
<destructor> <destructor>
<![CDATA[ <![CDATA[
// Release timer to avoid reference cycles. // Release timer to avoid reference cycles.
if (this.mFlashTimer) { if (this._animateTimer) {
this.mFlashTimer.cancel(); this._animateTimer.cancel();
this.mFlashTimer = null; this._animateTimer = null;
} }
]]> ]]>
</destructor> </destructor>
@ -2667,15 +2681,35 @@
"anonid", "alltabs-box"); "anonid", "alltabs-box");
</field> </field>
<field name="mFlashTimer">null</field> <field name="_animateTimer">null</field>
<field name="mFlashStage">0</field> <field name="_animateStep">-1</field>
<field name="mFlashStart">6</field> <field name="_animateDelay">50</field>
<field name="mFlashDelay">150</field> <field name="_animatePercents">
[0.50, 0.60, 0.70, 0.80, 0.90,
1.00, 1.00, 1.00, 1.00, 1.00, 1.00, 1.00, 1.00, 1.00, 1.00,
1.00, 1.00, 1.00, 1.00, 1.00, 1.00, 1.00, 1.00, 1.00, 1.00,
1.00, 1.00, 1.00, 1.00, 1.00, 1.00, 1.00, 1.00, 1.00, 1.00,
0.95, 0.90, 0.85, 0.80, 0.75, 0.70, 0.65, 0.60, 0.55, 0.50,
0.45, 0.40, 0.35, 0.30, 0.25, 0.20, 0.15, 0.10, 0.05, 0.00]
</field>
<method name="_stopAnimation">
<body><![CDATA[
if (this._animateStep != -1) {
if (this._animateTimer)
this._animateTimer.cancel();
this._animateStep = -1;
this.mAllTabsBox.style.opacity = 0.0;
}
]]></body>
</method>
<method name="_notifyBackgroundTab"> <method name="_notifyBackgroundTab">
<parameter name="aTab"/> <parameter name="aTab"/>
<body><![CDATA[ <body><![CDATA[
if (this.mFlashStage) // if we are already animating, don't do it again
if (this._animateStep != -1)
return; return;
var tsbo = this.mTabstrip.scrollBoxObject; var tsbo = this.mTabstrip.scrollBoxObject;
@ -2689,17 +2723,17 @@
// only start the flash timer if the new tab (which was loaded in // only start the flash timer if the new tab (which was loaded in
// the background) is not completely visible // the background) is not completely visible
if (tsboStart > ctboStart || ctboEnd > tsboEnd) { if (tsboStart > ctboStart || ctboEnd > tsboEnd) {
this.mFlashStage = this.mFlashStart; this._animateStep = 0;
if (!this.mFlashTimer) if (!this._animateTimer)
this.mFlashTimer = this._animateTimer =
Components.classes["@mozilla.org/timer;1"] Components.classes["@mozilla.org/timer;1"]
.createInstance(Components.interfaces.nsITimer); .createInstance(Components.interfaces.nsITimer);
else else
this.mFlashTimer.cancel(); this._animateTimer.cancel();
this.mFlashTimer.initWithCallback(this, this._animateTimer.initWithCallback(this,
this.mFlashDelay, this._animateDelay,
Components.interfaces.nsITimer.TYPE_REPEATING_SLACK); Components.interfaces.nsITimer.TYPE_REPEATING_SLACK);
} }
]]></body> ]]></body>
@ -2711,13 +2745,13 @@
if (!document) if (!document)
aTimer.cancel(); aTimer.cancel();
this.mFlashStage--; var percent = this._animatePercents[this._animateStep];
this.mAllTabsBox.style.opacity = percent;
this.mAllTabsBox.setAttribute("flash", if (this._animateStep < (this._animatePercents.length - 1))
(this.mFlashStage % 2) ? "true" : "false"); this._animateStep++;
else
if (!this.mFlashStage) this._stopAnimation();
aTimer.cancel();
]]></body> ]]></body>
</method> </method>
</implementation> </implementation>
@ -2802,6 +2836,10 @@
var tabcontainer = document.getBindingParent(this); var tabcontainer = document.getBindingParent(this);
var tabs = tabcontainer.childNodes; var tabs = tabcontainer.childNodes;
// if an animation is in progress and the user
// clicks on the "all tabs" button, stop the animation
tabcontainer._stopAnimation();
for (var i = 0; i < tabs.length; i++) { for (var i = 0; i < tabs.length; i++) {
var menuItem = document.createElementNS( var menuItem = document.createElementNS(
"http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul", "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul",

12
toolkit/themes/pinstripe/global/browser.css
View File

@ -41,8 +41,6 @@ tab:hover > .tab-image-middle > .tab-icon > .tab-extra-status {
padding-top: 1px; padding-top: 1px;
} }
tab[busy] > .tab-icon-image, tab[busy] > .tab-image-middle > .tab-icon > .tab-icon-image { tab[busy] > .tab-icon-image, tab[busy] > .tab-image-middle > .tab-icon > .tab-icon-image {
list-style-image: url("chrome://global/skin/icons/loading_16_grey.gif") !important; list-style-image: url("chrome://global/skin/icons/loading_16_grey.gif") !important;
} }
@ -245,8 +243,14 @@ tabbrowser > tabbox > tabpanels {
* All Tabs Button * All Tabs Button
*/ */
.tabs-alltabs-box[flash="true"] { .tabs-alltabs-box {
background-color: orange; /* XXXsspitzer
* disabling the background-color because on mac trunk
* due to the opacity bug #346738 (aka #325296)
*
* background-color: orange;
*/
opacity: 0.0;
} }
.tabs-alltabs-button { .tabs-alltabs-button {

19
toolkit/themes/pinstripe/global/globalBindings.xml
View File

@ -62,13 +62,28 @@
<xul:arrowscrollbox anonid="arrowscrollbox" orient="horizontal" flex="1" style="min-width: 1px;" clicktoscroll="true"> <xul:arrowscrollbox anonid="arrowscrollbox" orient="horizontal" flex="1" style="min-width: 1px;" clicktoscroll="true">
<children/> <children/>
</xul:arrowscrollbox> </xul:arrowscrollbox>
<xul:hbox class="tabs-alltabs-box" pack="end" align="center" <xul:stack align="center" pack="end">
anonid="alltabs-box"> <!-- XXXsspitzer hack
this extra hbox with position: relative
is needed to work around two bugs.
see bugs #346307 and #346035
-->
<xul:hbox style="position: relative;">
<xul:hbox flex="1" class="tabs-alltabs-box"
anonid="alltabs-box"/>
</xul:hbox>
<!-- XXXsspitzer hack
this extra hbox with position: relative
is needed to work around two bugs.
see bugs #346307 and #346035
-->
<xul:hbox style="position: relative;">
<xul:toolbarbutton class="tabs-alltabs-button" type="menu"> <xul:toolbarbutton class="tabs-alltabs-button" type="menu">
<xul:menupopup class="tabs-alltabs-popup" <xul:menupopup class="tabs-alltabs-popup"
anonid="alltabs-popup" position="after_end"/> anonid="alltabs-popup" position="after_end"/>
</xul:toolbarbutton> </xul:toolbarbutton>
</xul:hbox> </xul:hbox>
</xul:stack>
<xul:hbox class="tabs-closebutton-box" align="center" pack="end" anonid="tabstrip-closebutton"> <xul:hbox class="tabs-closebutton-box" align="center" pack="end" anonid="tabstrip-closebutton">
<xul:toolbarbutton class="close-button tabs-closebutton"/> <xul:toolbarbutton class="close-button tabs-closebutton"/>
</xul:hbox> </xul:hbox>

3
toolkit/themes/winstripe/global/browser.css
View File

@ -137,8 +137,9 @@ tab {
* All Tabs Button * All Tabs Button
*/ */
.tabs-alltabs-box[flash="true"] { .tabs-alltabs-box {
background-color: orange; background-color: orange;
opacity: 0.0;
} }
.tabs-alltabs-button { .tabs-alltabs-button {