Rooba
/
synclounge
mirror of https://github.com/synclounge/synclounge.git
1
1
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Changed subtitle selection to use vuex watchers

This commit is contained in:
Travis Shivers 2020-06-29 20:19:13 -05:00
parent ac566b6371
commit 95e5ee6660
2 changed files with 34 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/application/slplayer.vue
View File

@ -289,8 +289,8 @@ export default {
created() {
shaka.ui.OverflowMenu.registerElement('bitrate', BitrateSelectionFactory);
shaka.ui.OverflowMenu.registerElement('subtitle', new SubtitleSelectionFactory(this.eventbus));
shaka.ui.OverflowMenu.registerElement('audio', AudioSelectionFactory);
shaka.ui.OverflowMenu.registerElement('subtitle', SubtitleSelectionFactory);
shaka.ui.OverflowMenu.registerElement('audio', AudioSelectionFactory);
shaka.ui.OverflowMenu.registerElement('media', new MediaSelectionFactory(this.eventbus));
shaka.ui.Controls.registerElement('close', CloseButtonFactory);
shaka.ui.Controls.registerElement('forward30', Forward30ButtonFactory);
@ -310,7 +310,6 @@ export default {
this.bigPlayButton.addEventListener('click', this.onClick);
this.smallPlayButton.addEventListener('click', this.onClick);
this.eventbus.$on('subtitlestreamselectionchanged', this.CHANGE_SUBTITLE_STREAM);
this.eventbus.$on('mediaindexselectionchanged', this.CHANGE_MEDIA_INDEX);
this.INIT_PLAYER_STATE();
@ -323,7 +322,6 @@ export default {
window.removeEventListener('keyup', this.onKeyUp);
this.bigPlayButton.removeEventListener('click', this.onClick);
this.smallPlayButton.removeEventListener('click', this.onClick);
this.eventbus.$off('subtitlestreamselectionchanged', this.CHANGE_SUBTITLE_STREAM);
this.eventbus.$off('mediaindexselectionchanged', this.CHANGE_MEDIA_INDEX);
this.eventbus.$emit('slplayerdestroy');
this.DESTROY_PLAYER_STATE();
@ -331,7 +329,6 @@ export default {
methods: {
...mapActions('slplayer', [
'CHANGE_SUBTITLE_STREAM',
'CHANGE_MEDIA_INDEX',
'CHANGE_PLAYER_SRC',
'HANDLE_PLAYER_PLAYING',
@ -399,18 +396,6 @@ export default {
},
applyPlayerWatchers() {
this.$watch('GET_SUBTITLE_STREAMS', (newStreams) => {
this.eventbus.$emit('subtitlestreamschanged', newStreams);
}, {
immediate: true,
});
this.$watch('GET_SUBTITLE_STREAM_ID', (newId) => {
this.eventbus.$emit('subtitlestreamidchanged', newId);
}, {
immediate: true,
});
this.$watch('GET_MEDIA_LIST', (newList) => {
this.eventbus.$emit('medialistchanged', newList);
}, {

80
src/player/ui/subtitleselection.js
View File

@ -1,29 +1,24 @@
// eslint-disable-next-line max-classes-per-file
import shaka from 'shaka-player/dist/shaka-player.ui.debug';
import ShakaUtils from '@/player/ui/utils';
import store from '@/store';
class SubtitleSelection extends shaka.ui.SettingsMenu {
constructor(parent, controls, eventBus) {
super(parent, controls, 'subtitles');
this.eventBus = eventBus;
this.selectedSubtitleId = 0;
this.subtitleStreams = [];
this.eventListeners = [
{
event: 'subtitlestreamschanged',
fn: this.onSubtitleStreamsChanged.bind(this),
},
{
event: 'subtitlestreamidchanged',
fn: this.onSubtitleStreamIdChanged.bind(this),
},
];
#watcherCancellers = [];
ShakaUtils.addEventListeners(this.eventListeners, this.eventBus);
this.eventBus.$once(
'slplayerdestroy',
() => ShakaUtils.removeEventListeners(this.eventListeners, this.eventBus),
);
constructor(parent, controls) {
super(parent, controls, 'subtitles');
this.#watcherCancellers = [
store.watch(
(state, getters) => getters['slplayer/GET_SUBTITLE_STREAMS'],
this.updateSubtitleSelection.bind(this),
),
store.watch(
(state, getters) => getters['slplayer/GET_SUBTITLE_STREAM_ID'],
this.updateSubtitleSelection.bind(this),
),
];
this.button.classList.add('shaka-subtitles-button');
this.menu.classList.add('shaka-subtitles');
@ -34,21 +29,9 @@ class SubtitleSelection extends shaka.ui.SettingsMenu {
this.updateSubtitleSelection();
}
onSubtitleStreamsChanged(streams) {
this.subtitleStreams = streams;
this.updateSubtitleSelection();
}
onSubtitleStreamIdChanged(id) {
if (id !== this.selectedSubtitleId) {
this.selectedSubtitleId = id;
this.updateSubtitleSelection();
}
}
updateSubtitleSelection() {
// Hide menu if there is only the None subtitle option
if (this.subtitleStreams.length <= 1) {
if (store.getters['slplayer/GET_SUBTITLE_STREAMS'].length <= 1) {
ShakaUtils.setDisplay(this.menu, false);
ShakaUtils.setDisplay(this.button, false);
return;
@ -73,7 +56,7 @@ class SubtitleSelection extends shaka.ui.SettingsMenu {
}
addSubtitleSelection() {
this.subtitleStreams.forEach((subtitle) => {
store.getters['slplayer/GET_SUBTITLE_STREAMS'].forEach((subtitle) => {
const button = document.createElement('button');
button.classList.add('explicit-subtitle');
@ -87,7 +70,7 @@ class SubtitleSelection extends shaka.ui.SettingsMenu {
() => this.onSubtitleClicked(subtitle.id),
);
if (subtitle.id === this.selectedSubtitleId) {
if (subtitle.id === store.getters['slplayer/GET_SUBTITLE_STREAM_ID']) {
button.setAttribute('aria-selected', 'true');
button.appendChild(ShakaUtils.checkmarkIcon());
span.classList.add('shaka-chosen-item');
@ -99,18 +82,19 @@ class SubtitleSelection extends shaka.ui.SettingsMenu {
}
onSubtitleClicked(subtitleId) {
this.eventBus.$emit('subtitlestreamselectionchanged', subtitleId);
store.dispatch('slplayer/CHANGE_SUBTITLE_STREAM', subtitleId);
}
// TODO: replace this function name with "release" when upgrading to shaka 3
destroy() {
this.#watcherCancellers.forEach((canceller) => {
canceller();
});
super.destroy();
}
}
class SubtitleSelectionFactory {
constructor(eventBus) {
this.eventBus = eventBus;
}
create(rootElement, controls) {
return new SubtitleSelection(rootElement, controls, this.eventBus);
}
}
export default SubtitleSelectionFactory;
export default {
create: (rootElement, controls) => new SubtitleSelection(rootElement, controls),
};