front end done

This commit is contained in:
Balakrishnan Balasubramanian 2022-06-29 10:35:43 -04:00
parent c69654f38f
commit 784b82313c
2 changed files with 36 additions and 13 deletions

19
main.go
View File

@ -106,14 +106,15 @@ func main() {
return
}
fmt.Println("path is", p, "id is", id)
var wh websocket.Handler = func(c *websocket.Conn) {
defer c.Close()
log.Println("Are you here?")
var sc <-chan string
d.Run(func(d *db.Jdb) {
pt := d.Items[id].Pt
if pt != nil {
sc = pt.Subscribe()
}
})
var wh websocket.Handler = func(c *websocket.Conn) {
defer c.Close()
if sc != nil {
for update := range sc {
_, err := c.Write([]byte(update))
@ -137,7 +138,8 @@ func main() {
}
return
}
c.Write([]byte(fname))
alink := fmt.Sprintf(`<a target="_blank" href="%s/%s">Watch</a>`, videosUrl, fname)
c.Write([]byte(alink))
}
wh.ServeHTTP(w, r)
})
@ -171,19 +173,20 @@ func download(id int, yturl string) {
log.Panic(err)
}
//Log progress
go func() {
var sc <-chan string
d.Run(func(d *db.Jdb) {
pt := d.Items[id].Pt
sc = pt.Subscribe()
})
log.Println("before watching")
log.Println("Watching download progress for id: ", id)
if sc != nil {
for update := range sc {
log.Println(update)
}
}
log.Println("after watching")
log.Println("Done watching download progress for id: ", id)
}()
var status db.DownloadStatus
@ -201,8 +204,8 @@ func download(id int, yturl string) {
}
func downloadYt(id int, yturl string, pc chan<- string) (string, error) {
// pathTmpl := fmt.Sprintf("%s/video_%d.%%(ext)s", cachePath, id)
pathTmpl := fmt.Sprintf("%s/video_%d.mp4", cachePath, id)
pathTmpl := fmt.Sprintf("%s/video_%d.%%(ext)s", cachePath, id)
// pathTmpl := fmt.Sprintf("%s/video_%d.mp4", cachePath, id)
args := append(ytdlCmd, "--newline", "--output", pathTmpl, yturl)
cmd := exec.Command(args[0], args[1:]...)
rc, err := cmd.StdoutPipe()

View File

@ -1,9 +1,29 @@
<!DOCTYPE html>
<html>
<head>
<title>Srinidhi Youtube videos</title>
<title>Youtube Downloader UI</title>
<!-- Diable favicon requests: https://stackoverflow.com/a/13416784 -->
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
<script>
// https://developer.mozilla.org/en-US/docs/Web/API/Window/DOMContentLoaded_event
window.addEventListener('DOMContentLoaded', () => {
progressElems = document.querySelectorAll(".ytprogress")
progressElems.forEach(function(item) {
// https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes
item.innerText = item.dataset.ytid
ytid = item.dataset.ytid
// https://stackoverflow.com/a/47472874
var url = new URL("/ws/" + ytid, window.location.href);
url.protocol = url.protocol.replace('http', 'ws');
let socket = new WebSocket(url.href)
socket.onmessage = function(event) {
item.innerHTML = event.data
}
})
});
</script>
</head>
<body>
<form method="POST" action="/">
@ -30,7 +50,7 @@
{{ if eq .Status "Done" }}
<a target="_blank" href="{{ vids_prefix }}/{{ .FileName }}">Watch</a>
{{ else if eq .Status "InProgress" }}
<span class="progress" data="{{.Id}}">In Progress</span>
<span class="ytprogress" data-ytid="{{.Id}}">In Progress</span>
{{ else }}
{{ .Status }}
{{ end }}