+
diff --git a/chrome/player/main.mjs b/chrome/player/main.mjs
index df5c81fc..d86b8601 100644
--- a/chrome/player/main.mjs
+++ b/chrome/player/main.mjs
@@ -311,7 +311,7 @@ setup().catch((e)=>{
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
mutation.addedNodes.forEach((node) => {
- if (node.id === 'wave_sidebar_container') {
+ if (node.id === 'wave_sidebar_container' || node.id === 'waveordercontainer') {
doWaveFix();
}
});
@@ -328,6 +328,7 @@ observer.observe(document.body, {
childList: true,
});
+let lastObserver = null;
function doWaveFix() {
const player = document.querySelector('.mainplayer');
@@ -336,6 +337,11 @@ function doWaveFix() {
player.style.width = 'calc(100% - 380px)';
}
+ const waveordercontainer = document.querySelector('#waveordercontainer');
+ if (waveordercontainer) {
+ waveordercontainer.style.left = '380px';
+ }
+
const waveTopbar = document.querySelector('#wave5topbar');
if (waveTopbar) {
const topbarHeight = waveTopbar.clientHeight;
@@ -347,6 +353,10 @@ function doWaveFix() {
});
observer.observe(waveTopbar);
+ if (lastObserver) {
+ lastObserver.disconnect();
+ }
+ lastObserver = observer;
}
}
@@ -357,5 +367,10 @@ function undoWaveFix() {
player.style.width = '';
player.style.height = '';
}
+
+ if (lastObserver) {
+ lastObserver.disconnect();
+ lastObserver = null;
+ }
}
// SPLICER:EXTENSION:REMOVE_END
diff --git a/chrome/player/ui/InterfaceController.mjs b/chrome/player/ui/InterfaceController.mjs
index 975a9136..f0427004 100644
--- a/chrome/player/ui/InterfaceController.mjs
+++ b/chrome/player/ui/InterfaceController.mjs
@@ -944,9 +944,11 @@ export class InterfaceController {
if (this.state.playing) {
playButton.classList.add('playing');
playButtonBig.classList.replace('fluid_initial_play_button', 'fluid_initial_pause_button');
+ WebUtils.setLabels(playButton, Localize.getMessage('player_pause_label'));
} else {
playButton.classList.remove('playing');
playButtonBig.classList.replace('fluid_initial_pause_button', 'fluid_initial_play_button');
+ WebUtils.setLabels(playButton, Localize.getMessage('player_play_label'));
}
}
diff --git a/chrome/player/ui/OptionsWindow.mjs b/chrome/player/ui/OptionsWindow.mjs
index 86d4e597..be441b39 100644
--- a/chrome/player/ui/OptionsWindow.mjs
+++ b/chrome/player/ui/OptionsWindow.mjs
@@ -1,3 +1,4 @@
+import {Localize} from '../modules/Localize.mjs';
import {InterfaceUtils} from '../utils/InterfaceUtils.mjs';
import {WebUtils} from '../utils/WebUtils.mjs';
import {DOMElements} from './DOMElements.mjs';
@@ -37,10 +38,14 @@ export class OptionsWindow {
openUI() {
InterfaceUtils.closeWindows();
DOMElements.optionsContainer.style.display = '';
+
+ WebUtils.setLabels(DOMElements.settingsButton, Localize.getMessage('player_settings_close_label'));
}
closeUI() {
DOMElements.optionsContainer.style.display = 'none';
+
+ WebUtils.setLabels(DOMElements.settingsButton, Localize.getMessage('player_settings_open_label'));
}
toggleUI() {
diff --git a/chrome/player/ui/SourcesBrowser.mjs b/chrome/player/ui/SourcesBrowser.mjs
index eda69501..b069f3d8 100644
--- a/chrome/player/ui/SourcesBrowser.mjs
+++ b/chrome/player/ui/SourcesBrowser.mjs
@@ -249,10 +249,12 @@ export class SourcesBrowser {
openUI() {
InterfaceUtils.closeWindows();
DOMElements.linkuiContainer.style.display = '';
+ WebUtils.setLabels(DOMElements.linkButton, Localize.getMessage('player_sourcesbrowser_close_label'));
}
closeUI() {
DOMElements.linkuiContainer.style.display = 'none';
+ WebUtils.setLabels(DOMElements.linkButton, Localize.getMessage('player_sourcesbrowser_open_label'));
}
setupUI() {
diff --git a/chrome/player/ui/VolumeControls.mjs b/chrome/player/ui/VolumeControls.mjs
index 4d26d5df..03bc8da0 100644
--- a/chrome/player/ui/VolumeControls.mjs
+++ b/chrome/player/ui/VolumeControls.mjs
@@ -1,4 +1,5 @@
import {EventEmitter} from '../modules/eventemitter.mjs';
+import {Localize} from '../modules/Localize.mjs';
import {EnvUtils} from '../utils/EnvUtils.mjs';
import {Utils} from '../utils/Utils.mjs';
import {WebUtils} from '../utils/WebUtils.mjs';
@@ -143,6 +144,8 @@ export class VolumeControls extends EventEmitter {
} else {
DOMElements.volumeBanner.style.display = '';
}
+
+ WebUtils.setLabels(DOMElements.volumeBlock, Localize.getMessage('player_volume_label', [Math.round(volume * 100)]));
}
async loadVolumeState() {
diff --git a/chrome/player/ui/audio/AudioChannelMixer.mjs b/chrome/player/ui/audio/AudioChannelMixer.mjs
index 87b9f073..9c8f3334 100644
--- a/chrome/player/ui/audio/AudioChannelMixer.mjs
+++ b/chrome/player/ui/audio/AudioChannelMixer.mjs
@@ -239,6 +239,12 @@ export class AudioChannelMixer extends AbstractAudioModule {
const els = this.createMixerElements();
els.channelTitle.textContent = channel.isMaster() ? 'Master' : CHANNEL_NAMES[channel.id];
+ if (channel.isMaster()) {
+ WebUtils.setLabels(els.volumeHandle, Localize.getMessage('audiomixer_volume_master_handle_label', [els.channelTitle.textContent, Math.round(AudioUtils.gainToDB(channel.gain))]));
+ } else {
+ WebUtils.setLabels(els.volumeHandle, Localize.getMessage('audiomixer_volume_handle_label', [els.channelTitle.textContent, Math.round(AudioUtils.gainToDB(channel.gain))]));
+ }
+
els.volumeHandle.style.top = `${AudioUtils.mixerDBToPositionRatio(AudioUtils.gainToDB(channel.gain)) * 100}%`;
if (channel.isMaster()) { // master
@@ -270,6 +276,12 @@ export class AudioChannelMixer extends AbstractAudioModule {
els.volumeHandle.style.top = `${newYPercent}%`;
channel.gain = AudioUtils.dbToGain(db);
this.updateNodes();
+
+ if (channel.isMaster()) {
+ WebUtils.setLabels(els.volumeHandle, Localize.getMessage('audiomixer_volume_master_handle_label', [els.channelTitle.textContent, Math.round(AudioUtils.gainToDB(channel.gain))]));
+ } else {
+ WebUtils.setLabels(els.volumeHandle, Localize.getMessage('audiomixer_volume_handle_label', [els.channelTitle.textContent, Math.round(AudioUtils.gainToDB(channel.gain))]));
+ }
};
const mouseUp = (e) => {
@@ -382,6 +394,7 @@ export class AudioChannelMixer extends AbstractAudioModule {
}
});
els.volumeHandle.tabIndex = 0;
+ els.volumeHandle.role = 'slider';
els.soloButton.addEventListener('click', toggleSolo);
els.muteButton.addEventListener('click', toggleMute);
diff --git a/chrome/player/ui/audio/AudioConfigManager.mjs b/chrome/player/ui/audio/AudioConfigManager.mjs
index 90aa1641..8fa4ecdd 100644
--- a/chrome/player/ui/audio/AudioConfigManager.mjs
+++ b/chrome/player/ui/audio/AudioConfigManager.mjs
@@ -210,11 +210,15 @@ export class AudioConfigManager extends AbstractAudioModule {
InterfaceUtils.closeWindows();
DOMElements.audioConfigContainer.style.display = '';
this.startRenderLoop();
+
+ WebUtils.setLabels(DOMElements.audioConfigBtn, Localize.getMessage('player_audioconfig_close_label'));
}
closeUI() {
DOMElements.audioConfigContainer.style.display = 'none';
this.stopRenderLoop();
+
+ WebUtils.setLabels(DOMElements.audioConfigBtn, Localize.getMessage('player_audioconfig_open_label'));
}
saveCurrentProfile() {
diff --git a/chrome/player/ui/components/Dropdown.mjs b/chrome/player/ui/components/Dropdown.mjs
index db6aa7ad..2031b7ec 100644
--- a/chrome/player/ui/components/Dropdown.mjs
+++ b/chrome/player/ui/components/Dropdown.mjs
@@ -14,6 +14,8 @@ export function createDropdown(defaultChoice, title, items, call, editableCallba
container.dataset.val = defaultChoice;
container.tabIndex = 0;
+ container.role = 'listbox';
+ container.ariaLabel = title + ': ' + items[defaultChoice];
container.appendChild(text);
const itemListElement = create('div', `position: absolute; top: 100%; left: 0px; right: 0px;`, 'items');
for (const name in items) {
@@ -21,6 +23,7 @@ export function createDropdown(defaultChoice, title, items, call, editableCallba
const div = create('div');
div.dataset.val = name;
div.textContent = items[name];
+ div.role = 'option';
if (defaultChoice === name) {
div.style.backgroundColor = 'rgb(20,20,20)';
@@ -73,6 +76,9 @@ function setupDropdown(itemListElement, text, container, call) {
container.focus();
});
+
+ const main = text.children[0];
+
function shiftSelection(indexAmount) {
for (let j = 0; j < itemListElement.children.length; j++) {
const element = itemListElement.children[j];
@@ -81,7 +87,7 @@ function setupDropdown(itemListElement, text, container, call) {
const newIndex = (j + indexAmount + itemListElement.children.length) % itemListElement.children.length;
const nextElement = itemListElement.children[newIndex];
nextElement.style.backgroundColor = 'rgb(20,20,20)';
- text.children[0].textContent = nextElement.textContent;
+ main.textContent = nextElement.textContent;
container.dataset.val = nextElement.dataset.val;
if (call) call(container.dataset.val, element.dataset.val);
break;
@@ -115,7 +121,7 @@ function setupDropdown(itemListElement, text, container, call) {
const el = itemListElement.children[i];
el.addEventListener('click', (e) => {
- text.children[0].textContent = el.textContent;
+ main.textContent = el.textContent;
const prevValue = container.dataset.val;
container.dataset.val = el.dataset.val;
@@ -127,6 +133,7 @@ function setupDropdown(itemListElement, text, container, call) {
}
}
e.stopPropagation();
+ container.ariaLabel = text + ': ' + el.textContent;
if (call) call(container.dataset.val, prevValue);
});
})(i);
diff --git a/chrome/player/ui/components/Knob.mjs b/chrome/player/ui/components/Knob.mjs
index 52fe811b..6ab3bf2a 100644
--- a/chrome/player/ui/components/Knob.mjs
+++ b/chrome/player/ui/components/Knob.mjs
@@ -42,6 +42,10 @@ export function createKnob(name, minValue, maxValue, callback, units = '') {
const knobValue = WebUtils.create('div', null, 'knob_value');
knobContainer.appendChild(knobValue);
knobValue.contentEditable = true;
+ knobValue.role = 'textbox';
+ knobValue.ariaLabel = name;
+ knobValue.tabIndex = 0;
+
const decimals = Utils.clamp(3 - Math.ceil(Math.log10(maxValue - minValue)), 0, 3);
diff --git a/chrome/player/ui/subtitles/SubtitlesManager.mjs b/chrome/player/ui/subtitles/SubtitlesManager.mjs
index 5ee3bba4..86897015 100644
--- a/chrome/player/ui/subtitles/SubtitlesManager.mjs
+++ b/chrome/player/ui/subtitles/SubtitlesManager.mjs
@@ -146,6 +146,8 @@ export class SubtitlesManager extends EventEmitter {
closeUI() {
DOMElements.subtitlesMenu.style.display = 'none';
+
+ WebUtils.setLabels(DOMElements.subtitles, Localize.getMessage('player_subtitlesmenu_open_label'));
}
openUI() {
@@ -153,6 +155,8 @@ export class SubtitlesManager extends EventEmitter {
target: DOMElements.subtitles,
});
DOMElements.subtitlesMenu.style.display = '';
+
+ WebUtils.setLabels(DOMElements.subtitles, Localize.getMessage('player_subtitlesmenu_close_label'));
}
setupUI() {
diff --git a/chrome/player/utils/InterfaceUtils.mjs b/chrome/player/utils/InterfaceUtils.mjs
index 0be50c6d..8e6b08e1 100644
--- a/chrome/player/utils/InterfaceUtils.mjs
+++ b/chrome/player/utils/InterfaceUtils.mjs
@@ -2,9 +2,15 @@ import {DOMElements} from '../ui/DOMElements.mjs';
export class InterfaceUtils {
static closeWindows() {
- DOMElements.optionsContainer.style.display = 'none';
- DOMElements.subuiContainer.style.display = 'none';
- DOMElements.linkuiContainer.style.display = 'none';
- DOMElements.audioConfigContainer.style.display = 'none';
+ const windows = [
+ DOMElements.optionsContainer,
+ DOMElements.subuiContainer,
+ DOMElements.linkuiContainer,
+ DOMElements.audioConfigContainer,
+ ];
+
+ for (const box of windows) {
+ box.getElementsByClassName('close_button')[0].click();
+ }
}
}
diff --git a/chrome/player/utils/WebUtils.mjs b/chrome/player/utils/WebUtils.mjs
index 4024da35..4110a454 100644
--- a/chrome/player/utils/WebUtils.mjs
+++ b/chrome/player/utils/WebUtils.mjs
@@ -17,6 +17,11 @@ export class WebUtils {
});
}
+ static setLabels(element, label) {
+ element.ariaLabel = label;
+ element.title = label;
+ }
+
static getOffsetLeft(elem) {
return elem.getBoundingClientRect().left;
}
diff --git a/jsconfig.json b/jsconfig.json
new file mode 100644
index 00000000..854ff6ab
--- /dev/null
+++ b/jsconfig.json
@@ -0,0 +1,10 @@
+{
+ "compilerOptions": {
+ "module": "ES6",
+ "target": "ES6"
+ },
+ "exclude": [
+ "node_modules",
+ "built"
+ ]
+}
\ No newline at end of file