Revision control
Copy as Markdown
Other Tools
/* This Source Code Form is subject to the terms of the Mozilla Public
* 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/. */
/**
* Template ID: #calendarAttendeeTemplate
*
* @tagname calendar-dialog-attendee
*/
class CalendarDialogAttendee extends HTMLLIElement {
/**
* The attendee name element
*
* @type {HTMLElement}
*/
#name = null;
/**
* The attendee email element
*
* @type {HTMLElement}
*/
#email = null;
/**
* The attendee label element
*
* @type {HTMLElement}
*/
#label = null;
/**
* The attendee icon element
*
* @type {HTMLElement}
*/
#icon = null;
/**
* The attendee object
*
* @type {calIAttendee}
*/
attendee = null;
connectedCallback() {
if (this.hasConnected) {
return;
}
this.hasConnected = true;
const template = document
.getElementById("calendarDialogAttendeeTemplate")
.content.cloneNode(true);
this.append(template);
this.#name = this.querySelector(".attendee-name");
this.#email = this.querySelector(".attendee-email");
this.#label = this.querySelector(".attendee-label");
this.#icon = this.querySelector(".attendee-icon");
if (this.attendee) {
this.setAttendee(this.attendee);
}
}
/**
* Set the the attendee information from attendee object.
*
* @param {calIAttendee} attendee - An event attendee.
*/
setAttendee(attendee) {
this.attendee = attendee;
if (!this.hasConnected) {
return;
}
if (attendee.id.includes(attendee.commonName)) {
this.#name.hidden = true;
} else {
this.#name.textContent = attendee.commonName;
}
this.#email.textContent = attendee.id.split(":", 2)[1];
if (attendee.isOrganizer) {
document.l10n.setAttributes(
this.#label,
"calendar-dialog-attendee-organizer"
);
} else if (attendee.role === "OPT-PARTICIPANT") {
document.l10n.setAttributes(
this.#label,
"calendar-dialog-attendee-optional"
);
}
switch (attendee.participationStatus) {
case "ACCEPTED":
this.#icon.classList.add("attending");
document.l10n.setAttributes(
this.#icon,
"calendar-dialog-icon-attending"
);
break;
case "DECLINED":
this.#icon.classList.add("declined");
document.l10n.setAttributes(
this.#icon,
"calendar-dialog-icon-declined"
);
break;
case "TENTATIVE":
case "NEEDS-ACTION":
this.#icon.classList.add("maybe");
document.l10n.setAttributes(this.#icon, "calendar-dialog-icon-maybe");
break;
}
}
}
customElements.define("calendar-dialog-attendee", CalendarDialogAttendee, {
extends: "li",
});