mirror of
https://github.com/willmiao/ComfyUI-Lora-Manager.git
synced 2026-03-26 07:35:44 -03:00
Implement share functionality in RecipeCard component to enable image downloads. Adjust recipe indicator position in CSS for improved layout.
This commit is contained in:
@@ -44,7 +44,7 @@
|
|||||||
|
|
||||||
.recipe-indicator {
|
.recipe-indicator {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 8px;
|
top: 6px;
|
||||||
left: 8px;
|
left: 8px;
|
||||||
width: 24px;
|
width: 24px;
|
||||||
height: 24px;
|
height: 24px;
|
||||||
|
|||||||
@@ -78,8 +78,7 @@ class RecipeCard {
|
|||||||
// Share button click event - prevent propagation to card
|
// Share button click event - prevent propagation to card
|
||||||
card.querySelector('.fa-share-alt')?.addEventListener('click', (e) => {
|
card.querySelector('.fa-share-alt')?.addEventListener('click', (e) => {
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
// TODO: Implement share functionality
|
this.shareRecipe();
|
||||||
showToast('Share functionality will be implemented later', 'info');
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// Copy button click event - prevent propagation to card
|
// Copy button click event - prevent propagation to card
|
||||||
@@ -232,6 +231,34 @@ class RecipeCard {
|
|||||||
deleteBtn.disabled = false;
|
deleteBtn.disabled = false;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
shareRecipe() {
|
||||||
|
try {
|
||||||
|
// Get the image URL
|
||||||
|
const imageUrl = this.recipe.file_url ||
|
||||||
|
(this.recipe.file_path ? `/loras_static/root1/preview/${this.recipe.file_path.split('/').pop()}` :
|
||||||
|
'/loras_static/images/no-preview.png');
|
||||||
|
|
||||||
|
// Create a temporary anchor element
|
||||||
|
const downloadLink = document.createElement('a');
|
||||||
|
downloadLink.href = imageUrl;
|
||||||
|
|
||||||
|
// Set the download attribute with the recipe title as filename
|
||||||
|
const fileExtension = imageUrl.split('.').pop();
|
||||||
|
const safeFileName = this.recipe.title.replace(/[^a-z0-9]/gi, '_').toLowerCase();
|
||||||
|
downloadLink.download = `recipe_${safeFileName}.${fileExtension}`;
|
||||||
|
|
||||||
|
// Append to body, click and remove
|
||||||
|
document.body.appendChild(downloadLink);
|
||||||
|
downloadLink.click();
|
||||||
|
document.body.removeChild(downloadLink);
|
||||||
|
|
||||||
|
showToast('Recipe image download started', 'success');
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Error sharing recipe:', error);
|
||||||
|
showToast('Error downloading recipe image', 'error');
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export { RecipeCard };
|
export { RecipeCard };
|
||||||
Reference in New Issue
Block a user