зеркало из https://github.com/mozilla/gecko-dev.git
Bug 960484 - Download button should notify user on every completed download in case of multiple downloads. Signaling via concentric ring effect. r=sfoster
This commit is contained in:
Родитель
f4ea88bcfd
Коммит
67582783ff
|
@ -15,15 +15,32 @@
|
|||
|
||||
<content>
|
||||
<xul:stack>
|
||||
<xul:toolbarbutton anonid="progressButton" class="circularprogressindicator-progressButton"/>
|
||||
<html:div anonid="progressTrack" xbl:inherits="progress" class="circularprogressindicator-progressTrack"></html:div>
|
||||
<html:canvas anonid="progressRing" xbl:inherits="progress" class="circularprogressindicator-progressRing" width="40" height="40"></html:canvas>
|
||||
<xul:toolbarbutton anonid="progressButton"
|
||||
class="circularprogressindicator-progressButton"/>
|
||||
<html:div anonid="progressTrack"
|
||||
xbl:inherits="progress"
|
||||
class="circularprogressindicator-progressTrack">
|
||||
</html:div>
|
||||
<html:canvas anonid="progressRing"
|
||||
xbl:inherits="progress"
|
||||
class="circularprogressindicator-progressRing"
|
||||
width="40"
|
||||
height="40">
|
||||
</html:canvas>
|
||||
<html:div anonid="progressNotification"
|
||||
xbl:inherits="progress"
|
||||
class="circularprogressindicator-progressNotification">
|
||||
</html:div>
|
||||
</xul:stack>
|
||||
</content>
|
||||
|
||||
<implementation>
|
||||
<field name="_progressCanvas">
|
||||
document.getAnonymousElementByAttribute(this, "anonid", "progressRing");
|
||||
document.getAnonymousElementByAttribute(this, "anonid", "progressRing");
|
||||
</field>
|
||||
<field name="_progressNotification">
|
||||
document.getAnonymousElementByAttribute(this, "anonid",
|
||||
"progressNotification");
|
||||
</field>
|
||||
<field name="_progressCircleCtx">null</field>
|
||||
<field name="_img">null</field>
|
||||
|
@ -92,6 +109,26 @@
|
|||
]]>
|
||||
</body>
|
||||
</method>
|
||||
<method name="notify">
|
||||
<body>
|
||||
<![CDATA[
|
||||
this.addEventListener("transitionend", this._onNotificationEnd);
|
||||
|
||||
this._progressNotification.classList.add(
|
||||
"progressNotification-active");
|
||||
]]>
|
||||
</body>
|
||||
</method>
|
||||
<method name="_onNotificationEnd">
|
||||
<body>
|
||||
<![CDATA[
|
||||
this.removeEventListener("transitionend", this._onNotificationEnd);
|
||||
|
||||
this._progressNotification.classList.remove(
|
||||
"progressNotification-active");
|
||||
]]>
|
||||
</body>
|
||||
</method>
|
||||
</implementation>
|
||||
</binding>
|
||||
</bindings>
|
||||
|
|
|
@ -532,7 +532,11 @@ var MetroDownloadsView = {
|
|||
let notn = this._progressNotification;
|
||||
if (notn)
|
||||
this._notificationBox.removeNotification(notn);
|
||||
|
||||
ContextUI.displayNavbar();
|
||||
}
|
||||
|
||||
this._downloadProgressIndicator.notify();
|
||||
break;
|
||||
case "dl-failed":
|
||||
download = aSubject.QueryInterface(Ci.nsIDownload);
|
||||
|
|
|
@ -7,7 +7,8 @@
|
|||
|
||||
.circularprogressindicator-progressButton,
|
||||
.circularprogressindicator-progressRing,
|
||||
.circularprogressindicator-progressTrack {
|
||||
.circularprogressindicator-progressTrack,
|
||||
.circularprogressindicator-progressNotification {
|
||||
margin: 0 @toolbar_horizontal_spacing@;
|
||||
}
|
||||
|
||||
|
@ -25,6 +26,21 @@
|
|||
background-image: url(chrome://browser/skin/images/progresscircle-bg.png);
|
||||
}
|
||||
|
||||
.circularprogressindicator-progressNotification {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background-image: url(chrome://browser/skin/images/navbar-download-finished.png);
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.circularprogressindicator-progressNotification.progressNotification-active {
|
||||
visibility: visible;
|
||||
opacity: 0;
|
||||
transform: scale(2);
|
||||
transition: opacity @metro_animation_duration@,
|
||||
transform @metro_animation_duration@;
|
||||
}
|
||||
|
||||
.circularprogressindicator-progressRing:not([progress]),
|
||||
.circularprogressindicator-progressRing[progress="100"],
|
||||
.circularprogressindicator-progressTrack:not([progress]),
|
||||
|
|
Загрузка…
Ссылка в новой задаче