Qlaxcreatives/1688-proxy-paladin
0
1 2// Shared functionality across pages3document.addEventListener('DOMContentLoaded', function() {4 // Smooth scrolling for anchor links5 document.querySelectorAll('a[href^="#"]').forEach(anchor => {6 anchor.addEventListener('click', function (e) {7 e.preventDefault();8 document.querySelector(this.getAttribute('href')).scrollIntoView({9 behavior: 'smooth'10 });11 });12 });13 14 // API demo interaction15 if (window.location.pathname === '/' || window.location.pathname === '/index.html') {16 setupAPIDemo();17 }18 19 // Dashboard functionality20 if (window.location.pathname === '/dashboard.html') {21 setupDashboard();22 }23});24 25// Free API demo26async function setupAPIDemo() {27 const demoForm = document.getElementById('demo-form');28 const demoResults = document.getElementById('demo-results');29 30 if (demoForm) {31 demoForm.addEventListener('submit', async (e) => {32 e.preventDefault();33 const keyword = document.getElementById('demo-keyword').value;34 35 try {36 const response = await fetch(`/api/search?keyword=${encodeURIComponent(keyword)}`);37 const data = await response.json();38 39 demoResults.innerHTML = `40 <pre class="bg-gray-100 p-4 rounded-lg overflow-x-auto text-sm"><code>${JSON.stringify(data, null, 2)}</code></pre>41 <div class="mt-4 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4">42 ${data.products.map(product => `43 <div class="bg-white p-4 rounded-lg shadow">44 <img src="${product.image}" alt="${product.title}" class="w-full h-48 object-contain mb-2">45 <h3 class="font-medium">${product.title}</h3>46 <p class="text-gray-600">CNY ${product.price_cny.toFixed(2)}</p>47 <p class="text-orange-600 font-bold">NGN ${product.price_ngn}</p>48 <a href="${product.link}" target="_blank" class="text-sm text-blue-500 hover:underline">View on 1688</a>49 </div>50 `).join('')}51 </div>52 `;53 } catch (error) {54 demoResults.innerHTML = '<p class="text-red-500">Failed to fetch products. Please try again.</p>';55 }56 });57 }58}59 60// Dashboard functionality61function setupDashboard() {62 // Generate a demo API key for users63 const apiKeyDisplay = document.getElementById('api-key-display');64 if (apiKeyDisplay) {65 apiKeyDisplay.textContent = 'demo_' + Math.random().toString(36).substring(2, 15);66 }67 68 // Copy API key button69 const copyBtn = document.querySelector('.copy-api-key');70 if (copyBtn) {71 copyBtn.addEventListener('click', () => {72 navigator.clipboard.writeText(apiKeyDisplay.textContent);73 copyBtn.innerHTML = '<i data-feather="check" class="w-4 h-4"></i>';74 setTimeout(() => {75 copyBtn.innerHTML = '<i data-feather="copy" class="w-4 h-4"></i>';76 feather.replace();77 }, 2000);78 });79 }80 81 // Example API request82 const demoRequest = document.getElementById('demo-request');83 if (demoRequest) {84 demoRequest.addEventListener('click', async () => {85 const responseEl = document.getElementById('demo-response');86 try {87 const response = await fetch('/api/search?keyword=shoes');88 const data = await response.json();89 responseEl.innerHTML = `<pre>${JSON.stringify(data, null, 2)}</pre>`;90 } catch (error) {91 responseEl.innerHTML = '<p class="text-red-500">Failed to fetch demo data</p>';92 }93 });94 }95}96 