Destinations are now DownloadOptions

This commit is contained in:
2023-11-20 21:01:50 +10:30
parent fa978fecc2
commit a1e6421842
12 changed files with 200 additions and 139 deletions

View File

@@ -11,14 +11,14 @@
<div class="pure-g">
<div class="pure-u-1">
<button class="pure-button pure-button-primary" @click="save_config();" href="#">Save Config</button>
<button class="button-small pure-button button-small pure-button-primary" @click="save_config();" href="#">Save Config</button>
</div>
</div>
<div class="pure-g">
<div class="pure-u-lg-1-3 pure-u-1 l-box">
<form class="pure-form pure-form-stacked gropple-config">
<fieldset>
@@ -65,8 +65,8 @@
<legend>Download Profiles</legend>
<p>Gropple supports multiple download profiles. Each profile specifies a different youtube-dl
compatible command, and arguments. When starting a download, you may choose which profile
<p>Gropple supports multiple download profiles. Each profile specifies a different youtube-dl
compatible command, and arguments. When starting a download, you may choose which profile
to use. The URL will be appended to the argument list at the end.
</p>
@@ -75,10 +75,10 @@
<template x-for="(profile, i) in config.profiles">
<div>
<label x-bind:for="'config-profiles-'+i+'-name'">Name of profile <span x-text="i+1"></span>
</label>
</label>
<input type="text" x-bind:id="'config-profiles-'+i+'-name'" class="input-long" placeholder="name" x-model="profile.name" />
<button class="pure-button button-del" href="#" @click.prevent="config.profiles.splice(i, 1);;">delete profile</button>
<button class="button-small pure-button button-del" href="#" @click.prevent="config.profiles.splice(i, 1);;">delete profile</button>
<span class="pure-form-message">The name of this profile. For your information only.</span>
@@ -92,11 +92,11 @@
<template x-for="(arg, j) in profile.args">
<div>
<input type="text" x-bind:id="'config-profiles-'+i+'-arg-'+j" placeholder="arg" x-model="profile.args[j]" />
<button class="pure-button button-del" href="#" @click.prevent="profile.args.splice(j, 1);;">delete arg</button>
<button class="button-small pure-button button-del" href="#" @click.prevent="profile.args.splice(j, 1);;">delete arg</button>
</div>
</template>
<button class="pure-button button-add" href="#" @click.prevent="profile.args.push('');">add arg</button>
<button class="button-small pure-button button-add" href="#" @click.prevent="profile.args.push('');">add arg</button>
<span class="pure-form-message">Arguments for the command. Note that the shell is not used, so there is no need to quote or escape arguments, including those with spaces.</span>
<hr>
@@ -104,7 +104,7 @@
</div>
</template>
<button class="pure-button button-add" href="#" @click.prevent="config.profiles.push({name: 'new profile', command: 'youtube-dl', args: []});">add profile</button>
<button class="button-small pure-button button-add" href="#" @click.prevent="config.profiles.push({name: 'new profile', command: 'youtube-dl', args: []});">add profile</button>
</fieldset>
</form>
@@ -113,39 +113,44 @@
<div class="pure-u-lg-1-3 pure-u-1 l-box">
<form class="pure-form gropple-config">
<fieldset>
<legend>Destinations</legend>
<p>You can specify custom destinations (directories) here. Downloads can be
moved to one of these directories after completion from the index page,
if you do not want them to be left in the download path above.</p>
<legend>Download Options</legend>
<p>You can specify custom download options here. These are (optionally) selectable in addition
to the profile when starting a download. They append extra arguments to the downloader command.
The most common use is to specify a particular <tt>-o</tt> argument to <tt>yt-dlp</tt> to allow files to be downloaded
to a custom path.</p>
</p>
<template x-for="(dest, i) in config.destinations">
<template x-for="(download_option, i) in config.download_options">
<div>
<label x-bind:for="'config-destinations-'+i+'-name'">Name of destination <span x-text="i+1"></span>
</label>
<input type="text" x-bind:id="'config-destinations-'+i+'-name'" class="input-long" placeholder="name" x-model="dest.name" />
<label x-bind:for="'config-download-option-'+i+'-name'">Name of option <span x-text="i+1"></span>
</label>
<span class="pure-form-message">The name of this destination. For your information only.</span>
<input type="text" x-bind:id="'config-download-option-'+i+'-name'" class="input-long" placeholder="name" x-model="download_option.name" />
<label x-bind:for="'config-destinations-'+i+'-command'">Path</label>
<input type="text" x-bind:id="'config-destinations-'+i+'-command'" class="input-long" placeholder="name" x-model="dest.path" />
<span class="pure-form-message">Path to move completed downloads to.</span>
<span class="pure-form-message">The name of this option. For your information only.</span>
<button class="pure-button button-del" href="#" @click.prevent="config.destinations.splice(i, 1);">delete destination</button>
<label>Arguments</label>
<template x-for="(arg, j) in download_option.args">
<div>
<input type="text" x-bind:id="'config-download-option-'+i+'-arg-'+j" placeholder="arg" x-model="download_option.args[j]" />
<button class="button-small pure-button button-del" href="#" @click.prevent="download_option.args.splice(j, 1);;">delete arg</button>
</div>
</template>
<button class="button-small pure-button button-del" href="#" @click.prevent="config.download_options.splice(i, 1);">delete option</button>
<hr>
</div>
</template>
<button class="pure-button button-add" href="#" @click.prevent="config.destinations.push({name: 'new destination', path: '/tmp'});">add destination</button>
<button class="button-small pure-button button-add" href="#" @click.prevent="config.download_options.push({name: 'new option', args: ['-o', 'someting']});">add option</button>
</fieldset>
</form>
</div>
<div class="pure-g">
<div class="pure-u-1">
<button class="pure-button pure-button-primary" @click="save_config();" href="#">Save Config</button>
<button class="button-small pure-button button-small pure-button-primary" @click="save_config();" href="#">Save Config</button>
</div>
</div>
@@ -157,8 +162,8 @@
{{ define "js" }}
<script>
function config() {
return {
config: { server : {}, ui : {}, profiles: [], destinations: []},
return {
config: { server : {}, ui : {}, profiles: [], download_options: []},
error_message: '',
success_message: '',

View File

@@ -24,13 +24,23 @@
<table class="pure-table">
<thead>
<tr>
<th>id</th><th>filename</th><th>url</th><th>show</th><th>state</th><th>percent</th><th>eta</th><th>finished</th>
<th>id</th>
<th>filename</th>
<th>url</th>
<th>state</th>
<th>percent</th>
<th>eta</th>
<th>finished</th>
</tr>
</thead>
<tbody>
<template x-for="item in items">
<tr>
<td x-text="item.id"></td>
<td>
<a class="int-link" @click="show_popup(item)" href="#">
<span x-text="item.id">
</a>
</td>
<td>
<span x-show="item.files && item.files.length > 0">
<ul>
@@ -43,18 +53,17 @@
x-text="item.url">
</span>
</td>
<td><a class="int-link" x-bind:href="item.url">&#x2197;</a></td>
<td><a class="int-link" @click="show_popup(item)" href="#">&#x1F4C4;</a></td>
<td><a class="int-link" x-bind:href="item.url">&#x1F517;</a></td>
<td :class="'state-'+item.state" x-text="item.state"></td>
<td x-text="item.percent"></td>
<td x-text="item.eta"></td>
<td x-text="item.finished ? '&#x2714;' : '-'"></td>
</tr>
</template>
</tbody>
</template>
</tbody>
</table>
</div>
{{ end }}
@@ -62,7 +71,7 @@
{{ define "js" }}
<script>
function index() {
return {
return {
items: [], version: {}, popups: {},
fetch_version() {
fetch('/rest/version')

View File

@@ -5,9 +5,24 @@
<title>gropple</title>
<script src="/static/alpine.min.js" defer></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://unpkg.com/purecss@2.0.6/build/pure-min.css" integrity="sha384-Uu6IeWbM+gzNVXJcM9XV3SohHtmWE+3VGi496jvgX1jyvDTXfdK+rfZc8C1Aehk5" crossorigin="anonymous">
<link rel="stylesheet" href="https://unpkg.com/purecss@2.0.6/build/grids-responsive-min.css">
<link rel="preconnect" href="https://rsms.me/">
<link rel="stylesheet" href="https://rsms.me/inter/inter.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/purecss@3.0.0/build/pure-min.css" integrity="sha384-X38yfunGUhNzHpBaEBsWLO+A0HDYOQi8ufWDkZ0k9e0eXz/tH3II7uKZ9msv++Ls" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/purecss@3.0.0/build/grids-responsive-min.css">
<style>
:root {
font-family: Inter, sans-serif;
font-feature-settings: 'liga' 1, 'calt' 1; /* fix for Chrome */
}
@supports (font-variation-settings: normal) {
:root { font-family: InterVariable, sans-serif; }
}
.button-small {
font-size: 85%;
}
.pure-g > div {
box-sizing: border-box;
}
@@ -45,9 +60,6 @@
.gropple-config input.input-long {
width: 27em;
}
.gropple-config button {
border-radius: 12px;
}
.gropple-config button.button-del {
background: rgb(202, 60, 60);
}

View File

@@ -2,6 +2,7 @@
<div id="layout" class="pure-g pure-u-1" x-data="popup()" x-init="fetch_data()">
<h2>Download started</h2>
<p>Fetching <tt>{{ .dl.Url }}</tt></p>
<form class="pure-form">
<table class="pure-table" >
<tr>
<th>profile</th>
@@ -9,9 +10,9 @@
</tr>
<tr><th>current filename</th><td x-text="filename"></td></tr>
<tr>
<th>destination</th>
<th>option</th>
<td>
{{ if .dl.Destination }} {{ .dl.Destination.Name }} {{ else }} leave in {{ .config.Server.DownloadPath }} {{ end }}
{{ if .dl.DownloadOption }} {{ .dl.DownloadOption.Name }} {{ else }} n/a {{ end }}
</td>
</tr>
<tr><th>state</th><td x-text="state"></td></tr>
@@ -22,8 +23,9 @@
</table>
<p>You can close this window and your download will continue. Check the <a href="/" target="_gropple_status">Status page</a> to see all downloads in progress.</p>
{{ if .canStop }}
<button x-show="state=='Downloading'" class="pure-button" @click="stop()">stop</button>
<button x-show="state=='Downloading'" class="button-small pure-button" @click="stop()">stop</button>
{{ end }}
</form>
<div>
<h4>Logs</h4>
<pre x-text="log" style="height: auto;">

View File

@@ -19,11 +19,11 @@
</td>
</tr>
<tr>
<th>destination</th>
<th>download option</th>
<td>
<select class="pure-input-1-2" x-model="destination_chosen">
<option value="">leave in {{ .config.Server.DownloadPath }}</option>
{{ range $i := .config.Destinations }}
<select class="pure-input-1-2" x-model="download_option_chosen">
<option value="">no option</option>
{{ range $i := .config.DownloadOptions }}
<option>{{ $i.Name }}</option>
{{ end }}
</select>
@@ -32,7 +32,7 @@
<tr>
<th>&nbsp;</th>
<td>
<button class="pure-button" @click="start()">start download</button>
<button class="button-small pure-button" @click="start()">start download</button>
</td>
</tr>
@@ -44,12 +44,12 @@
function popup_create() {
return {
profile_chosen: "",
destination_chosen: "",
download_option_chosen: "",
error_message: "",
start() {
let op = {
method: 'POST',
body: JSON.stringify({action: 'start', url: '{{ .url }}', profile: this.profile_chosen, destination: this.destination_chosen}),
body: JSON.stringify({action: 'start', url: '{{ .url }}', profile: this.profile_chosen, download_option: this.download_option_chosen}),
headers: { 'Content-Type': 'application/json' }
};
fetch('/fetch', op)

View File

@@ -317,9 +317,9 @@ func fetchHandler(cs *config.ConfigService, vm *version.Manager, dm *download.Ma
} else if method == "POST" {
// creating a new one
type reqType struct {
URL string `json:"url"`
ProfileChosen string `json:"profile"`
DestinationChosen string `json:"destination"`
URL string `json:"url"`
ProfileChosen string `json:"profile"`
DownloadOptionChosen string `json:"download_option"`
}
req := reqType{}
@@ -356,20 +356,12 @@ func fetchHandler(cs *config.ConfigService, vm *version.Manager, dm *download.Ma
return
}
destination := cs.Config.DestinationCalled(req.DestinationChosen)
if req.DestinationChosen != "" && destination == nil {
w.WriteHeader(400)
json.NewEncoder(w).Encode(errorResponse{
Success: false,
Error: fmt.Sprintf("no such destination: '%s'", req.DestinationChosen),
})
return
}
option := cs.Config.DownloadOptionCalled(req.DownloadOptionChosen)
// create the new download
newDL := download.NewDownload(req.URL, cs.Config)
id := newDL.Id
newDL.Destination = destination
newDL.DownloadOption = option
newDL.DownloadProfile = *profile
dm.AddDownload(newDL)
dm.Queue(newDL)