Bug 1491756 - Convert mail-tagfield to custom element; r=mkmelin
This commit is contained in:
Arshad Khan
Родитель
4cfad78180
Коммит
d5c6eaac6d
|
|
@ -3,8 +3,7 @@
|
|||
* 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/. */
|
||||
|
||||
/* global MozXULElement */
|
||||
/* global openUILink */
|
||||
/* global MozXULElement, openUILink */
|
||||
|
||||
class MozMailHeaderfield extends MozXULElement {
|
||||
connectedCallback() {
|
||||
|
|
@ -29,5 +28,51 @@ class MozMailUrlfield extends MozMailHeaderfield {
|
|||
}
|
||||
}
|
||||
|
||||
class MozMailHeaderfieldTags extends MozXULElement {
|
||||
connectedCallback() {
|
||||
this.classList.add("headerValue");
|
||||
ChromeUtils.import("resource:///modules/MailServices.jsm");
|
||||
}
|
||||
|
||||
set headerValue(val) {
|
||||
return this.buildTags(val);
|
||||
}
|
||||
|
||||
buildTags(tags) {
|
||||
// tags contains a list of actual tag names (not the keys), delimited by spaces
|
||||
// each tag name is encoded.
|
||||
|
||||
// remove any existing tag items we've appended to the list
|
||||
while (this.hasChildNodes()) {
|
||||
this.lastChild.remove();
|
||||
}
|
||||
|
||||
// tokenize the keywords based on ' '
|
||||
const tagsArray = tags.split(" ");
|
||||
for (let i = 0; i < tagsArray.length; i++) {
|
||||
// for each tag, create a label, give it the font color that corresponds to the
|
||||
// color of the tag and append it.
|
||||
let tagName;
|
||||
try {
|
||||
// if we got a bad tag name, getTagForKey will throw an exception, skip it
|
||||
// and go to the next one.
|
||||
tagName = MailServices.tags.getTagForKey(tagsArray[i]);
|
||||
} catch (ex) {
|
||||
continue;
|
||||
}
|
||||
|
||||
let color = MailServices.tags.getColorForKey(tagsArray[i]);
|
||||
|
||||
// now create a label for the tag name, and set the color
|
||||
const label = document.createElement("label");
|
||||
label.setAttribute("value", tagName);
|
||||
label.className = "tagvalue blc-" + color.substr(1);
|
||||
|
||||
this.appendChild(label);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define("mail-headerfield", MozMailHeaderfield);
|
||||
customElements.define("mail-urlfield", MozMailUrlfield);
|
||||
customElements.define("mail-tagfield", MozMailHeaderfieldTags);
|
||||
|
|
|
|||
|
|
@ -1182,72 +1182,6 @@
|
|||
</implementation>
|
||||
</binding>
|
||||
|
||||
<!-- Header field for showing the tags associated with a message -->
|
||||
<binding id="mail-headerfield-tags">
|
||||
<content>
|
||||
<xul:label class="headerValue" anonid="headerValue" flex="1"/>
|
||||
</content>
|
||||
|
||||
<implementation>
|
||||
<property name="headerValue" onset="return this.buildTags(val);"/>
|
||||
<method name="buildTags">
|
||||
<parameter name="aTags"/>
|
||||
<body>
|
||||
<![CDATA[
|
||||
// aTags contains a list of actual tag names (not the keys), delimited by spaces
|
||||
// each tag name is encoded.
|
||||
|
||||
// remove any existing tag items we've appended to the list
|
||||
var headerValueNode = document.getAnonymousElementByAttribute(this, 'anonid', 'headerValue');
|
||||
while (headerValueNode.hasChildNodes())
|
||||
headerValueNode.lastChild.remove();
|
||||
|
||||
// tokenize the keywords based on ' '
|
||||
var tagsArray = aTags.split(' ');
|
||||
for (var index = 0; index < tagsArray.length; index++)
|
||||
{
|
||||
// for each tag, create a label, give it the font color that corresponds to the
|
||||
// color of the tag and append it.
|
||||
var tagName;
|
||||
try {
|
||||
// if we got a bad tag name, getTagForKey will throw an exception, skip it
|
||||
// and go to the next one.
|
||||
tagName = MailServices.tags.getTagForKey(tagsArray[index]);
|
||||
} catch (ex) { continue; }
|
||||
|
||||
let color = MailServices.tags.getColorForKey(tagsArray[index]);
|
||||
|
||||
// now create a label for the tag name, and set the color
|
||||
var label = document.createElement("label");
|
||||
label.setAttribute('value', tagName);
|
||||
label.className = "tagvalue blc-" + color.substr(1);
|
||||
|
||||
// Since the control attribute points to the
|
||||
// <mail-headerfield-tags> rather than the XUL <label>, screen
|
||||
// readers don't know to automagically prepend the label when
|
||||
// reading the tag, so we force this. Furthermore, at least on
|
||||
// Mac, there is no JS labelElement property at all, so we
|
||||
// skip in that case. We get away with it because there's no
|
||||
// screen reader support on the Mac.
|
||||
if ("labelElement" in this) {
|
||||
let ariaLabel = this.labelElement.value + ": "
|
||||
+ tagName;
|
||||
label.setAttribute("aria-label", ariaLabel);
|
||||
}
|
||||
|
||||
headerValueNode.appendChild(label);
|
||||
}
|
||||
]]>
|
||||
</body>
|
||||
</method>
|
||||
<constructor>
|
||||
<![CDATA[
|
||||
ChromeUtils.import("resource:///modules/MailServices.jsm");
|
||||
]]>
|
||||
</constructor>
|
||||
</implementation>
|
||||
</binding>
|
||||
|
||||
<binding id="search-menulist-abstract" name="searchMenulistAbstract" extends="xul:box">
|
||||
<content>
|
||||
<xul:menulist class="search-menulist" xbl:inherits="flex,disabled" oncommand="this.parentNode.onSelect(event)">
|
||||
|
|
|
|||
|
|
@ -56,10 +56,6 @@ mail-newsgroups-headerfield {
|
|||
-moz-binding: url("chrome://messenger/content/mailWidgets.xml#mail-newsgroups-headerfield");
|
||||
}
|
||||
|
||||
mail-tagfield {
|
||||
-moz-binding: url("chrome://messenger/content/mailWidgets.xml#mail-headerfield-tags");
|
||||
}
|
||||
|
||||
mail-tagfield[collapsed="true"] {
|
||||
display: none;
|
||||
}
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче