mirror of
https://github.com/willmiao/ComfyUI-Lora-Manager.git
synced 2026-03-21 21:22:11 -03:00
265 lines
11 KiB
HTML
265 lines
11 KiB
HTML
<!-- Model details Modal -->
|
|
<div id="loraModal" class="modal"></div>
|
|
|
|
<!-- Delete Confirmation Modal -->
|
|
<div id="deleteModal" class="modal delete-modal">
|
|
<div class="modal-content delete-modal-content">
|
|
<h2>Delete Model</h2>
|
|
<p class="delete-message">Are you sure you want to delete this model and all associated files?</p>
|
|
<div class="delete-model-info"></div>
|
|
<div class="modal-actions">
|
|
<button class="cancel-btn" onclick="closeDeleteModal()">Cancel</button>
|
|
<button class="delete-btn" onclick="confirmDelete()">Delete</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Download from URL Modal -->
|
|
<div id="downloadModal" class="modal">
|
|
<div class="modal-content">
|
|
<button class="close" onclick="modalManager.closeModal('downloadModal')">×</button>
|
|
<h2>Download LoRA from URL</h2>
|
|
|
|
<!-- Step 1: URL Input -->
|
|
<div class="download-step" id="urlStep">
|
|
<div class="input-group">
|
|
<label for="loraUrl">Civitai URL:</label>
|
|
<input type="text" id="loraUrl" placeholder="https://civitai.com/models/..." />
|
|
<div class="error-message" id="urlError"></div>
|
|
</div>
|
|
<div class="modal-actions">
|
|
<button class="primary-btn" onclick="downloadManager.validateAndFetchVersions()">Next</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 2: Version Selection -->
|
|
<div class="download-step" id="versionStep" style="display: none;">
|
|
<div class="version-list" id="versionList">
|
|
<!-- Versions will be inserted here dynamically -->
|
|
</div>
|
|
<div class="modal-actions">
|
|
<button class="secondary-btn" onclick="downloadManager.backToUrl()">Back</button>
|
|
<button class="primary-btn" onclick="downloadManager.proceedToLocation()">Next</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 3: Location Selection -->
|
|
<div class="download-step" id="locationStep" style="display: none;">
|
|
<div class="location-selection">
|
|
<!-- Move path preview to top -->
|
|
<div class="path-preview">
|
|
<label>Download Location Preview:</label>
|
|
<div class="path-display" id="targetPathDisplay">
|
|
<span class="path-text">Select a LoRA root directory</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="input-group">
|
|
<label>Select LoRA Root:</label>
|
|
<select id="loraRoot"></select>
|
|
</div>
|
|
<div class="input-group">
|
|
<label>Target Folder:</label>
|
|
<div class="folder-browser" id="folderBrowser">
|
|
{% for folder in folders %}
|
|
{% if folder %}
|
|
<div class="folder-item" data-folder="{{ folder }}">
|
|
{{ folder }}
|
|
</div>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
<div class="input-group">
|
|
<label for="newFolder">New Folder (optional):</label>
|
|
<input type="text" id="newFolder" placeholder="Enter folder name" />
|
|
</div>
|
|
</div>
|
|
<div class="modal-actions">
|
|
<button class="secondary-btn" onclick="downloadManager.backToVersions()">Back</button>
|
|
<button class="primary-btn" onclick="downloadManager.startDownload()">Download</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Move Model Modal -->
|
|
<div id="moveModal" class="modal">
|
|
<div class="modal-content">
|
|
<button class="close" onclick="modalManager.closeModal('moveModal')">×</button>
|
|
<h2>Move Model</h2>
|
|
<div class="location-selection">
|
|
<div class="path-preview">
|
|
<label>Target Location Preview:</label>
|
|
<div class="path-display" id="moveTargetPathDisplay">
|
|
<span class="path-text">Select a LoRA root directory</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="input-group">
|
|
<label>Select LoRA Root:</label>
|
|
<select id="moveLoraRoot"></select>
|
|
</div>
|
|
<div class="input-group">
|
|
<label>Target Folder:</label>
|
|
<div class="folder-browser" id="moveFolderBrowser">
|
|
{% for folder in folders %}
|
|
{% if folder %}
|
|
<div class="folder-item" data-folder="{{ folder }}">
|
|
{{ folder }}
|
|
</div>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
<div class="input-group">
|
|
<label for="moveNewFolder">New Folder (optional):</label>
|
|
<input type="text" id="moveNewFolder" placeholder="Enter folder name" />
|
|
</div>
|
|
</div>
|
|
<div class="modal-actions">
|
|
<button class="cancel-btn" onclick="modalManager.closeModal('moveModal')">Cancel</button>
|
|
<button class="primary-btn" onclick="moveManager.moveModel()">Move</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Settings Modal -->
|
|
<div id="settingsModal" class="modal">
|
|
<div class="modal-content settings-modal">
|
|
<button class="close" onclick="modalManager.closeModal('settingsModal')">×</button>
|
|
<h2>Settings</h2>
|
|
<div class="settings-form">
|
|
<div class="input-group">
|
|
<label for="civitaiApiKey">Civitai API Key:</label>
|
|
<div class="api-key-input">
|
|
<input type="password"
|
|
id="civitaiApiKey"
|
|
placeholder="Enter your Civitai API key"
|
|
value="{{ settings.get('civitai_api_key', '') }}" />
|
|
<button class="toggle-visibility" onclick="toggleApiKeyVisibility(this)">
|
|
<i class="fas fa-eye"></i>
|
|
</button>
|
|
</div>
|
|
<div class="input-help">
|
|
Used for authentication when downloading models from Civitai
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-actions">
|
|
<button class="primary-btn" onclick="settingsManager.saveSettings()">Save</button>
|
|
</div>
|
|
<!-- Add the new links section -->
|
|
<div class="settings-links">
|
|
<a href="https://github.com/willmiao/ComfyUI-Lora-Manager" target="_blank" class="settings-link" title="GitHub Repository">
|
|
<i class="fab fa-github"></i>
|
|
</a>
|
|
<a href="https://github.com/willmiao/ComfyUI-Lora-Manager/issues/new" target="_blank" class="settings-link" title="Report Issue">
|
|
<i class="fas fa-bug"></i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Support Modal -->
|
|
<div id="supportModal" class="modal">
|
|
<div class="modal-content support-modal">
|
|
<button class="close" onclick="modalManager.closeModal('supportModal')">×</button>
|
|
<div class="support-header">
|
|
<i class="fas fa-heart support-icon"></i>
|
|
<h2>Support the Project</h2>
|
|
</div>
|
|
<div class="support-content">
|
|
<p>If you find LoRA Manager useful, I'd really appreciate your support! 🙌</p>
|
|
|
|
<div class="support-section">
|
|
<h3><i class="fas fa-comment"></i> Provide Feedback</h3>
|
|
<p>Your feedback helps shape future updates! Share your thoughts:</p>
|
|
<div class="support-links">
|
|
<a href="https://github.com/willmiao/ComfyUI-Lora-Manager/issues/new" class="social-link" target="_blank">
|
|
<i class="fab fa-github"></i>
|
|
<span>Submit GitHub Issue</span>
|
|
</a>
|
|
<a href="https://discord.gg/KK3dn4Jx" class="social-link" target="_blank">
|
|
<i class="fab fa-discord"></i>
|
|
<span>Join Discord</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="support-section">
|
|
<h3><i class="fas fa-rss"></i> Follow for Updates</h3>
|
|
<div class="support-links">
|
|
<a href="https://www.youtube.com/@pixelpaws-ai" class="social-link" target="_blank">
|
|
<i class="fab fa-youtube"></i>
|
|
<span>YouTube Channel</span>
|
|
</a>
|
|
<a href="https://discord.gg/KK3dn4Jx" class="social-link" target="_blank">
|
|
<i class="fab fa-discord"></i>
|
|
<span>Discord Community</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="support-section">
|
|
<h3><i class="fas fa-coffee"></i> Buy me a coffee</h3>
|
|
<p>If you'd like to support my work directly:</p>
|
|
<a href="https://ko-fi.com/pixelpawsai" class="kofi-button" target="_blank">
|
|
<i class="fas fa-mug-hot"></i>
|
|
<span>Support on Ko-fi</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="support-footer">
|
|
<p>Thank you for using LoRA Manager! ❤️</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Update Modal -->
|
|
<div id="updateModal" class="modal">
|
|
<div class="modal-content update-modal">
|
|
<button class="close" onclick="modalManager.closeModal('updateModal')">×</button>
|
|
<div class="update-header">
|
|
<i class="fas fa-bell update-icon"></i>
|
|
<h2>Check for Updates</h2>
|
|
</div>
|
|
<div class="update-content">
|
|
<div class="update-info">
|
|
<div class="version-info">
|
|
<div class="current-version">
|
|
<span class="label">Current Version:</span>
|
|
<span class="version-number">v0.0.0</span>
|
|
</div>
|
|
<div class="new-version">
|
|
<span class="label">New Version:</span>
|
|
<span class="version-number">v0.0.0</span>
|
|
</div>
|
|
</div>
|
|
<a href="https://github.com/willmiao/ComfyUI-Lora-Manager" target="_blank" class="update-link">
|
|
<i class="fas fa-external-link-alt"></i> View on GitHub
|
|
</a>
|
|
</div>
|
|
|
|
<div class="changelog-section">
|
|
<h3>Changelog</h3>
|
|
<div class="changelog-content">
|
|
<!-- Dynamic changelog content will be inserted here -->
|
|
<div class="changelog-item">
|
|
<h4>Checking for updates...</h4>
|
|
<p>Please wait while we check for the latest version.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="update-preferences">
|
|
<label class="toggle-switch">
|
|
<input type="checkbox" id="updateNotifications" checked>
|
|
<span class="toggle-slider"></span>
|
|
<span class="toggle-label">Show update notifications</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div> |