diff --git a/index.html b/index.html index 9ab1e31..52d6b7b 100644 --- a/index.html +++ b/index.html @@ -163,53 +163,13 @@
- - - -
- -
-
-

- Gooner Training Academy - Professional Development -

-

- Master Your Dedication - � Advanced Training System � v3.0 -

- - -
- - - - - + + @@ -237,7 +197,56 @@
+ + + + + + + +
+
+

+ Gooner Training Academy + Professional Development +

+

+ Master Your Dedication + ★ Advanced Training System ★ v0.41 +

+ +
+ + + + + +
@@ -1356,6 +1365,7 @@ if (allImages.length === 0) { // No images available - show placeholder or fall back to hentai theme console.log('No library images found, falling back to hentai theme'); + localStorage.removeItem('userLibraryImages'); characterSides.forEach((element, index) => { element.style.display = 'block'; // Fallback to hentai theme @@ -1369,6 +1379,9 @@ return; } + // Save library images to localStorage for other pages to use + localStorage.setItem('userLibraryImages', JSON.stringify(allImages)); + // Dynamic layout variables const FIXED_WIDTH = 150; // Fixed width for all images const MIN_HEIGHT = 100; // Minimum height @@ -2034,11 +2047,50 @@ console.error('? Options menu initialization failed - missing elements'); } } + + // Load profile data into header + function loadHeaderProfile() { + // Get username from userProfile object + let username = 'Player'; + const userProfile = localStorage.getItem('userProfile'); + if (userProfile) { + try { + const profile = JSON.parse(userProfile); + username = profile.username || 'Player'; + } catch (e) { + console.error('Error parsing user profile:', e); + } + } + + const profilePicture = localStorage.getItem('profilePicture'); + + const usernameElement = document.getElementById('header-username'); + const avatarContainer = document.getElementById('header-profile-avatar'); + + if (usernameElement) { + usernameElement.textContent = username; + } + + if (avatarContainer && profilePicture) { + avatarContainer.innerHTML = `Profile`; + } + + // Make profile display clickable to open profile page + const profileDisplay = document.querySelector('.user-profile-display'); + if (profileDisplay) { + profileDisplay.addEventListener('click', () => { + window.location.href = 'user-profile.html'; + }); + } + } // Initialize application when page loads window.addEventListener('DOMContentLoaded', () => { console.log(' DOM Content Loaded - Initializing UI components...'); + // Load profile data + loadHeaderProfile(); + // Initialize options menu early initializeOptionsMenu(); @@ -3412,12 +3464,12 @@ const pauseBtn = document.getElementById('billboard-pause'); if (muteBtn) { - muteBtn.textContent = this.isMuted ? '🔇' : '🔊'; + muteBtn.textContent = this.isMuted ? '' : ''; muteBtn.title = this.isMuted ? 'Unmute' : 'Mute'; } if (pauseBtn) { - pauseBtn.textContent = this.isPlaying ? '⏸️' : '▶️'; + pauseBtn.textContent = this.isPlaying ? '' : ''; pauseBtn.title = this.isPlaying ? 'Pause' : 'Play'; } }, @@ -7122,3 +7174,4 @@ + diff --git a/player-stats.html b/player-stats.html index 7509a59..6d333b8 100644 --- a/player-stats.html +++ b/player-stats.html @@ -88,6 +88,20 @@ + +
+
+
+
+
+
+
+
+
+
+
+
+
@@ -229,6 +243,46 @@ alert('Statistics exported successfully!'); } + + // Apply sidebar theme on page load + window.addEventListener('DOMContentLoaded', async function() { + const savedTheme = localStorage.getItem('selectedTheme') || 'hentai'; + const characterSides = document.querySelectorAll('.character-side'); + + console.log('Applying sidebar theme:', savedTheme); + + if (savedTheme === 'none') { + characterSides.forEach(element => { + element.style.display = 'none'; + }); + return; + } + + // Show all sides + characterSides.forEach(element => { + element.style.display = 'block'; + }); + + if (savedTheme === 'library') { + // Use user library images if available + const libraryImages = JSON.parse(localStorage.getItem('userLibraryImages') || '[]'); + if (libraryImages.length > 0) { + characterSides.forEach((element, index) => { + const randomImage = libraryImages[Math.floor(Math.random() * libraryImages.length)]; + const imagePath = randomImage.path || randomImage; + element.style.backgroundImage = `url('file:///${imagePath.replace(/\\/g, '/')}')`; + }); + } + return; + } + + // For asset themes (hentai, pornstars, BBC, feet) + const themePath = `assets/${savedTheme}`; + characterSides.forEach((element, index) => { + const imageNum = [1,11,3,4,5,6,7,8,9,10,12,13][index] || 1; + element.style.backgroundImage = `url('${themePath}/${imageNum}.png')`; + }); + }); \ No newline at end of file diff --git a/src/styles/styles.css b/src/styles/styles.css index 53fbc06..edc2df3 100644 --- a/src/styles/styles.css +++ b/src/styles/styles.css @@ -175,6 +175,54 @@ body { display: flex; gap: 10px; z-index: 100; + align-items: flex-start; +} + +.user-profile-display { + display: flex; + align-items: center; + gap: 10px; + padding: 8px 12px; + cursor: pointer; + transition: all 0.3s ease; +} + +.user-profile-display:hover { + opacity: 0.8; +} + +.profile-avatar-small { + width: 40px; + height: 40px; + border-radius: 50%; + overflow: hidden; + background: linear-gradient(135deg, rgba(138, 43, 226, 0.3), rgba(218, 112, 214, 0.3)); + display: flex; + align-items: center; + justify-content: center; + flex-shrink: 0; +} + +.profile-avatar-small img { + width: 100%; + height: 100%; + object-fit: cover; +} + +.avatar-placeholder { + font-size: 1.5rem; +} + +.profile-info { + display: flex; + flex-direction: column; +} + +.profile-username { + color: var(--text-primary); + font-weight: 600; + font-size: 0.95em; + line-height: 1.2; } .utility-btn { @@ -191,6 +239,7 @@ body { cursor: pointer; transition: all 0.3s ease; backdrop-filter: blur(10px); + flex-shrink: 0; } .utility-btn:hover { @@ -7057,8 +7106,8 @@ button#start-mirror-btn:disabled { /* ===== CYBERPUNK VIDEO BILLBOARD ===== */ .video-billboard-container { position: absolute; - top: 15%; - right: 50px; + top: 22.5%; + right: 20px; width: 500px; height: 320px; z-index: 10; diff --git a/user-profile.html b/user-profile.html index cb2bea3..842de2b 100644 --- a/user-profile.html +++ b/user-profile.html @@ -15,21 +15,30 @@ body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; - background: var(--color-background); - color: var(--color-text); + background: linear-gradient(135deg, #1a0033 0%, #0a0015 50%, #1a0033 100%); + color: #e0e0e0; line-height: 1.6; padding: 20px; min-height: 100vh; + display: flex; + align-items: center; + justify-content: center; + } + + .main-content-wrapper { + width: calc(100vw - 350px); + max-width: calc(100vw - 350px); + margin: 10px auto; } .header { position: relative; text-align: center; - margin-bottom: 40px; - padding: 30px 20px; - background: var(--color-gradient); + margin-bottom: 20px; + padding: 20px; + background: linear-gradient(180deg, rgba(138, 43, 226, 0.2) 0%, transparent 100%); border-radius: 20px; - box-shadow: 0 10px 30px var(--color-secondary-transparent); + box-shadow: 0 10px 30px rgba(138, 43, 226, 0.3); } .header h1 { @@ -44,25 +53,25 @@ } .profile-container { - max-width: 1400px; + max-width: 100%; margin: 0 auto; display: grid; grid-template-columns: 1fr 2fr; - gap: 30px; - margin-bottom: 30px; + gap: 20px; + margin-bottom: 20px; } .profile-info { - background: var(--color-surface); + background: rgba(26, 26, 26, 0.8); border-radius: 15px; padding: 30px; - border: 1px solid var(--color-border); + border: 1px solid rgba(138, 43, 226, 0.3); height: fit-content; } .profile-avatar { - width: 120px; - height: 120px; + width: 150px; + height: 150px; background: var(--gradient); border-radius: 50%; margin: 0 auto 20px; @@ -73,12 +82,58 @@ font-weight: bold; cursor: pointer; transition: transform 0.3s ease; + overflow: hidden; + position: relative; + border: 3px solid var(--color-primary); + } + + .profile-avatar img { + width: 100%; + height: 100%; + object-fit: cover; } .profile-avatar:hover { transform: scale(1.05); } + .profile-avatar:hover::after { + content: '📷 Change Photo'; + position: absolute; + inset: 0; + background: rgba(0, 0, 0, 0.7); + display: flex; + align-items: center; + justify-content: center; + font-size: 0.9rem; + color: white; + } + + .character-side { + position: fixed; + z-index: 3; + pointer-events: none; + background-size: contain; + background-repeat: no-repeat; + background-position: center; + } + + .character-side.left { + left: 0; + top: 50%; + transform: translateY(-50%); + width: 150px; + height: 300px; + } + + .character-side.right { + right: 0; + top: 50%; + transform: translateY(-50%); + width: 150px; + height: 300px; + } + .profile-details h2 { font-size: 1.8rem; margin-bottom: 15px; @@ -418,17 +473,35 @@ -
-
-

👤 User Profile

-

Customize your gaming experience and track your progress

-
+ +
+
+
+
+
+
+
+
+
+
+
+
-
+
+
+
+

👤 User Profile

+

Customize your gaming experience and track your progress

+
+ +
U +
+ +

Profile Information

@@ -1100,7 +1173,104 @@ } window.userProfile = new UserProfile(); + + // Profile Picture Upload Handler + document.getElementById('avatar-upload').addEventListener('change', function(e) { + const file = e.target.files[0]; + if (file && file.type.startsWith('image/')) { + const reader = new FileReader(); + reader.onload = function(event) { + const avatarImage = document.getElementById('avatar-image'); + const avatarText = document.getElementById('avatar-text'); + + avatarImage.src = event.target.result; + avatarImage.style.display = 'block'; + avatarText.style.display = 'none'; + + // Save to localStorage + localStorage.setItem('profilePicture', event.target.result); + + if (window.userProfile) { + window.userProfile.showNotification('Profile picture updated!', 'success'); + } + }; + reader.readAsDataURL(file); + } + }); + + // Load saved profile picture + const savedPicture = localStorage.getItem('profilePicture'); + if (savedPicture) { + const avatarImage = document.getElementById('avatar-image'); + const avatarText = document.getElementById('avatar-text'); + + avatarImage.src = savedPicture; + avatarImage.style.display = 'block'; + avatarText.style.display = 'none'; + } + + // Profile avatar click handler + document.getElementById('profile-avatar').addEventListener('click', function() { + document.getElementById('avatar-upload').click(); + }); + + // Apply sidebar image theme from home page settings + applySidebarTheme(); }); + + // Function to apply sidebar image theme + async function applySidebarTheme() { + const savedTheme = localStorage.getItem('selectedTheme') || 'hentai'; + const characterSides = document.querySelectorAll('.character-side'); + + console.log('Applying sidebar theme:', savedTheme); + + if (savedTheme === 'none') { + characterSides.forEach(element => { + element.style.display = 'none'; + }); + return; + } + + // Show all sides + characterSides.forEach(element => { + element.style.display = 'block'; + }); + + // Update image sources based on theme + const availableImages = []; + + if (savedTheme === 'library') { + // Use user library images if available + const libraryImages = JSON.parse(localStorage.getItem('userLibraryImages') || '[]'); + console.log('Library images from localStorage:', libraryImages.length, 'images found'); + if (libraryImages.length > 0) { + characterSides.forEach((element, index) => { + const randomImage = libraryImages[Math.floor(Math.random() * libraryImages.length)]; + const imagePath = randomImage.path || randomImage; + console.log(`Setting sidebar ${index} to:`, imagePath); + element.style.backgroundImage = `url('file:///${imagePath.replace(/\\/g, '/')}')`; + }); + return; + } else { + // No library images available, hide sidebar + console.log('No library images in localStorage, hiding sidebar'); + characterSides.forEach(element => { + element.style.display = 'none'; + }); + return; + } + } + + // For asset themes (hentai, pornstars, BBC, feet) + const themePath = `assets/${savedTheme}`; + characterSides.forEach((element, index) => { + // Keep the existing image numbering but update the folder + const imageNum = index < 10 ? [1,11,3,4,5,6,7,8,9,10,12,13][index] : 1; + element.style.backgroundImage = `url('${themePath}/${imageNum}.png')`; + }); + } +
\ No newline at end of file