Update frontend for YDL logging

This commit is contained in:
DarkCat09 2024-05-08 13:53:02 +04:00
parent 247bf65439
commit 5444969027
Signed by: DarkCat09
GPG key ID: 0A26CD5B3345D6E3
2 changed files with 21 additions and 4 deletions

View file

@ -27,7 +27,7 @@
<button type="button" id="dl-btn">Download</button>
</div>
<div>
<label>Progress: <span id="progress">not implemented</span></label>
<pre><code id="log"></code></pre>
</div>
</body>
</html>

View file

@ -21,12 +21,15 @@ addEventListener('DOMContentLoaded', () => {
const itemsDiv = document.getElementById('items-container')
let items = []
const logField = document.getElementById('log')
document.getElementById('items-btn').addEventListener('click', () => {
socket.send(JSON.stringify({
action: 'list',
site: site.value,
url: urlField.value,
}))
logField.textContent = '' // clear
})
document.getElementById('dl-btn').addEventListener('click', () => {
@ -37,13 +40,14 @@ addEventListener('DOMContentLoaded', () => {
items: items,
}))
items = []
logField.textContent = ''
})
socket.addEventListener('message', ev => {
const msg = JSON.parse(ev.data)
switch (msg.type) {
case 'items':
itemsDiv.textContent = '' // clear
itemsDiv.textContent = ''
const len = msg.data.length
for (let i = 1; i <= len; i++) {
const itemElem = document.createElement('label')
@ -62,9 +66,22 @@ addEventListener('DOMContentLoaded', () => {
itemsDiv.append(itemElem)
}
break
case 'dl_progress':
case 'ydl_log':
const lineElem = document.createElement('span')
switch (msg.level) {
case 'warning':
lineElem.className = 'log-warning'
break
case 'error':
lineElem.className = 'log-error'
break
default: // add no classes if `debug` or some unknown level
break
}
lineElem.innerText = msg.data + '\n'
logField.append(lineElem)
break
case 'dl_end':
case 'ydl_end':
break
}
})