// code related to showing and updating progressbar shown as the image is being made let lastTimeGenerate = 0; //epoch time in second let timeWarning = 160; let maxTimeWarning = 3600; let firstTimeStart = 0; let timeZone = 'Asia/Bangkok'; let lastGenerateTimeStamp = 0; // timestamp let cacheLastGenerateTimeStamp = 0; let cacheLastStringHourMin = null; //string //const options = { timeZone }; const options = { timeZone, hour: '2-digit', minute: '2-digit' }; const formatter = new Intl.DateTimeFormat([], options); function rememberGallerySelection() { } function getGallerySelectedIndex() { } function request(url, data, handler, errorHandler) { var xhr = new XMLHttpRequest(); xhr.open("POST", url, true); xhr.setRequestHeader("Content-Type", "application/json"); xhr.onreadystatechange = function() { if (xhr.readyState === 4) { if (xhr.status === 200) { try { var js = JSON.parse(xhr.responseText); handler(js); } catch (error) { console.error(error); errorHandler(); } } else { errorHandler(); } } }; var js = JSON.stringify(data); xhr.send(js); } function pad2(x) { return x < 10 ? '0' + x : x; } function formatTime(secs) { if (secs > 3600) { return pad2(Math.floor(secs / 60 / 60)) + ":" + pad2(Math.floor(secs / 60) % 60) + ":" + pad2(Math.floor(secs) % 60); } else if (secs > 60) { return pad2(Math.floor(secs / 60)) + ":" + pad2(Math.floor(secs) % 60); } else { return Math.floor(secs) + "s"; } } function setTitle(progress, isGenerating = false) { // var title = 'Unity'; var title = lastTimeGenerate; if (opts.show_progress_in_title && progress) { title = '[' + progress.trim() + '] ' + title; } else if (!isGenerating){ if (lastTimeGenerate > 0){ var curTime = getCurTimeInSeconds(); if (curTime - firstTimeStart > 14400){ title = 'exceed 4 hours '; } else{ var durationSinceLastGenerate = curTime - lastTimeGenerate; if (durationSinceLastGenerate > maxTimeWarning){ // hoangpl no need update ui title = 'exceed > ' + maxTimeWarning + 's'; } else if (durationSinceLastGenerate > timeWarning){ title = 'warning ' + durationSinceLastGenerate + 's'; } else{ //display last time generating if (lastGenerateTimeStamp == cacheLastGenerateTimeStamp && cacheLastStringHourMin != null){ } else{ cacheLastStringHourMin = getFormatDateTime(lastGenerateTimeStamp); cacheLastGenerateTimeStamp = lastGenerateTimeStamp; } title = cacheLastStringHourMin; } } } } if (document.title != title) { document.title = title; } } function getFormatDateTime(timeStamp){ var currentDate = new Date(timeStamp); var hours = currentDate.getHours(); var minutes = currentDate.getMinutes(); var formattedHours = hours.toString().padStart(2, '0'); var formattedMinutes = minutes.toString().padStart(2, '0'); // Format the hours and minutes as a string return `${formattedHours}:${formattedMinutes}`; } function getCurrentDateTimeGMTPlus7() { // Use the global formatter to format the current date and time return formatter.format(new Date()); } function getCurTimeInSeconds(){ return Math.floor(Date.now() / 1000); } function randomId() { return "task(" + Math.random().toString(36).slice(2, 7) + Math.random().toString(36).slice(2, 7) + Math.random().toString(36).slice(2, 7) + ")"; } // starts sending progress requests to "/internal/progress" uri, creating progressbar above progressbarContainer element and // preview inside gallery element. Cleans up all created stuff when the task is over and calls atEnd. // calls onProgress every time there is a progress update function requestProgress(id_task, progressbarContainer, gallery, atEnd, onProgress, inactivityTimeout = 40) { var dateStart = new Date(); var wasEverActive = false; var parentProgressbar = progressbarContainer.parentNode; var divProgress = document.createElement('div'); divProgress.className = 'progressDiv'; divProgress.style.display = opts.show_progressbar ? "block" : "none"; var divInner = document.createElement('div'); divInner.className = 'progress'; divProgress.appendChild(divInner); parentProgressbar.insertBefore(divProgress, progressbarContainer); var livePreview = null; var removeProgressBar = function() { if (!divProgress) { setTitle(""); // hoangpl continue update title return; } setTitle(""); parentProgressbar.removeChild(divProgress); if (gallery && livePreview) gallery.removeChild(livePreview); atEnd(); divProgress = null; }; var funProgress = function(id_task) { request("./internal/progress", {id_task: id_task, live_preview: false}, function(res) { if (res.completed) { removeProgressBar(); return; } let isGenerating = false; let progressText = ""; divInner.style.width = ((res.progress || 0) * 100.0) + '%'; divInner.style.background = res.progress ? "" : "transparent"; if (res.progress > 0) { isGenerating = true; progressText = ((res.progress || 0) * 100.0).toFixed(0) + '%'; } if (res.eta) { isGenerating = true; progressText += " ETA: " + formatTime(res.eta); } if (isGenerating){ lastTimeGenerate = getCurTimeInSeconds(); // hoangpl lastGenerateTimeStamp = Date.now(); if (firstTimeStart <= 0){ firstTimeStart = lastTimeGenerate; } } setTitle(progressText, isGenerating); if (res.textinfo && res.textinfo.indexOf("\n") == -1) { progressText = res.textinfo + " " + progressText; } divInner.textContent = progressText; var elapsedFromStart = (new Date() - dateStart) / 1000; if (res.active) wasEverActive = true; if (!res.active && wasEverActive) { removeProgressBar(); return; } if (elapsedFromStart > inactivityTimeout && !res.queued && !res.active) { removeProgressBar(); return; } if (onProgress) { onProgress(res); } setTimeout(() => { funProgress(id_task, res.id_live_preview); }, opts.live_preview_refresh_period || 500); }, function() { removeProgressBar(); }); }; var funLivePreview = function(id_task, id_live_preview) { request("./internal/progress", {id_task: id_task, id_live_preview: id_live_preview}, function(res) { if (!divProgress) { return; } if (res.live_preview && gallery) { var img = new Image(); img.onload = function() { if (!livePreview) { livePreview = document.createElement('div'); livePreview.className = 'livePreview'; gallery.insertBefore(livePreview, gallery.firstElementChild); } livePreview.appendChild(img); if (livePreview.childElementCount > 2) { livePreview.removeChild(livePreview.firstElementChild); } }; img.src = res.live_preview; } setTimeout(() => { funLivePreview(id_task, res.id_live_preview); }, opts.live_preview_refresh_period || 500); }, function() { removeProgressBar(); }); }; funProgress(id_task, 0); if (gallery) { funLivePreview(id_task, 0); } }