|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8" />
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
|
|
|
<title>PodGrab</title>
|
|
|
|
|
{{template "commoncss"}}
|
|
|
|
|
<style>
|
|
|
|
|
.button-delete {
|
|
|
|
|
color: #d11a2a;
|
|
|
|
|
}
|
|
|
|
|
.podcasts .button {
|
|
|
|
|
padding: 0 15px;
|
|
|
|
|
}
|
|
|
|
|
img {
|
|
|
|
|
display: none;
|
|
|
|
|
}
|
|
|
|
|
/* Larger than tablet */
|
|
|
|
|
@media (min-width: 750px) {
|
|
|
|
|
img {
|
|
|
|
|
display: block;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div class="container">
|
|
|
|
|
{{template "navbar" .}}
|
|
|
|
|
|
|
|
|
|
<div class="row" style="display: none">
|
|
|
|
|
<form action="/" method="post">
|
|
|
|
|
<div class="nine columns">
|
|
|
|
|
<input
|
|
|
|
|
type="url"
|
|
|
|
|
name="url"
|
|
|
|
|
id="url"
|
|
|
|
|
placeholder="Enter Podcast RSS feed to add"
|
|
|
|
|
class="u-full-width"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="three columns">
|
|
|
|
|
<input
|
|
|
|
|
type="submit"
|
|
|
|
|
value="Add Podcast"
|
|
|
|
|
class="u-full-width button-primary"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
<br />
|
|
|
|
|
|
|
|
|
|
{{range .podcasts}}
|
|
|
|
|
<div class="podcasts row" id="podcast-{{ .ID }}">
|
|
|
|
|
<div class="columns two">
|
|
|
|
|
<img
|
|
|
|
|
onerror="onImageError(this)"
|
|
|
|
|
class="u-full-width"
|
|
|
|
|
src="{{ .Image }}"
|
|
|
|
|
alt="{{ .Title }}"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="columns ten">
|
|
|
|
|
<a style="text-decoration: none" href="/podcasts/{{ .ID }}/view">
|
|
|
|
|
<h3>{{.Title}}</h3></a
|
|
|
|
|
>
|
|
|
|
|
|
|
|
|
|
<p class="useMore">{{ .Summary }}</p>
|
|
|
|
|
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="columns four">
|
|
|
|
|
{{if .LastEpisode}} Last Ep : {{ formatDate .LastEpisode }}
|
|
|
|
|
{{end}}
|
|
|
|
|
</div>
|
|
|
|
|
{{$downloading:= .DownloadingEpisodesCount}}
|
|
|
|
|
<div
|
|
|
|
|
class="columns five"
|
|
|
|
|
title="{{downloadedEpisodes .PodcastItems}} episodes downloaded out of total {{ len .PodcastItems}} episodes.
|
|
|
|
|
{{if gt $downloading 0}} {{$downloading}} episodes in queue {{end}}
|
|
|
|
|
"
|
|
|
|
|
>
|
|
|
|
|
{{if gt $downloading 0}}
|
|
|
|
|
({{$downloading}})/{{end}}{{.DownloadedEpisodesCount}}/{{.AllEpisodesCount}}
|
|
|
|
|
episodes
|
|
|
|
|
</div>
|
|
|
|
|
<div class="columns three" style="">
|
|
|
|
|
<button
|
|
|
|
|
class="button button-delete"
|
|
|
|
|
onclick="deletePodcast('{{.ID}}')"
|
|
|
|
|
title="Delete Podcast and episode files"
|
|
|
|
|
>
|
|
|
|
|
<i class="fas fa-trash"></i>
|
|
|
|
|
</button>
|
|
|
|
|
<button
|
|
|
|
|
class="button button-delete"
|
|
|
|
|
title="Delete only episode files"
|
|
|
|
|
onclick="deletePodcastEpisodes('{{.ID}}')"
|
|
|
|
|
>
|
|
|
|
|
<i class="fas fa-folder-minus"></i>
|
|
|
|
|
</button>
|
|
|
|
|
|
|
|
|
|
<button
|
|
|
|
|
class="button"
|
|
|
|
|
title="Download all episode files"
|
|
|
|
|
onclick="downloadAllEpisodes('{{.ID}}')"
|
|
|
|
|
>
|
|
|
|
|
<i class="fas fa-download"></i>
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
|
{{else}}
|
|
|
|
|
<div class="welcome">
|
|
|
|
|
<h5>Welcome</h5>
|
|
|
|
|
<p>It seems you have just setup Podgrab for the first time?</p>
|
|
|
|
|
<p>
|
|
|
|
|
Before you start adding and downloading podcasts I recommend that you
|
|
|
|
|
give a quick look to the <a href="/settings"><strong>Settings</strong> here</a> so that you can customize the
|
|
|
|
|
downloading behavior of the software as per your needs.
|
|
|
|
|
</p>
|
|
|
|
|
<p>
|
|
|
|
|
<a href="/add">Click here</a> to add
|
|
|
|
|
a new podcast to start downloading.
|
|
|
|
|
</p>
|
|
|
|
|
<p>
|
|
|
|
|
Please feel free to report any issues or request any features on our github page <a target="_blank" href="https://github.com/akhilrex/podgrab">here</a>
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
{{end}}
|
|
|
|
|
<!-- <div class="row">
|
|
|
|
|
<div class="columns twelve" style="text-align: center;">
|
|
|
|
|
<a href="/episodes" class="button button-primary">All Episodes</a>
|
|
|
|
|
</div>
|
|
|
|
|
</div> -->
|
|
|
|
|
</div>
|
|
|
|
|
{{template "scripts"}}
|
|
|
|
|
<script>
|
|
|
|
|
function downloadAllEpisodes(id) {
|
|
|
|
|
var confirmed = confirm(
|
|
|
|
|
"Are you sure you want to download all episodes of this podcast?"
|
|
|
|
|
);
|
|
|
|
|
if (!confirmed) {
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
axios
|
|
|
|
|
.get("/podcasts/" + id + "/download")
|
|
|
|
|
.then(function (response) {
|
|
|
|
|
Vue.toasted.show(
|
|
|
|
|
"All episodes of this podcast have been enqueued to download.",
|
|
|
|
|
{
|
|
|
|
|
theme: "bubble",
|
|
|
|
|
type: "info",
|
|
|
|
|
position: "top-right",
|
|
|
|
|
duration: 5000,
|
|
|
|
|
}
|
|
|
|
|
);
|
|
|
|
|
})
|
|
|
|
|
.catch(function (error) {
|
|
|
|
|
if (error.response) {
|
|
|
|
|
Vue.toasted.show(error.response.data?.message, {
|
|
|
|
|
theme: "bubble",
|
|
|
|
|
type: "error",
|
|
|
|
|
position: "top-right",
|
|
|
|
|
duration: 5000,
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
.then(function () {});
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
function deletePodcast(id) {
|
|
|
|
|
// console.log(id);
|
|
|
|
|
var confirmed = confirm(
|
|
|
|
|
"Are you sure you want to delete this podcast and all files?"
|
|
|
|
|
);
|
|
|
|
|
if (!confirmed) {
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
axios
|
|
|
|
|
.delete("/podcasts/" + id)
|
|
|
|
|
.then(function (response) {
|
|
|
|
|
Vue.toasted.show("Podcast deleted successfully.", {
|
|
|
|
|
theme: "bubble",
|
|
|
|
|
type: "success",
|
|
|
|
|
position: "top-right",
|
|
|
|
|
duration: 5000,
|
|
|
|
|
});
|
|
|
|
|
var row = document.getElementById("podcast-" + id);
|
|
|
|
|
row.remove();
|
|
|
|
|
})
|
|
|
|
|
.catch(function (error) {
|
|
|
|
|
if (error.response) {
|
|
|
|
|
Vue.toasted.show(error.response.data?.message, {
|
|
|
|
|
theme: "bubble",
|
|
|
|
|
type: "error",
|
|
|
|
|
position: "top-right",
|
|
|
|
|
duration: 5000,
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
.then(function () {});
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function deletePodcastEpisodes(id) {
|
|
|
|
|
console.log(id);
|
|
|
|
|
var confirmed = confirm(
|
|
|
|
|
"Are you sure you want to delete all episodes of this podcast?"
|
|
|
|
|
);
|
|
|
|
|
if (!confirmed) {
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
axios
|
|
|
|
|
.delete("/podcasts/" + id + "/items")
|
|
|
|
|
.then(function (response) {
|
|
|
|
|
Vue.toasted.show("Podcast Episodes deleted successfully.", {
|
|
|
|
|
theme: "bubble",
|
|
|
|
|
type: "success",
|
|
|
|
|
position: "top-right",
|
|
|
|
|
duration: 5000,
|
|
|
|
|
});
|
|
|
|
|
})
|
|
|
|
|
.catch(function (error) {
|
|
|
|
|
if (error.response) {
|
|
|
|
|
Vue.toasted.show(error.response.data?.message, {
|
|
|
|
|
theme: "bubble",
|
|
|
|
|
type: "error",
|
|
|
|
|
position: "top-right",
|
|
|
|
|
duration: 5000,
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
.then(function () {});
|
|
|
|
|
return false;
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
