Add finished flag to response and clean up html templates

This commit is contained in:
Justin Hawkins 2021-09-21 17:13:30 +09:30
parent a9002162f1
commit 5cc2e609ae
4 changed files with 86 additions and 60 deletions

37
main.go
View File

@ -26,6 +26,7 @@ type download struct {
Pid int `json:"pid"` Pid int `json:"pid"`
ExitCode int `json:"exit_code"` ExitCode int `json:"exit_code"`
State string `json:"state"` State string `json:"state"`
Finished bool `json:"finished"`
Files []string `json:"files"` Files []string `json:"files"`
Eta string `json:"eta"` Eta string `json:"eta"`
Percent float32 `json:"percent"` Percent float32 `json:"percent"`
@ -78,7 +79,7 @@ func HomeHandler(w http.ResponseWriter, r *http.Request) {
bookmarkletURL := "javascript:(function(f,s,n,o){window.open(f+encodeURIComponent(s),n,o)}('http://localhost:8000/fetch?url=',window.location,'yourform','width=500,height=500'));" bookmarkletURL := "javascript:(function(f,s,n,o){window.open(f+encodeURIComponent(s),n,o)}('http://localhost:8000/fetch?url=',window.location,'yourform','width=500,height=500'));"
t, err := template.ParseFS(webFS, "web/index.html") t, err := template.ParseFS(webFS, "web/layout.tmpl", "web/index.html")
if err != nil { if err != nil {
panic(err) panic(err)
} }
@ -94,7 +95,7 @@ func HomeHandler(w http.ResponseWriter, r *http.Request) {
} }
log.Printf("%s", info.BookmarkletURL) log.Printf("%s", info.BookmarkletURL)
err = t.Execute(w, info) err = t.ExecuteTemplate(w, "layout", info)
if err != nil { if err != nil {
panic(err) panic(err)
} }
@ -131,12 +132,13 @@ func FetchHandler(w http.ResponseWriter, r *http.Request) {
// XXX should be atomic! // XXX should be atomic!
downloadId++ downloadId++
newDownload := download{ newDownload := download{
Id: downloadId, Id: downloadId,
Url: url[0], Url: url[0],
State: "starting", State: "starting",
Eta: "?", Finished: false,
Percent: 0.0, Eta: "?",
Log: make([]string, 0, 1000), Percent: 0.0,
Log: make([]string, 0, 1000),
} }
downloads[downloadId] = &newDownload downloads[downloadId] = &newDownload
// XXX atomic ^^ // XXX atomic ^^
@ -145,11 +147,11 @@ func FetchHandler(w http.ResponseWriter, r *http.Request) {
go func() { go func() {
queue(&newDownload) queue(&newDownload)
}() }()
t, err := template.ParseFS(webFS, "web/popup.html") t, err := template.ParseFS(webFS, "web/layout.tmpl", "web/popup.html")
if err != nil { if err != nil {
panic(err) panic(err)
} }
err = t.Execute(w, newDownload) err = t.ExecuteTemplate(w, "layout", newDownload)
if err != nil { if err != nil {
panic(err) panic(err)
} }
@ -170,21 +172,24 @@ func queue(dl *download) {
stdout, err := cmd.StdoutPipe() stdout, err := cmd.StdoutPipe()
if err != nil { if err != nil {
dl.State = "ended" dl.State = "failed"
dl.Finished = true
dl.Log = append(dl.Log, fmt.Sprintf("error setting up stdout pipe: %v", err)) dl.Log = append(dl.Log, fmt.Sprintf("error setting up stdout pipe: %v", err))
return return
} }
stderr, err := cmd.StderrPipe() stderr, err := cmd.StderrPipe()
if err != nil { if err != nil {
dl.State = "ended" dl.State = "failed"
dl.Finished = true
dl.Log = append(dl.Log, fmt.Sprintf("error setting up stderr pipe: %v", err)) dl.Log = append(dl.Log, fmt.Sprintf("error setting up stderr pipe: %v", err))
return return
} }
err = cmd.Start() err = cmd.Start()
if err != nil { if err != nil {
dl.State = "ended" dl.State = "failed"
dl.Finished = true
dl.Log = append(dl.Log, fmt.Sprintf("error starting youtube-dl: %v", err)) dl.Log = append(dl.Log, fmt.Sprintf("error starting youtube-dl: %v", err))
return return
} }
@ -204,13 +209,13 @@ func queue(dl *download) {
}() }()
wg.Wait() wg.Wait()
cmd.Wait()
dl.State = "ended" dl.State = "complete"
dl.Finished = true
dl.ExitCode = cmd.ProcessState.ExitCode() dl.ExitCode = cmd.ProcessState.ExitCode()
fmt.Printf("OBJ %#v\n", dl) fmt.Printf("OBJ %#v\n", dl)
return
} }
func updateDownload(r io.Reader, dl *download) { func updateDownload(r io.Reader, dl *download) {

View File

@ -1,29 +1,41 @@
<html> {{ define "content" }}
<head> <p>
<title>index</title> Drag this bookmarklet: <a href="{{ .BookmarkletURL }}">Gropple</a> to your bookmark bar, and click it
<link rel="stylesheet" href="https://unpkg.com/purecss@2.0.6/build/pure-min.css" integrity="sha384-Uu6IeWbM+gzNVXJcM9XV3SohHtmWE+3VGi496jvgX1jyvDTXfdK+rfZc8C1Aehk5" crossorigin="anonymous"> on any page you want to grab the video from.
</head> </p>
<body>
<p>
Drag this bookmarklet: <a href="{{ .BookmarkletURL }}">Gropple</a> to your bookmark bar, and click it
on any page you want to grab the video from.
</p>
{{ range $k, $v := .Downloads }}
<div>
<h4>{{ $v.Url }}</h4>
<table>
<tr><th>state</th><td>{{ $v.State }}</td></tr>
<tr><th>percent</th><td>{{ $v.Percent }}</td></tr>
<tr><th>files</th><td>{{ range $i, $f := $v.Files }}{{ $f }}<br>{{ end }}</td></tr>
<tr><th>exit code</th><td>{{ $v.ExitCode }}</td></tr>
</table> {{ range $k, $v := .Downloads }}
<pre> <div>
{{ range $i, $l := $v.Log }} <h4>{{ $v.Url }}</h4>
line: {{ $l }} <table>
{{- end -}} <tr>
</pre> <th>state</th>
</div> <td>{{ $v.State }}</td>
{{ end }} </tr>
<tr>
</body> <th>percent</th>
<td>{{ $v.Percent }}</td>
</tr>
<tr>
<th>files</th>
<td>{{ range $i, $f := $v.Files }}{{ $f }} {{ end }}</td>
</tr>
<tr>
<th>exit code</th>
<td>{{ $v.ExitCode }}</td>
</tr>
</table>
<pre>
{{ range $i, $l := $v.Log }}
line: {{ $l }}
{{- end -}}
</pre>
</div>
{{ end }}
{{ end }}
{{ define "js" }}
{{ end }}

16
web/layout.tmpl Normal file
View File

@ -0,0 +1,16 @@
{{ define "layout" }}
<html lang="en">
<head>
<meta charset="utf-8">
<title>gropple</title>
<script src="//unpkg.com/alpinejs" 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">
</head>
<body>
{{ template "content" . }}
</body>
{{ template "js" . }}
</html>
{{ end }}

View File

@ -1,13 +1,4 @@
<html lang="en"> {{ define "content" }}
<head>
<meta charset="utf-8">
<title>fetching {{ .Url }}</title>
<script src="//unpkg.com/alpinejs" 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">
</head>
<body>
<div id="layout" class="pure-g pure-u-1"> <div id="layout" class="pure-g pure-u-1">
<p>Fetching <tt>{{ .Url }}</tt></p> <p>Fetching <tt>{{ .Url }}</tt></p>
<table class="pure-table" x-data="popup()" x-init="fetch_data()"> <table class="pure-table" x-data="popup()" x-init="fetch_data()">
@ -16,13 +7,14 @@
<tr><th>progress</th><td x-text="percent"></td></tr> <tr><th>progress</th><td x-text="percent"></td></tr>
<tr><th>ETA</th><td x-text="eta"></td></tr> <tr><th>ETA</th><td x-text="eta"></td></tr>
</table> </table>
<p><a href="/" target="_grobbler">Status page</a> </p> <p><a href="/" target="_gropple_status">Status page</a> </p>
</div> </div>
</body> {{ end }}
{{ define "js" }}
<script> <script>
function popup() { function popup() {
return { return {
eta: '', percent: 0.0, state: '??', filename: '', eta: '', percent: 0.0, state: '??', filename: '', finished: false,
fetch_data() { fetch_data() {
fetch('/fetch/info/{{ .Id }}') fetch('/fetch/info/{{ .Id }}')
.then(response => response.json()) .then(response => response.json())
@ -30,17 +22,18 @@
this.eta = info.eta; this.eta = info.eta;
this.percent = info.percent + "%"; this.percent = info.percent + "%";
this.state = info.state; this.state = info.state;
this.finished = info.finished;
if (info.files && info.files.length > 0) { if (info.files && info.files.length > 0) {
this.filename = info.files[info.files.length - 1]; this.filename = info.files[info.files.length - 1];
} }
if (this.state != "ended") { console.log('finish?', this.finished);
if (! this.finished) {
setTimeout(() => { this.fetch_data() }, 100); setTimeout(() => { this.fetch_data() }, 100);
} }
}); });
}, },
} }
} }
</script> </script>
</html> {{ end }}