From e89d7add1137e859fd23d6757351579c4565e26c Mon Sep 17 00:00:00 2001 From: Flatlogic Bot Date: Fri, 6 Feb 2026 17:46:33 +0000 Subject: [PATCH] Revert to version f0fcbb7 --- api/save_settings.php | 97 +--- assets/css/custom.css | 398 ++++++++-------- assets/js/main.js | 424 +++++++----------- .../003_add_font_and_pos_settings.sql | 5 - ...004_add_text_content_and_size_settings.sql | 9 - index.php | 132 +----- 6 files changed, 374 insertions(+), 691 deletions(-) delete mode 100644 db/migrations/003_add_font_and_pos_settings.sql delete mode 100644 db/migrations/004_add_text_content_and_size_settings.sql diff --git a/api/save_settings.php b/api/save_settings.php index be7fd69..9340e8e 100644 --- a/api/save_settings.php +++ b/api/save_settings.php @@ -57,69 +57,6 @@ if ($action === 'upload_bg_image') { } else { echo json_encode(['success' => false, 'error' => 'Invalid color format.']); } -} elseif ($action === 'update_second_page_text_color') { - $color = $_POST['color'] ?? ''; - if (preg_match('/^#[a-f0-9]{6}$/i', $color)) { - $stmt = db()->prepare("UPDATE settings SET setting_value = ? WHERE setting_key = 'second_page_text_color'"); - $stmt->execute([$color]); - echo json_encode(['success' => true]); - } else { - echo json_encode(['success' => false, 'error' => 'Invalid color format.']); - } -} elseif ($action === 'update_proposal_text_color') { - $color = $_POST['color'] ?? ''; - if (preg_match('/^#[a-f0-9]{6}$/i', $color)) { - $stmt = db()->prepare("UPDATE settings SET setting_value = ? WHERE setting_key = 'proposal_text_color'"); - $stmt->execute([$color]); - echo json_encode(['success' => true]); - } else { - echo json_encode(['success' => false, 'error' => 'Invalid color format.']); - } -} elseif ($action === 'update_font_family') { - $font = $_POST['font'] ?? ''; - $stmt = db()->prepare("UPDATE settings SET setting_value = ? WHERE setting_key = 'font_family'"); - $stmt->execute([$font]); - echo json_encode(['success' => true]); -} elseif ($action === 'update_second_page_box_pos_y') { - $pos = $_POST['pos'] ?? '0'; - $stmt = db()->prepare("UPDATE settings SET setting_value = ? WHERE setting_key = 'second_page_box_pos_y'"); - $stmt->execute([$pos]); - echo json_encode(['success' => true]); -} elseif ($action === 'update_image_border_radius') { - $radius = $_POST['radius'] ?? '12'; - $stmt = db()->prepare("UPDATE settings SET setting_value = ? WHERE setting_key = 'image_border_radius'"); - $stmt->execute([$radius]); - echo json_encode(['success' => true]); -} elseif ($action === 'update_proposal_text') { - $text = $_POST['text'] ?? ''; - $stmt = db()->prepare("UPDATE settings SET setting_value = ? WHERE setting_key = 'proposal_text'"); - $stmt->execute([$text]); - echo json_encode(['success' => true]); -} elseif ($action === 'update_success_text_1') { - $text = $_POST['text'] ?? ''; - $stmt = db()->prepare("UPDATE settings SET setting_value = ? WHERE setting_key = 'success_text_1'"); - $stmt->execute([$text]); - echo json_encode(['success' => true]); -} elseif ($action === 'update_success_text_2') { - $text = $_POST['text'] ?? ''; - $stmt = db()->prepare("UPDATE settings SET setting_value = ? WHERE setting_key = 'success_text_2'"); - $stmt->execute([$text]); - echo json_encode(['success' => true]); -} elseif ($action === 'update_proposal_text_size') { - $size = $_POST['size'] ?? '2'; - $stmt = db()->prepare("UPDATE settings SET setting_value = ? WHERE setting_key = 'proposal_text_size'"); - $stmt->execute([$size]); - echo json_encode(['success' => true]); -} elseif ($action === 'update_success_text_1_size') { - $size = $_POST['size'] ?? '1.5'; - $stmt = db()->prepare("UPDATE settings SET setting_value = ? WHERE setting_key = 'success_text_1_size'"); - $stmt->execute([$size]); - echo json_encode(['success' => true]); -} elseif ($action === 'update_success_text_2_size') { - $size = $_POST['size'] ?? '0.9'; - $stmt = db()->prepare("UPDATE settings SET setting_value = ? WHERE setting_key = 'success_text_2_size'"); - $stmt->execute([$size]); - echo json_encode(['success' => true]); } elseif ($action === 'remove_bg_image') { $stmt = db()->prepare("UPDATE settings SET setting_value = '' WHERE setting_key = 'bg_image'"); $stmt->execute(); @@ -130,30 +67,16 @@ if ($action === 'upload_bg_image') { $stmt->execute([$lockValue]); echo json_encode(['success' => true, 'locked' => $lockValue === '1']); } elseif ($action === 'reset') { - $defaults = [ - 'valentine_image' => 'assets/pasted-20260206-164030-456a591e.jpg', - 'is_locked' => '0', - 'bg_color' => '#ffe4e6', - 'bg_image' => '', - 'popup_color' => '#ffccd5', - 'font_family' => "'Inter', sans-serif", - 'second_page_text_color' => '#e63946', - 'second_page_box_pos_y' => '0', - 'image_border_radius' => '12', - 'proposal_text' => 'Gvantsa, would you be my valentine?', - 'success_text_1' => "Congratulations, you are now Sam's Valentine! ❤️", - 'success_text_2' => 'He is so incredibly lucky to have someone in his life who would click yes.', - 'proposal_text_color' => '#e63946', - 'proposal_text_size' => '2', - 'success_text_1_size' => '1.5', - 'success_text_2_size' => '0.9' - ]; - - foreach ($defaults as $key => $value) { - $stmt = db()->prepare("UPDATE settings SET setting_value = ? WHERE setting_key = ?"); - $stmt->execute([$value, $key]); - } - + $stmt = db()->prepare("UPDATE settings SET setting_value = 'assets/pasted-20260206-164030-456a591e.jpg' WHERE setting_key = 'valentine_image'"); + $stmt->execute(); + $stmt = db()->prepare("UPDATE settings SET setting_value = '0' WHERE setting_key = 'is_locked'"); + $stmt->execute(); + $stmt = db()->prepare("UPDATE settings SET setting_value = '#ffe4e6' WHERE setting_key = 'bg_color'"); + $stmt->execute(); + $stmt = db()->prepare("UPDATE settings SET setting_value = '' WHERE setting_key = 'bg_image'"); + $stmt->execute(); + $stmt = db()->prepare("UPDATE settings SET setting_value = '#ffccd5' WHERE setting_key = 'popup_color'"); + $stmt->execute(); echo json_encode(['success' => true]); } else { echo json_encode(['success' => false, 'error' => 'Invalid action.']); diff --git a/assets/css/custom.css b/assets/css/custom.css index 6ebdfdc..2694f50 100644 --- a/assets/css/custom.css +++ b/assets/css/custom.css @@ -1,254 +1,218 @@ :root { - --bg-color: #ffe4e6; - --popup-bg: #ffccd5; - --bg-image: none; - --font-family: 'Inter', sans-serif; - --second-page-text-color: #e63946; - --second-page-box-pos-y: 0px; - --image-border-radius: 12px; - - --proposal-text-color: #e63946; - --proposal-text-size: 2rem; - --success-text-1-size: 1.5rem; - --success-text-2-size: 0.9rem; + --primary-color: #e63946; + --bg-color: #ffe4e6; /* Default Light Pink */ + --popup-bg: #ffccd5; /* Default Light Red */ + --bg-image: none; + --text-color: #2d3436; + --secondary-text: #636e72; + --border-color: rgba(0,0,0,0.05); + --font-family: 'Inter', system-ui, -apple-system, sans-serif; } body { - margin: 0; - padding: 0; - font-family: var(--font-family); - background-color: var(--bg-color); - background-image: var(--bg-image); - background-size: cover; - background-position: center; - background-attachment: fixed; - min-height: 100vh; - display: flex; - justify-content: center; - align-items: center; - transition: background-color 0.3s ease; + background-color: var(--bg-color); + background-image: var(--bg-image); + background-size: cover; + background-position: center; + background-attachment: fixed; + color: var(--text-color); + font-family: var(--font-family); + margin: 0; + display: flex; + justify-content: center; + align-items: center; + min-height: 100vh; + overflow-x: hidden; } -.container { - width: 90%; - max-width: 500px; - text-align: center; - z-index: 1; -} - -#proposal-box, #success-message { - background-color: var(--popup-bg); - padding: 2.5rem; - border-radius: 20px; - box-shadow: 0 10px 25px rgba(0,0,0,0.1); - backdrop-filter: blur(5px); - transition: all 0.3s ease; -} - -#success-message { - display: none; - animation: fadeInScale 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; - transform: translateY(var(--second-page-box-pos-y)); -} - -#success-message.preview-mode { - animation: none; /* No animation for preview to make it snappier */ -} - -#success-message.preview-mode .redirect-hint { - display: none; -} - -@keyframes fadeInScale { - from { opacity: 0; transform: translateY(calc(var(--second-page-box-pos-y) + 20px)) scale(0.9); } - to { opacity: 1; transform: translateY(var(--second-page-box-pos-y)) scale(1); } -} - -h1 { - color: var(--proposal-text-color); - font-size: var(--proposal-text-size); - margin-bottom: 2rem; -} - -.image-preview-container { - width: 100%; - height: 250px; - background: #f1f5f9; - border-radius: var(--image-border-radius); - margin-bottom: 2rem; - display: flex; - align-items: center; - justify-content: center; - overflow: hidden; - position: relative; - border: 2px dashed #cbd5e1; -} - -.image-preview-container.has-image { - border: none; -} - -.image-preview-container img { - width: 100%; - height: 100%; - object-fit: cover; -} - -.button-group { - display: flex; - gap: 1.5rem; - justify-content: center; - align-items: center; - min-height: 60px; -} - -.btn { - padding: 0.8rem 2rem; - border: none; - border-radius: 50px; - font-weight: 700; - cursor: pointer; - transition: transform 0.2s, box-shadow 0.2s; - font-family: inherit; -} - -.btn:active { - transform: scale(0.95); -} - -.btn-yes { - background-color: #e63946; - color: white; - font-size: 1.1rem; - box-shadow: 0 4px 15px rgba(230, 57, 70, 0.3); -} - -.btn-no { - background-color: #f8fafc; - color: #64748b; - border: 1px solid #e2e8f0; -} - -.success-text { - font-size: var(--success-text-1-size); - color: var(--second-page-text-color); - font-weight: 700; - margin-bottom: 1.5rem; -} - -.success-text-small { - font-size: var(--success-text-2-size); -} - -.redirect-hint { - font-size: 0.9rem; - color: #64748b; - margin-top: 2rem; - font-style: italic; -} - -/* Admin Controls */ .admin-controls { - position: fixed; - top: 20px; - right: 20px; - display: flex; - flex-direction: column; - align-items: flex-end; - gap: 10px; - z-index: 1000; + position: fixed; + top: 1rem; + right: 1rem; + display: flex; + flex-direction: column; + gap: 0.5rem; + z-index: 100; + align-items: flex-end; } .control-buttons { - display: flex; - gap: 10px; + display: flex; + gap: 0.5rem; } .admin-controls button { - background: white; - border: 1px solid #e2e8f0; - padding: 8px; - border-radius: 8px; - cursor: pointer; - display: flex; - align-items: center; - justify-content: center; - color: #64748b; - box-shadow: 0 2px 5px rgba(0,0,0,0.05); - transition: all 0.2s; + background: rgba(255, 255, 255, 0.8); + border: none; + border-radius: 50%; + width: 36px; + height: 36px; + display: flex; + justify-content: center; + align-items: center; + cursor: pointer; + box-shadow: 0 2px 8px rgba(0,0,0,0.1); + transition: all 0.2s ease; + color: var(--secondary-text); } .admin-controls button:hover { - background: #f8fafc; - color: #e63946; + background: #fff; + color: var(--primary-color); + transform: scale(1.1); } .settings-panel { - background: white; - border: 1px solid #e2e8f0; - border-radius: 12px; - padding: 15px; - width: 280px; - box-shadow: 0 10px 25px rgba(0,0,0,0.1); - display: flex; - flex-direction: column; - gap: 12px; + background: white; + padding: 1rem; + border-radius: 12px; + box-shadow: 0 4px 15px rgba(0,0,0,0.1); + margin-top: 0.5rem; + display: flex; + flex-direction: column; + gap: 0.75rem; + width: 200px; + animation: slideDown 0.3s ease; } -.settings-scroll-area { - max-height: 400px; - overflow-y: auto; - padding-right: 5px; -} - -.settings-scroll-area::-webkit-scrollbar { - width: 6px; -} - -.settings-scroll-area::-webkit-scrollbar-thumb { - background: #e2e8f0; - border-radius: 10px; +@keyframes slideDown { + from { opacity: 0; transform: translateY(-10px); } + to { opacity: 1; transform: translateY(0); } } .settings-group { - margin-bottom: 15px; -} - -.settings-group:last-child { - margin-bottom: 0; + display: flex; + flex-direction: column; + gap: 0.25rem; } .settings-group label { - display: block; - font-size: 0.8rem; - color: #64748b; - margin-bottom: 5px; - font-weight: 600; + font-size: 0.75rem; + font-weight: 600; + color: var(--secondary-text); } -.settings-group input[type="color"], -.settings-group input[type="number"], -.settings-group select { - width: 100%; - padding: 6px; - border: 1px solid #e2e8f0; - border-radius: 6px; - outline: none; +.settings-group input[type="color"] { + width: 100%; + height: 30px; + border: 1px solid var(--border-color); + border-radius: 4px; + cursor: pointer; } -.btn-small { - padding: 4px 10px !important; - font-size: 0.75rem !important; +.settings-group .btn-small { + padding: 4px 8px; + font-size: 0.7rem; + background: #f1f2f6; + border: 1px solid #dfe4ea; + border-radius: 4px; + cursor: pointer; } -#bg-image-input { - display: none; +.container { + max-width: 500px; + width: 90%; + text-align: center; + padding: 2.5rem 2rem; + border-radius: 20px; + background: var(--popup-bg); + box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); + transition: all 0.3s ease; + position: relative; } -/* State management */ -.state-locked .admin-controls #lock-btn { - opacity: 0.3; +h1 { + font-size: 1.75rem; + font-weight: 700; + margin-bottom: 1.5rem; + letter-spacing: -0.5px; + color: var(--primary-color); } -.state-locked .admin-controls #lock-btn:hover { - opacity: 1; + +.image-preview-container { + width: 100%; + height: 250px; + background-color: rgba(255, 255, 255, 0.5); + border: 2px solid rgba(0,0,0,0.05); + border-radius: 12px; + margin-bottom: 1.5rem; + display: flex; + justify-content: center; + align-items: center; + overflow: hidden; + position: relative; +} + +.image-preview-container img { + width: 100%; + height: 100%; + object-fit: cover; +} + +.button-group { + display: flex; + justify-content: center; + align-items: center; + gap: 1rem; + margin-top: 2rem; + position: relative; + min-height: 60px; +} + +.btn { + padding: 0.75rem 1.75rem; + font-size: 1rem; + font-weight: 600; + border-radius: 10px; + border: none; + cursor: pointer; + transition: transform 0.1s ease, font-size 0.2s ease, background-color 0.2s ease; + white-space: nowrap; +} + +.btn-yes { + background-color: var(--primary-color); + color: white; + z-index: 10; + box-shadow: 0 4px 12px rgba(230, 57, 70, 0.3); +} + +.btn-yes:hover { + background-color: #d62839; +} + +.btn-no { + background-color: #fff; + color: var(--text-color); + position: relative; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05); +} + +#success-message { + display: none; + animation: fadeIn 0.8s ease forwards; +} + +@keyframes fadeIn { + from { opacity: 0; transform: translateY(10px); } + to { opacity: 1; transform: translateY(0); } +} + +.success-text { + font-size: 1.25rem; + line-height: 1.6; + color: var(--primary-color); + font-weight: 700; + margin-bottom: 0.5rem; +} + +.redirect-hint { + margin-top: 2rem; + font-size: 0.85rem; + color: var(--secondary-text); + font-style: italic; +} + +#image-input, #bg-image-input { + display: none; } \ No newline at end of file diff --git a/assets/js/main.js b/assets/js/main.js index 587379a..fc15cca 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -1,282 +1,109 @@ document.addEventListener('DOMContentLoaded', () => { - const yesBtn = document.getElementById('yes-btn'); const noBtn = document.getElementById('no-btn'); + const yesBtn = document.getElementById('yes-btn'); const proposalBox = document.getElementById('proposal-box'); - const successMessage = document.getElementById('success-message'); - const resetBtn = document.getElementById('reset-btn'); + const successBox = document.getElementById('success-message'); const lockBtn = document.getElementById('lock-btn'); + const resetBtn = document.getElementById('reset-btn'); const settingsToggle = document.getElementById('settings-toggle'); const settingsPanel = document.getElementById('settings-panel'); - const previewImg = document.getElementById('preview-img'); - const previewSuccessToggle = document.getElementById('preview-success-toggle'); - - // Setting inputs const bgColorPicker = document.getElementById('bg-color-picker'); const popupColorPicker = document.getElementById('popup-color-picker'); const bgImageInput = document.getElementById('bg-image-input'); const removeBgBtn = document.getElementById('remove-bg-btn'); - const fontFamilySelect = document.getElementById('font-family-select'); - const secondPageTextColorPicker = document.getElementById('second-page-text-color-picker'); - const secondPageBoxPosYInput = document.getElementById('second-page-box-pos-y-input'); - const imageBorderRadiusInput = document.getElementById('image-border-radius-input'); - // New setting inputs - const proposalTextColorPicker = document.getElementById('proposal-text-color-picker'); - const proposalTextSizeInput = document.getElementById('proposal-text-size-input'); - const successText1SizeInput = document.getElementById('success-text-1-size-input'); - const successText2SizeInput = document.getElementById('success-text-2-size-input'); - const proposalTextInput = document.getElementById('proposal-text-input'); - const successText1Input = document.getElementById('success-text-1-input'); - const successText2Input = document.getElementById('success-text-2-input'); - - // Display elements - const proposalTextDisplay = document.getElementById('proposal-text-display'); - const successText1Display = document.getElementById('success-text-1-display'); - const successText2Display = document.getElementById('success-text-2-display'); + let yesScale = 1; + let isLocked = typeof IS_LOCKED !== 'undefined' ? IS_LOCKED : false; - let noCount = 0; - const phrases = [ - "No", "Are you sure?", "Really sure?", "Think again!", "Last chance!", - "Surely not?", "You might regret this!", "Give it another thought!", - "Are you absolutely sure?", "This could be a mistake!", "Have a heart!", - "Don't be so cold!", "Change of heart?", "Wouldn't you reconsider?", - "Is that your final answer?", "You're breaking my heart ;(" - ]; + // Settings Toggle + if (settingsToggle) { + settingsToggle.addEventListener('click', () => { + settingsPanel.style.display = settingsPanel.style.display === 'none' ? 'flex' : 'none'; + }); + } - // No button movement and text change - noBtn.addEventListener('click', () => { - noCount++; - noBtn.innerText = phrases[Math.min(noCount, phrases.length - 1)]; - - const currentSize = parseFloat(window.getComputedStyle(yesBtn).fontSize); - yesBtn.style.fontSize = `${currentSize * 1.2}px`; - yesBtn.style.padding = `${parseFloat(window.getComputedStyle(yesBtn).paddingTop) * 1.2}px ${parseFloat(window.getComputedStyle(yesBtn).paddingLeft) * 1.2}px`; - - // Randomly move No button - const container = document.getElementById('main-container'); - const containerRect = container.getBoundingClientRect(); - const btnRect = noBtn.getBoundingClientRect(); - - const maxX = containerRect.width - btnRect.width; - const maxY = containerRect.height - btnRect.height; - - const randomX = Math.floor(Math.random() * maxX); - const randomY = Math.floor(Math.random() * maxY); - - noBtn.style.position = 'absolute'; - noBtn.style.left = `${randomX}px`; - noBtn.style.top = `${randomY}px`; - }); + // Color Pickers + if (bgColorPicker) { + bgColorPicker.addEventListener('input', (e) => { + document.documentElement.style.setProperty('--bg-color', e.target.value); + }); + bgColorPicker.addEventListener('change', (e) => { + const formData = new FormData(); + formData.append('action', 'update_bg_color'); + formData.append('color', e.target.value); + fetch('api/save_settings.php', { method: 'POST', body: formData }); + }); + } - // Yes button action - yesBtn.addEventListener('click', () => { - if (previewSuccessToggle.checked) return; // Ignore if in preview mode - - proposalBox.style.display = 'none'; - successMessage.style.display = 'block'; - - // Confetti effect - const duration = 15 * 1000; - const animationEnd = Date.now() + duration; - const defaults = { startVelocity: 30, spread: 360, ticks: 60, zIndex: 0 }; + if (popupColorPicker) { + popupColorPicker.addEventListener('input', (e) => { + document.documentElement.style.setProperty('--popup-bg', e.target.value); + }); + popupColorPicker.addEventListener('change', (e) => { + const formData = new FormData(); + formData.append('action', 'update_popup_color'); + formData.append('color', e.target.value); + fetch('api/save_settings.php', { method: 'POST', body: formData }); + }); + } - function randomInRange(min, max) { - return Math.random() * (max - min) + min; - } + // Background Image Upload + if (bgImageInput) { + bgImageInput.addEventListener('change', function() { + const file = this.files[0]; + if (file) { + const formData = new FormData(); + formData.append('action', 'upload_bg_image'); + formData.append('image', file); - const interval = setInterval(function() { - const timeLeft = animationEnd - Date.now(); - - if (timeLeft <= 0) { - return clearInterval(interval); - } - - const particleCount = 50 * (timeLeft / duration); - confetti({ ...defaults, particleCount, origin: { x: randomInRange(0.1, 0.3), y: Math.random() - 0.2 } }); - confetti({ ...defaults, particleCount, origin: { x: randomInRange(0.7, 0.9), y: Math.random() - 0.2 } }); - }, 250); - - // Redirect after 15 seconds - setTimeout(() => { - window.location.href = "https://www.youtube.com/watch?v=dQw4w9WgXcQ"; - }, 15000); - }); - - // Preview Success Page logic - previewSuccessToggle.addEventListener('change', (e) => { - if (e.target.checked) { - proposalBox.style.display = 'none'; - successMessage.style.display = 'block'; - successMessage.classList.add('preview-mode'); - } else { - proposalBox.style.display = 'block'; - successMessage.style.display = 'none'; - successMessage.classList.remove('preview-mode'); - } - }); - - // Toggle settings panel - settingsToggle.addEventListener('click', () => { - settingsPanel.style.display = settingsPanel.style.display === 'none' ? 'flex' : 'none'; - }); - - // Update background color - bgColorPicker.addEventListener('input', (e) => { - document.documentElement.style.setProperty('--bg-color', e.target.value); - }); - - bgColorPicker.addEventListener('change', (e) => { - saveSetting('update_bg_color', { color: e.target.value }); - }); - - // Update popup color - popupColorPicker.addEventListener('input', (e) => { - document.documentElement.style.setProperty('--popup-bg', e.target.value); - }); - - popupColorPicker.addEventListener('change', (e) => { - saveSetting('update_popup_color', { color: e.target.value }); - }); - - // Update second page text color - secondPageTextColorPicker.addEventListener('input', (e) => { - document.documentElement.style.setProperty('--second-page-text-color', e.target.value); - }); - - secondPageTextColorPicker.addEventListener('change', (e) => { - saveSetting('update_second_page_text_color', { color: e.target.value }); - }); - - // Update proposal text color - proposalTextColorPicker.addEventListener('input', (e) => { - document.documentElement.style.setProperty('--proposal-text-color', e.target.value); - }); - - proposalTextColorPicker.addEventListener('change', (e) => { - saveSetting('update_proposal_text_color', { color: e.target.value }); - }); - - // Update font family - fontFamilySelect.addEventListener('change', (e) => { - document.documentElement.style.setProperty('--font-family', e.target.value); - saveSetting('update_font_family', { font: e.target.value }); - }); - - // Update success box Y position - secondPageBoxPosYInput.addEventListener('input', (e) => { - document.documentElement.style.setProperty('--second-page-box-pos-y', `${e.target.value}px`); - }); - - secondPageBoxPosYInput.addEventListener('change', (e) => { - saveSetting('update_second_page_box_pos_y', { pos: e.target.value }); - }); - - // Update image border radius - imageBorderRadiusInput.addEventListener('input', (e) => { - document.documentElement.style.setProperty('--image-border-radius', `${e.target.value}px`); - }); - - imageBorderRadiusInput.addEventListener('change', (e) => { - saveSetting('update_image_border_radius', { radius: e.target.value }); - }); - - // Update proposal text size - proposalTextSizeInput.addEventListener('input', (e) => { - document.documentElement.style.setProperty('--proposal-text-size', `${e.target.value}rem`); - }); - - proposalTextSizeInput.addEventListener('change', (e) => { - saveSetting('update_proposal_text_size', { size: e.target.value }); - }); - - // Update success text 1 size - successText1SizeInput.addEventListener('input', (e) => { - document.documentElement.style.setProperty('--success-text-1-size', `${e.target.value}rem`); - }); - - successText1SizeInput.addEventListener('change', (e) => { - saveSetting('update_success_text_1_size', { size: e.target.value }); - }); - - // Update success text 2 size - successText2SizeInput.addEventListener('input', (e) => { - document.documentElement.style.setProperty('--success-text-2-size', `${e.target.value}rem`); - }); - - successText2SizeInput.addEventListener('change', (e) => { - saveSetting('update_success_text_2_size', { size: e.target.value }); - }); - - // Update proposal text content - proposalTextInput.addEventListener('input', (e) => { - proposalTextDisplay.innerText = e.target.value; - }); - - proposalTextInput.addEventListener('change', (e) => { - saveSetting('update_proposal_text', { text: e.target.value }); - }); - - // Update success text 1 content - successText1Input.addEventListener('input', (e) => { - successText1Display.innerText = e.target.value; - }); - - successText1Input.addEventListener('change', (e) => { - saveSetting('update_success_text_1', { text: e.target.value }); - }); - - // Update success text 2 content - successText2Input.addEventListener('input', (e) => { - successText2Display.innerText = e.target.value; - }); - - successText2Input.addEventListener('change', (e) => { - saveSetting('update_success_text_2', { text: e.target.value }); - }); - - // Upload background image - bgImageInput.addEventListener('change', (e) => { - const file = e.target.files[0]; - if (!file) return; - - const formData = new FormData(); - formData.append('action', 'upload_bg_image'); - formData.append('image', file); - - fetch('api/save_settings.php', { - method: 'POST', - body: formData - }) - .then(res => res.json()) - .then(data => { - if (data.success) { - document.documentElement.style.setProperty('--bg-image', `url('${data.path}?v=${Date.now()}')`); - location.reload(); // Reload to show remove button and update PHP state + fetch('api/save_settings.php', { + method: 'POST', + body: formData + }) + .then(response => response.json()) + .then(data => { + if (data.success) { + document.documentElement.style.setProperty('--bg-image', `url('${data.path}?t=${new Date().getTime()}')`); + location.reload(); // Reload to update the "Remove" button visibility + } else { + alert(data.error || 'Failed to upload background image'); + } + }) + .catch(error => { + console.error('Error:', error); + alert('An error occurred during upload.'); + }); } }); - }); + } - // Remove background image if (removeBgBtn) { removeBgBtn.addEventListener('click', () => { - saveSetting('remove_bg_image', {}).then(() => { - location.reload(); + const formData = new FormData(); + formData.append('action', 'remove_bg_image'); + fetch('api/save_settings.php', { method: 'POST', body: formData }) + .then(response => response.json()) + .then(data => { + if (data.success) { + document.documentElement.style.setProperty('--bg-image', 'none'); + location.reload(); + } }); }); } - // Toggle Lock + // Lock/Unlock Toggle lockBtn.addEventListener('click', () => { - const newLockState = !IS_LOCKED; + const newLockedState = !isLocked; const formData = new FormData(); formData.append('action', 'toggle_lock'); - formData.append('lock', newLockState); + formData.append('lock', newLockedState); fetch('api/save_settings.php', { method: 'POST', body: formData }) - .then(res => res.json()) + .then(response => response.json()) .then(data => { if (data.success) { location.reload(); @@ -284,30 +111,99 @@ document.addEventListener('DOMContentLoaded', () => { }); }); - // Reset settings + // Reset Experience resetBtn.addEventListener('click', () => { - if (confirm('Are you sure you want to reset all settings to defaults?')) { - saveSetting('reset', {}).then(() => { - location.reload(); + if (confirm('Reset everything to defaults?')) { + const formData = new FormData(); + formData.append('action', 'reset'); + + fetch('api/save_settings.php', { + method: 'POST', + body: formData + }) + .then(response => response.json()) + .then(data => { + if (data.success) { + location.reload(); + } }); } }); - async function saveSetting(action, data) { - const formData = new FormData(); - formData.append('action', action); - for (const key in data) { - formData.append(key, data[key]); - } + // "No" Button Dodging Logic + const dodgeThreshold = 100; // pixels - try { - const res = await fetch('api/save_settings.php', { - method: 'POST', - body: formData - }); - return await res.json(); - } catch (err) { - console.error('Failed to save setting:', err); + document.addEventListener('mousemove', (e) => { + if (!noBtn || (successBox && successBox.style.display === 'block')) return; + + const rect = noBtn.getBoundingClientRect(); + const btnCenterX = rect.left + rect.width / 2; + const btnCenterY = rect.top + rect.height / 2; + + const distance = Math.hypot(e.clientX - btnCenterX, e.clientY - btnCenterY); + + if (distance < dodgeThreshold) { + const angle = Math.atan2(e.clientY - btnCenterY, e.clientX - btnCenterX); + const moveDist = dodgeThreshold - distance + 20; + + let newX = rect.left - Math.cos(angle) * moveDist; + let newY = rect.top - Math.sin(angle) * moveDist; + + // Keep within viewport bounds + const padding = 20; + newX = Math.max(padding, Math.min(window.innerWidth - rect.width - padding, newX)); + newY = Math.max(padding, Math.min(window.innerHeight - rect.height - padding, newY)); + + noBtn.style.position = 'fixed'; + noBtn.style.left = `${newX}px`; + noBtn.style.top = `${newY}px`; + noBtn.style.margin = '0'; } + }); + + // "No" Click Logic + if (noBtn) { + noBtn.addEventListener('click', (e) => { + e.preventDefault(); + yesScale += 0.15; + yesBtn.style.transform = `scale(${yesScale})`; + }); + } + + // "Yes" Click Logic + if (yesBtn) { + yesBtn.addEventListener('click', () => { + proposalBox.style.display = 'none'; + successBox.style.display = 'block'; + + // Hide controls during celebration + document.querySelector('.admin-controls').style.display = 'none'; + + // Confetti effect + const duration = 15 * 1000; + const animationEnd = Date.now() + duration; + const defaults = { startVelocity: 30, spread: 360, ticks: 60, zIndex: 0 }; + + function randomInRange(min, max) { + return Math.random() * (max - min) + min; + } + + const interval = setInterval(function() { + const timeLeft = animationEnd - Date.now(); + + if (timeLeft <= 0) { + return clearInterval(interval); + } + + const particleCount = 50 * (timeLeft / duration); + confetti(Object.assign({}, defaults, { particleCount, origin: { x: randomInRange(0.1, 0.3), y: Math.random() - 0.2 } })); + confetti(Object.assign({}, defaults, { particleCount, origin: { x: randomInRange(0.7, 0.9), y: Math.random() - 0.2 } })); + }, 250); + + // Redirect after 15s + setTimeout(() => { + window.location.href = "https://www.youtube.com/watch?v=dQw4w9WgXcQ"; + }, 15000); + }); } }); diff --git a/db/migrations/003_add_font_and_pos_settings.sql b/db/migrations/003_add_font_and_pos_settings.sql deleted file mode 100644 index a288b46..0000000 --- a/db/migrations/003_add_font_and_pos_settings.sql +++ /dev/null @@ -1,5 +0,0 @@ -INSERT IGNORE INTO settings (setting_key, setting_value) VALUES -('font_family', "'Inter', sans-serif"), -('second_page_text_color', '#e63946'), -('second_page_box_pos_y', '0'), -('image_border_radius', '12'); diff --git a/db/migrations/004_add_text_content_and_size_settings.sql b/db/migrations/004_add_text_content_and_size_settings.sql deleted file mode 100644 index 6f71cdb..0000000 --- a/db/migrations/004_add_text_content_and_size_settings.sql +++ /dev/null @@ -1,9 +0,0 @@ -INSERT IGNORE INTO settings (setting_key, setting_value) VALUES -('proposal_text', 'Gvantsa, would you be my valentine?'), -('success_text_1', 'Congratulations, you are now Sam\'s Valentine! ❤️'), -('success_text_2', 'He is so incredibly lucky to have someone in his life who would click yes.'), -('proposal_text_color', '#e63946'), -('proposal_text_size', '2'), -('success_text_1_size', '1.5'), -('success_text_2_size', '0.9'); - diff --git a/index.php b/index.php index e5e519a..3b39361 100644 --- a/index.php +++ b/index.php @@ -12,29 +12,15 @@ $isLocked = ($settings['is_locked'] ?? '0') === '1'; $bgColor = $settings['bg_color'] ?? '#ffe4e6'; $bgImage = $settings['bg_image'] ?? ''; $popupColor = $settings['popup_color'] ?? '#ffccd5'; -$fontFamily = $settings['font_family'] ?? "'Inter', sans-serif"; -$secondPageTextColor = $settings['second_page_text_color'] ?? '#e63946'; -$secondPageBoxPosY = $settings['second_page_box_pos_y'] ?? '0'; -$imageBorderRadius = $settings['image_border_radius'] ?? '12'; - -// New settings -$proposalText = $settings['proposal_text'] ?? 'Gvantsa, would you be my valentine?'; -$successText1 = $settings['success_text_1'] ?? "Congratulations, you are now Sam's Valentine! ❤️"; -$successText2 = $settings['success_text_2'] ?? "He is so incredibly lucky to have someone in his life who would click yes."; -$proposalTextColor = $settings['proposal_text_color'] ?? '#e63946'; -$proposalTextSize = $settings['proposal_text_size'] ?? '2'; -$successText1Size = $settings['success_text_1_size'] ?? '1.5'; -$successText2Size = $settings['success_text_2_size'] ?? '0.9'; - ?> - <?= htmlspecialchars($proposalText) ?> + Gvantsa, would you be my valentine? @@ -47,22 +33,13 @@ $successText2Size = $settings['success_text_2_size'] ?? '0.9'; - + @@ -86,91 +63,28 @@ $successText2Size = $settings['success_text_2_size'] ?? '0.9'; -
+
-

+

Gvantsa, would you be my valentine?

Valentine Image @@ -183,8 +97,8 @@ $successText2Size = $settings['success_text_2_size'] ?? '0.9';
-

-

+

Congratulations, you are now Sam's Valentine! ❤️

+

He is so incredibly lucky to have someone in his life who would click yes.

Redirecting you to a special surprise in 15 seconds...
@@ -195,4 +109,4 @@ $successText2Size = $settings['success_text_2_size'] ?? '0.9'; - \ No newline at end of file +