sd-civitai-browser-plus/javascript/civitai-html.js

91 lines
3.1 KiB
JavaScript

"use strict";
function select_model(model_name) {
let model_dropdown = gradioApp().querySelector('#eventtext1 textarea');
if (model_dropdown && model_name) {
let randomNumber = Math.floor(Math.random() * 1000);
let paddedNumber = String(randomNumber).padStart(3, '0');
model_dropdown.value = model_name + "." + paddedNumber;
updateInput(model_dropdown)
}
}
function updateCardSize(width, height) {
var styleSheet = document.styleSheets[0];
var imgKeyframes = `width: ${width}em !important; height: ${height}em !important;`;
var fontSize = (width / 8) * 100;
var textKeyframes = `font-size: ${fontSize}% !important;`;
styleSheet.insertRule(`.civmodelcard img { ${imgKeyframes} }`, styleSheet.cssRules.length);
styleSheet.insertRule(`.civmodelcard figcaption { ${textKeyframes} }`, styleSheet.cssRules.length);
}
function filterByBaseModel(selectedBaseModels) {
if (!selectedBaseModels || selectedBaseModels.length === 0) {
document.querySelectorAll('.civmodelcard').forEach(card => {
card.style.display = 'block';
});
return;
}
if (!Array.isArray(selectedBaseModels)) {
selectedBaseModels = [selectedBaseModels];
}
document.querySelectorAll('.civmodelcard').forEach(card => {
const cardBaseModel = card.getAttribute('base-model');
let shouldDisplay = false;
for (let i = 0; i < selectedBaseModels.length; i++) {
if (cardBaseModel === selectedBaseModels[i]) {
shouldDisplay = true;
break;
}
if (selectedBaseModels[i] === "SD 2.0" && (cardBaseModel === "SD 2.0" || cardBaseModel === "SD 2.0 768")) {
shouldDisplay = true;
break;
}
if (selectedBaseModels[i] === "SD 2.1" && ["SD 2.1", "SD 2.1 768", "SD 2.1 Unclip"].includes(cardBaseModel)) {
shouldDisplay = true;
break;
}
}
card.style.display = shouldDisplay ? 'block' : 'none';
});
}
function installedCard(modelName) {
console.log(`Model ${modelName} has been enabled.`); // Added console log
const parentDiv = document.querySelector('.civmodellist');
if (parentDiv) {
const cards = parentDiv.querySelectorAll('.civmodelcard');
cards.forEach((card) => {
const onclickAttr = card.getAttribute('onclick');
if (onclickAttr && onclickAttr.includes(`select_model('${modelName}')`)) {
card.className = 'civmodelcard civmodelcardinstalled';
}
});
}
}
function removedCard(modelName) {
console.log(`Model ${modelName} has been disabled.`); // Added console log
const parentDiv = document.querySelector('.civmodellist');
if (parentDiv) {
const cards = parentDiv.querySelectorAll('.civmodelcard');
cards.forEach((card) => {
const onclickAttr = card.getAttribute('onclick');
if (onclickAttr && onclickAttr.includes(`select_model('${modelName}')`)) {
card.className = 'civmodelcard ';
}
});
}
}