Merge branch 'Master' into 'efy', Update efy submodule

src/main.js

@@ -20,8 +20,10 @@ import {
     faBook,
     faServer,
     faDonate,
+    faBookmark,
+    faEdit,
 } from "@fortawesome/free-solid-svg-icons";
-import { faGithub, faBitcoin, faYoutube } from "@fortawesome/free-brands-svg-icons";
+import { faGithub, faBitcoin, faYoutube, faOdysee } from "@fortawesome/free-brands-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 library.add(
     faEye,
@@ -32,6 +34,7 @@ library.add(
     faHeart,
     faHeadphones,
     faYoutube,
+    faOdysee,
     faRss,
     faChevronLeft,
     faLevelDownAlt,
@@ -46,6 +49,8 @@ library.add(
     faBook,
     faServer,
     faDonate,
+    faBookmark,
+    faEdit,
 );
 
 import router from "@/router/router.js";
@@ -60,8 +65,6 @@ import "./piped.js";
 
 import App from "./App.vue";
 
-import DOMPurify from "dompurify";
-
 import TimeAgo from "javascript-time-ago";
 
 import en from "javascript-time-ago/locale/en";
@@ -122,9 +125,6 @@ const mixin = {
                 return response.json();
             });
         },
-        purifyHTML(original) {
-            return DOMPurify.sanitize(original);
-        },
         setPreference(key, value, disableAlert = false) {
             try {
                 localStorage.setItem(key, value);
@@ -164,7 +164,17 @@ const mixin = {
                 (value = new URLSearchParams(window.location.search).get(key)) !== null ||
                 (this.testLocalStorage && (value = localStorage.getItem(key)) !== null)
             ) {
-                return Number(value);
+                const num = Number(value);
+                return isNaN(num) ? defaultVal : num;
+            } else return defaultVal;
+        },
+        getPreferenceJSON(key, defaultVal) {
+            var value;
+            if (
+                (value = new URLSearchParams(window.location.search).get(key)) !== null ||
+                (this.testLocalStorage && (value = localStorage.getItem(key)) !== null)
+            ) {
+                return JSON.parse(value);
             } else return defaultVal;
         },
         apiUrl() {
@@ -187,21 +197,8 @@ const mixin = {
         timeAgo(time) {
             return timeAgo.format(time);
         },
-        urlify(string) {
-            if (!string) return "";
-            const urlRegex = /(((https?:\/\/)|(www\.))[^\s]+)/g;
-            const emailRegex = /([\w-\\.]+@(?:[\w-]+\.)+[\w-]{2,4})/g;
-            return string
-                .replace(urlRegex, url => {
-                    if (url.endsWith("</a>") || url.endsWith("<a")) return url;
-                    return `<a href="${url}" target="_blank">${url}</a>`;
-                })
-                .replace(emailRegex, email => {
-                    return `<a href="mailto:${email}">${email}</a>`;
-                });
-        },
         async updateWatched(videos) {
-            if (window.db) {
+            if (window.db && this.getPreferenceBoolean("watchHistory", false)) {
                 var tx = window.db.transaction("watch_history", "readonly");
                 var store = tx.objectStore("watch_history");
                 videos.map(async video => {
@@ -209,6 +206,7 @@ const mixin = {
                     request.onsuccess = function (event) {
                         if (event.target.result) {
                             video.watched = true;
+                            video.currentTime = event.target.result.currentTime;
                         }
                     };
                 });
@@ -229,7 +227,7 @@ const mixin = {
         handleLocalSubscriptions(channelId) {
             var localSubscriptions = this.getLocalSubscriptions() ?? [];
             if (localSubscriptions.includes(channelId))
-                localSubscriptions.splice(localSubscriptions.indexOf(channelId));
+                localSubscriptions.splice(localSubscriptions.indexOf(channelId), 1);
             else localSubscriptions.push(channelId);
             // Sort for better cache hits
             localSubscriptions.sort();
@@ -246,8 +244,8 @@ const mixin = {
             return localSubscriptions.join(",");
         },
         /* generate a temporary file and ask the user to download it */
-        download(text, filename, type) {
-            var file = new Blob([text], { type: type });
+        download(text, filename, mimeType) {
+            var file = new Blob([text], { type: mimeType });
 
             const elem = document.createElement("a");
 
@@ -256,6 +254,294 @@ const mixin = {
             elem.click();
             elem.remove();
         },
+        getChannelGroupsCursor() {
+            if (!window.db) return;
+            var tx = window.db.transaction("channel_groups", "readonly");
+            var store = tx.objectStore("channel_groups");
+            return store.index("groupName").openCursor();
+        },
+        createOrUpdateChannelGroup(group) {
+            var tx = window.db.transaction("channel_groups", "readwrite");
+            var store = tx.objectStore("channel_groups");
+            store.put({
+                groupName: group.groupName,
+                channels: JSON.stringify(group.channels),
+            });
+        },
+        deleteChannelGroup(groupName) {
+            var tx = window.db.transaction("channel_groups", "readwrite");
+            var store = tx.objectStore("channel_groups");
+            store.delete(groupName);
+        },
+        async getLocalPlaylist(playlistId) {
+            return await new Promise(resolve => {
+                var tx = window.db.transaction("playlists", "readonly");
+                var store = tx.objectStore("playlists");
+                const req = store.openCursor(playlistId);
+                let playlist = null;
+                req.onsuccess = e => {
+                    playlist = e.target.result.value;
+                    playlist.videos = JSON.parse(playlist.videoIds).length;
+                    resolve(playlist);
+                };
+            });
+        },
+        createOrUpdateLocalPlaylist(playlist) {
+            var tx = window.db.transaction("playlists", "readwrite");
+            var store = tx.objectStore("playlists");
+            store.put(playlist);
+        },
+        // needs to handle both, streamInfo items and streams items
+        createLocalPlaylistVideo(videoId, videoInfo) {
+            if (videoInfo === undefined || videoId === null || videoInfo?.error) return;
+
+            var tx = window.db.transaction("playlist_videos", "readwrite");
+            var store = tx.objectStore("playlist_videos");
+            const video = {
+                videoId: videoId,
+                title: videoInfo.title,
+                type: "stream",
+                shortDescription: videoInfo.shortDescription ?? videoInfo.description,
+                url: `/watch?v=${videoId}`,
+                thumbnail: videoInfo.thumbnail ?? videoInfo.thumbnailUrl,
+                uploaderVerified: videoInfo.uploaderVerified,
+                duration: videoInfo.duration,
+                uploaderAvatar: videoInfo.uploaderAvatar,
+                uploaderUrl: videoInfo.uploaderUrl,
+                uploaderName: videoInfo.uploaderName ?? videoInfo.uploader,
+            };
+            store.put(video);
+        },
+        async getLocalPlaylistVideo(videoId) {
+            return await new Promise(resolve => {
+                var tx = window.db.transaction("playlist_videos", "readonly");
+                var store = tx.objectStore("playlist_videos");
+                const req = store.openCursor(videoId);
+                req.onsuccess = e => {
+                    resolve(e.target.result.value);
+                };
+            });
+        },
+        async getPlaylists() {
+            if (!this.authenticated) {
+                if (!window.db) return [];
+                return await new Promise(resolve => {
+                    let playlists = [];
+                    var tx = window.db.transaction("playlists", "readonly");
+                    var store = tx.objectStore("playlists");
+                    const cursorRequest = store.openCursor();
+                    cursorRequest.onsuccess = e => {
+                        const cursor = e.target.result;
+                        if (cursor) {
+                            let playlist = cursor.value;
+                            playlist.videos = JSON.parse(playlist.videoIds).length;
+                            playlists.push(playlist);
+                            cursor.continue();
+                        } else {
+                            resolve(playlists);
+                        }
+                    };
+                });
+            }
+
+            return await this.fetchJson(this.authApiUrl() + "/user/playlists", null, {
+                headers: {
+                    Authorization: this.getAuthToken(),
+                },
+            });
+        },
+        async getPlaylist(playlistId) {
+            if (!this.authenticated) {
+                const playlist = await this.getLocalPlaylist(playlistId);
+                const videoIds = JSON.parse(playlist.videoIds);
+                const videosFuture = videoIds.map(videoId => this.getLocalPlaylistVideo(videoId));
+                playlist.relatedStreams = await Promise.all(videosFuture);
+                return playlist;
+            }
+
+            return await this.fetchJson(this.authApiUrl() + "/playlists/" + playlistId);
+        },
+        async createPlaylist(name) {
+            if (!this.authenticated) {
+                const uuid = crypto.randomUUID();
+                const playlistId = `local-${uuid}`;
+                this.createOrUpdateLocalPlaylist({
+                    playlistId: playlistId,
+                    // remapping needed for the playlists page
+                    id: playlistId,
+                    name: name,
+                    description: "",
+                    thumbnail: "https://pipedproxy.kavin.rocks/?host=i.ytimg.com",
+                    videoIds: "[]", // empty list
+                });
+                return { playlistId: playlistId };
+            }
+
+            return await this.fetchJson(this.authApiUrl() + "/user/playlists/create", null, {
+                method: "POST",
+                body: JSON.stringify({
+                    name: name,
+                }),
+                headers: {
+                    Authorization: this.getAuthToken(),
+                    "Content-Type": "application/json",
+                },
+            });
+        },
+        async deletePlaylist(playlistId) {
+            if (!this.authenticated) {
+                const playlist = await this.getLocalPlaylist(playlistId);
+                var tx = window.db.transaction("playlists", "readwrite");
+                var store = tx.objectStore("playlists");
+                store.delete(playlistId);
+                // delete videos that don't need to be store anymore
+                const playlists = await this.getPlaylists();
+                const usedVideoIds = playlists
+                    .filter(playlist => playlist.id != playlistId)
+                    .map(playlist => JSON.parse(playlist.videoIds))
+                    .flat();
+                const potentialDeletableVideos = JSON.parse(playlist.videoIds);
+                var videoTx = window.db.transaction("playlist_videos", "readwrite");
+                var videoStore = videoTx.objectStore("playlist_videos");
+                for (let videoId of potentialDeletableVideos) {
+                    if (!usedVideoIds.includes(videoId)) videoStore.delete(videoId);
+                }
+                return { message: "ok" };
+            }
+
+            return await this.fetchJson(this.authApiUrl() + "/user/playlists/delete", null, {
+                method: "POST",
+                body: JSON.stringify({
+                    playlistId: playlistId,
+                }),
+                headers: {
+                    Authorization: this.getAuthToken(),
+                    "Content-Type": "application/json",
+                },
+            });
+        },
+        async renamePlaylist(playlistId, newName) {
+            if (!this.authenticated) {
+                const playlist = await this.getLocalPlaylist(playlistId);
+                playlist.name = newName;
+                this.createOrUpdateLocalPlaylist(playlist);
+                return { message: "ok" };
+            }
+
+            return await this.fetchJson(this.authApiUrl() + "/user/playlists/rename", null, {
+                method: "POST",
+                body: JSON.stringify({
+                    playlistId: playlistId,
+                    newName: newName,
+                }),
+                headers: {
+                    Authorization: this.getAuthToken(),
+                    "Content-Type": "application/json",
+                },
+            });
+        },
+        async changePlaylistDescription(playlistId, newDescription) {
+            if (!this.authenticated) {
+                const playlist = await this.getLocalPlaylist(playlistId);
+                playlist.description = newDescription;
+                this.createOrUpdateLocalPlaylist(playlist);
+                return { message: "ok" };
+            }
+
+            return await this.fetchJson(this.authApiUrl() + "/user/playlists/description", null, {
+                method: "PATCH",
+                body: JSON.stringify({
+                    playlistId: playlistId,
+                    description: newDescription,
+                }),
+                headers: {
+                    Authorization: this.getAuthToken(),
+                    "Content-Type": "application/json",
+                },
+            });
+        },
+        async addVideosToPlaylist(playlistId, videoIds, videoInfos) {
+            if (!this.authenticated) {
+                const playlist = await this.getLocalPlaylist(playlistId);
+                const currentVideoIds = JSON.parse(playlist.videoIds);
+                currentVideoIds.push(...videoIds);
+                playlist.videoIds = JSON.stringify(currentVideoIds);
+                let streamInfos =
+                    videoInfos ??
+                    (await Promise.all(videoIds.map(videoId => this.fetchJson(this.apiUrl() + "/streams/" + videoId))));
+                playlist.thumbnail = streamInfos[0].thumbnail || streamInfos[0].thumbnailUrl;
+                this.createOrUpdateLocalPlaylist(playlist);
+                for (let i in videoIds) {
+                    this.createLocalPlaylistVideo(videoIds[i], streamInfos[i]);
+                }
+                return { message: "ok" };
+            }
+
+            return await this.fetchJson(this.authApiUrl() + "/user/playlists/add", null, {
+                method: "POST",
+                body: JSON.stringify({
+                    playlistId: playlistId,
+                    videoIds: videoIds,
+                }),
+                headers: {
+                    Authorization: this.getAuthToken(),
+                    "Content-Type": "application/json",
+                },
+            });
+        },
+        async removeVideoFromPlaylist(playlistId, index) {
+            if (!this.authenticated) {
+                const playlist = await this.getLocalPlaylist(playlistId);
+                const videoIds = JSON.parse(playlist.videoIds);
+                videoIds.splice(index, 1);
+                playlist.videoIds = JSON.stringify(videoIds);
+                if (videoIds.length == 0) playlist.thumbnail = "https://pipedproxy.kavin.rocks/?host=i.ytimg.com";
+                this.createOrUpdateLocalPlaylist(playlist);
+                return { message: "ok" };
+            }
+
+            return await this.fetchJson(this.authApiUrl() + "/user/playlists/remove", null, {
+                method: "POST",
+                body: JSON.stringify({
+                    playlistId: playlistId,
+                    index: index,
+                }),
+                headers: {
+                    Authorization: this.getAuthToken(),
+                    "Content-Type": "application/json",
+                },
+            });
+        },
+        getHomePage(_this) {
+            switch (_this.getPreferenceString("homepage", "trending")) {
+                case "trending":
+                    return "/trending";
+                case "feed":
+                    return "/feed";
+                default:
+                    return undefined;
+            }
+        },
+        fetchDeArrowContent(content) {
+            if (!this.getPreferenceBoolean("dearrow", false)) return;
+
+            const videoIds = content
+                .filter(item => item.type === "stream")
+                .filter(item => item.dearrow === undefined)
+                .map(item => item.url.substr(-11))
+                .sort();
+
+            if (videoIds.length === 0) return;
+
+            this.fetchJson(this.apiUrl() + "/dearrow", {
+                videoIds: videoIds.join(","),
+            }).then(json => {
+                Object.keys(json).forEach(videoId => {
+                    const item = content.find(item => item.url.endsWith(videoId));
+                    if (item) item.dearrow = json[videoId];
+                });
+            });
+        },
     },
     computed: {
         authenticated(_this) {