🚀 Welcome to Aapnu Area Hub! Buy, Sell, Rent, Find Services & Matchmaking in Your Neighborhood. Post Free Ad Now

Aapnu Area Hub

Rajkot & Surrounding Areas

Your Trusted Neighborhood Marketplace

Buy, Sell, Rent & Connect in Your Area

Discover verified local deals, properties, wedding profiles, services, and community listings instantly.

Active Neighborhood Listings

2. app.js (JavaScript Logic, Slider & Approval Workflow) JavaScript // Initial Mock Data & State let categories = ["Real Estate", "Buy & Sell", "Shaadi & Events", "Services", "Vehicles"]; let listings = [ { id: 1, title: "Luxurious 3 BHK Apartment for Rent", category: "Real Estate", price: "₹22,000 / month", location: "Kalawad Road, Rajkot", phone: "+91 98765 11223", image: "https://images.unsplash.com/photo-1545324418-cc1a3fa10c00?auto=format&fit=crop&w=800&q=80", description: "Semi-furnished 3 BHK apartment with modular kitchen, 24/7 water supply, security, and reserved parking.", status: "approved" }, { id: 2, title: "Apple MacBook Pro M2 (Like New)", category: "Buy & Sell", price: "₹85,000", location: "University Road, Rajkot", phone: "+91 91234 56789", image: "https://images.unsplash.com/photo-1517336714731-489689fd1ca8?auto=format&fit=crop&w=800&q=80", description: "Barely 4 months used MacBook Pro M2, 16GB RAM, 512GB SSD with bill, box, and original charger.", status: "approved" }, { id: 3, title: "Professional Wedding Photography & Cinematic Video", category: "Shaadi & Events", price: "₹45,000 onwards", location: "Yagnik Road, Rajkot", phone: "+91 98250 99887", image: "https://images.unsplash.com/photo-1537633552985-df8429e8048b?auto=format&fit=crop&w=800&q=80", description: "Capture your special moments with our expert team. Candid photography, drone shots, and cinematic highlight reels.", status: "approved" }, { id: 4, title: "Honda Activa 6G Scooter (2023 Model)", category: "Vehicles", price: "₹68,000", location: "Nana Mava, Rajkot", phone: "+91 94260 11223", image: "https://images.unsplash.com/photo-1558981806-ec527fa84c39?auto=format&fit=crop&w=800&q=80", description: "Single owner, driven only 12,000 km, excellent mileage, insurance valid till late 2027.", status: "approved" } ]; let pendingListings = [ { id: 101, title: "Matrimonial Profile: Engineer Boy (Agarwal)", category: "Shaadi & Events", price: "Biodata Match", location: "Race Course, Rajkot", phone: "+91 99001 12233", image: "https://images.unsplash.com/photo-1506794778202-cad84cf45f1d?auto=format&fit=crop&w=800&q=80", description: "Seeking suitable match for software engineer working in MNC. Vegetarian family based in Rajkot.", status: "pending" } ]; let currentFilter = "All"; // Hero Background Image Slider Logic let currentSlide = 0; const slides = document.querySelectorAll('.hero-slide'); function nextSlide() { if(slides.length === 0) return; slides[currentSlide].classList.remove('active'); currentSlide = (currentSlide + 1) % slides.length; slides[currentSlide].classList.add('active'); } setInterval(nextSlide, 4500); // Initialize App document.addEventListener("DOMContentLoaded", () => { renderListings(); updateDashboardStats(); updateCategoryDropdowns(); }); // Render Listings Grid function renderListings() { const grid = document.getElementById("listingsGrid"); grid.innerHTML = ""; const searchQuery = document.getElementById("searchInput").value.toLowerCase(); const dropdownCategory = document.getElementById("categorySelect").value; let filtered = listings.filter(item => { let matchesCat = (currentFilter === "All" || item.category === currentFilter) && (dropdownCategory === "All" || item.category === dropdownCategory); let matchesSearch = item.title.toLowerCase().includes(searchQuery) || item.location.toLowerCase().includes(searchQuery) || item.description.toLowerCase().includes(searchQuery); return matchesCat && matchesSearch; }); if (filtered.length === 0) { grid.innerHTML = `

No listings found

Try searching with another keyword or category.

`; return; } filtered.forEach(item => { grid.innerHTML += `
${item.title} ${item.category} ${item.price}

${item.title}

${item.location}

${item.description}

${item.phone} Call
`; }); } // Category Filter Tabs function filterCategory(cat) { currentFilter = cat; document.getElementById("categorySelect").value = cat; // Highlight pills document.querySelectorAll(".category-pill").forEach(pill => { if(pill.innerText === cat || (cat === 'All' && pill.innerText === 'All')) { pill.className = "category-pill bg-orange-600 text-white px-4 py-2 rounded-xl text-xs font-bold shadow-sm transition"; } else { pill.className = "category-pill bg-white text-slate-600 border border-slate-200 px-4 py-2 rounded-xl text-xs font-bold hover:bg-slate-100 transition"; } }); renderListings(); } function filterListings() { renderListings(); } // Modal Handlers function openPostModal() { document.getElementById("postModal").classList.remove("hidden"); } function closePostModal() { document.getElementById("postModal").classList.add("hidden"); } function openAdminModal() { document.getElementById("adminModal").classList.remove("hidden"); renderAdminDashboard(); } function closeAdminModal() { document.getElementById("adminModal").classList.add("hidden"); } // Submit Ad Functionality function submitAd(e) { e.preventDefault(); const newAd = { id: Date.now(), title: document.getElementById("adTitle").value, category: document.getElementById("adCategory").value, price: document.getElementById("adPrice").value, location: document.getElementById("adLocation").value, phone: document.getElementById("adPhone").value, image: document.getElementById("adImage").value || "https://images.unsplash.com/photo-1560518883-ce09059eeffa?auto=format&fit=crop&w=800&q=80", description: document.getElementById("adDesc").value, status: "pending" }; pendingListings.push(newAd); document.getElementById("adForm").reset(); closePostModal(); updateDashboardStats(); alert("Success! Your ad has been submitted for admin approval and will appear live once reviewed."); } // Admin Dashboard Render & Actions function switchAdminTab(tab) { const pendingSec = document.getElementById("adminPendingSection"); const manageSec = document.getElementById("adminManageSection"); const catSec = document.getElementById("adminCatSection"); const btnP = document.getElementById("tabPendingBtn"); const btnM = document.getElementById("tabManageBtn"); const btnC = document.getElementById("tabCatBtn"); pendingSec.classList.add("hidden"); manageSec.classList.add("hidden"); catSec.classList.add("hidden"); btnP.className = "bg-slate-100 text-slate-600 px-4 py-2 rounded-xl text-xs font-bold hover:bg-slate-200 transition"; btnM.className = "bg-slate-100 text-slate-600 px-4 py-2 rounded-xl text-xs font-bold hover:bg-slate-200 transition"; btnC.className = "bg-slate-100 text-slate-600 px-4 py-2 rounded-xl text-xs font-bold hover:bg-slate-200 transition"; if(tab === 'pending') { pendingSec.classList.remove("hidden"); btnP.className = "bg-orange-600 text-white px-4 py-2 rounded-xl text-xs font-bold transition"; } else if(tab === 'manage') { manageSec.classList.remove("hidden"); btnM.className = "bg-orange-600 text-white px-4 py-2 rounded-xl text-xs font-bold transition"; } else if(tab === 'categories') { catSec.classList.remove("hidden"); btnC.className = "bg-orange-600 text-white px-4 py-2 rounded-xl text-xs font-bold transition"; renderCategoriesList(); } } function renderAdminDashboard() { updateDashboardStats(); // Render Pending Queue const pendingContainer = document.getElementById("adminPendingSection"); pendingContainer.innerHTML = ""; if(pendingListings.length === 0) { pendingContainer.innerHTML = `

No pending member ads for review.

`; } else { pendingListings.forEach(item => { pendingContainer.innerHTML += `
${item.category}

${item.title}

${item.location} • ${item.price}

`; }); } // Render Manage Live Ads const manageContainer = document.getElementById("adminManageSection"); manageContainer.innerHTML = ""; listings.forEach(item => { manageContainer.innerHTML += `

${item.title}

${item.category} • ${item.price}

`; }); } function approveAd(id) { const index = pendingListings.findIndex(i => i.id === id); if(index !== -1) { const approved = pendingListings.splice(index, 1)[0]; approved.status = "approved"; listings.unshift(approved); renderListings(); renderAdminDashboard(); alert("Ad approved and published live!"); } } function rejectAd(id) { pendingListings = pendingListings.filter(i => i.id !== id); renderAdminDashboard(); alert("Ad rejected."); } function deleteListing(id) { listings = listings.filter(i => i.id !== id); renderListings(); renderAdminDashboard(); } function updateDashboardStats() { document.getElementById("statApproved").innerText = listings.length; document.getElementById("statPending").innerText = pendingListings.length; document.getElementById("pendingBadge").innerText = pendingListings.length; document.getElementById("pendingCountTab").innerText = pendingListings.length; } // Category Manager function renderCategoriesList() { const container = document.getElementById("categoriesList"); container.innerHTML = ""; categories.forEach(cat => { container.innerHTML += `
${cat}
`; }); } function addNewCategory() { const input = document.getElementById("newCategoryInput"); const val = input.value.trim(); if(val && !categories.includes(val)) { categories.push(val); input.value = ""; renderCategoriesList(); updateCategoryDropdowns(); } } function removeCategory(cat) { categories = categories.filter(c => c !== cat); renderCategoriesList(); updateCategoryDropdowns(); } function updateCategoryDropdowns() { const select = document.getElementById("categorySelect"); const adSelect = document.getElementById("adCategory"); let currentSel = select.value; let currentAdSel = adSelect.value; select.innerHTML = ``; adSelect.innerHTML = ""; categories.forEach(cat => { select.innerHTML += ``; adSelect.innerHTML += ``; }); select.value = categories.includes(currentSel) ? currentSel : "All"; adSelect.value = categories.includes(currentAdSel) ? currentAdSel : categories[0]; }