Skip to content
Permalink
Browse files

Bug 1147011 - Use text-align instead of dir attribute for Notificatio…

…n API dir overrides
  • Loading branch information...
mikehenrty authored and rvandermeulen committed Mar 27, 2015
1 parent 36b6608 commit 4ed7519a9dcaf1315bd90f7236241a9bb88a5a1b
@@ -92,7 +92,6 @@ var NotificationScreen = {
window.addEventListener('ftuopen', this);
window.addEventListener('ftudone', this);
window.addEventListener('desktop-notification-resend', this);
window.addEventListener('localized', this);

this._sound = 'style/notifications/ringtones/notifier_firefox.opus';

@@ -189,9 +188,6 @@ var NotificationScreen = {
this.clearLockScreen();
}).bind(this), 400);
break;
case 'localized':
this.updateNotificationsDir();
break;
}
},

@@ -366,25 +362,6 @@ var NotificationScreen = {
return date;
},

/* updateNotificationsDir makes sure all the notifications'
* directions are updated accoring to the system direction
* if they have dir explicitely specified to "auto", which is
* how we want the auto to behave, otherwise every child element
* will be aligned according to its own direction which creates
* a UI mess we can't control by changing the system
* language/direction
*/
updateNotificationsDir: function ns_updateNotificationsDir() {
var newDir = document.documentElement.dir;
var notificationGroup = document.getElementsByClassName('notification');
for (var i = 0, l = notificationGroup.length; i < l; i++) {
var predefinedDir = notificationGroup[i].dataset.predefinedDir;
if ((predefinedDir === 'auto') || !predefinedDir) {
notificationGroup[i].dir = newDir;
}
}
},

updateToaster: function ns_updateToaster(detail, type, dir) {
if (detail.icon) {
this.toasterIcon.src = detail.icon;
@@ -437,9 +414,7 @@ var NotificationScreen = {

notificationNode.dataset.notificationId = detail.id;
notificationNode.dataset.noClear = behavior.noclear ? 'true' : 'false';

notificationNode.lang = detail.lang;
notificationNode.dir = dir;
notificationNode.dataset.predefinedDir = detail.bidi;

notificationNode.dataset.obsoleteAPI = 'false';
@@ -499,7 +474,7 @@ var NotificationScreen = {
// but we still need to update type, lang and dir.
oldNotif.dataset.type = type;
oldNotif.lang = detail.lang;
oldNotif.dir = dir;
oldNotif.dataset.predefinedDir = detail.bidi;

notificationNode = oldNotif;
} else {
@@ -280,6 +280,17 @@

/* RTL View */

#notifications-container .notification[data-predefined-dir="rtl"] > div.title-container .title,
#notifications-container .notification[data-predefined-dir="rtl"] > div.detail {
direction: rtl;
}

#notifications-container .notification[data-predefined-dir="ltr"] > div.title-container .title,
#notifications-container .notification[data-predefined-dir="ltr"] > div.detail {
direction: ltr;
}


html[dir="rtl"] #toaster-icon{
left: unset;
right: 1.5rem;
@@ -303,15 +314,3 @@ html[dir="rtl"] #notifications-container .notification > div {
margin-left: unset;
margin-right: 3.7rem;
}

/*
* For the notification title, we need to use dir="auto" to display
* parenthesis and periods in their proper place. However, we still
* want the text to align right when in an RTL language, so we use
* the following override. See bug 1134453 and bug 1142925.
*/
html[dir="rtl"] #notifications-container .title-container .title:-moz-dir(ltr) {
text-align: right;
-moz-margin-end: unset;
margin-left: 0.5rem;
}
@@ -98,7 +98,7 @@
.innerHTML,
body: node.querySelector('.detail').innerHTML,
lang: node.getAttribute('lang'),
dir: node.getAttribute('dir'),
dir: node.getAttribute('data-predefined-dir'),
manifestURL: node.getAttribute('data-manifest-u-r-l')
};
});
@@ -96,7 +96,7 @@ NotificationList.prototype = {
.innerHTML,
body: document.querySelector(query + ' > .detail').innerHTML,
lang: document.querySelector(query).getAttribute('lang'),
dir: document.querySelector(query).getAttribute('dir'),
dir: document.querySelector(query).getAttribute('data-predefined-dir'),
manifestURL: node.getAttribute('data-manifest-u-r-l'),
query: query
});
@@ -344,7 +344,7 @@ suite('system/NotificationScreen >', function() {
document.getElementsByClassName('notification')[0];
var notificationNodeTitle =
document.querySelector('.notification .title-container .title');
assert.equal(dir, notificationNode.dir);
assert.equal(dir, notificationNode.dataset.predefinedDir);
assert.equal('auto', notificationNodeTitle.dir);
}

@@ -871,13 +871,4 @@ suite('system/NotificationScreen >', function() {
});
});
});

suite('events >', function() {

test('localization event', function() {
var spy = this.sinon.spy(NotificationScreen, 'updateNotificationsDir');
window.dispatchEvent(new CustomEvent('localized'));
assert.ok(spy.called);
});
});
});

0 comments on commit 4ed7519

Please sign in to comment.
You can’t perform that action at this time.