alphard/ComfyUI-Lora-Manager
1
0
Fork 0
mirror of https://github.com/willmiao/ComfyUI-Lora-Manager.git synced 2026-03-24 14:42:11 -03:00
Code Issues Packages Projects Releases Wiki Activity

refactor: rename 'lora-card' to 'model-card' across styles and scripts for consistency

Browse Source
This commit is contained in:
Will Miao
2025-07-25 23:23:57 +08:00
parent e4ce384023
commit 381bd3938a
21 changed files with 58 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
static/js/components/ContextMenu/CheckpointContextMenu.js
View File

@@ -6,7 +6,7 @@ import { showDeleteModal, showExcludeModal } from '../../utils/modalUtils.js';
export class CheckpointContextMenu extends BaseContextMenu {
constructor() {
super('checkpointContextMenu', '.lora-card');
super('checkpointContextMenu', '.model-card');
this.nsfwSelector = document.getElementById('nsfwLevelSelector');
this.modelType = 'checkpoint';
this.resetAndReload = resetAndReload;

2
static/js/components/ContextMenu/EmbeddingContextMenu.js
View File

@@ -6,7 +6,7 @@ import { showDeleteModal, showExcludeModal } from '../../utils/modalUtils.js';
export class EmbeddingContextMenu extends BaseContextMenu {
constructor() {
super('embeddingContextMenu', '.embedding-card');
super('embeddingContextMenu', '.model-card');
this.nsfwSelector = document.getElementById('nsfwLevelSelector');
this.modelType = 'embedding';
this.resetAndReload = resetAndReload;

2
static/js/components/ContextMenu/LoraContextMenu.js
View File

@@ -6,7 +6,7 @@ import { showExcludeModal, showDeleteModal } from '../../utils/modalUtils.js';
export class LoraContextMenu extends BaseContextMenu {
constructor() {
super('loraContextMenu', '.lora-card');
super('loraContextMenu', '.model-card');
this.nsfwSelector = document.getElementById('nsfwLevelSelector');
this.modelType = 'lora';
this.resetAndReload = resetAndReload;

2
static/js/components/ContextMenu/RecipeContextMenu.js
View File

@@ -7,7 +7,7 @@ import { state } from '../../state/index.js';
export class RecipeContextMenu extends BaseContextMenu {
constructor() {
super('recipeContextMenu', '.lora-card');
super('recipeContextMenu', '.model-card');
this.nsfwSelector = document.getElementById('nsfwLevelSelector');
this.modelType = 'recipe';

8
static/js/components/DuplicatesManager.js
View File

@@ -243,7 +243,7 @@ export class DuplicatesManager {
checkboxes.forEach(checkbox => {
checkbox.checked = !allSelected;
const recipeId = checkbox.dataset.recipeId;
const card = checkbox.closest('.lora-card');
const card = checkbox.closest('.model-card');
if (!allSelected) {
this.selectedForDeletion.add(recipeId);
@@ -268,7 +268,7 @@ export class DuplicatesManager {
checkboxes.forEach(checkbox => {
checkbox.checked = true;
this.selectedForDeletion.add(checkbox.dataset.recipeId);
checkbox.closest('.lora-card').classList.add('duplicate-selected');
checkbox.closest('.model-card').classList.add('duplicate-selected');
});
// Update the button text
@@ -299,7 +299,7 @@ export class DuplicatesManager {
if (checkbox) {
checkbox.checked = true;
this.selectedForDeletion.add(recipeId);
checkbox.closest('.lora-card').classList.add('duplicate-selected');
checkbox.closest('.model-card').classList.add('duplicate-selected');
}
}
@@ -310,7 +310,7 @@ export class DuplicatesManager {
if (latestCheckbox) {
latestCheckbox.checked = false;
this.selectedForDeletion.delete(latestId);
latestCheckbox.closest('.lora-card').classList.remove('duplicate-selected');
latestCheckbox.closest('.model-card').classList.remove('duplicate-selected');
}
this.updateSelectedCount();

4
static/js/components/ModelDuplicatesManager.js
View File

@@ -330,7 +330,7 @@ export class ModelDuplicatesManager {
renderModelCard(model, groupHash) {
// Create basic card structure
const card = document.createElement('div');
card.className = 'lora-card duplicate';
card.className = 'model-card duplicate';
card.dataset.hash = model.sha256;
card.dataset.filePath = model.file_path;
@@ -549,7 +549,7 @@ export class ModelDuplicatesManager {
checkboxes.forEach(checkbox => {
checkbox.checked = !allSelected;
const filePath = checkbox.dataset.filePath;
const card = checkbox.closest('.lora-card');
const card = checkbox.closest('.model-card');
if (!allSelected) {
this.selectedForDeletion.add(filePath);

2
static/js/components/RecipeCard.js
View File

@@ -17,7 +17,7 @@ class RecipeCard {
createCardElement() {
const card = document.createElement('div');
card.className = 'lora-card';
card.className = 'model-card';
card.dataset.filepath = this.recipe.file_path;
card.dataset.title = this.recipe.title;
card.dataset.nsfwLevel = this.recipe.preview_nsfw_level || 0;

4
static/js/components/controls/PageControls.js
View File

@@ -242,7 +242,7 @@ export class PageControls {
* @param {string} folderPath - Folder path to filter by
*/
filterByFolder(folderPath) {
const cardSelector = this.pageType === 'loras' ? '.lora-card' : '.checkpoint-card';
const cardSelector = this.pageType === 'loras' ? '.model-card' : '.checkpoint-card';
document.querySelectorAll(cardSelector).forEach(card => {
card.style.display = card.dataset.folder === folderPath ? '' : 'none';
});
@@ -374,7 +374,7 @@ export class PageControls {
openCivitai(modelName) {
// Get card selector based on page type
const cardSelector = this.pageType === 'loras'
? `.lora-card[data-name="${modelName}"]`
? `.model-card[data-name="${modelName}"]`
: `.checkpoint-card[data-name="${modelName}"]`;
const card = document.querySelector(cardSelector);

12
static/js/components/shared/ModelCard.js
View File

@@ -28,10 +28,8 @@ export function setupModelCardEventDelegation(modelType) {
// Event delegation handler for all model card events
function handleModelCardEvent_internal(event, modelType) {
// Find the closest card element
const card = event.target.closest('.lora-card');
const card = event.target.closest('.model-card');
if (!card) return;
const apiClient = getModelApiClient();
// Handle specific elements within the card
if (event.target.closest('.toggle-blur-btn')) {
@@ -80,7 +78,7 @@ function handleModelCardEvent_internal(event, modelType) {
if (event.target.closest('.fa-image')) {
event.stopPropagation();
apiClient.replaceModelPreview(card.dataset.filepath);
getModelApiClient().replaceModelPreview(card.dataset.filepath);
return;
}
@@ -137,7 +135,7 @@ async function toggleFavorite(card) {
const newFavoriteState = !isFavorite;
try {
await apiClient.saveModelMetadata(card.dataset.filepath, {
await getModelApiClient().saveModelMetadata(card.dataset.filepath, {
favorite: newFavoriteState
});
@@ -364,7 +362,7 @@ function showExampleAccessModal(card, modelType) {
export function createModelCard(model, modelType) {
const card = document.createElement('div');
card.className = 'lora-card'; // Reuse the same class for styling
card.className = 'model-card'; // Reuse the same class for styling
card.dataset.sha256 = model.sha256;
card.dataset.filepath = model.file_path;
card.dataset.name = model.model_name;
@@ -518,7 +516,7 @@ export function updateCardsForBulkMode(isBulkMode) {
document.body.classList.toggle('bulk-mode', isBulkMode);
// Get all lora cards - this can now be from the DOM or through the virtual scroller
const loraCards = document.querySelectorAll('.lora-card');
const loraCards = document.querySelectorAll('.model-card');
loraCards.forEach(card => {
// Get all action containers for this card

2
static/js/components/shared/ModelModal.js
View File

@@ -380,7 +380,7 @@ function setupLoraSpecificFields(filePath) {
if (!key || !value) return;
const loraCard = document.querySelector(`.lora-card[data-filepath="${filePath}"]`);
const loraCard = document.querySelector(`.model-card[data-filepath="${filePath}"]`);
const currentPresets = parsePresets(loraCard?.dataset.usage_tips);
currentPresets[key] = parseFloat(value);

2
static/js/components/shared/PresetTags.js
View File

@@ -52,7 +52,7 @@ window.removePreset = async function(key) {
.querySelector('.file-path').textContent +
document.querySelector('#modelModal .modal-content')
.querySelector('#file-name').textContent + '.safetensors';
const loraCard = document.querySelector(`.lora-card[data-filepath="${filePath}"]`);
const loraCard = document.querySelector(`.model-card[data-filepath="${filePath}"]`);
const currentPresets = parsePresets(loraCard.dataset.usage_tips);
delete currentPresets[key];

2
static/js/components/shared/RecipeTab.js
View File

@@ -96,7 +96,7 @@ function renderRecipes(tabElement, recipes, loraName, loraHash) {
// Create card element matching the structure in recipes.html
const card = document.createElement('div');
card.className = 'lora-card';
card.className = 'model-card';
card.dataset.filePath = recipe.file_path || '';
card.dataset.title = recipe.title || '';
card.dataset.created = recipe.created_date || '';

8
static/js/managers/BulkManager.js
View File

@@ -105,7 +105,7 @@ export class BulkManager {
// TODO: fix this, no DOM manipulation should be done here
// Force a lightweight refresh of the cards to ensure proper display
// This is less disruptive than a full resetAndReload()
document.querySelectorAll('.lora-card').forEach(card => {
document.querySelectorAll('.model-card').forEach(card => {
// Re-apply normal display mode to all card actions
const actions = card.querySelectorAll('.card-actions, .card-button');
actions.forEach(action => action.style.display = 'flex');
@@ -114,7 +114,7 @@ export class BulkManager {
}
clearSelection() {
document.querySelectorAll('.lora-card.selected').forEach(card => {
document.querySelectorAll('.model-card.selected').forEach(card => {
card.classList.remove('selected');
});
state.selectedLoras.clear();
@@ -190,7 +190,7 @@ export class BulkManager {
applySelectionState() {
if (!state.bulkMode) return;
document.querySelectorAll('.lora-card').forEach(card => {
document.querySelectorAll('.model-card').forEach(card => {
const filepath = card.dataset.filepath;
if (state.selectedLoras.has(filepath)) {
card.classList.add('selected');
@@ -502,7 +502,7 @@ export class BulkManager {
deselectItem(filepath) {
// Find and deselect the corresponding card if it's in the DOM
const card = document.querySelector(`.lora-card[data-filepath="${filepath}"]`);
const card = document.querySelector(`.model-card[data-filepath="${filepath}"]`);
if (card) {
card.classList.remove('selected');
}

2
static/js/managers/SettingsManager.js
View File

@@ -734,7 +734,7 @@ export class SettingsManager {
applyFrontendSettings() {
// Apply blur setting to existing content
const blurSetting = state.global.settings.blurMatureContent;
document.querySelectorAll('.lora-card[data-nsfw="true"] .card-image').forEach(img => {
document.querySelectorAll('.model-card[data-nsfw="true"] .card-image').forEach(img => {
if (blurSetting) {
img.classList.add('nsfw-blur');
} else {

2
static/js/utils/cardUpdater.js
View File

@@ -9,7 +9,7 @@
*/
export function updateRecipeCard(recipeId, updates) {
// Find the card with matching recipe ID
const recipeCard = document.querySelector(`.lora-card[data-id="${recipeId}"]`);
const recipeCard = document.querySelector(`.model-card[data-id="${recipeId}"]`);
if (!recipeCard) return;
// Get the recipe card component instance

4
static/js/utils/modalUtils.js
View File

@@ -9,7 +9,7 @@ let pendingExcludePath = null;
export function showDeleteModal(filePath) {
pendingDeletePath = filePath;
const card = document.querySelector(`.lora-card[data-filepath="${filePath}"]`);
const card = document.querySelector(`.model-card[data-filepath="${filePath}"]`);
const modelName = card ? card.dataset.name : filePath.split('/').pop();
const modal = modalManager.getModal('deleteModal').element;
const modelInfo = modal.querySelector('.delete-model-info');
@@ -49,7 +49,7 @@ export function closeDeleteModal() {
export function showExcludeModal(filePath) {
pendingExcludePath = filePath;
const card = document.querySelector(`.lora-card[data-filepath="${filePath}"]`);
const card = document.querySelector(`.model-card[data-filepath="${filePath}"]`);
const modelName = card ? card.dataset.name : filePath.split('/').pop();
const modal = modalManager.getModal('excludeModal').element;
const modelInfo = modal.querySelector('.exclude-model-info');

4
static/js/utils/uiHelpers.js
View File

@@ -168,13 +168,13 @@ function updateThemeToggleIcons(theme) {
}
function filterByFolder(folderPath) {
document.querySelectorAll('.lora-card').forEach(card => {
document.querySelectorAll('.model-card').forEach(card => {
card.style.display = card.dataset.folder === folderPath ? '' : 'none';
});
}
export function openCivitai(filePath) {
const loraCard = document.querySelector(`.lora-card[data-filepath="${filePath}"]`);
const loraCard = document.querySelector(`.model-card[data-filepath="${filePath}"]`);
if (!loraCard) return;
const metaData = JSON.parse(loraCard.dataset.meta);