Bug 1453701 - Add 30fps and 20fps configurations for the tab loading throbber. r=jaws

MozReview-Commit-ID: FH6XUPOVtZp

--HG--
extra : rebase_source : fff8ed4b1a3b20c03837fba5e64dd708ce7c8a5e
This commit is contained in:
Mike Conley 2018-04-12 13:45:49 -04:00
parent 732c8b496c
commit e0535aa7b4
5 changed files with 180 additions and 2 deletions

View File

@ -458,6 +458,8 @@ pref("browser.link.open_newwindow.disabled_in_fullscreen", false);
#endif
// Tabbed browser
pref("browser.tabs.20FpsThrobber", false);
pref("browser.tabs.30FpsThrobber", false);
pref("browser.tabs.closeTabByDblclick", false);
pref("browser.tabs.closeWindowWithLastTab", true);
// Open related links to a tab, e.g., link in current tab, at next to the

View File

@ -187,6 +187,8 @@
skin/classic/browser/tabbrowser/tab-loading-inverted.png (../shared/tabbrowser/tab-loading-inverted.png)
skin/classic/browser/tabbrowser/tab-loading-inverted@2x.png (../shared/tabbrowser/tab-loading-inverted@2x.png)
skin/classic/browser/tabbrowser/loading.svg (../shared/tabbrowser/loading.svg)
skin/classic/browser/tabbrowser/loading-20fps.svg (../shared/tabbrowser/loading-20fps.svg)
skin/classic/browser/tabbrowser/loading-30fps.svg (../shared/tabbrowser/loading-30fps.svg)
skin/classic/browser/tabbrowser/loading-burst.svg (../shared/tabbrowser/loading-burst.svg)
skin/classic/browser/tabbrowser/crashed.svg (../shared/tabbrowser/crashed.svg)
skin/classic/browser/tabbrowser/newtab.svg (../shared/tabbrowser/newtab.svg)

View File

@ -0,0 +1,68 @@
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<svg xmlns="http://www.w3.org/2000/svg" width="320" height="16" fill="context-fill">
<svg>
<path d="M2.062 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="16">
<path d="M5.058 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="32">
<path d="M8.338 6.171c1.435 0 2.6 0.82 2.6 1.829 0 1.01 -1.165 1.829 -2.6 1.829s-2.6 -0.82 -2.6 -1.829c0 -1.01 1.165 -1.829 2.6 -1.829z"/>
</svg>
<svg x="48">
<path d="M10.33 6.343c1.767 0 3.201 0.742 3.201 1.657s-1.434 1.657 -3.2 1.657c-1.766 0 -3.2 -0.742 -3.2 -1.657s1.434 -1.657 3.2 -1.657z"/>
</svg>
<svg x="64">
<path d="M11.648 6.3c1.683 0 3.05 0.762 3.05 1.7s-1.367 1.7 -3.05 1.7c-1.683 0 -3.05 -0.762 -3.05 -1.7s1.367 -1.7 3.05 -1.7z"/>
</svg>
<svg x="80">
<path d="M12.551 6.15c1.394 0 2.525 0.829 2.525 1.85 0 1.021 -1.131 1.85 -2.525 1.85 -1.393 0 -2.525 -0.829 -2.525 -1.85 0 -1.021 1.132 -1.85 2.525 -1.85z"/>
</svg>
<svg x="96">
<path d="M13.17 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="112">
<path d="M13.578 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2c0 -1.104 0.897 -2 2 -2z"/>
</svg>
<svg x="128">
<path d="M13.823 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="144">
<path d="M13.935 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="160">
<path d="M13.937 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="176">
<path d="M12.219 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="192">
<path d="M7.913 6.171c1.34 0 2.429 0.82 2.429 1.829 0 1.01 -1.088 1.829 -2.429 1.829 -1.34 0 -2.428 -0.82 -2.428 -1.829 0 -1.01 1.088 -1.829 2.428 -1.829z"/>
</svg>
<svg x="208">
<path d="M5.545 6.343c1.577 0 2.857 0.742 2.857 1.657s-1.28 1.657 -2.857 1.657c-1.577 0 -2.858 -0.742 -2.858 -1.657s1.28 -1.657 2.858 -1.657z"/>
</svg>
<svg x="224">
<path d="M4.168 6.3c1.517 0 2.75 0.762 2.75 1.7s-1.233 1.7 -2.75 1.7c-1.518 0 -2.75 -0.762 -2.75 -1.7s1.232 -1.7 2.75 -1.7z"/>
</svg>
<svg x="240">
<path d="M3.288 6.15c1.311 0 2.375 0.829 2.375 1.85 0 1.021 -1.064 1.85 -2.375 1.85 -1.31 0 -2.375 -0.829 -2.375 -1.85 0 -1.021 1.065 -1.85 2.375 -1.85z"/>
</svg>
<svg x="256">
<path d="M2.714 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2c0 -1.104 0.897 -2 2 -2z"/>
</svg>
<svg x="272">
<path d="M2.35 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2c0 -1.104 0.897 -2 2 -2z"/>
</svg>
<svg x="288">
<path d="M2.142 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="304">
<path d="M2.053 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2c0 -1.104 0.897 -2 2 -2z"/>
</svg>
<svg x="320">
<path d="M2.062 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
</svg>

After

Width:  |  Height:  |  Size: 3.0 KiB

View File

@ -0,0 +1,98 @@
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<svg xmlns="http://www.w3.org/2000/svg" width="480" height="16" fill="context-fill">
<svg>
<path d="M2.062 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="16">
<path d="M3.613 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="32">
<path d="M6.352 6.057c1.214 0 2.2 0.87 2.2 1.943 0 1.072 -0.986 1.943 -2.2 1.943 -1.214 0 -2.2 -0.87 -2.2 -1.943 0 -1.072 0.986 -1.943 2.2 -1.943z"/>
</svg>
<svg x="48">
<path d="M8.338 6.171c1.435 0 2.6 0.82 2.6 1.829 0 1.01 -1.165 1.829 -2.6 1.829s-2.6 -0.82 -2.6 -1.829c0 -1.01 1.165 -1.829 2.6 -1.829z"/>
</svg>
<svg x="64">
<path d="M9.762 6.286c1.655 0 3 0.768 3 1.714s-1.345 1.714 -3 1.714c-1.656 0 -3 -0.768 -3 -1.714s1.344 -1.714 3 -1.714z"/>
</svg>
<svg x="80">
<path d="M10.828 6.4c1.877 0 3.4 0.717 3.4 1.6 0 0.883 -1.523 1.6 -3.4 1.6 -1.876 0 -3.4 -0.717 -3.4 -1.6 0 -0.883 1.524 -1.6 3.4 -1.6z"/>
</svg>
<svg x="96">
<path d="M11.648 6.3c1.683 0 3.05 0.762 3.05 1.7s-1.367 1.7 -3.05 1.7c-1.683 0 -3.05 -0.762 -3.05 -1.7s1.367 -1.7 3.05 -1.7z"/>
</svg>
<svg x="112">
<path d="M12.287 6.2c1.49 0 2.7 0.807 2.7 1.8s-1.21 1.8 -2.7 1.8c-1.49 0 -2.7 -0.807 -2.7 -1.8s1.21 -1.8 2.7 -1.8z"/>
</svg>
<svg x="128">
<path d="M12.785 6.1c1.297 0 2.35 0.851 2.35 1.9s-1.053 1.9 -2.35 1.9c-1.297 0 -2.35 -0.851 -2.35 -1.9s1.053 -1.9 2.35 -1.9z"/>
</svg>
<svg x="144">
<path d="M13.17 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2c0 -1.104 0.897 -2 2 -2z"/>
</svg>
<svg x="160">
<path d="M13.463 6c1.103 0 2 0.896 2 2s-0.897 2 -2 2a2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="176">
<path d="M13.677 6c1.103 0 2 0.896 2 2s-0.897 2 -2 2a2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="192">
<path d="M13.823 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="208">
<path d="M13.911 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="224">
<path d="M13.947 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="240">
<path d="M13.937 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="256">
<path d="M13.27 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2c0 -1.104 0.897 -2 2 -2z"/>
</svg>
<svg x="272">
<path d="M10.65 6.057c1.182 0 2.142 0.87 2.142 1.943 0 1.072 -0.96 1.943 -2.143 1.943 -1.182 0 -2.142 -0.87 -2.142 -1.943 0 -1.072 0.96 -1.943 2.142 -1.943z"/>
</svg>
<svg x="288">
<path d="M7.911 6.171c1.34 0 2.429 0.82 2.429 1.829 0 1.01 -1.088 1.829 -2.429 1.829 -1.34 0 -2.428 -0.82 -2.428 -1.829 0 -1.01 1.088 -1.829 2.428 -1.829z"/>
</svg>
<svg x="304">
<path d="M6.18 6.286c1.498 0 2.715 0.768 2.715 1.714s-1.217 1.714 -2.715 1.714c-1.498 0 -2.714 -0.768 -2.714 -1.714s1.216 -1.714 2.714 -1.714z"/>
</svg>
<svg x="320">
<path d="M5.01 6.4c1.655 0 3 0.717 3 1.6 0 0.883 -1.345 1.6 -3 1.6 -1.656 0 -3 -0.717 -3 -1.6 0 -0.883 1.344 -1.6 3 -1.6z"/>
</svg>
<svg x="336">
<path d="M4.167 6.3c1.518 0 2.75 0.762 2.75 1.7s-1.232 1.7 -2.75 1.7 -2.75 -0.762 -2.75 -1.7 1.232 -1.7 2.75 -1.7z"/>
</svg>
<svg x="352">
<path d="M3.54 6.2c1.38 0 2.5 0.807 2.5 1.8s-1.12 1.8 -2.5 1.8 -2.5 -0.807 -2.5 -1.8 1.12 -1.8 2.5 -1.8z"/>
</svg>
<svg x="368">
<path d="M3.069 6.1c1.241 0 2.25 0.851 2.25 1.9s-1.009 1.9 -2.25 1.9c-1.242 0 -2.25 -0.851 -2.25 -1.9s1.008 -1.9 2.25 -1.9z"/>
</svg>
<svg x="384">
<path d="M2.714 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="400">
<path d="M2.452 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="416">
<path d="M2.266 6c1.103 0 2 0.896 2 2s-0.897 2 -2 2a2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="432">
<path d="M2.142 6c1.103 0 2 0.896 2 2s-0.897 2 -2 2a2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="448">
<path d="M2.071 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
<svg x="464">
<path d="M2.046 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2c0 -1.104 0.897 -2 2 -2z"/>
</svg>
<svg x="480">
<path d="M2.062 6a2 2 0 0 1 0 4 2.001 2.001 0 0 1 -2 -2 2 2 0 0 1 2 -2z"/>
</svg>
</svg>

After

Width:  |  Height:  |  Size: 4.3 KiB

View File

@ -201,13 +201,21 @@
opacity: 0.7;
}
%ifdef NIGHTLY_BUILD
@supports -moz-bool-pref("browser.tabs.30FpsThrobber") {
:root[sessionrestored] .tab-throbber[busy]::before {
background-image: url("chrome://browser/skin/tabbrowser/loading-30fps.svg");
animation: tab-throbber-animation 1.05s steps(30) infinite;
width: 480px;
}
}
@supports -moz-bool-pref("browser.tabs.20FpsThrobber") {
:root[sessionrestored] .tab-throbber[busy]::before {
background-image: url("chrome://browser/skin/tabbrowser/loading-20fps.svg");
animation: tab-throbber-animation 1.05s steps(20) infinite;
width: 320px;
}
}
%endif
:root[sessionrestored] .tab-throbber[busy]:-moz-locale-dir(rtl)::before {
animation-name: tab-throbber-animation-rtl;