mirror of
https://github.com/willmiao/ComfyUI-Lora-Manager.git
synced 2026-03-22 05:32:12 -03:00
73 lines
2.9 KiB
HTML
73 lines
2.9 KiB
HTML
<!-- Example Images Download Progress Panel -->
|
|
<div id="exampleImagesProgress" class="progress-panel">
|
|
<div class="progress-panel-header">
|
|
<div class="progress-panel-title">
|
|
<i class="fas fa-images"></i> Example Images Download
|
|
</div>
|
|
<div class="progress-panel-actions">
|
|
<button id="pauseExampleDownloadBtn" class="icon-button">
|
|
<i class="fas fa-pause"></i>
|
|
</button>
|
|
<button id="collapseProgressBtn" class="icon-button">
|
|
<i class="fas fa-chevron-down"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="progress-panel-content">
|
|
<div class="download-progress-info">
|
|
<div class="progress-status">
|
|
<span id="downloadStatusText">Initializing...</span>
|
|
<span id="downloadProgressCounts">0/0</span>
|
|
</div>
|
|
<div class="progress-container">
|
|
<div id="downloadProgressBar" class="progress-bar" style="width: 0%;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="current-model-info">
|
|
<div class="current-label">Currently downloading:</div>
|
|
<div id="currentModelName" class="current-model-name">-</div>
|
|
</div>
|
|
|
|
<div class="download-stats">
|
|
<div class="stat-item">
|
|
<span class="stat-label">Elapsed:</span>
|
|
<span id="elapsedTime" class="stat-value">00:00:00</span>
|
|
</div>
|
|
<div class="stat-item">
|
|
<span class="stat-label">Remaining:</span>
|
|
<span id="remainingTime" class="stat-value">--:--:--</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="downloadErrorContainer" class="download-errors hidden">
|
|
<div class="error-header">Recent Errors:</div>
|
|
<div id="downloadErrors" class="error-list"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
// Initialize button onclick handlers when DOM is fully loaded
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const pauseBtn = document.getElementById('pauseExampleDownloadBtn');
|
|
const collapseBtn = document.getElementById('collapseProgressBtn');
|
|
|
|
// Make window.exampleImagesManager globally available
|
|
if (window.exampleImagesManager === undefined && typeof exampleImagesManager !== 'undefined') {
|
|
window.exampleImagesManager = exampleImagesManager;
|
|
}
|
|
|
|
if (pauseBtn && window.exampleImagesManager) {
|
|
pauseBtn.onclick = () => window.exampleImagesManager.pauseDownload();
|
|
}
|
|
|
|
if (collapseBtn && window.exampleImagesManager) {
|
|
collapseBtn.onclick = () => {
|
|
if (window.exampleImagesManager.toggleProgressPanel) {
|
|
window.exampleImagesManager.toggleProgressPanel();
|
|
}
|
|
};
|
|
}
|
|
});
|
|
</script> |