justin/gropple
1
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases 24 Wiki Activity

Add finished flag to response and clean up html templates

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

68
web/index.html
View File

@@ -1,29 +1,41 @@
<html>
<head>
<title>index</title>
<link rel="stylesheet" href="https://unpkg.com/purecss@2.0.6/build/pure-min.css" integrity="sha384-Uu6IeWbM+gzNVXJcM9XV3SohHtmWE+3VGi496jvgX1jyvDTXfdK+rfZc8C1Aehk5" crossorigin="anonymous">
</head>
<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>
{{ define "content" }}
<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>
</table>
<pre>
{{ range $i, $l := $v.Log }}
line: {{ $l }}
{{- end -}}
</pre>
</div>
{{ end }}
</body>
{{ 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 }} {{ 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 }}

25
web/popup.html
View File

@@ -1,13 +1,4 @@
<html lang="en">
<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>
{{ define "content" }}
<div id="layout" class="pure-g pure-u-1">
<p>Fetching <tt>{{ .Url }}</tt></p>
<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>ETA</th><td x-text="eta"></td></tr>
</table>
<p><a href="/" target="_grobbler">Status page</a> </p>
<p><a href="/" target="_gropple_status">Status page</a> </p>
</div>
</body>
{{ end }}
{{ define "js" }}
<script>
function popup() {
return {
eta: '', percent: 0.0, state: '??', filename: '',
eta: '', percent: 0.0, state: '??', filename: '', finished: false,
fetch_data() {
fetch('/fetch/info/{{ .Id }}')
.then(response => response.json())
@@ -30,17 +22,18 @@
this.eta = info.eta;
this.percent = info.percent + "%";
this.state = info.state;
this.finished = info.finished;
if (info.files && info.files.length > 0) {
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);
}
});
},
}
}
</script>
</html>
{{ end }}