chuijs 4.0.2 → 4.0.4

package/framework/components/chui_media/video.js

@@ -1,9 +1,9 @@
 const { Icon, Icons } = require("../chui_icons/icons");
-const {Label} = require('../chui_label/label');
-const {makeKeyboardButton} = require("../../modules/chui_a11y/chui_a11y");
-const {Log} = require("../../modules/chui_logger/chui_logger");
-const {I18n} = require("../../modules/chui_i18n/chui_i18n");
-const {setStyles, optionOr} = require("../../modules/chui_functions");
+const { Label } = require("../chui_label/label");
+const { makeKeyboardButton } = require("../../modules/chui_a11y/chui_a11y");
+const { Log } = require("../../modules/chui_logger/chui_logger");
+const { I18n } = require("../../modules/chui_i18n/chui_i18n");
+const { setStyles, optionOr } = require("../../modules/chui_functions");
 
 /**
  * Видеоплеер: кадр и плавающая полоса управления внутри кадра.
@@ -17,18 +17,18 @@ const {setStyles, optionOr} = require("../../modules/chui_functions");
  * а события — через `addEventListener()`.
  */
 class Video {
-    #chui_vp_main = document.createElement("chui_vp_main");
-    #chui_vt = document.createElement("video");
+    #chuiVpMain = document.createElement("chui_vp_main");
+    #chuiVt = document.createElement("video");
     // Плавающая полоса управления
-    #chui_vp_panel = document.createElement("chui_vp_panel");
-    #chui_vp_play_pause = document.createElement("chui_vp_play_pause");
-    #chui_vp_time = undefined;
-    #chui_vp_progress = document.createElement("chui_vp_progress");
-    #chui_vp_seek = document.createElement("input");
-    #chui_vp_seek_buf = document.createElement("chui_vp_seek_buf");
-    #chui_vp_volume_icon = document.createElement("chui_vp_volume_icon");
-    #chui_vp_volume = document.createElement("input");
-    #chui_vp_full_mode = document.createElement("chui_vp_full_mode");
+    #chuiVpPanel = document.createElement("chui_vp_panel");
+    #chuiVpPlayPause = document.createElement("chui_vp_play_pause");
+    #chuiVpTime = undefined;
+    #chuiVpProgress = document.createElement("chui_vp_progress");
+    #chuiVpSeek = document.createElement("input");
+    #chuiVpSeekBuf = document.createElement("chui_vp_seek_buf");
+    #chuiVpVolumeIcon = document.createElement("chui_vp_volume_icon");
+    #chuiVpVolume = document.createElement("input");
+    #chuiVpFullMode = document.createElement("chui_vp_full_mode");
     // Состояние
     #controls = true;
     #destroyed = false;
@@ -36,58 +36,71 @@ class Video {
     #onPlay = () => this.#renderPlayState(true);
     #onPause = () => this.#renderPlayState(false);
     #onTimeUpdate = () => this.#renderProgress();
-    #onDurationChange = () => { this.#setSliderMax(); this.#renderProgress(); };
+    #onDurationChange = () => {
+        this.#setSliderMax();
+        this.#renderProgress();
+    };
     #onBuffered = () => this.#displayBufferedAmount();
     #onEnter = () => this.#openPanel();
     #onLeave = () => this.#closePanel();
-    constructor(options = {
-        src: String(), autoplay: Boolean(), controls: Boolean(), loop: Boolean(), muted: Boolean(),
-        volume: Number(), poster: String(), width: String(), height: String(), label: String()
-    }) {
-        setStyles(__dirname + "/video_styles.css", 'chUiJS_Video');
+    constructor(
+        options = {
+            src: String(),
+            autoplay: Boolean(),
+            controls: Boolean(),
+            loop: Boolean(),
+            muted: Boolean(),
+            volume: Number(),
+            poster: String(),
+            width: String(),
+            height: String(),
+            label: String(),
+        }
+    ) {
+        setStyles(__dirname + "/video_styles.css", "chUiJS_Video");
         // Плеер — именованная группа: своих ролей у панели нет, а без имени скринридер
         // читает подряд безымянные кнопки без контекста
-        this.#chui_vp_main.setAttribute("role", "group");
-        this.#chui_vp_main.setAttribute("aria-label", optionOr(options.label, I18n.t("media.videoPlayer")));
-        this.#chui_vt.preload = "metadata";
-        this.#chui_vt.controls = false;
-        if (options.src !== undefined) this.#chui_vt.setAttribute("src", options.src);
-        if (options.poster !== undefined) this.#chui_vt.setAttribute("poster", options.poster);
-        if (options.autoplay !== undefined) this.#chui_vt.autoplay = options.autoplay === true;
-        if (options.loop !== undefined) this.#chui_vt.loop = options.loop === true;
-        if (options.muted !== undefined) this.#chui_vt.muted = options.muted === true;
-        this.#chui_vt.volume = options.volume === undefined ? 0.5 : Math.min(1, Math.max(0, Number(options.volume)));
+        this.#chuiVpMain.setAttribute("role", "group");
+        this.#chuiVpMain.setAttribute("aria-label", optionOr(options.label, I18n.t("media.videoPlayer")));
+        this.#chuiVt.preload = "metadata";
+        this.#chuiVt.controls = false;
+        if (options.src !== undefined) this.#chuiVt.setAttribute("src", options.src);
+        if (options.poster !== undefined) this.#chuiVt.setAttribute("poster", options.poster);
+        if (options.autoplay !== undefined) this.#chuiVt.autoplay = options.autoplay === true;
+        if (options.loop !== undefined) this.#chuiVt.loop = options.loop === true;
+        if (options.muted !== undefined) this.#chuiVt.muted = options.muted === true;
+        this.#chuiVt.volume = options.volume === undefined ? 0.5 : Math.min(1, Math.max(0, Number(options.volume)));
         // Размеры кадра — стилем: опции принимают и проценты, и `-webkit-fill-available`
-        if (options.width !== undefined) this.#chui_vt.style.width = options.width;
-        if (options.height !== undefined) this.#chui_vt.style.height = options.height;
-        this.#chui_vp_main.appendChild(this.#chui_vt);
+        if (options.width !== undefined) this.#chuiVt.style.width = options.width;
+        if (options.height !== undefined) this.#chuiVt.style.height = options.height;
+        this.#chuiVpMain.appendChild(this.#chuiVt);
         this.#buildPanel();
-        this.#chui_vp_main.appendChild(this.#chui_vp_panel);
+        this.#chuiVpMain.appendChild(this.#chuiVpPanel);
         // О смене состояния и ошибках сообщает скрытый live-регион
         this.#status.classList.add("chui_visually_hidden");
         this.#status.setAttribute("role", "status");
         this.#status.setAttribute("aria-live", "polite");
-        this.#chui_vp_main.appendChild(this.#status);
+        this.#chuiVpMain.appendChild(this.#status);
         // СОБЫТИЯ
-        this.#chui_vt.addEventListener("play", this.#onPlay);
-        this.#chui_vt.addEventListener("pause", this.#onPause);
-        this.#chui_vt.addEventListener("timeupdate", this.#onTimeUpdate);
-        this.#chui_vt.addEventListener("durationchange", this.#onDurationChange);
-        this.#chui_vt.addEventListener("loadedmetadata", this.#onDurationChange);
-        this.#chui_vt.addEventListener("progress", this.#onBuffered);
-        this.#chui_vt.addEventListener("volumechange", () => this.#renderVolume());
-        this.#chui_vt.addEventListener("error", () => {
+        this.#chuiVt.addEventListener("play", this.#onPlay);
+        this.#chuiVt.addEventListener("pause", this.#onPause);
+        this.#chuiVt.addEventListener("timeupdate", this.#onTimeUpdate);
+        this.#chuiVt.addEventListener("durationchange", this.#onDurationChange);
+        this.#chuiVt.addEventListener("loadedmetadata", this.#onDurationChange);
+        this.#chuiVt.addEventListener("progress", this.#onBuffered);
+        this.#chuiVt.addEventListener("volumechange", () => this.#renderVolume());
+        this.#chuiVt.addEventListener("error", () => {
             Log.error(`[Video] не удалось прочитать дорожку: ${this.getSrc()}`);
-            this.#setStatus(I18n.t("media.videoNotPlaying", {reason: I18n.t("media.error.sourceFailed")}));
+            this.#setStatus(I18n.t("media.videoNotPlaying", { reason: I18n.t("media.error.sourceFailed") }));
         });
-        this.#chui_vp_main.addEventListener("mouseenter", this.#onEnter);
-        this.#chui_vp_main.addEventListener("mouseleave", this.#onLeave);
+        this.#chuiVpMain.addEventListener("mouseenter", this.#onEnter);
+        this.#chuiVpMain.addEventListener("mouseleave", this.#onLeave);
         // Панель не должна прятаться, пока в ней стоит клавиатурный фокус
-        this.#chui_vp_main.addEventListener("focusin", this.#onEnter);
-        this.#chui_vp_main.addEventListener("focusout", this.#onLeave);
-        this.#chui_vp_play_pause.addEventListener("click", () => this.#playPause());
-        this.#chui_vp_volume_icon.addEventListener("click", () => this.setMuted(!this.getMuted()));
-        this.#chui_vp_full_mode.addEventListener("click", () => this.#toggleFullscreen());
+        this.#chuiVpMain.addEventListener("focusin", this.#onEnter);
+        this.#chuiVpMain.addEventListener("focusout", this.#onLeave);
+        this.#chuiVpPlayPause.addEventListener("click", () => this.#playPause());
+        this.#chuiVpVolumeIcon.addEventListener("click", () => this.setMuted(!this.getMuted()));
+        this.#chuiVpFullMode.addEventListener("click", () => this.#toggleFullscreen());
         this.#setSliderMax();
         this.setControls(options.controls === undefined ? true : options.controls === true);
         this.#renderPlayState(false);
@@ -95,117 +108,123 @@ class Video {
     }
     /** Полоса управления: кнопки, полоса прогресса, время, громкость, полный экран */
     #buildPanel() {
-        this.#setButton(this.#chui_vp_play_pause, I18n.t("media.play"), Icons.AUDIO_VIDEO.PLAY_ARROW);
-        this.#setButton(this.#chui_vp_volume_icon, I18n.t("media.mute"), Icons.AUDIO_VIDEO.VOLUME_UP);
-        this.#setButton(this.#chui_vp_full_mode, I18n.t("media.fullscreen"), Icons.NAVIGATION.FULLSCREEN);
-        this.#chui_vp_time = new Label({text: this.#calculateTime(0)});
-        this.#chui_vp_seek.type = "range";
-        this.#chui_vp_seek.id = "chui_vp_seek";
-        this.#chui_vp_seek.max = "0";
-        this.#chui_vp_seek.value = "0";
-        this.#chui_vp_seek.setAttribute("aria-label", I18n.t("media.position"));
-        this.#chui_vp_seek.addEventListener("input", () => {
-            this.#chui_vt.currentTime = Number(this.#chui_vp_seek.value);
+        this.#setButton(this.#chuiVpPlayPause, I18n.t("media.play"), Icons.AUDIO_VIDEO.PLAY_ARROW);
+        this.#setButton(this.#chuiVpVolumeIcon, I18n.t("media.mute"), Icons.AUDIO_VIDEO.VOLUME_UP);
+        this.#setButton(this.#chuiVpFullMode, I18n.t("media.fullscreen"), Icons.NAVIGATION.FULLSCREEN);
+        this.#chuiVpTime = new Label({ text: this.#calculateTime(0) });
+        this.#chuiVpSeek.type = "range";
+        this.#chuiVpSeek.id = "chui_vp_seek";
+        this.#chuiVpSeek.max = "0";
+        this.#chuiVpSeek.value = "0";
+        this.#chuiVpSeek.setAttribute("aria-label", I18n.t("media.position"));
+        this.#chuiVpSeek.addEventListener("input", () => {
+            this.#chuiVt.currentTime = Number(this.#chuiVpSeek.value);
             this.#renderProgress();
         });
-        this.#chui_vp_progress.appendChild(this.#chui_vp_seek);
-        this.#chui_vp_progress.appendChild(this.#chui_vp_seek_buf);
-        this.#chui_vp_volume.type = "range";
-        this.#chui_vp_volume.id = "chui_vp_volume";
-        this.#chui_vp_volume.max = "100";
-        this.#chui_vp_volume.value = String(Math.round(this.#chui_vt.volume * 100));
-        this.#chui_vp_volume.setAttribute("aria-label", I18n.t("media.volume"));
-        this.#chui_vp_volume.addEventListener("input", () => {
-            this.#chui_vt.volume = Number(this.#chui_vp_volume.value) / 100;
-            this.#chui_vt.muted = false;
+        this.#chuiVpProgress.appendChild(this.#chuiVpSeek);
+        this.#chuiVpProgress.appendChild(this.#chuiVpSeekBuf);
+        this.#chuiVpVolume.type = "range";
+        this.#chuiVpVolume.id = "chui_vp_volume";
+        this.#chuiVpVolume.max = "100";
+        this.#chuiVpVolume.value = String(Math.round(this.#chuiVt.volume * 100));
+        this.#chuiVpVolume.setAttribute("aria-label", I18n.t("media.volume"));
+        this.#chuiVpVolume.addEventListener("input", () => {
+            this.#chuiVt.volume = Number(this.#chuiVpVolume.value) / 100;
+            this.#chuiVt.muted = false;
         });
         //
-        this.#chui_vp_panel.appendChild(this.#chui_vp_play_pause);
-        this.#chui_vp_panel.appendChild(this.#chui_vp_progress);
-        this.#chui_vp_panel.appendChild(this.#chui_vp_time.set());
-        this.#chui_vp_panel.appendChild(this.#chui_vp_volume_icon);
-        this.#chui_vp_panel.appendChild(this.#chui_vp_volume);
-        this.#chui_vp_panel.appendChild(this.#chui_vp_full_mode);
+        this.#chuiVpPanel.appendChild(this.#chuiVpPlayPause);
+        this.#chuiVpPanel.appendChild(this.#chuiVpProgress);
+        this.#chuiVpPanel.appendChild(this.#chuiVpTime.set());
+        this.#chuiVpPanel.appendChild(this.#chuiVpVolumeIcon);
+        this.#chuiVpPanel.appendChild(this.#chuiVpVolume);
+        this.#chuiVpPanel.appendChild(this.#chuiVpFullMode);
     }
     // === ПАНЕЛЬ И ПОЛОСЫ ===
     /** Полоса показывается, пока курсор над плеером или фокус в нём (состояние — класс) */
     #openPanel() {
         if (!this.#controls) return;
-        this.#chui_vp_main.classList.add("vp_panel_open");
+        this.#chuiVpMain.classList.add("vp_panel_open");
+    }
+    #closePanel() {
+        this.#chuiVpMain.classList.remove("vp_panel_open");
     }
-    #closePanel() { this.#chui_vp_main.classList.remove("vp_panel_open"); }
     #playPause = async () => {
         if (this.getPaused()) await this.play();
         else this.pause();
-    }
+    };
     #toggleFullscreen = async () => {
         if (document.fullscreenElement === null) await this.requestFullscreen();
         else await this.exitFullscreen();
-    }
+    };
     #renderPlayState(playing) {
-        this.#setIcon(this.#chui_vp_play_pause, playing ? Icons.AUDIO_VIDEO.PAUSE : Icons.AUDIO_VIDEO.PLAY_ARROW);
-        this.#setLabel(this.#chui_vp_play_pause, playing ? I18n.t("media.pause") : I18n.t("media.play"));
+        this.#setIcon(this.#chuiVpPlayPause, playing ? Icons.AUDIO_VIDEO.PAUSE : Icons.AUDIO_VIDEO.PLAY_ARROW);
+        this.#setLabel(this.#chuiVpPlayPause, playing ? I18n.t("media.pause") : I18n.t("media.play"));
     }
     #renderVolume = () => {
-        const доля = Math.min(100, Math.max(0, Math.round(this.#chui_vt.volume * 100)));
-        this.#chui_vp_volume.value = String(доля);
-        this.#chui_vp_volume.disabled = this.getMuted();
-        this.#chui_vp_main.style.setProperty('--volume-before-width', `${доля}%`);
-        this.#setIcon(this.#chui_vp_volume_icon, this.getMuted() || this.#chui_vt.volume === 0
-            ? Icons.AUDIO_VIDEO.VOLUME_OFF : Icons.AUDIO_VIDEO.VOLUME_UP);
-        this.#chui_vp_volume_icon.setAttribute("aria-label", I18n.t(this.getMuted() ? "media.unmute" : "media.mute"));
-    }
+        const доля = Math.min(100, Math.max(0, Math.round(this.#chuiVt.volume * 100)));
+        this.#chuiVpVolume.value = String(доля);
+        this.#chuiVpVolume.disabled = this.getMuted();
+        this.#chuiVpMain.style.setProperty("--volume_before_width", `${доля}%`);
+        this.#setIcon(
+            this.#chuiVpVolumeIcon,
+            this.getMuted() || this.#chuiVt.volume === 0 ? Icons.AUDIO_VIDEO.VOLUME_OFF : Icons.AUDIO_VIDEO.VOLUME_UP
+        );
+        this.#chuiVpVolumeIcon.setAttribute("aria-label", I18n.t(this.getMuted() ? "media.unmute" : "media.mute"));
+    };
     #displayBufferedAmount = () => {
-        const max = Number(this.#chui_vp_seek.max);
+        const max = Number(this.#chuiVpSeek.max);
         if (!(max > 0)) return;
         try {
-            const end = Math.floor(this.#chui_vt.buffered.end(0) / max * 100);
-            this.#chui_vp_seek_buf.style.width = `${Math.min(100, Math.max(0, end))}%`;
+            const end = Math.floor((this.#chuiVt.buffered.end(0) / max) * 100);
+            this.#chuiVpSeekBuf.style.width = `${Math.min(100, Math.max(0, end))}%`;
         } catch (_error) {
             // Буфер ещё пуст — рисовать нечего
         }
-    }
+    };
     // Длительность приходит с метаданными: без неё полоса прокрутки делила бы на ноль,
     // а у живого потока её нет вовсе (duration = Infinity)
     #setSliderMax = () => {
         const duration = this.getDuration();
         const known = Number.isFinite(duration) && duration > 0;
-        this.#chui_vp_seek.max = known ? String(Math.floor(duration)) : "0";
+        this.#chuiVpSeek.max = known ? String(Math.floor(duration)) : "0";
         // Без известной длительности ползунок бессмысленен: перетаскивание отправляло бы плеер в начало
-        this.#chui_vp_seek.disabled = !known;
-    }
+        this.#chuiVpSeek.disabled = !known;
+    };
     #renderProgress = () => {
-        const max = Number(this.#chui_vp_seek.max);
+        const max = Number(this.#chuiVpSeek.max);
         const position = this.getCurrentTime();
         const duration = this.getDuration();
         if (!(max > 0)) {
             // «0:07 / 0:00» читалось бы как поломка: у источника без длительности показываем только прошедшее
-            this.#chui_vp_time.setText(this.#calculateTime(position));
-            this.#chui_vp_main.style.setProperty('--seek-before-width', '0%');
+            this.#chuiVpTime.setText(this.#calculateTime(position));
+            this.#chuiVpMain.style.setProperty("--seek_before_width", "0%");
             return;
         }
-        this.#chui_vp_time.setText(`${this.#calculateTime(position)} / ${this.#calculateTime(duration)}`);
-        this.#chui_vp_seek.value = String(Math.floor(position));
+        this.#chuiVpTime.setText(`${this.#calculateTime(position)} / ${this.#calculateTime(duration)}`);
+        this.#chuiVpSeek.value = String(Math.floor(position));
         // Доля ограничена сотней: `max` — округлённая длительность, а позиция идёт дальше,
         // и без ограничения полоса целиком заливалась акцентом
-        const доля = Math.min(100, Math.max(0, Math.floor(position / max * 100)));
-        this.#chui_vp_main.style.setProperty('--seek-before-width', `${доля}%`);
-    }
+        const доля = Math.min(100, Math.max(0, Math.floor((position / max) * 100)));
+        this.#chuiVpMain.style.setProperty("--seek_before_width", `${доля}%`);
+    };
     #calculateTime = (secs) => {
         const seconds = Number.isFinite(Number(secs)) ? Number(secs) : 0;
         const minutes = Math.floor(seconds / 60);
         const rest = Math.floor(seconds % 60);
         const returnedSeconds = rest < 10 ? `0${rest}` : `${rest}`;
         return `${minutes}:${returnedSeconds}`;
+    };
+    #setStatus(text) {
+        this.#status.innerText = text;
     }
-    #setStatus(text) { this.#status.innerText = text; }
     #setButton(node, label, icon) {
-        node.innerHTML = new Icon(icon, "18px").getHTML();
+        node.innerHTML = new Icon(icon).getHTML();
         node.setAttribute("aria-label", label);
         makeKeyboardButton(node);
     }
-    #setIcon(node, icon, size = "18px") {
-        const glyph = new Icon(icon, size).getHTML();
+    #setIcon(node, icon) {
+        const glyph = new Icon(icon).getHTML();
         if (node.innerHTML !== glyph) node.innerHTML = glyph;
     }
     #setLabel(node, label) {
@@ -216,87 +235,161 @@ class Video {
     /** Полоса управления: `false` — панели нет вовсе, остаётся только кадр */
     setControls(boolean = Boolean()) {
         this.#controls = boolean === true;
-        this.#chui_vp_main.classList.toggle("vp_controls_off", !this.#controls);
+        this.#chuiVpMain.classList.toggle("vp_controls_off", !this.#controls);
         if (!this.#controls) this.#closePanel();
         return this;
     }
-    getControls() { return this.#controls; }
+    getControls() {
+        return this.#controls;
+    }
     // === СТАНДАРТНЫЕ ВОЗМОЖНОСТИ `<video>` ===
     /** Сам элемент: для всего, чего нет в списке ниже */
-    getVideo() { return this.#chui_vt; }
+    getVideo() {
+        return this.#chuiVt;
+    }
     /** Воспроизведение: промис, как у `<video>` (разрешается, когда воспроизведение началось) */
-    play() { return this.#chui_vt.play(); }
-    pause() { this.#chui_vt.pause(); return this; }
-    load() { this.#chui_vt.load(); return this; }
-    canPlayType(type = String()) { return this.#chui_vt.canPlayType(type); }
-    getSrc() { return this.#chui_vt.getAttribute("src") ?? ""; }
+    play() {
+        return this.#chuiVt.play();
+    }
+    pause() {
+        this.#chuiVt.pause();
+        return this;
+    }
+    load() {
+        this.#chuiVt.load();
+        return this;
+    }
+    canPlayType(type = String()) {
+        return this.#chuiVt.canPlayType(type);
+    }
+    getSrc() {
+        return this.#chuiVt.getAttribute("src") ?? "";
+    }
     setSrc(url = String()) {
-        this.#chui_vt.setAttribute("src", url);
-        this.#chui_vt.load();
+        this.#chuiVt.setAttribute("src", url);
+        this.#chuiVt.load();
         return this;
     }
-    getSrcObject() { return this.#chui_vt.srcObject; }
+    getSrcObject() {
+        return this.#chuiVt.srcObject;
+    }
     /** Живой поток (камера, `getUserMedia`) — штатное `srcObject`, а не путь */
     setSrcObject(object) {
-        this.#chui_vt.srcObject = object;
+        this.#chuiVt.srcObject = object;
         return this;
     }
-    getPoster() { return this.#chui_vt.getAttribute("poster") ?? ""; }
+    getPoster() {
+        return this.#chuiVt.getAttribute("poster") ?? "";
+    }
     setPoster(url = String()) {
-        if (url === "") this.#chui_vt.removeAttribute("poster");
-        else this.#chui_vt.setAttribute("poster", url);
+        if (url === "") this.#chuiVt.removeAttribute("poster");
+        else this.#chuiVt.setAttribute("poster", url);
         return this;
     }
-    getCurrentTime() { return this.#chui_vt.currentTime; }
+    getCurrentTime() {
+        return this.#chuiVt.currentTime;
+    }
     setCurrentTime(seconds = Number()) {
-        this.#chui_vt.currentTime = Number(seconds);
+        this.#chuiVt.currentTime = Number(seconds);
         // Подписи и заливка не ждут `timeupdate`: перемотка из кода видна сразу
         this.#renderProgress();
         return this;
     }
-    getDuration() { return this.#chui_vt.duration; }
-    getBuffered() { return this.#chui_vt.buffered; }
-    getPaused() { return this.#chui_vt.paused; }
-    getEnded() { return this.#chui_vt.ended; }
-    getReadyState() { return this.#chui_vt.readyState; }
-    getVolume() { return this.#chui_vt.volume; }
+    getDuration() {
+        return this.#chuiVt.duration;
+    }
+    getBuffered() {
+        return this.#chuiVt.buffered;
+    }
+    getPaused() {
+        return this.#chuiVt.paused;
+    }
+    getEnded() {
+        return this.#chuiVt.ended;
+    }
+    getReadyState() {
+        return this.#chuiVt.readyState;
+    }
+    getVolume() {
+        return this.#chuiVt.volume;
+    }
     setVolume(value = Number()) {
-        this.#chui_vt.volume = Math.min(1, Math.max(0, Number(value)));
+        this.#chuiVt.volume = Math.min(1, Math.max(0, Number(value)));
         return this;
     }
-    getMuted() { return this.#chui_vt.muted; }
+    getMuted() {
+        return this.#chuiVt.muted;
+    }
     setMuted(boolean = Boolean()) {
-        this.#chui_vt.muted = boolean === true;
+        this.#chuiVt.muted = boolean === true;
         return this;
     }
-    getPlaybackRate() { return this.#chui_vt.playbackRate; }
-    setPlaybackRate(rate = Number()) { this.#chui_vt.playbackRate = Number(rate); return this; }
-    getDefaultPlaybackRate() { return this.#chui_vt.defaultPlaybackRate; }
-    setDefaultPlaybackRate(rate = Number()) { this.#chui_vt.defaultPlaybackRate = Number(rate); return this; }
-    getLoop() { return this.#chui_vt.loop; }
-    setLoop(boolean = Boolean()) { this.#chui_vt.loop = boolean === true; return this; }
-    getAutoplay() { return this.#chui_vt.autoplay; }
-    setAutoplay(boolean = Boolean()) { this.#chui_vt.autoplay = boolean === true; return this; }
-    getWidth() { return getComputedStyle(this.#chui_vt).width; }
-    setWidth(value = String()) { this.#chui_vt.style.width = value; return this; }
-    getHeight() { return getComputedStyle(this.#chui_vt).height; }
-    setHeight(value = String()) { this.#chui_vt.style.height = value; return this; }
-    getFullscreen() { return this.#chui_vp_main === document.fullscreenElement; }
+    getPlaybackRate() {
+        return this.#chuiVt.playbackRate;
+    }
+    setPlaybackRate(rate = Number()) {
+        this.#chuiVt.playbackRate = Number(rate);
+        return this;
+    }
+    getDefaultPlaybackRate() {
+        return this.#chuiVt.defaultPlaybackRate;
+    }
+    setDefaultPlaybackRate(rate = Number()) {
+        this.#chuiVt.defaultPlaybackRate = Number(rate);
+        return this;
+    }
+    getLoop() {
+        return this.#chuiVt.loop;
+    }
+    setLoop(boolean = Boolean()) {
+        this.#chuiVt.loop = boolean === true;
+        return this;
+    }
+    getAutoplay() {
+        return this.#chuiVt.autoplay;
+    }
+    setAutoplay(boolean = Boolean()) {
+        this.#chuiVt.autoplay = boolean === true;
+        return this;
+    }
+    getWidth() {
+        return getComputedStyle(this.#chuiVt).width;
+    }
+    setWidth(value = String()) {
+        this.#chuiVt.style.width = value;
+        return this;
+    }
+    getHeight() {
+        return getComputedStyle(this.#chuiVt).height;
+    }
+    setHeight(value = String()) {
+        this.#chuiVt.style.height = value;
+        return this;
+    }
+    getFullscreen() {
+        return this.#chuiVpMain === document.fullscreenElement;
+    }
     /** Полный экран — на весь плеер, а не на кадр: иначе полоса управления осталась бы снаружи */
-    requestFullscreen() { return this.#chui_vp_main.requestFullscreen({ navigationUI: "hide" }); }
-    exitFullscreen() { return document.exitFullscreen(); }
+    requestFullscreen() {
+        return this.#chuiVpMain.requestFullscreen({ navigationUI: "hide" });
+    }
+    exitFullscreen() {
+        return document.exitFullscreen();
+    }
     addEventListener(type = String(), listener = () => {}) {
-        this.#chui_vt.addEventListener(type, listener);
+        this.#chuiVt.addEventListener(type, listener);
         return this;
     }
     removeEventListener(type = String(), listener = () => {}) {
-        this.#chui_vt.removeEventListener(type, listener);
+        this.#chuiVt.removeEventListener(type, listener);
         return this;
     }
-    set() { return this.#chui_vp_main; }
+    set() {
+        return this.#chuiVpMain;
+    }
     detach() {
         this.pause();
-        this.#chui_vp_main.remove();
+        this.#chuiVpMain.remove();
         return this;
     }
     /** Остановить плеер и снять свои обработчики. Повторный вызов безопасен */
@@ -304,20 +397,20 @@ class Video {
         if (this.#destroyed) return this;
         this.#destroyed = true;
         this.pause();
-        this.#chui_vt.removeEventListener("play", this.#onPlay);
-        this.#chui_vt.removeEventListener("pause", this.#onPause);
-        this.#chui_vt.removeEventListener("timeupdate", this.#onTimeUpdate);
-        this.#chui_vt.removeEventListener("durationchange", this.#onDurationChange);
-        this.#chui_vt.removeEventListener("loadedmetadata", this.#onDurationChange);
-        this.#chui_vt.removeEventListener("progress", this.#onBuffered);
-        this.#chui_vp_main.removeEventListener("mouseenter", this.#onEnter);
-        this.#chui_vp_main.removeEventListener("mouseleave", this.#onLeave);
-        this.#chui_vp_main.removeEventListener("focusin", this.#onEnter);
-        this.#chui_vp_main.removeEventListener("focusout", this.#onLeave);
-        this.#chui_vt.removeAttribute("src");
-        this.#chui_vt.load();
+        this.#chuiVt.removeEventListener("play", this.#onPlay);
+        this.#chuiVt.removeEventListener("pause", this.#onPause);
+        this.#chuiVt.removeEventListener("timeupdate", this.#onTimeUpdate);
+        this.#chuiVt.removeEventListener("durationchange", this.#onDurationChange);
+        this.#chuiVt.removeEventListener("loadedmetadata", this.#onDurationChange);
+        this.#chuiVt.removeEventListener("progress", this.#onBuffered);
+        this.#chuiVpMain.removeEventListener("mouseenter", this.#onEnter);
+        this.#chuiVpMain.removeEventListener("mouseleave", this.#onLeave);
+        this.#chuiVpMain.removeEventListener("focusin", this.#onEnter);
+        this.#chuiVpMain.removeEventListener("focusout", this.#onLeave);
+        this.#chuiVt.removeAttribute("src");
+        this.#chuiVt.load();
         return this;
     }
 }
 
-exports.Video = Video
+exports.Video = Video;