TeamPiped-mirror/Piped
1
0
Fork 0
mirror of https://github.com/TeamPiped/Piped.git synced 2024-08-14 23:57:27 +00:00
Code Issues Projects Releases Packages Wiki Activity

add import functionality

Browse source
This commit is contained in:
Bnyro 2022-11-28 14:51:17 +01:00
parent 0a7c2d6c0c
commit d595e9d2c4
2 changed files with 68 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

84
src/components/PlaylistsPage.vue
View file

@ -4,10 +4,16 @@
<hr />
<div class="flex justify-between mb-3">
<button v-t="'actions.create_playlist'" class="btn" @click="createPlaylist" />
<button v-t="'actions.create_playlist'" class="btn" @click="onCreatePlaylist" />
<div class="flex">
<button v-t="'actions.export_to_json'" class="btn" @click="exportPlaylists" />
<button v-t="'actions.import_from_json'" class="btn ml-2" @click="importPlaylists" />
<button
v-if="this.playlists.length > 0"
v-t="'actions.export_to_json'"
class="btn"
@click="exportPlaylists"
/>
<input id="fileSelector" ref="fileSelector" type="file" class="display-none" @change="importPlaylists" />
<label for="fileSelector" v-t="'actions.import_from_json'" class="btn ml-2" />
</div>
</div>
@ -100,22 +106,26 @@ export default {
else this.playlists = this.playlists.filter(playlist => playlist.id !== id);
});
},
createPlaylist() {
onCreatePlaylist() {
const name = prompt(this.$t("actions.create_playlist"));
if (name)
this.fetchJson(this.authApiUrl() + "/user/playlists/create", null, {
method: "POST",
body: JSON.stringify({
name: name,
}),
headers: {
Authorization: this.getAuthToken(),
"Content-Type": "application/json",
},
}).then(json => {
if (json.error) alert(json.error);
else this.fetchPlaylists();
});
if (!name) return;
this.createPlaylist(name).then(json => {
if (json.error) alert(json.error);
else this.fetchPlaylists();
});
},
async createPlaylist(name) {
let json = await this.fetchJson(this.authApiUrl() + "/user/playlists/create", null, {
method: "POST",
body: JSON.stringify({
name: name,
}),
headers: {
Authorization: this.getAuthToken(),
"Content-Type": "application/json",
},
});
return json;
},
exportPlaylists() {
if (!this.playlists) return;
@ -147,6 +157,44 @@ export default {
}
onSuccess(playlistJson);
},
importPlaylists() {
const file = this.$refs.fileSelector.files[0];
file.text().then(text => {
let playlists = JSON.parse(text).playlists;
if (!playlists.length) {
alert(this.$t("actions.no_valid_playlists"));
return;
}
let importedCount = 0;
for (var i = 0; i < playlists.length; i++) {
this.createPlaylistWithVideos(playlists[i], () => {
importedCount++;
if (playlists.length != importedCount) return;
window.location.reload();
});
}
});
},
async createPlaylistWithVideos(playlist, onSuccess) {
let newPlaylist = await this.createPlaylist(playlist.name);
console.log(newPlaylist);
let videoIds = playlist.videos.map(url => url.replace("https://youtube.com/watch?v=", ""));
await this.addVideosToPlaylist(newPlaylist.playlistId, videoIds);
onSuccess();
},
async addVideosToPlaylist(playlistId, videoIds) {
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",
},
});
},
},
};
</script>

3
src/locales/en.json
View file

@ -118,7 +118,8 @@
"status_page": "Status",
"source_code": "Source code",
"instance_donations": "Instance donations",
"reply_count": "{count} replies"
"reply_count": "{count} replies",
"no_valid_playlists": "The file doesn't contain valid playlists!"
},
"comment": {
"pinned_by": "Pinned by {author}",