Permalink
Browse files

Merge pull request #25716 from kentaromiura/add-clearAllNotifications…

…-effect

Bug 1092536 - Add a clear all notifications effect. r=cwiiis
  • Loading branch information...
2 parents 90585fb + dbf0819 commit 046e2783d2be7b6103a7220aa691fd14f4acb76a @Cwiiis Cwiiis committed Nov 17, 2014
@@ -9,6 +9,7 @@ var NotificationScreen = {
TRANSITION_FRACTION: 0.30,
TAP_THRESHOLD: 10,
SCROLL_THRESHOLD: 10,
+ CLEAR_DELAY: 80,
_notification: null,
_containerWidth: null,
@@ -728,11 +729,31 @@ var NotificationScreen = {
clearAll: function ns_clearAll() {
var notifications = this.container.querySelectorAll('.notification');
- for (var notification of notifications) {
- if (notification.dataset.noClear === 'true') {
- continue;
+ var clearable = [].slice.apply(notifications)
+ .filter(function isClearable(notification) {
+ return notification.dataset.noClear !== 'true';
+ });
+ var notification;
+ this.clearAllButton.disabled = true;
+ if (!clearable.length) {
+ return;
+ }
+ // Adding a callback to the last cleared notification to defer
+ // the destroying of the notifications after the last disappear
+ var lastClearable = clearable[clearable.length - 1];
+ var removeAll = (function removeAll() {
+ lastClearable.removeEventListener('transitionend', removeAll);
+ for (var notification of clearable) {
+ this.closeNotification(notification);
}
- this.closeNotification(notification);
+ }).bind(this);
+ lastClearable.addEventListener('transitionend', removeAll);
+
+ for (var index = 0, max = clearable.length; index < max; index++) {
+ notification = clearable[index];
+ notification.style.transitionDelay = (this.CLEAR_DELAY * index) + 'ms';
+ notification.classList.add('disappearing-via-clear-all');
+ notification.style.transform = '';
}
},
@@ -266,6 +266,7 @@
}
#notifications-container .notification.disappearing,
+#notifications-container .notification.disappearing-via-clear-all,
.notification-toaster.disappearing {
transition: transform 0.2s linear;
transform: translateX(100%);
@@ -87,12 +87,18 @@ marionette('notification behavior tests', function() {
notificationList.refresh();
assert.equal(notificationList.notifications.length, 2,
'unexpected number of notifications');
-
- client.executeScript(function() {
+ // Adding a new notification (to be sure it's the last one),
+ // once is shown triggers a `click` event on the `Clear all` button
+ // which starts the closing animation.
+ // The animation finish when the last `close` event is fired.
+ client.executeAsyncScript(function() {
var clearAll = document.getElementById('notification-clear');
var event = document.createEvent('CustomEvent');
event.initCustomEvent('click', true, true, {});
- clearAll.dispatchEvent(event);
+ var notification;
+ notification = new Notification('title 3');
+ notification.onclose = function(){ marionetteScriptFinished(true); };
+ notification.onshow = function(){ clearAll.dispatchEvent(event); };
});
notificationList.refresh();
@@ -169,4 +175,3 @@ marionette('notification behavior tests', function() {
done();
});
});
-

0 comments on commit 046e278

Please sign in to comment.