add stop queue button to frontend

This commit is contained in:
simon 2021-09-24 18:03:22 +07:00
parent 91a57cc780
commit d0b54f8a88
6 changed files with 115 additions and 1 deletions

View File

@ -5,6 +5,7 @@
<h1>Downloads</h1> <h1>Downloads</h1>
</div> </div>
<div id="downloadMessage"></div> <div id="downloadMessage"></div>
<div id="downloadControl"></div>
<div class="info-box info-box-3 padding-box"> <div class="info-box info-box-3 padding-box">
<div class="icon-text"> <div class="icon-text">
<img id="rescan-icon" onclick="rescanPending()" src="{% static 'img/icon-rescan.svg' %}" alt="rescan-icon"> <img id="rescan-icon" onclick="rescanPending()" src="{% static 'img/icon-rescan.svg' %}" alt="rescan-icon">

View File

@ -480,6 +480,7 @@ class PostData:
"rescan_pending": self.rescan_pending, "rescan_pending": self.rescan_pending,
"ignore": self.ignore, "ignore": self.ignore,
"dl_pending": self.dl_pending, "dl_pending": self.dl_pending,
"queue": self.queue_handler,
"unsubscribe": self.unsubscribe, "unsubscribe": self.unsubscribe,
"sort_order": self.sort_order, "sort_order": self.sort_order,
"hide_watched": self.hide_watched, "hide_watched": self.hide_watched,
@ -522,6 +523,15 @@ class PostData:
download_pending.delay() download_pending.delay()
return {"success": True} return {"success": True}
def queue_handler(self):
"""queue controls from frontend"""
to_execute = self.exec_val
if to_execute == "stop":
print("stopping download queue")
RedisQueue("dl_queue").clear()
return {"success": True}
def unsubscribe(self): def unsubscribe(self):
"""unsubscribe from channel""" """unsubscribe from channel"""
channel_id_unsub = self.exec_val channel_id_unsub = self.exec_val

View File

@ -458,10 +458,21 @@ button:hover {
} }
.dl-desc { .dl-desc {
padding-left: 15px; padding: 0 15px;
width: 75%; width: 75%;
} }
.dl-control-icons {
display: flex;
justify-content: center;
padding: 10px 0;
}
.dl-control-icons img {
width: 30px;
filter: var(--img-filter);
cursor: pointer;
}
/* status message */ /* status message */
.download-progress { .download-progress {

View File

@ -0,0 +1,67 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="500"
height="500"
viewBox="0 0 132.29197 132.29167"
version="1.1"
id="svg1303"
inkscape:version="0.92.4 (5da689c313, 2019-01-14)"
sodipodi:docname="Icons_stop.svg">
<defs
id="defs1297" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="1.0105705"
inkscape:cx="43.182711"
inkscape:cy="168.09972"
inkscape:document-units="mm"
inkscape:current-layer="layer1"
showgrid="false"
units="px"
inkscape:window-width="1920"
inkscape:window-height="1017"
inkscape:window-x="-8"
inkscape:window-y="-8"
inkscape:window-maximized="1" />
<metadata
id="metadata1300">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Ebene 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-164.70764)">
<rect
style="opacity:1;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:markers fill stroke"
id="rect836"
width="118.86465"
height="118.86465"
x="6.7136617"
y="171.42116"
rx="10.00003"
ry="10.00003" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.0 KiB

View File

@ -18,6 +18,7 @@ function checkMessage() {
if (dlProgress['status']) { if (dlProgress['status']) {
buildDownloadMessage(dlProgress); buildDownloadMessage(dlProgress);
handleInterval(); handleInterval();
buildDownloadIcons();
}; };
}; };
req.send(); req.send();
@ -71,3 +72,20 @@ function buildDownloadMessage(dlProgress) {
message.appendChild(messageText); message.appendChild(messageText);
box.appendChild(message); box.appendChild(message);
}; };
// add dl control icons
function buildDownloadIcons() {
var box = document.getElementById('downloadControl');
var iconBox = document.createElement('div');
iconBox.classList = 'dl-control-icons';
var stopIcon = document.createElement('img');
stopIcon.setAttribute('id', "stop-icon");
stopIcon.setAttribute('title', "Stop Download Queue");
stopIcon.setAttribute('src', "/static/img/icon-stop.svg");
stopIcon.setAttribute('alt', "stop icon");
stopIcon.setAttribute('onclick', 'stopQueue()');
// stich together
iconBox.appendChild(stopIcon);
box.appendChild(iconBox);
}

View File

@ -79,6 +79,13 @@ function downloadNow(button) {
}, 500); }, 500);
} }
function stopQueue() {
var payload = JSON.stringify({'queue': 'stop'});
sendPost(payload);
document.getElementById('stop-icon').remove();
}
// settings page buttons // settings page buttons
function manualImport() { function manualImport() {
var payload = JSON.stringify({'manual-import': true}); var payload = JSON.stringify({'manual-import': true});