diff --git a/index.html b/index.html
index ff6f4c5..0c85c9b 100644
--- a/index.html
+++ b/index.html
@@ -1563,7 +1563,8 @@
>
-
+
+
diff --git a/js/themeStore.js b/js/themeStore.js
index bf272b1..0be7630 100644
--- a/js/themeStore.js
+++ b/js/themeStore.js
@@ -12,6 +12,7 @@ export class ThemeStore {
this.loadingIndicator = document.getElementById('theme-store-loading');
this._isCheckingAuth = false;
this.previewShadow = null;
+ this.editingThemeId = null;
this.init();
}
@@ -35,6 +36,8 @@ export class ThemeStore {
document.getElementById(contentId)?.classList.add('active');
if (tab.dataset.tab === 'upload') {
this.checkAuth();
+ } else {
+ this.resetEditState();
}
});
});
@@ -60,6 +63,10 @@ export class ThemeStore {
document.getElementById('email-auth-modal')?.classList.add('active');
});
+ document.getElementById('theme-upload-cancel-edit')?.addEventListener('click', () => {
+ this.resetEditState();
+ });
+
this.setupEditorTools();
document.getElementById('theme-details-back-btn')?.addEventListener('click', () => {
@@ -154,12 +161,17 @@ export class ThemeStore {
authorHtml = `${this.escapeHtml(authorName)}`;
}
- let deleteBtnHtml = '';
+ let actionBtnsHtml = '';
if (currentUserId && theme.author === currentUserId) {
- deleteBtnHtml = `
-
+ actionBtnsHtml = `
+
`;
}
@@ -176,7 +188,7 @@ export class ThemeStore {
div.innerHTML = `
- ${deleteBtnHtml}
+ ${actionBtnsHtml}
${previewHtml}
@@ -194,6 +206,11 @@ export class ThemeStore {
this.deleteTheme(theme.id);
return;
}
+ if (e.target.closest('.edit-theme-btn')) {
+ e.stopPropagation();
+ this.startEditTheme(theme);
+ return;
+ }
this.openThemeDetails(theme);
});
@@ -516,20 +533,25 @@ export class ThemeStore {
);
}
- console.log('Uploading theme:', { name, author: userId, authorName: userName });
+ console.log(this.editingThemeId ? 'Updating theme:' : 'Uploading theme:', { name, author: userId, authorName: userName });
const formData = new FormData();
formData.append('name', name);
formData.append('description', desc);
formData.append('css', css);
- formData.append('author', userId);
formData.append('authorName', userName);
- if (website) formData.append('authorUrl', website);
+ formData.append('authorUrl', website || '');
- await this.pb.collection('themes').create(formData, { f_id: fbUser.uid });
+ if (this.editingThemeId) {
+ await this.pb.collection('themes').update(this.editingThemeId, formData, { f_id: fbUser.uid });
+ alert('Theme updated successfully!');
+ } else {
+ formData.append('author', userId);
+ await this.pb.collection('themes').create(formData, { f_id: fbUser.uid });
+ alert('Theme uploaded successfully!');
+ }
- alert('Theme uploaded successfully!');
- e.target.reset();
+ this.resetEditState();
const previewWindow = document.getElementById('theme-preview-window');
const togglePreviewBtn = document.getElementById('te-toggle-preview');
@@ -561,6 +583,39 @@ export class ThemeStore {
}
}
+ startEditTheme(theme) {
+ this.editingThemeId = theme.id;
+
+ const uploadTab = this.modal.querySelector('[data-tab="upload"]');
+ if (uploadTab) uploadTab.click();
+
+ document.getElementById('theme-upload-name').value = theme.name;
+ document.getElementById('theme-upload-desc').value = theme.description || '';
+ document.getElementById('theme-upload-website').value = theme.authorUrl || '';
+ document.getElementById('theme-upload-css').value = theme.css;
+
+ const submitBtn = document.getElementById('theme-upload-submit-btn');
+ if (submitBtn) submitBtn.textContent = 'Update Theme';
+
+ const cancelBtn = document.getElementById('theme-upload-cancel-edit');
+ if (cancelBtn) cancelBtn.style.display = 'inline-block';
+
+ this.updatePreview();
+ }
+
+ resetEditState() {
+ this.editingThemeId = null;
+ document.getElementById('theme-upload-form')?.reset();
+
+ const submitBtn = document.getElementById('theme-upload-submit-btn');
+ if (submitBtn) submitBtn.textContent = 'Upload Theme';
+
+ const cancelBtn = document.getElementById('theme-upload-cancel-edit');
+ if (cancelBtn) cancelBtn.style.display = 'none';
+
+ this.updatePreview();
+ }
+
escapeHtml(str) {
const div = document.createElement('div');
div.textContent = str;