diff --git a/src/main/webapp/index.jsp b/src/main/webapp/index.jsp index 2bc134d79b..9639b505b6 100644 --- a/src/main/webapp/index.jsp +++ b/src/main/webapp/index.jsp @@ -1,1708 +1,879 @@ - - - NexusShop — Modern E‑Commerce - - - - - - + + + NexusShop · user‑friendly e‑commerce + + + + - - -
-
-
- - - - NexusShop - -
- - - -
- - -
- - -
- - 0 -
-
-
+ +
+
+
+ + + + NexusShop + +
+ + + +
+ - -
-
- -
+
+ + +
+ + 0 +
-
- - -
- - -
-
-
New Collection 2026
-

Discover Premium
Essentials

-

Curated fashion, tech & accessories with free shipping on your first order. Limited-time deals await.

-
- - -
-
-
- - -
-
-
-
-

Browse Categories

-

Find exactly what you're looking for

-
- All Categories -
-
-
-
- - -
-
-
-
-

Trending Now

-

What's hot — popular picks from our community

-
- View All -
-
-
-
- - -
-
-
-
-

⚡ Flash Deal

-

Grab it before it's gone — limited stock

-
-
-
-
- MacBook Air M2 -
-
- Limited Offer -

MacBook Air M2

-

Thin, light, and incredibly powerful — the M2 chip redefines performance.

-
- $999 $1,199 -
-

Only 12 items left — hurry!

-
-
-
0
-
Days
-
-
-
00
-
Hours
-
-
-
00
-
Mins
-
-
-
00
-
Secs
-
-
- -
-
-
-
- - -
-
-
-
-

What Our Customers Say

-

Real reviews from real people

-
-
-
-
-
- - -
-
- -
-
- -
- - -
+ + +
+ +
+
+
New Collection 2026
+

Discover Premium
Essentials

+

Curated fashion, tech & accessories with free shipping on your first order. Limited-time deals await.

+
+ + +
+
+
+ + +
+
+
+
+

Browse Categories

+

Find exactly what you're looking for

+
+ All Categories +
+
+
+
+ + +
+
+
+
+

Trending Now

+

What's hot — popular picks from our community

+
+ View All +
+
+
+
+ + +
+
+
+
+

⚡ Flash Deal

+

Grab it before it's gone — limited stock

+
+
+
+
+ MacBook Air M2 +
+
+ Limited Offer +

MacBook Air M2

+

Thin, light, and incredibly powerful — the M2 chip redefines performance.

+
+ $999 $1,199
-
- © NexusShop. All rights reserved. +

Only 12 items left — hurry!

+
+
0
Days
+
00
Hours
+
00
Mins
+
00
Secs
+ +
- - - - - + }); + } + + function renderTestimonials() { + testimonialsList.innerHTML = ''; + TESTIMONIALS.forEach(t => { + const stars = '★'.repeat(t.stars) + '☆'.repeat(5 - t.stars); + const el = document.createElement('div'); + el.className = 'testimonial-card'; + el.innerHTML = ` +
${stars}
+
“${escapeHtml(t.text)}”
+
+ ${escapeHtml(t.name)} +
${escapeHtml(t.name)}
${escapeHtml(t.role)}
+
+ `; + testimonialsList.appendChild(el); + }); + } + + // ──────────────────────────────────────────────── + // UTILITY + function escapeHtml(text) { + return String(text).replace(/[&<>"']/g, s => ({ '&':'&','<':'<','>':'>','"':'"',"'":''' }[s])); + } + function updateCartCount() { + cartCountEl.textContent = cartCount; + cartCountEl.style.transform = 'scale(1.3)'; + setTimeout(() => cartCountEl.style.transform = 'scale(1)', 200); + } + function addToCart(productId, btnEl) { + const p = PRODUCTS.find(x => x.id === productId); + if (!p) return; + cartCount++; + updateCartCount(); + if (btnEl) { + const orig = btnEl.innerHTML; + btnEl.innerHTML = ' Added'; + btnEl.classList.add('added'); + setTimeout(() => { btnEl.innerHTML = orig; btnEl.classList.remove('added'); }, 1500); + } + document.getElementById('cartBtn').style.color = 'var(--accent)'; + setTimeout(() => document.getElementById('cartBtn').style.color = '', 400); + } + function filterProducts(query) { + const q = String(query || '').trim().toLowerCase(); + if (!q) { renderProducts(PRODUCTS); return; } + const filtered = PRODUCTS.filter(p => p.title.toLowerCase().includes(q) || p.category.toLowerCase().includes(q)); + renderProducts(filtered); + } + + // ──────────────────────────────────────────────── + // DEAL TIMER + (function setupDealTimer() { + const now = new Date(); + const target = new Date(now.getTime() + (24 * 60 + 36) * 60 * 1000); + function tick() { + const diff = target - new Date(); + if (diff <= 0) { + document.getElementById('dealDays').textContent = '0'; + document.getElementById('dealHours').textContent = '00'; + document.getElementById('dealMinutes').textContent = '00'; + document.getElementById('dealSeconds').textContent = '00'; + return; + } + document.getElementById('dealDays').textContent = Math.floor(diff / (24*3600*1000)); + document.getElementById('dealHours').textContent = String(Math.floor((diff % (24*3600*1000)) / (3600*1000))).padStart(2,'0'); + document.getElementById('dealMinutes').textContent = String(Math.floor((diff % (3600*1000)) / (60*1000))).padStart(2,'0'); + document.getElementById('dealSeconds').textContent = String(Math.floor((diff % (60*1000)) / 1000)).padStart(2,'0'); + } + tick(); setInterval(tick, 1000); + })(); + + // ──────────────────────────────────────────────── + // EVENT BINDINGS + searchBtn.addEventListener('click', () => filterProducts(searchInput.value)); + searchInput.addEventListener('keydown', (e) => { if (e.key === 'Enter') filterProducts(e.target.value); }); + + mobileToggle.addEventListener('click', () => { + const isOpen = mobileMenu.style.display === 'block'; + mobileMenu.style.display = isOpen ? 'none' : 'block'; + mobileToggle.innerHTML = isOpen ? '' : ''; + }); + mobileMenu.querySelectorAll('a').forEach(link => { + link.addEventListener('click', () => { + mobileMenu.style.display = 'none'; + mobileToggle.innerHTML = ''; + }); + }); + + document.getElementById('shopNow').addEventListener('click', () => { + document.getElementById('products').scrollIntoView({ behavior: 'smooth', block: 'start' }); + }); + document.getElementById('exploreDeals').addEventListener('click', () => { + document.getElementById('deals').scrollIntoView({ behavior: 'smooth', block: 'start' }); + }); + + document.getElementById('buyDeal').addEventListener('click', function() { + cartCount++; + updateCartCount(); + const orig = this.innerHTML; + this.innerHTML = ' Added!'; + this.style.background = 'var(--success)'; + setTimeout(() => { this.innerHTML = orig; this.style.background = ''; }, 1600); + }); + + newsletterForm.addEventListener('submit', (e) => { + e.preventDefault(); + const email = newsletterEmail.value.trim(); + if (!email || !email.includes('@')) { + newsletterMsg.textContent = 'Please enter a valid email address.'; + newsletterMsg.style.color = '#ffb3b3'; + newsletterMsg.style.display = 'block'; + return; + } + newsletterMsg.textContent = '🎉 Thanks for subscribing!'; + newsletterMsg.style.color = '#a8e6cf'; + newsletterMsg.style.display = 'block'; + newsletterEmail.value = ''; + setTimeout(() => { newsletterMsg.style.display = 'none'; }, 3500); + }); + + document.getElementById('cartBtn').addEventListener('click', () => { + alert(`🛒 Your cart has ${cartCount} item${cartCount !== 1 ? 's' : ''}.`); + }); + + document.getElementById('year').textContent = new Date().getFullYear(); + + // ──────────────────────────────────────────────── + // INIT + renderCategories(); + renderProducts(PRODUCTS); + renderTestimonials(); + updateCartCount(); + + window.addEventListener('resize', () => { + if (window.innerWidth > 768) { + mobileMenu.style.display = 'none'; + mobileToggle.innerHTML = ''; + } + }); + + console.log('🚀 NexusShop — user‑friendly e‑commerce demo loaded.'); +