thm/noise-maker
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

better url handling

Browse source
This commit is contained in:
Tomáš Mládek 2020-01-10 22:50:10 +01:00
parent 382f2e34d4
commit 06ffaa02df
1 changed files with 10 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/components/Channel.vue
View file

@ -65,7 +65,7 @@ export default class Channel extends Vue {
@Watch("url") @Watch("url")
private onUrlChange() { private onUrlChange() {
if (this.url !== undefined) { if (this.url !== undefined && this.url.length > 0) {
if (this.youtubePlayer === undefined) { if (this.youtubePlayer === undefined) {
this.youtubePlayer = YouTubePlayerFactory(this.$refs.ytpl as HTMLDivElement, { this.youtubePlayer = YouTubePlayerFactory(this.$refs.ytpl as HTMLDivElement, {
playerVars: {"autoplay": 0}, playerVars: {"autoplay": 0},
@ -81,9 +81,8 @@ export default class Channel extends Vue {
} }
}); });
} }
const videoIdMatch = this.url.match(/v=([\w_\-]+)/); const videoId = Channel.extractYoutubeId(this.url);
if (videoIdMatch !== null && videoIdMatch.length == 2) { if (videoId !== undefined) {
const videoId = videoIdMatch[1];
this.state = ChannelState.LOADING; this.state = ChannelState.LOADING;
console.log(`Loading YouTube video "${videoId}"`); console.log(`Loading YouTube video "${videoId}"`);
this.youtubePlayer.loadVideoById(videoId); this.youtubePlayer.loadVideoById(videoId);
@ -102,6 +101,13 @@ export default class Channel extends Vue {
} }
} }
private static extractYoutubeId(url: string): string | undefined {
const videoIdMatch = url.match(/(v=|youtu\.be\/)([^&]+)/);
if (videoIdMatch !== null && videoIdMatch.length == 3) {
return videoIdMatch[2];
}
}
@Watch("volume") @Watch("volume")
private onVolumeChange() { private onVolumeChange() {
if (this.youtubePlayer) { if (this.youtubePlayer) {