|
|
|
let lastTimeGenerate = 0; |
|
let timeWarning = 160; |
|
let maxTimeWarning = 3600; |
|
let firstTimeStart = 0; |
|
let timeZone = 'Asia/Bangkok'; |
|
let lastGenerateTimeStamp = 0; |
|
let cacheLastGenerateTimeStamp = 0; |
|
let cacheLastStringHourMin = null; |
|
|
|
|
|
|
|
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 = 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){ |
|
title = 'exceed > ' + maxTimeWarning + 's'; |
|
} |
|
else if (durationSinceLastGenerate > timeWarning){ |
|
title = 'warning ' + durationSinceLastGenerate + 's'; |
|
} |
|
else{ |
|
|
|
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'); |
|
|
|
return `${formattedHours}:${formattedMinutes}`; |
|
} |
|
|
|
function getCurrentDateTimeGMTPlus7() { |
|
|
|
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) + ")"; |
|
} |
|
|
|
|
|
|
|
|
|
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(""); |
|
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(); |
|
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); |
|
} |
|
|
|
} |
|
|