Allow Switching between Dash and Legacy formats

This commit is contained in:
Preston 2020-02-18 22:31:10 -05:00
parent 4dc8eab9b8
commit 06f3839515
7 changed files with 64 additions and 127 deletions

124
package-lock.json generated
View File

@ -3692,8 +3692,7 @@
"version": "3.0.0", "version": "3.0.0",
"resolved": "https://registry.npmjs.org/boolean/-/boolean-3.0.0.tgz", "resolved": "https://registry.npmjs.org/boolean/-/boolean-3.0.0.tgz",
"integrity": "sha512-OElxJ1lUSinuoUnkpOgLmxp0DC4ytEhODEL6QJU0NpxE/mI4rUSh8h1P1Wkvfi3xQEBcxXR2gBIPNYNuaFcAbQ==", "integrity": "sha512-OElxJ1lUSinuoUnkpOgLmxp0DC4ytEhODEL6QJU0NpxE/mI4rUSh8h1P1Wkvfi3xQEBcxXR2gBIPNYNuaFcAbQ==",
"dev": true, "dev": true
"optional": true
}, },
"boxen": { "boxen": {
"version": "4.2.0", "version": "4.2.0",
@ -7477,8 +7476,7 @@
"ansi-regex": { "ansi-regex": {
"version": "2.1.1", "version": "2.1.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"aproba": { "aproba": {
"version": "1.2.0", "version": "1.2.0",
@ -7499,14 +7497,12 @@
"balanced-match": { "balanced-match": {
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"brace-expansion": { "brace-expansion": {
"version": "1.1.11", "version": "1.1.11",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"balanced-match": "^1.0.0", "balanced-match": "^1.0.0",
"concat-map": "0.0.1" "concat-map": "0.0.1"
@ -7521,20 +7517,17 @@
"code-point-at": { "code-point-at": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"concat-map": { "concat-map": {
"version": "0.0.1", "version": "0.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"console-control-strings": { "console-control-strings": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"core-util-is": { "core-util-is": {
"version": "1.0.2", "version": "1.0.2",
@ -7651,8 +7644,7 @@
"inherits": { "inherits": {
"version": "2.0.3", "version": "2.0.3",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"ini": { "ini": {
"version": "1.3.5", "version": "1.3.5",
@ -7664,7 +7656,6 @@
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"number-is-nan": "^1.0.0" "number-is-nan": "^1.0.0"
} }
@ -7679,7 +7670,6 @@
"version": "3.0.4", "version": "3.0.4",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"brace-expansion": "^1.1.7" "brace-expansion": "^1.1.7"
} }
@ -7687,14 +7677,12 @@
"minimist": { "minimist": {
"version": "0.0.8", "version": "0.0.8",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"minipass": { "minipass": {
"version": "2.3.5", "version": "2.3.5",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"safe-buffer": "^5.1.2", "safe-buffer": "^5.1.2",
"yallist": "^3.0.0" "yallist": "^3.0.0"
@ -7713,7 +7701,6 @@
"version": "0.5.1", "version": "0.5.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"minimist": "0.0.8" "minimist": "0.0.8"
} }
@ -7794,8 +7781,7 @@
"number-is-nan": { "number-is-nan": {
"version": "1.0.1", "version": "1.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"object-assign": { "object-assign": {
"version": "4.1.1", "version": "4.1.1",
@ -7807,7 +7793,6 @@
"version": "1.4.0", "version": "1.4.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"wrappy": "1" "wrappy": "1"
} }
@ -7893,8 +7878,7 @@
"safe-buffer": { "safe-buffer": {
"version": "5.1.2", "version": "5.1.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"safer-buffer": { "safer-buffer": {
"version": "2.1.2", "version": "2.1.2",
@ -7930,7 +7914,6 @@
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"code-point-at": "^1.0.0", "code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0", "is-fullwidth-code-point": "^1.0.0",
@ -7950,7 +7933,6 @@
"version": "3.0.1", "version": "3.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"ansi-regex": "^2.0.0" "ansi-regex": "^2.0.0"
} }
@ -7994,14 +7976,12 @@
"wrappy": { "wrappy": {
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"yallist": { "yallist": {
"version": "3.0.3", "version": "3.0.3",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
} }
} }
}, },
@ -14518,86 +14498,6 @@
"resolved": "https://registry.npmjs.org/videojs-font/-/videojs-font-3.2.0.tgz", "resolved": "https://registry.npmjs.org/videojs-font/-/videojs-font-3.2.0.tgz",
"integrity": "sha512-g8vHMKK2/JGorSfqAZQUmYYNnXmfec4MLhwtEFS+mMs2IDY398GLysy6BH6K+aS1KMNu/xWZ8Sue/X/mdQPliA==" "integrity": "sha512-g8vHMKK2/JGorSfqAZQUmYYNnXmfec4MLhwtEFS+mMs2IDY398GLysy6BH6K+aS1KMNu/xWZ8Sue/X/mdQPliA=="
}, },
"videojs-frankly-ttml": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/videojs-frankly-ttml/-/videojs-frankly-ttml-1.0.1.tgz",
"integrity": "sha512-lmpTQA7q47V5S2ILpNhHbqOyWBebPGb3OGpTMXzUP1HkhA1ZdGSaBFLUG+manE9ZlONLu8FsoqrEFQoobCR4zA==",
"requires": {
"video.js": "^5.8.5"
},
"dependencies": {
"global": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/global/-/global-4.3.0.tgz",
"integrity": "sha1-737EvurVebRU9evV5/MD21T0Kis=",
"requires": {
"min-document": "^2.6.1",
"process": "~0.5.1"
}
},
"process": {
"version": "0.5.2",
"resolved": "https://registry.npmjs.org/process/-/process-0.5.2.tgz",
"integrity": "sha1-FjjYqONML0QKkduVq5rrZ3/Bhc8="
},
"video.js": {
"version": "5.20.5",
"resolved": "https://registry.npmjs.org/video.js/-/video.js-5.20.5.tgz",
"integrity": "sha1-RFza4gS85Fl4LYajGyWjKv1tjv8=",
"requires": {
"babel-runtime": "^6.9.2",
"global": "4.3.0",
"safe-json-parse": "4.0.0",
"tsml": "1.0.1",
"videojs-font": "2.0.0",
"videojs-ie8": "1.1.2",
"videojs-swf": "5.4.1",
"videojs-vtt.js": "0.12.6",
"xhr": "2.2.2"
}
},
"videojs-font": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/videojs-font/-/videojs-font-2.0.0.tgz",
"integrity": "sha1-r3Rh751LleAzS/+3iy8v8DZKkDQ="
},
"videojs-vtt.js": {
"version": "0.12.6",
"resolved": "https://registry.npmjs.org/videojs-vtt.js/-/videojs-vtt.js-0.12.6.tgz",
"integrity": "sha512-XFXeGBQiljnElMhwCcZst0RDbZn2n8LU7ZScXryd3a00OaZsHAjdZu/7/RdSr7Z1jHphd45FnOvOQkGK4YrWCQ==",
"requires": {
"global": "^4.3.1"
},
"dependencies": {
"global": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/global/-/global-4.4.0.tgz",
"integrity": "sha512-wv/LAoHdRE3BeTGz53FAamhGlPLhlssK45usmGFThIi4XqnBmjKQ16u+RNbP7WvigRZDxUsM0J3gcQ5yicaL0w==",
"requires": {
"min-document": "^2.19.0",
"process": "^0.11.10"
}
},
"process": {
"version": "0.11.10",
"resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
"integrity": "sha1-czIwDoQBYb2j5podHZGn1LwW8YI="
}
}
},
"xhr": {
"version": "2.2.2",
"resolved": "https://registry.npmjs.org/xhr/-/xhr-2.2.2.tgz",
"integrity": "sha1-LuclcYafhobUFVmp6ihsGJcUNf8=",
"requires": {
"global": "~4.3.0",
"is-function": "^1.0.1",
"parse-headers": "^2.0.0",
"xtend": "^4.0.0"
}
}
}
},
"videojs-http-source-selector": { "videojs-http-source-selector": {
"version": "1.1.6", "version": "1.1.6",
"resolved": "https://registry.npmjs.org/videojs-http-source-selector/-/videojs-http-source-selector-1.1.6.tgz", "resolved": "https://registry.npmjs.org/videojs-http-source-selector/-/videojs-http-source-selector-1.1.6.tgz",

View File

@ -16,16 +16,20 @@ export default Vue.extend({
'ft-card': FtCard 'ft-card': FtCard
}, },
props: { props: {
sourceList: { format: {
type: Array, type: String,
required: true required: true
}, },
sourceList: {
type: Array,
default: null
},
dashSrc: { dashSrc: {
type: Object, type: Array,
default: null default: null
}, },
hlsSrc: { hlsSrc: {
type: Object, type: Array,
default: null default: null
}, },
captionList: { captionList: {
@ -126,7 +130,7 @@ export default Vue.extend({
}, },
determineFormatType: function () { determineFormatType: function () {
if (this.hlsSrc === null && this.dashSrc !== null && this.videoFormatPreference === 'dash') { if (this.format === 'dash') {
this.enableDashFormat() this.enableDashFormat()
} else { } else {
this.enableLegacyFormat() this.enableLegacyFormat()
@ -139,14 +143,10 @@ export default Vue.extend({
return return
} }
console.log('using dash format')
this.useDash = true this.useDash = true
this.useHls = false this.useHls = false
this.activeSourceList = this.dashSrc this.activeSourceList = this.dashSrc
console.log(this.activeSourceList)
setTimeout(this.initializePlayer, 1000) setTimeout(this.initializePlayer, 1000)
}, },
@ -156,8 +156,6 @@ export default Vue.extend({
return return
} }
console.log('using legacy format')
this.useDash = false this.useDash = false
this.useHls = false this.useHls = false
this.activeSourceList = this.sourceList this.activeSourceList = this.sourceList

View File

@ -125,6 +125,20 @@ export default Vue.extend({
console.log('TODO: Handle subscription logic') console.log('TODO: Handle subscription logic')
}, },
handleFormatChange: function (format) {
console.log('Handling share')
console.log(this)
switch (format) {
case 'dash':
this.$parent.enableDashFormat()
break
case 'legacy':
this.$parent.enableLegacyFormat()
break
}
},
handleShare: function (method) { handleShare: function (method) {
console.log('Handling share') console.log('Handling share')

View File

@ -37,6 +37,7 @@
:label-names="formatTypeNames" :label-names="formatTypeNames"
:label-values="formatTypeValues" :label-values="formatTypeValues"
class="formatTypeDropdown" class="formatTypeDropdown"
@click="handleFormatChange"
/> />
<ft-list-dropdown <ft-list-dropdown
:title="shareLabel" :title="shareLabel"

View File

@ -10,7 +10,7 @@ const settingsDb = new Datastore({
const state = { const state = {
listType: 'grid', listType: 'grid',
invidiousInstance: 'https://invidio.us', invidiousInstance: 'https://invidio.us',
backendPreference: 'invidious', backendPreference: 'local',
useClickBaitRemover: true, useClickBaitRemover: true,
clickBaitRemoverPreference: '', clickBaitRemoverPreference: '',
backendFallback: true, backendFallback: true,

View File

@ -29,6 +29,8 @@ export default Vue.extend({
showLegacyPlayer: false, showLegacyPlayer: false,
showYouTubeNoCookieEmbed: false, showYouTubeNoCookieEmbed: false,
proxyVideos: false, proxyVideos: false,
hidePlayer: false,
activeFormat: 'legacy',
videoId: '', videoId: '',
videoTitle: '', videoTitle: '',
videoDescription: '', videoDescription: '',
@ -61,6 +63,10 @@ export default Vue.extend({
return this.$store.getters.getInvidiousInstance return this.$store.getters.getInvidiousInstance
}, },
videoFormatPreference: function () {
return this.$store.getters.getVideoFormatPreference
},
videoDashUrl: function () { videoDashUrl: function () {
return `${this.invidiousInstance}/api/manifest/dash/id/${this.videoId}.mpd` return `${this.invidiousInstance}/api/manifest/dash/id/${this.videoId}.mpd`
}, },
@ -70,11 +76,11 @@ export default Vue.extend({
}, },
dashSrc: function () { dashSrc: function () {
return { return [{
url: `${this.invidiousInstance}/api/manifest/dash/${this.videoId}.mpd`, url: `${this.invidiousInstance}/api/manifest/dash/${this.videoId}.mpd`,
type: 'application/dash+xml', type: 'application/dash+xml',
label: 'Dash' label: 'Dash'
} }]
} }
}, },
watch: { watch: {
@ -98,6 +104,8 @@ export default Vue.extend({
this.videoId = this.$route.params.id this.videoId = this.$route.params.id
this.videoStoryboardSrc = `${this.invidiousInstance}/api/v1/storyboards/${this.videoId}?height=90` this.videoStoryboardSrc = `${this.invidiousInstance}/api/v1/storyboards/${this.videoId}?height=90`
this.activeFormat = this.videoFormatPreference
if (this.proxyVideos) { if (this.proxyVideos) {
this.dashSrc = this.dashSrc + '?local=true' this.dashSrc = this.dashSrc + '?local=true'
} }
@ -223,6 +231,20 @@ export default Vue.extend({
// TODO: Show toast with error message // TODO: Show toast with error message
} }
}) })
},
enableDashFormat: function () {
this.activeFormat = 'dash'
this.hidePlayer = true
setTimeout(() => { this.hidePlayer = false }, 100)
},
enableLegacyFormat: function () {
this.activeFormat = 'legacy'
this.hidePlayer = true
setTimeout(() => { this.hidePlayer = false }, 100)
} }
} }
}) })

View File

@ -5,13 +5,15 @@
:fullscreen="true" :fullscreen="true"
/> />
<ft-video-player <ft-video-player
v-if="!isLoading" v-if="!isLoading && !hidePlayer"
:dash-src="dashSrc" :dash-src="dashSrc"
:source-list="videoSourceList" :source-list="videoSourceList"
:caption-list="captionSourceList" :caption-list="captionSourceList"
:storyboard-src="videoStoryboardSrc" :storyboard-src="videoStoryboardSrc"
:format="activeFormat"
class="videoPlayer" class="videoPlayer"
:class="{ theatrePlayer: useTheatreMode }" :class="{ theatrePlayer: useTheatreMode }"
ref="videoPlayer"
/> />
<watch-video-info <watch-video-info
v-if="!isLoading" v-if="!isLoading"