KumiSystems/pix360core
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Refactor UI updates and AJAX logic

Browse source 
Flattened AJAX success handling and pruned conditional branches for clarity, enhancing code readability and maintainability. Optimized UI card element creation for handling image and video content, reducing DOM manipulation frequency for improved performance. Eliminated inefficient video thumbnail refresh intervals, switching to static resource loading to alleviate server load.
This commit is contained in:
Kumi 2023-12-12 14:17:13 +01:00
parent 32562849c3
commit addd45b356
Signed by: kumi
GPG key ID: ECBCC9082395383F
2 changed files with 50 additions and 58 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
src/pix360core/static/js/worker.js
View file

@ -52,11 +52,7 @@ function checkServerForFile(jobid, title, interval) {
200: function (data, tstatus, xhr) {
if (data.status == "completed") {
clearInterval(intervals[jobid]);
finishcard(
jobid,
title,
data.content_type == "video/mp4"
);
finishcard(jobid, title, data.content_type == "video/mp4");
return;
} else if (data.status == "failed") {
clearInterval(intervals[jobid]);
@ -108,7 +104,9 @@ function failcard(jobid, title) {
'<div class="card"> <div style="text-align: center; color: red; font-weight: bold;" class="card-block">' +
title +
': Export failed.</div><div style="text-align: center;" class="card-block"><a style="color: white;" onclick="restartconversion (\'' +
jobid + '\', \'' + title +
jobid +
"', '" +
title +
'\');" class="btn btn-info">Retry</a> <a style="color: white;" onclick="deletecard(\'' +
jobid +
'\');" class="btn btn-danger">Hide</a></div> </div>';
@ -124,33 +122,27 @@ function finishcard(jobid, title, video) {
}
});
var text =
'<div class="card"> <img ' +
(video ? 'id="' + jobid + '-thumb"' : "") +
'<div class="card"> <' +
(video ? "video" : "img") +
' class="card-img-top img-fluid" download src="/download/' +
jobid +
(video ? "-thumb" : "") +
'" alt="Final ' +
(video ? "Video" : "Image") +
'"><div style="text-align: center; font-weight: bold;" class="card-block">' +
'">' +
(video ? "</video>" : "") +
'<div style="text-align: center; font-weight: bold;" class="card-block">' +
title +
'</div> <div style="text-align: center; color: white;" class="card-block"><a style="color: white;" onclick="restartconversion (\'' +
jobid + '\', \'' + title +
'\');" class="btn btn-info">Retry</a><a href="/download/' +
'</div> <div style="text-align: center; color: white;" class="card-block"><a style="color: white;" onclick="restartconversion(\'' +
jobid +
"', '" +
title +
'\');" class="btn btn-info">Retry</a> <a href="/download/' +
jobid +
'" class="btn btn-primary">Download</a> <a onclick="deletecard(\'' +
jobid +
'\');" class="btn btn-danger">Hide</a> </div> </div>';
$("#" + jobid).html(text);
var counter = 0;
var interval = setInterval(function () {
var image = document.getElementById(jobid + "-thumb");
image.src = "/download/" + jobid + "-thumb?rand=" + Math.random();
if (++counter === 10) {
window.clearInterval(interval);
}
}, 2000);
$("#" + jobid + " img").on("click", function () {
imgurl = $(this).attr("src");
pannellum.viewer("panorama", {
@ -193,13 +185,13 @@ function initialize() {
intervals[job.id] = interval;
}
}
}
},
});
}
$(document).ready(function () {
if (Notification.permission !== "granted") {
Notification.requestPermission();
};
}
initialize();
});