123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138 |
- import { ref, reactive } from "vue";
- import Toast from "toasters";
- import { useWebsocketsStore } from "@/stores/websockets";
- type YoutubeVideo = {
- _id: string;
- youtubeId: string;
- title: string;
- author: string;
- duration: number;
- documentVersion: number;
- createdAt: Date;
- rawData: {
- kind: "youtube#video";
- etag: string;
- id: string;
- snippet: {
- publishedAt: string;
- channelId: string;
- title: string;
- description: string;
- thumbnails: {
- default: {
- url: string;
- width: number;
- height: number;
- };
- medium: {
- url: string;
- width: number;
- height: number;
- };
- high: {
- url: string;
- width: number;
- height: number;
- };
- standard: {
- url: string;
- width: number;
- height: number;
- };
- maxres: {
- url: string;
- width: number;
- height: number;
- };
- };
- channelTitle: string;
- tags: string[];
- categoryId: string;
- liveBroadcastContent: string;
- localized: {
- title: string;
- description: string;
- };
- };
- contentDetails: {
- duration: string;
- dimension: string;
- definition: string;
- caption: string;
- licensedContent: boolean;
- regionRestriction: {
- allowed: string[];
- };
- contentRating: object;
- projection: string;
- };
- status: {
- uploadStatus: string;
- privacyStatus: string;
- license: string;
- embeddable: true;
- publicStatsViewable: true;
- madeForKids: false;
- };
- statistics: {
- viewCount: string;
- likeCount: string;
- favoriteCount: string;
- commentCount: string;
- };
- };
- updatedAt: Date;
- uploadedAt: Date;
- };
- const youtubeVideoIDRegex = /^([\w-]{11})$/;
- export const useYoutubeVideo = () => {
- const youtubeVideoURLOrID = ref("");
- const youtubeVideos = reactive<YoutubeVideo[]>([]);
- const { socket } = useWebsocketsStore();
- const selectYoutubeVideo = () => {
- const youtubeVideoURLOrIDTrimmed = youtubeVideoURLOrID.value.trim();
- if (youtubeVideoURLOrIDTrimmed.length === 0)
- return new Toast(
- "No YouTube video ID found in the supplied value."
- );
- const youtubeVideoIDRegexResult = youtubeVideoIDRegex.exec(
- youtubeVideoURLOrIDTrimmed
- );
- if (!youtubeVideoIDRegexResult)
- return new Toast(
- "No YouTube video ID found in the supplied value."
- );
- return socket.dispatch(
- "youtube.getVideo",
- youtubeVideoIDRegexResult.groups.youtubeVideoID,
- res => {
- if (res.status === "success") {
- const { data } = res;
- if (
- !youtubeVideos.find(
- youtubeVideo =>
- youtubeVideo.youtubeId === data.youtubeId
- )
- )
- youtubeVideos.push(data);
- youtubeVideoURLOrID.value = "";
- } else if (res.status === "error") new Toast(res.message);
- }
- );
- };
- return {
- youtubeVideoURLOrID,
- youtubeVideos,
- selectYoutubeVideo
- };
- };
|