v1.4.0 socketio 적용

This commit is contained in:
joyfuI
2020-03-19 00:32:24 +09:00
parent 181b51fa1c
commit cce361fe79
6 changed files with 61 additions and 40 deletions

View File

@@ -40,7 +40,15 @@
var package_name = '{{ arg["package_name"] }}';
$(function () {
// var socket = io.connect(location.origin + "/" + package_name);
var socket = io.connect(location.origin + "/" + package_name);
socket.on('add', function (data) {
$('#list').append(make_item(data));
});
socket.on('status', function (data) {
status_html(data);
});
$.ajax({
url: '/' + package_name + '/ajax/list',
@@ -76,24 +84,8 @@
});
function make_item(data) {
var str = '<tr style="cursor: pointer;" data-toggle="collapse" data-target="#collapse_' + data.index + '" aria-expanded="true">';
str += '<td scope="col">' + (data.index + 1) + '</td>';
str += '<td scope="col">' + data.plugin + '</td>';
str += '<td scope="col">' + data.start_time + '</td>';
str += '<td scope="col">' + data.extractor + '</td>';
str += '<td scope="col">' + data.title + '</td>';
str += '<td id="status_' + data.index + '" scope="col">' + data.status_ko + '</td>';
var visi = 'hidden';
if (parseInt(data.percent) > 0 && data.status_str !== 'STOP') {
visi = 'visible';
}
str += '<td scope="col"><div class="progress"><div id="progress_' + data.index + '" class="progress-bar" style="visibility: ' + visi + '; width:' + data.percent + '%">' + data.percent + '%</div></div></td>';
str += '<td id="download_time_' + data.index + '" scope="col">' + data.download_time + '</td>';
str += '<td id="button_' + data.index + '" scope="col" class="tableRowHoverOff">';
if (data.status_str === 'START' || data.status_str === 'DOWNLOADING' || data.status_str === 'FINISHED') {
str += '<button class="align-middle btn btn-outline-danger btn-sm youtube-dl_stop" data-index="' + data.index + '">중지</button>';
}
str += '</td>';
var str = '<tr id="item_' + data.index + '" style="cursor: pointer;" data-toggle="collapse" data-target="#collapse_' + data.index + '" aria-expanded="true">';
str += get_item(data);
str += '</tr>';
str += '<tr class="collapse tableRowHoverOff" style="cursor: pointer;" id="collapse_' + data.index + '">';
str += '<td colspan="9">';
@@ -105,6 +97,27 @@
return str;
}
function get_item(data) {
var str = '<td scope="col">' + (data.index + 1) + '</td>';
str += '<td scope="col">' + data.plugin + '</td>';
str += '<td scope="col">' + data.start_time + '</td>';
str += '<td scope="col">' + data.extractor + '</td>';
str += '<td scope="col">' + data.title + '</td>';
str += '<td scope="col">' + data.status_ko + '</td>';
var visi = 'hidden';
if (parseInt(data.percent) > 0 && data.status_str !== 'STOP') {
visi = 'visible';
}
str += '<td scope="col"><div class="progress"><div class="progress-bar" style="visibility: ' + visi + '; width:' + data.percent + '%">' + data.percent + '%</div></div></td>';
str += '<td scope="col">' + data.download_time + '</td>';
str += '<td scope="col" class="tableRowHoverOff">';
if (data.status_str === 'START' || data.status_str === 'DOWNLOADING' || data.status_str === 'FINISHED') {
str += '<button class="align-middle btn btn-outline-danger btn-sm youtube-dl_stop" data-index="' + data.index + '">중지</button>';
}
str += '</td>';
return str;
}
function get_detail(data) {
var str = info_html('URL', data.url, data.url);
str += info_html('업로더', data.uploader, data.uploader_url);
@@ -140,6 +153,11 @@
str += '</span></div></div></div>';
return str;
}
function status_html(data) {
$('#item_' + data.index).html(get_item(data));
$('#detail_' + data.index).html(get_detail(data));
}
</script>
{% endblock %}