TDvorak/PPve
1
0
Fork 0
mirror of https://github.com/Dvorinka/PPve.git synced 2026-06-04 12:32:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

dd

Browse Source
This commit is contained in:
Tomas Dvorak
2025-05-29 09:24:49 +02:00
parent 6f549b2fb1
commit 2bf92edbb3
1 changed files with 105 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files
admin-dashboard.html
+105 -73
View File
@@ -1347,52 +1347,58 @@ async function loadBanner() {
// Update form fields // Update form fields
const bannerText = document.getElementById('bannerText'); const bannerText = document.getElementById('bannerText');
const bannerLink = document.getElementById('bannerLink'); const bannerLink = document.getElementById('bannerLink');
const bannerVisible = document.getElementById('bannerVisible'); const bannerVisible = document.getElementById('bannerVisibility');
if (bannerText) bannerText.value = data.text || ''; if (bannerText) bannerText.value = data.Text || '';
if (bannerLink) bannerLink.value = data.link || ''; if (bannerLink) bannerLink.value = data.Link || '';
if (bannerVisible) { if (bannerVisible) {
bannerVisible.checked = data.style?.isVisible !== false; bannerVisible.checked = data.Style?.IsVisible !== false;
// Update the hidden input for form submission
const hiddenVisible = document.getElementById('bannerVisible');
if (hiddenVisible) {
hiddenVisible.value = bannerVisible.checked ? 'true' : 'false';
}
// Force update visibility in preview // Force update visibility in preview
updateBannerPreview(); updateBannerPreview();
} }
// Initialize image position variables once // Initialize image position variables once
currentImagePosition = data.style?.imagePosition || 'center'; currentImagePosition = data.Style?.ImagePosition || 'center';
currentImageX = data.style?.imageX || '0'; currentImageX = data.Style?.ImageX || '0';
currentImageY = data.style?.imageY || '0'; currentImageY = data.Style?.ImageY || '0';
// Apply the saved template if it exists // Apply the saved template if it exists
if (data.style?.template && templateConfigs[data.style.template]) { if (data.Style?.template && templateConfigs[data.Style.template]) {
// Apply the template // Apply the template
applyTemplate(data.style.template); applyTemplate(data.Style.template);
// Update the active template in the UI // Update the active template in the UI
const templateItems = document.querySelectorAll('.template-item'); const templateItems = document.querySelectorAll('.template-item');
templateItems.forEach(item => { if (templateItems) {
if (item.dataset.template === data.style.template) { templateItems.forEach(item => {
item.classList.add('active'); if (item && item.dataset.template === data.Style.template) {
} else { item.classList.add('active');
item.classList.remove('active'); } else if (item) {
} item.classList.remove('active');
}); }
});
}
} else { } else {
// Fallback to default template if none is set // Fallback to default template if none is set
applyTemplate('modern-minimal'); applyTemplate('modern-minimal');
} }
// Handle image // Handle image
const bannerImgElement = document.getElementById('bannerImagePreview');
const uploadPrompt = document.getElementById('uploadPrompt');
const imagePreview = document.getElementById('imagePreview'); const imagePreview = document.getElementById('imagePreview');
const imagePreviewContainer = document.getElementById('imagePreviewContainer');
const removeBtn = document.getElementById('removeImageBtn');
const removeImageInput = document.getElementById('removeImage');
if (data.image) { if (data.Image) {
currentImage = data.image; currentImage = data.Image;
const bannerImgElement = document.getElementById('bannerImagePreview');
if (bannerImgElement) { if (bannerImgElement) {
const bannerLinkValue = document.getElementById('bannerLink')?.value || ''; bannerImgElement.src = data.Image;
const bannerLinkValue = data.Link || '';
if (bannerLinkValue) { if (bannerLinkValue) {
bannerImgElement.style.cursor = 'pointer'; bannerImgElement.style.cursor = 'pointer';
@@ -1404,69 +1410,95 @@ async function loadBanner() {
bannerImgElement.style.cursor = 'default'; bannerImgElement.style.cursor = 'default';
bannerImgElement.onclick = null; bannerImgElement.onclick = null;
} }
// Show the image preview and hide the upload prompt
if (uploadPrompt) uploadPrompt.style.display = 'none';
if (imagePreview) imagePreview.style.display = 'block';
} }
if (imagePreview) { // Update position if exists
imagePreview.src = data.image; if (data.Style?.ImagePosition) {
imagePreview.classList.remove('d-none'); currentImagePosition = data.Style.ImagePosition;
// Update position if exists // Update active state of position buttons
if (data.style?.imagePosition) { const positionButtons = document.querySelectorAll('.position-btn');
currentImagePosition = data.style.imagePosition; if (positionButtons) {
imagePreview.dataset.position = currentImagePosition; positionButtons.forEach(btn => {
if (btn) {
// Update active state of position buttons btn.classList.remove('active', 'btn-primary');
document.querySelectorAll('.image-pos-btn').forEach(btn => { btn.classList.add('btn-outline-secondary');
btn.classList.remove('active'); if (btn.dataset.position === currentImagePosition) {
if (btn.dataset.pos === currentImagePosition) { btn.classList.add('active', 'btn-primary');
btn.classList.add('active'); btn.classList.remove('btn-outline-secondary');
}
} }
}); });
} }
}
// Update coordinates if they exist // Update coordinates if they exist
if (data.style?.imageX !== undefined && data.style?.imageY !== undefined) { if (data.Style?.ImageX !== undefined && data.Style?.ImageY !== undefined) {
currentImageX = data.style.imageX; currentImageX = data.Style.ImageX;
currentImageY = data.style.imageY; currentImageY = data.Style.ImageY;
imagePreview.style.left = `${currentImageX}px`;
imagePreview.style.top = `${currentImageY}px`;
// Activate custom position // Update image preview position if it exists
document.getElementById('customPosBtn').classList.add('active'); if (bannerImgElement) {
bannerImgElement.style.left = `${currentImageX}px`;
bannerImgElement.style.top = `${currentImageY}px`;
// Activate custom position button if it exists
const customPosBtn = document.getElementById('customPosBtn');
if (customPosBtn) {
customPosBtn.classList.add('active', 'btn-primary');
customPosBtn.classList.remove('btn-outline-secondary');
}
}
}
// Show remove button if it exists
const removeBtn = document.getElementById('removeImageBtn');
if (removeBtn) {
removeBtn.style.display = 'block';
}
// Set remove image input if it exists
const removeImageInput = document.getElementById('removeImage');
if (removeImageInput) {
removeImageInput.value = 'false';
}
} else {
// No image in the saved banner
currentImage = null;
// Hide image preview and show upload prompt
if (imagePreview) {
imagePreview.style.display = 'none';
}
if (uploadPrompt) {
uploadPrompt.style.display = 'block';
}
// Hide remove button
const removeBtn = document.getElementById('removeImageBtn');
if (removeBtn) {
removeBtn.style.display = 'none';
}
// Set remove image input
const removeImageInput = document.getElementById('removeImage');
if (removeImageInput) {
removeImageInput.value = 'true';
} }
} }
if (removeImageInput) {
removeImageInput.value = 'true';
}
} else {
// No image in the saved banner
currentImage = null;
if (imagePreview) { // Update previews
imagePreview.removeAttribute('src'); updateColorPreviews();
} updateBannerPreview();
if (imagePreviewContainer) {
imagePreviewContainer.style.display = 'none';
}
if (removeBtn) {
removeBtn.style.display = 'none';
}
if (removeImageInput) {
removeImageInput.value = 'true';
}
} }
} catch (error) {
// Update previews console.error('Chyba při načítání banneru:', error);
updateColorPreviews(); showNotification('Chyba při načítání banneru', 'error');
updateBannerPreview();
} }
} catch (error) {
console.error('Chyba při načítání banneru:', error);
showNotification('Chyba při načítání banneru', 'error');
}
} }
// Add submission flag at the top of the script // Add submission flag at the top of the script
@@ -1769,7 +1801,7 @@ function updateBannerPreview() {
width: ${imageWidth}px; width: ${imageWidth}px;
max-height: ${imageHeight}px; max-height: ${imageHeight}px;
object-fit: contain; object-fit: contain;
border-radius: ${template.borderRadius || '0'}px; border-radius: ${template?.BorderRadius || '8'}px;
${imagePosition === 'left' ? 'float: left; margin-right: 20px;' : ''} ${imagePosition === 'left' ? 'float: left; margin-right: 20px;' : ''}
${imagePosition === 'right' ? 'float: right; margin-left: 20px;' : ''} ${imagePosition === 'right' ? 'float: right; margin-left: 20px;' : ''}
${imagePosition === 'center' ? 'display: block; margin: 0 auto;' : ''} ${imagePosition === 'center' ? 'display: block; margin: 0 auto;' : ''}