wine/gecko
0
0
Fork 0
mirror of https://gitlab.winehq.org/wine/wine-gecko.git synced 2024-09-13 09:24:08 -07:00
Code Issues Packages Projects Releases Wiki Activity

Bug 812813 - The Downloads Panel needs to draw your attention when a download finishes. r=mak

Browse Source 
--HG--
rename : browser/themes/gnomestripe/downloads/download-notification.png => browser/themes/gnomestripe/downloads/download-notification-start.png
rename : browser/themes/pinstripe/downloads/download-notification.png => browser/themes/pinstripe/downloads/download-notification-start.png
rename : browser/themes/winstripe/downloads/download-notification.png => browser/themes/winstripe/downloads/download-notification-start.png
This commit is contained in:
Paolo Amadini 2013-01-06 12:18:21 +01:00
parent a02b45847d
commit 0569633261
15 changed files with 95 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
browser/components/downloads/content/indicator.js
View File

@ -349,8 +349,11 @@ const DownloadsIndicatorView = {
/**
* If the status indicator is visible in its assigned position, shows for a
* brief time a visual notification of a relevant event, like a new download.
*
* @param aType
* Set to "start" for new downloads, "finish" for completed downloads.
*/
showEventNotification: function DIV_showEventNotification()
showEventNotification: function DIV_showEventNotification(aType)
{
if (!this._initialized) {
return;
@ -366,7 +369,7 @@ const DownloadsIndicatorView = {
DownloadsButton.updatePosition();
let indicator = this.indicator;
indicator.setAttribute("notification", "true");
indicator.setAttribute("notification", aType);
this._notificationTimeout = setTimeout(
function () indicator.removeAttribute("notification"), 1000);
}
@ -486,7 +489,7 @@ const DownloadsIndicatorView = {
if (this._attention != aValue) {
this._attention = aValue;
if (aValue) {
this.indicator.setAttribute("attention", "true")
this.indicator.setAttribute("attention", "true");
} else {
this.indicator.removeAttribute("attention");
}

18
browser/components/downloads/src/DownloadsCommon.jsm
View File

@ -985,7 +985,12 @@ DownloadsDataCtor.prototype = {
if (isNew && !dataItem.newDownloadNotified) {
dataItem.newDownloadNotified = true;
this._notifyNewDownload();
this._notifyDownloadEvent("start");
}
// This is a final state of which we are only notified once.
if (dataItem.done) {
this._notifyDownloadEvent("finish");
}
},
@ -1042,10 +1047,13 @@ DownloadsDataCtor.prototype = {
},
/**
* Displays a new download notification in the most recent browser window, if
* one is currently available.
* Displays a new or finished download notification in the most recent browser
* window, if one is currently available with the required privacy type.
*
* @param aType
* Set to "start" for new downloads, "finish" for completed downloads.
*/
_notifyNewDownload: function DD_notifyNewDownload()
_notifyDownloadEvent: function DD_notifyDownloadEvent(aType)
{
if (DownloadsCommon.useToolkitUI) {
return;
@ -1061,7 +1069,7 @@ DownloadsDataCtor.prototype = {
// For new downloads after the first one, don't show the panel
// automatically, but provide a visible notification in the topmost
// browser window, if the status indicator is already visible.
browserWin.DownloadsIndicatorView.showEventNotification();
browserWin.DownloadsIndicatorView.showEventNotification(aType);
return;
}
this.panelHasShownBefore = true;

4
browser/components/downloads/test/browser/browser_first_download_panel.js
View File

@ -19,7 +19,7 @@ function gen_test()
DownloadsCommon.getData(window).panelHasShownBefore = false;
prepareForPanelOpen();
DownloadsCommon.getData(window)._notifyNewDownload();
DownloadsCommon.getData(window)._notifyDownloadEvent("start");
yield;
// If we got here, that means the panel opened.
@ -31,7 +31,7 @@ function gen_test()
// Next, make sure that if we start another download, we don't open
// the panel automatically.
panelShouldNotOpen();
DownloadsCommon.getData(window)._notifyNewDownload();
DownloadsCommon.getData(window)._notifyDownloadEvent("start");
yield waitFor(2);
} catch(e) {
ok(false, e);

BIN
browser/themes/gnomestripe/downloads/download-notification-finish.png Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.5 KiB

0
browser/themes/gnomestripe/downloads/download-notification.png → browser/themes/gnomestripe/downloads/download-notification-start.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 3.1 KiB

31
browser/themes/gnomestripe/downloads/downloads.css
View File

@ -230,34 +230,47 @@ toolbar[iconsize="large"] > #downloads-indicator[attention] > #downloads-indicat
background-image: url("chrome://browser/skin/downloads/download-glow.png");
}
/*** Event notification ***/
/*** Download notifications ***/
#downloads-indicator-notification {
opacity: 0;
background: url("chrome://browser/skin/downloads/download-notification.png")
center no-repeat;
background-size: 16px;
background-position: center;
background-repeat: no-repeat;
}
@keyframes downloadsIndicatorNotificationRight {
@keyframes downloadsIndicatorNotificationStartRight {
from { opacity: 0; transform: translate(-128px, 128px) scale(8); }
20% { opacity: .85; animation-timing-function: ease-out; }
to { opacity: 0; transform: translate(0) scale(1); }
}
@keyframes downloadsIndicatorNotificationLeft {
@keyframes downloadsIndicatorNotificationStartLeft {
from { opacity: 0; transform: translate(128px, 128px) scale(8); }
20% { opacity: .85; animation-timing-function: ease-out; }
to { opacity: 0; transform: translate(0) scale(1); }
}
#downloads-indicator[notification] > #downloads-indicator-anchor > #downloads-indicator-notification {
animation-name: downloadsIndicatorNotificationRight;
#downloads-indicator[notification="start"] > #downloads-indicator-anchor > #downloads-indicator-notification {
background-image: url("chrome://browser/skin/downloads/download-notification-start.png");
animation-name: downloadsIndicatorNotificationStartRight;
animation-duration: 1s;
}
#downloads-indicator[notification]:-moz-locale-dir(rtl) > #downloads-indicator-anchor > #downloads-indicator-notification {
animation-name: downloadsIndicatorNotificationLeft;
#downloads-indicator[notification="start"]:-moz-locale-dir(rtl) > #downloads-indicator-anchor > #downloads-indicator-notification {
animation-name: downloadsIndicatorNotificationStartLeft;
}
@keyframes downloadsIndicatorNotificationFinish {
from { opacity: 0; transform: scale(1); }
20% { opacity: .65; animation-timing-function: ease-in; }
to { opacity: 0; transform: scale(8); }
}
#downloads-indicator[notification="finish"] > #downloads-indicator-anchor > #downloads-indicator-notification {
background-image: url("chrome://browser/skin/downloads/download-notification-finish.png");
animation-name: downloadsIndicatorNotificationFinish;
animation-duration: 1s;
}
/*** Progress bar and text ***/

3
browser/themes/gnomestripe/jar.mn
View File

@ -49,7 +49,8 @@ browser.jar:
skin/classic/browser/downloads/buttons.png (downloads/buttons.png)
skin/classic/browser/downloads/download-glow.png (downloads/download-glow.png)
skin/classic/browser/downloads/download-glow-small.png (downloads/download-glow-small.png)
skin/classic/browser/downloads/download-notification.png (downloads/download-notification.png)
skin/classic/browser/downloads/download-notification-finish.png (downloads/download-notification-finish.png)
skin/classic/browser/downloads/download-notification-start.png (downloads/download-notification-start.png)
skin/classic/browser/downloads/download-summary.png (downloads/download-summary.png)
skin/classic/browser/downloads/downloads.css (downloads/downloads.css)
skin/classic/browser/downloads/allDownloadsViewOverlay.css (downloads/allDownloadsViewOverlay.css)

BIN
browser/themes/pinstripe/downloads/download-notification-finish.png Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.0 KiB

0
browser/themes/pinstripe/downloads/download-notification.png → browser/themes/pinstripe/downloads/download-notification-start.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 3.1 KiB

31
browser/themes/pinstripe/downloads/downloads.css
View File

@ -238,34 +238,47 @@ richlistitem[type="download"][state="1"]:hover > stack > .downloadButton.downloa
}
}
/*** Event notification ***/
/*** Download notifications ***/
#downloads-indicator-notification {
opacity: 0;
background: url("chrome://browser/skin/downloads/download-notification.png")
center no-repeat;
background-size: 16px;
background-position: center;
background-repeat: no-repeat;
}
@keyframes downloadsIndicatorNotificationRight {
@keyframes downloadsIndicatorNotificationStartRight {
from { opacity: 0; transform: translate(-128px, 128px) scale(8); }
20% { opacity: .85; animation-timing-function: ease-out; }
to { opacity: 0; transform: translate(0) scale(1); }
}
@keyframes downloadsIndicatorNotificationLeft {
@keyframes downloadsIndicatorNotificationStartLeft {
from { opacity: 0; transform: translate(128px, 128px) scale(8); }
20% { opacity: .85; animation-timing-function: ease-out; }
to { opacity: 0; transform: translate(0) scale(1); }
}
#downloads-indicator[notification] > #downloads-indicator-anchor > #downloads-indicator-notification {
animation-name: downloadsIndicatorNotificationRight;
#downloads-indicator[notification="start"] > #downloads-indicator-anchor > #downloads-indicator-notification {
background-image: url("chrome://browser/skin/downloads/download-notification-start.png");
animation-name: downloadsIndicatorNotificationStartRight;
animation-duration: 1s;
}
#downloads-indicator[notification]:-moz-locale-dir(rtl) > #downloads-indicator-anchor > #downloads-indicator-notification {
animation-name: downloadsIndicatorNotificationLeft;
#downloads-indicator[notification="start"]:-moz-locale-dir(rtl) > #downloads-indicator-anchor > #downloads-indicator-notification {
animation-name: downloadsIndicatorNotificationStartLeft;
}
@keyframes downloadsIndicatorNotificationFinish {
from { opacity: 0; transform: scale(1); }
20% { opacity: .65; animation-timing-function: ease-in; }
to { opacity: 0; transform: scale(8); }
}
#downloads-indicator[notification="finish"] > #downloads-indicator-anchor > #downloads-indicator-notification {
background-image: url("chrome://browser/skin/downloads/download-notification-finish.png");
animation-name: downloadsIndicatorNotificationFinish;
animation-duration: 1s;
}
/*** Progress bar and text ***/

3
browser/themes/pinstripe/jar.mn
View File

@ -73,7 +73,8 @@ browser.jar:
skin/classic/browser/downloads/buttons.png (downloads/buttons.png)
skin/classic/browser/downloads/download-glow.png (downloads/download-glow.png)
skin/classic/browser/downloads/download-glow@2x.png (downloads/download-glow@2x.png)
skin/classic/browser/downloads/download-notification.png (downloads/download-notification.png)
skin/classic/browser/downloads/download-notification-finish.png (downloads/download-notification-finish.png)
skin/classic/browser/downloads/download-notification-start.png (downloads/download-notification-start.png)
skin/classic/browser/downloads/download-summary.png (downloads/download-summary.png)
skin/classic/browser/downloads/downloads.css (downloads/downloads.css)
skin/classic/browser/downloads/allDownloadsViewOverlay.css (downloads/allDownloadsViewOverlay.css)

BIN
browser/themes/winstripe/downloads/download-notification-finish.png Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.7 KiB

0
browser/themes/winstripe/downloads/download-notification.png → browser/themes/winstripe/downloads/download-notification-start.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 3.1 KiB

31
browser/themes/winstripe/downloads/downloads.css
View File

@ -227,34 +227,47 @@ richlistitem[type="download"][state="1"]:hover > stack > .downloadButton.downloa
background-image: url("chrome://browser/skin/downloads/download-glow.png");
}
/*** Event notification ***/
/*** Download notifications ***/
#downloads-indicator-notification {
opacity: 0;
background: url("chrome://browser/skin/downloads/download-notification.png")
center no-repeat;
background-size: 16px;
background-position: center;
background-repeat: no-repeat;
}
@keyframes downloadsIndicatorNotificationRight {
@keyframes downloadsIndicatorNotificationStartRight {
from { opacity: 0; transform: translate(-128px, 128px) scale(8); }
20% { opacity: .85; animation-timing-function: ease-out; }
to { opacity: 0; transform: translate(0) scale(1); }
}
@keyframes downloadsIndicatorNotificationLeft {
@keyframes downloadsIndicatorNotificationStartLeft {
from { opacity: 0; transform: translate(128px, 128px) scale(8); }
20% { opacity: .85; animation-timing-function: ease-out; }
to { opacity: 0; transform: translate(0) scale(1); }
}
#downloads-indicator[notification] > #downloads-indicator-anchor > #downloads-indicator-notification {
animation-name: downloadsIndicatorNotificationRight;
#downloads-indicator[notification="start"] > #downloads-indicator-anchor > #downloads-indicator-notification {
background-image: url("chrome://browser/skin/downloads/download-notification-start.png");
animation-name: downloadsIndicatorNotificationStartRight;
animation-duration: 1s;
}
#downloads-indicator[notification]:-moz-locale-dir(rtl) > #downloads-indicator-anchor > #downloads-indicator-notification {
animation-name: downloadsIndicatorNotificationLeft;
#downloads-indicator[notification="start"]:-moz-locale-dir(rtl) > #downloads-indicator-anchor > #downloads-indicator-notification {
animation-name: downloadsIndicatorNotificationStartLeft;
}
@keyframes downloadsIndicatorNotificationFinish {
from { opacity: 0; transform: scale(1); }
20% { opacity: .65; animation-timing-function: ease-in; }
to { opacity: 0; transform: scale(8); }
}
#downloads-indicator[notification="finish"] > #downloads-indicator-anchor > #downloads-indicator-notification {
background-image: url("chrome://browser/skin/downloads/download-notification-finish.png");
animation-name: downloadsIndicatorNotificationFinish;
animation-duration: 1s;
}
/*** Progress bar and text ***/

6
browser/themes/winstripe/jar.mn
View File

@ -63,7 +63,8 @@ browser.jar:
skin/classic/browser/webRTC-shareDevice-64.png
skin/classic/browser/downloads/buttons.png (downloads/buttons.png)
skin/classic/browser/downloads/download-glow.png (downloads/download-glow.png)
skin/classic/browser/downloads/download-notification.png (downloads/download-notification.png)
skin/classic/browser/downloads/download-notification-finish.png (downloads/download-notification-finish.png)
skin/classic/browser/downloads/download-notification-start.png (downloads/download-notification-start.png)
skin/classic/browser/downloads/download-summary.png (downloads/download-summary.png)
* skin/classic/browser/downloads/downloads.css (downloads/downloads.css)
* skin/classic/browser/downloads/allDownloadsViewOverlay.css (downloads/allDownloadsViewOverlay.css)
@ -283,7 +284,8 @@ browser.jar:
skin/classic/aero/browser/webRTC-shareDevice-64.png
skin/classic/aero/browser/downloads/buttons.png (downloads/buttons-aero.png)
skin/classic/aero/browser/downloads/download-glow.png (downloads/download-glow.png)
skin/classic/aero/browser/downloads/download-notification.png (downloads/download-notification.png)
skin/classic/aero/browser/downloads/download-notification-finish.png (downloads/download-notification-finish.png)
skin/classic/aero/browser/downloads/download-notification-start.png (downloads/download-notification-start.png)
skin/classic/aero/browser/downloads/download-summary.png (downloads/download-summary.png)
* skin/classic/aero/browser/downloads/downloads.css (downloads/downloads-aero.css)
* skin/classic/aero/browser/downloads/allDownloadsViewOverlay.css (downloads/allDownloadsViewOverlay-aero.css)