@@ -1193,6 +1292,7 @@ No sentences, no commentary, no captions. Only tags. Keep length short but descr
document.getElementById("restoreBtn").addEventListener("click", () => this.showRestoreModal());
document.getElementById("scanBtn").addEventListener("click", () => this.showScanModal());
document.getElementById("autoTagBtn").addEventListener("click", () => this.showAutoTagModal());
+ document.getElementById("addPromptBtn").addEventListener("click", () => this.showAddPromptModal());
document.getElementById("logsBtn").addEventListener("click", () => this.showLogsModal());
document.getElementById("metadataBtn").addEventListener("click", () => this.openMetadataViewer());
document.getElementById("galleryBtn").addEventListener("click", () => this.openGallery());
@@ -1273,6 +1373,10 @@ No sentences, no commentary, no captions. Only tags. Keep length short but descr
// Tags accordion toggle
document.getElementById("reviewTagsToggle").addEventListener("click", () => this.toggleReviewTags());
+ // Add Prompt modal
+ document.getElementById("saveNewPromptBtn").addEventListener("click", () => this.saveNewPrompt());
+ this.setupAddPromptModal();
+
// Close modals on backdrop click
document.querySelectorAll("[id$='Modal']").forEach((modal) => {
modal.addEventListener("click", (e) => {
@@ -4277,6 +4381,194 @@ Seed: ${this.currentMetadata.seed || 'Unknown'}`;
tagsExpanded: false // Track accordion state
};
+ // ==================== Add Prompt Modal ====================
+
+ showAddPromptModal() {
+ // Clear form
+ document.getElementById('addPromptText').value = '';
+ document.getElementById('addPromptCategory').value = '';
+ document.getElementById('addPromptRatingValue').value = '';
+ document.getElementById('addPromptNotes').value = '';
+ document.getElementById('addPromptProtected').checked = true;
+
+ // Clear tags
+ this.addPromptTags = [];
+ this.renderAddPromptTags();
+
+ // Reset rating stars
+ this.updateAddPromptRatingStars(0);
+
+ // Populate categories datalist
+ this.populateAddPromptCategories();
+
+ this.showModal('addPromptModal');
+ }
+
+ setupAddPromptModal() {
+ this.addPromptTags = [];
+
+ // Rating stars
+ const ratingContainer = document.getElementById('addPromptRating');
+ const ratingStars = ratingContainer.querySelectorAll('.rating-star');
+ ratingStars.forEach(star => {
+ star.addEventListener('click', () => {
+ const rating = parseInt(star.dataset.rating);
+ document.getElementById('addPromptRatingValue').value = rating;
+ this.updateAddPromptRatingStars(rating);
+ });
+ });
+
+ // Clear rating button
+ document.getElementById('clearAddPromptRatingBtn').addEventListener('click', () => {
+ document.getElementById('addPromptRatingValue').value = '';
+ this.updateAddPromptRatingStars(0);
+ });
+
+ // Tag input
+ const tagInput = document.getElementById('addPromptTagInput');
+ tagInput.addEventListener('keydown', (e) => {
+ if (e.key === 'Enter' || e.key === ',') {
+ e.preventDefault();
+ const tag = tagInput.value.trim().replace(/,/g, '');
+ if (tag && !this.addPromptTags.includes(tag)) {
+ this.addPromptTags.push(tag);
+ this.renderAddPromptTags();
+ }
+ tagInput.value = '';
+ }
+ });
+
+ // Tag suggestions
+ tagInput.addEventListener('input', () => {
+ this.showAddPromptTagSuggestions(tagInput.value);
+ });
+ }
+
+ updateAddPromptRatingStars(rating) {
+ const stars = document.querySelectorAll('#addPromptRating .rating-star');
+ stars.forEach((star, index) => {
+ if (index < rating) {
+ star.textContent = '★';
+ star.classList.add('text-yellow-400');
+ star.classList.remove('text-gray-500');
+ } else {
+ star.textContent = '☆';
+ star.classList.remove('text-yellow-400');
+ star.classList.add('text-gray-500');
+ }
+ });
+ }
+
+ renderAddPromptTags() {
+ const container = document.getElementById('addPromptTagsContainer');
+ const input = document.getElementById('addPromptTagInput');
+
+ // Remove existing tag chips
+ container.querySelectorAll('.tag-chip').forEach(chip => chip.remove());
+
+ // Add tag chips
+ this.addPromptTags.forEach(tag => {
+ const chip = document.createElement('span');
+ chip.className = 'tag-chip inline-flex items-center px-2 py-1 bg-blue-600 text-white text-xs rounded cursor-pointer hover:bg-blue-700';
+ chip.innerHTML = `${tag}
×`;
+ chip.addEventListener('click', () => {
+ this.addPromptTags = this.addPromptTags.filter(t => t !== tag);
+ this.renderAddPromptTags();
+ });
+ container.insertBefore(chip, input);
+ });
+ }
+
+ showAddPromptTagSuggestions(query) {
+ const suggestionsContainer = document.getElementById('addPromptTagSuggestions');
+ if (!query) {
+ suggestionsContainer.classList.add('hidden');
+ return;
+ }
+
+ const matchingTags = this.tags.filter(tag =>
+ tag.toLowerCase().includes(query.toLowerCase()) &&
+ !this.addPromptTags.includes(tag)
+ ).slice(0, 10);
+
+ if (matchingTags.length === 0) {
+ suggestionsContainer.classList.add('hidden');
+ return;
+ }
+
+ suggestionsContainer.innerHTML = matchingTags.map(tag => `
+
+ ${tag}
+
+ `).join('');
+
+ suggestionsContainer.querySelectorAll('[data-tag]').forEach(el => {
+ el.addEventListener('click', () => {
+ const tag = el.dataset.tag;
+ if (!this.addPromptTags.includes(tag)) {
+ this.addPromptTags.push(tag);
+ this.renderAddPromptTags();
+ }
+ document.getElementById('addPromptTagInput').value = '';
+ suggestionsContainer.classList.add('hidden');
+ });
+ });
+
+ suggestionsContainer.classList.remove('hidden');
+ }
+
+ populateAddPromptCategories() {
+ const datalist = document.getElementById('addPromptCategoryList');
+ datalist.innerHTML = this.categories.map(cat => `