import { MediaChromeButton } from "./media-chrome-button.js";
import { globalThis, document } from "./utils/server-safe-globals.js";
import { MediaUIAttributes, MediaUIEvents } from "./constants.js";
import { nouns, tooltipLabels } from "./labels/labels.js";
import {
areSubsOn,
parseTextTracksStr,
stringifyTextTrackList
} from "./utils/captions.js";
const ccIconOn = ``;
const ccIconOff = ``;
const slotTemplate = document.createElement("template");
slotTemplate.innerHTML = /*html*/
`
${ccIconOn}
${ccIconOff}
`;
const tooltipContent = (
/*html*/
`
${tooltipLabels.ENABLE_CAPTIONS}
${tooltipLabels.DISABLE_CAPTIONS}
`
);
const updateAriaChecked = (el) => {
el.setAttribute("aria-checked", areSubsOn(el).toString());
};
class MediaCaptionsButton extends MediaChromeButton {
static get observedAttributes() {
return [
...super.observedAttributes,
MediaUIAttributes.MEDIA_SUBTITLES_LIST,
MediaUIAttributes.MEDIA_SUBTITLES_SHOWING
];
}
constructor(options = {}) {
super({ slotTemplate, tooltipContent, ...options });
this._captionsReady = false;
}
connectedCallback() {
super.connectedCallback();
this.setAttribute("role", "switch");
this.setAttribute("aria-label", nouns.CLOSED_CAPTIONS());
updateAriaChecked(this);
}
attributeChangedCallback(attrName, oldValue, newValue) {
super.attributeChangedCallback(attrName, oldValue, newValue);
if (attrName === MediaUIAttributes.MEDIA_SUBTITLES_SHOWING) {
updateAriaChecked(this);
}
}
/**
* An array of TextTrack-like objects.
* Objects must have the properties: kind, language, and label.
*/
get mediaSubtitlesList() {
return getSubtitlesListAttr(this, MediaUIAttributes.MEDIA_SUBTITLES_LIST);
}
set mediaSubtitlesList(list) {
setSubtitlesListAttr(this, MediaUIAttributes.MEDIA_SUBTITLES_LIST, list);
}
/**
* An array of TextTrack-like objects.
* Objects must have the properties: kind, language, and label.
*/
get mediaSubtitlesShowing() {
return getSubtitlesListAttr(
this,
MediaUIAttributes.MEDIA_SUBTITLES_SHOWING
);
}
set mediaSubtitlesShowing(list) {
setSubtitlesListAttr(this, MediaUIAttributes.MEDIA_SUBTITLES_SHOWING, list);
}
handleClick() {
this.dispatchEvent(
new globalThis.CustomEvent(MediaUIEvents.MEDIA_TOGGLE_SUBTITLES_REQUEST, {
composed: true,
bubbles: true
})
);
}
}
const getSubtitlesListAttr = (el, attrName) => {
const attrVal = el.getAttribute(attrName);
return attrVal ? parseTextTracksStr(attrVal) : [];
};
const setSubtitlesListAttr = (el, attrName, list) => {
if (!(list == null ? void 0 : list.length)) {
el.removeAttribute(attrName);
return;
}
const newValStr = stringifyTextTrackList(list);
const oldVal = el.getAttribute(attrName);
if (oldVal === newValStr)
return;
el.setAttribute(attrName, newValStr);
};
if (!globalThis.customElements.get("media-captions-button")) {
globalThis.customElements.define(
"media-captions-button",
MediaCaptionsButton
);
}
var media_captions_button_default = MediaCaptionsButton;
export {
MediaCaptionsButton,
media_captions_button_default as default
};