mirror of
https://github.com/TeamPiped/Piped.git
synced 2024-08-14 23:57:27 +00:00
add support for auto deleting the history (#1778)
This commit is contained in:
Bnyro
GitHub
parent
d82a93fd0b
commit
ba3a87cb5c
2 changed files with 63 additions and 20 deletions
|
|
@ -1,13 +1,32 @@
|
|||
<template>
|
||||
<h1 class="font-bold text-center" v-t="'titles.history'" />
|
||||
<h1 class="font-bold text-center mb-3" v-t="'titles.history'" />
|
||||
|
||||
<div class="flex md:items-center gap-2 flex-col md:flex-row">
|
||||
<button class="btn" v-t="'actions.clear_history'" @click="clearHistory" />
|
||||
<div class="flex">
|
||||
<div class="flex md:items-center gap-2 flex-col md:flex-row">
|
||||
<button class="btn" v-t="'actions.clear_history'" @click="clearHistory" />
|
||||
|
||||
<button class="btn" v-t="'actions.export_to_json'" @click="exportHistory" />
|
||||
<button class="btn" v-t="'actions.export_to_json'" @click="exportHistory" />
|
||||
|
||||
<div class="ml-auto flex gap-1 items-center">
|
||||
<SortingSelector by-key="watchedAt" @apply="order => videos.sort(order)" />
|
||||
<div class="ml-auto flex gap-1 items-center">
|
||||
<SortingSelector by-key="watchedAt" @apply="order => videos.sort(order)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex ml-4 items-center">
|
||||
<input id="autoDelete" type="checkbox" v-model="autoDeleteHistory" @change="onChange" />
|
||||
<label class="ml-2" for="autoDelete" v-t="'actions.delete_automatically'" />
|
||||
<select class="pl-3 ml-3 select" v-model="autoDeleteDelayHours" @change="onChange">
|
||||
<option value="1" v-t="{ path: 'info.hours', args: { amount: '1' } }" />
|
||||
<option value="3" v-t="{ path: 'info.hours', args: { amount: '3' } }" />
|
||||
<option value="6" v-t="{ path: 'info.hours', args: { amount: '6' } }" />
|
||||
<option value="12" v-t="{ path: 'info.hours', args: { amount: '12' } }" />
|
||||
<option value="24" v-t="{ path: 'info.days', args: { amount: '1' } }" />
|
||||
<option value="72" v-t="{ path: 'info.days', args: { amount: '3' } }" />
|
||||
<option value="168" v-t="{ path: 'info.weeks', args: { amount: '1' } }" />
|
||||
<option value="336" v-t="{ path: 'info.weeks', args: { amount: '3' } }" />
|
||||
<option value="672" v-t="{ path: 'info.months', args: { amount: '1' } }" />
|
||||
<option value="1344" v-t="{ path: 'info.months', args: { amount: '2' } }" />
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -32,30 +51,39 @@ export default {
|
|||
data() {
|
||||
return {
|
||||
videos: [],
|
||||
autoDeleteHistory: false,
|
||||
autoDeleteDelayHours: "24",
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.autoDeleteHistory = this.getPreferenceBoolean("autoDeleteWatchHistory", false);
|
||||
this.autoDeleteDelayHours = this.getPreferenceString("autoDeleteWatchHistoryDelayHours", "24");
|
||||
|
||||
(async () => {
|
||||
if (window.db && this.getPreferenceBoolean("watchHistory", false)) {
|
||||
var tx = window.db.transaction("watch_history", "readonly");
|
||||
var tx = window.db.transaction("watch_history", "readwrite");
|
||||
var store = tx.objectStore("watch_history");
|
||||
const cursorRequest = store.index("watchedAt").openCursor(null, "prev");
|
||||
cursorRequest.onsuccess = e => {
|
||||
const cursor = e.target.result;
|
||||
if (cursor) {
|
||||
const video = cursor.value;
|
||||
this.videos.push({
|
||||
url: "/watch?v=" + video.videoId,
|
||||
title: video.title,
|
||||
uploaderName: video.uploaderName,
|
||||
uploaderUrl: video.uploaderUrl,
|
||||
duration: video.duration,
|
||||
thumbnail: video.thumbnail,
|
||||
watchedAt: video.watchedAt,
|
||||
watched: true,
|
||||
currentTime: video.currentTime,
|
||||
});
|
||||
if (this.videos.length < 1000) cursor.continue();
|
||||
if (!this.shouldRemoveVideo(video)) {
|
||||
this.videos.push({
|
||||
url: "/watch?v=" + video.videoId,
|
||||
title: video.title,
|
||||
uploaderName: video.uploaderName,
|
||||
uploaderUrl: video.uploaderUrl,
|
||||
duration: video.duration,
|
||||
thumbnail: video.thumbnail,
|
||||
watchedAt: video.watchedAt,
|
||||
watched: true,
|
||||
currentTime: video.currentTime,
|
||||
});
|
||||
} else {
|
||||
store.delete(video.videoId);
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
@ -89,6 +117,16 @@ export default {
|
|||
};
|
||||
this.download(JSON.stringify(json), `piped_history_${dateStr}.json`, "application/json");
|
||||
},
|
||||
onChange() {
|
||||
this.setPreference("autoDeleteWatchHistory", this.autoDeleteHistory);
|
||||
this.setPreference("autoDeleteWatchHistoryDelayHours", this.autoDeleteDelayHours);
|
||||
},
|
||||
shouldRemoveVideo(video) {
|
||||
if (!this.autoDeleteHistory) return false;
|
||||
// convert from hours to milliseconds
|
||||
let maximumTimeDiff = Number(this.autoDeleteDelayHours) * 60 * 60 * 1000;
|
||||
return Date.now() - video.watchedAt > maximumTimeDiff;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -139,7 +139,8 @@
|
|||
"group_name": "Group name",
|
||||
"cancel": "Cancel",
|
||||
"okay": "Okay",
|
||||
"show_search_suggestions": "Show search suggestions"
|
||||
"show_search_suggestions": "Show search suggestions",
|
||||
"delete_automatically": "Delete automatically after"
|
||||
},
|
||||
"comment": {
|
||||
"pinned_by": "Pinned by {author}",
|
||||
|
|
@ -196,6 +197,10 @@
|
|||
"cannot_copy": "Can't copy!",
|
||||
"local_storage": "This action requires localStorage, are cookies enabled?",
|
||||
"register_no_email_note": "Using an e-mail as username is not recommended. Proceed anyways?",
|
||||
"next_video_countdown": "Playing next video in {0}s"
|
||||
"next_video_countdown": "Playing next video in {0}s",
|
||||
"hours": "{amount} hour(s)",
|
||||
"days": "{amount} day(s)",
|
||||
"weeks": "{amount} week(s)",
|
||||
"months": "{amount} month(s)"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue