<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Kırmızı Site - Alışverişin En Kolay Yolu</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.0/font/bootstrap-icons.css">
<style>
:root {
--primary-color: #ffd700;
--secondary-color: #ff8c00;
--dark-color: #333;
--light-bg: #f8f9fa;
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background-color: var(--light-bg);
}
.navbar {
background-color: var(--dark-color) !important;
box-shadow: 0 2px 4px rgba(0,0,0,.1);
}
.navbar-brand {
font-weight: bold;
font-size: 1.5rem;
color: var(--primary-color) !important;
}
.category-card {
border: none;
border-radius: 10px;
overflow: hidden;
transition: transform 0.3s, box-shadow 0.3s;
cursor: pointer;
height: 100%;
background-color: white;
box-shadow: 0 2px 5px rgba(0,0,0,.1);
}
.category-card:hover {
transform: translateY(-5px);
box-shadow: 0 5px 15px rgba(0,0,0,.1);
}
.category-icon {
font-size: 2.5rem;
color: var(--secondary-color);
margin-bottom: 1rem;
}
.listing-card {
border: none;
border-radius: 10px;
overflow: hidden;
transition: all 0.3s;
cursor: pointer;
height: 100%;
background-color: white;
box-shadow: 0 2px 5px rgba(0,0,0,.1);
}
.listing-card:hover {
transform: translateY(-5px);
box-shadow: 0 5px 15px rgba(0,0,0,.1);
}
.listing-image {
height: 200px;
object-fit: cover;
width: 100%;
}
.listing-info {
padding: 1rem;
}
.listing-title {
font-size: 1.1rem;
font-weight: 600;
color: var(--dark-color);
margin-bottom: 0.5rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.listing-price {
font-size: 1.2rem;
font-weight: bold;
color: var(--secondary-color);
}
.listing-location {
color: #6c757d;
font-size: 0.9rem;
}
.listing-date {
color: #6c757d;
font-size: 0.8rem;
}
.filter-section {
background-color: white;
border-radius: 10px;
padding: 1.5rem;
margin-bottom: 2rem;
box-shadow: 0 2px 5px rgba(0,0,0,.1);
}
.detail-image {
width: 100%;
height: 400px;
object-fit: cover;
border-radius: 10px;
}
.detail-title {
font-size: 1.8rem;
font-weight: bold;
color: var(--dark-color);
margin-bottom: 1rem;
}
.detail-price {
font-size: 2rem;
font-weight: bold;
color: var(--secondary-color);
margin-bottom: 1rem;
}
.detail-info {
background-color: white;
border-radius: 10px;
padding: 1.5rem;
margin-bottom: 1.5rem;
box-shadow: 0 2px 5px rgba(0,0,0,.1);
}
.contact-button {
background-color: var(--primary-color);
border: none;
color: var(--dark-color);
font-weight: bold;
padding: 0.75rem 1.5rem;
border-radius: 5px;
transition: all 0.3s;
}
.contact-button:hover {
background-color: var(--secondary-color);
color: white;
transform: scale(1.05);
}
.add-listing-form {
background-color: white;
border-radius: 10px;
padding: 2rem;
box-shadow: 0 2px 5px rgba(0,0,0,.1);
}
.form-label {
font-weight: 600;
color: var(--dark-color);
}
.form-control, .form-select {
border-radius: 5px;
border: 1px solid #ced4da;
}
.form-control:focus, .form-select:focus {
border-color: var(--secondary-color);
box-shadow: 0 0 0 0.25rem rgba(255, 140, 0, 0.25);
}
.submit-button {
background-color: var(--primary-color);
border: none;
color: var(--dark-color);
font-weight: bold;
padding: 0.75rem 2rem;
border-radius: 5px;
transition: all 0.3s;
}
.submit-button:hover {
background-color: var(--secondary-color);
color: white;
}
.search-bar {
position: relative;
}
.search-bar input {
padding-left: 2.5rem;
}
.search-bar i {
position: absolute;
left: 0.75rem;
top: 50%;
transform: translateY(-50%);
color: #6c757d;
}
.pagination {
margin-top: 2rem;
}
.page-link {
color: var(--dark-color);
}
.page-item.active .page-link {
background-color: var(--primary-color);
border-color: var(--primary-color);
color: var(--dark-color);
}
.featured-badge {
position: absolute;
top: 10px;
right: 10px;
background-color: var(--primary-color);
color: var(--dark-color);
font-weight: bold;
padding: 0.25rem 0.5rem;
border-radius: 5px;
font-size: 0.8rem;
}
</style>
</head>
<body>
<!-- Navbar -->
<nav class="navbar navbar-expand-lg navbar-dark">
<div class="container">
<a class="navbar-brand" href="#" onclick="showHome()">
<i class="bi bi-shop"></i> Turuncu Site
</a>
<div class="ms-auto">
<button class="btn btn-outline-light me-2" onclick="showAddListing()">
<i class="bi bi-plus-circle"></i> İlan Ver
</button>
<button class="btn btn-outline-light">
<i class="bi bi-person-circle"></i> Giriş Yap
</button>
</div>
</div>
</nav>
<!-- Main Content -->
<div class="container mt-4">
<!-- Home Page -->
<div id="homePage">
<div class="text-center mb-5">
<h1 class="display-4 fw-bold">Alışverişin En Kolay Yolu</h1>
<p class="lead">Milyonlarca ilan arasından dilediğini seç, sat veya kirala!</p>
</div>
<!-- Search Bar -->
<div class="row mb-5">
<div class="col-md-8 mx-auto">
<div class="search-bar">
<i class="bi bi-search"></i>
<input type="text" class="form-control form-control-lg" id="searchInput" placeholder="Kelime, ilan no veya mağaza adı ile ara">
</div>
</div>
</div>
<!-- Categories -->
<h2 class="mb-4">Kategoriler</h2>
<div class="row mb-5" id="categoriesContainer">
<!-- Kategoriler buraya yüklenecek -->
</div>
<!-- Featured Listings -->
<h2 class="mb-4">Öne Çıkan İlanlar</h2>
<div class="row mb-4" id="featuredListings">
<!-- Öne çıkan ilanlar buraya yüklenecek -->
</div>
<!-- Recent Listings -->
<h2 class="mb-4">En Yeni İlanlar</h2>
<div class="row mb-4" id="recentListings">
<!-- En yeni ilanlar buraya yüklenecek -->
</div>
</div>
<!-- Listings Page -->
<div id="listingsPage" class="d-none">
<div class="d-flex justify-content-between align-items-center mb-4">
<h2 id="listingsTitle">Tüm İlanlar</h2>
<button class="btn btn-outline-secondary" onclick="showHome()">
<i class="bi bi-arrow-left"></i> Ana Sayfaya Dön
</button>
</div>
<!-- Filters -->
<div class="filter-section">
<div class="row">
<div class="col-md-3 mb-3">
<label class="form-label">Kategori</label>
<select class="form-select" id="categoryFilter">
<option value="">Tüm Kategoriler</option>
</select>
</div>
<div class="col-md-3 mb-3">
<label class="form-label">Şehir</label>
<select class="form-select" id="cityFilter">
<option value="">Tüm Şehirler</option>
<option value="İstanbul">İstanbul</option>
<option value="Ankara">Ankara</option>
<option value="İzmir">İzmir</option>
<option value="Bursa">Bursa</option>
<option value="Antalya">Antalya</option>
</select>
</div>
<div class="col-md-3 mb-3">
<label class="form-label">Min Fiyat</label>
<input type="number" class="form-control" id="minPriceFilter" placeholder="Min TL">
</div>
<div class="col-md-3 mb-3">
<label class="form-label">Max Fiyat</label>
<input type="number" class="form-control" id="maxPriceFilter" placeholder="Max TL">
</div>
</div>
<div class="row">
<div class="col-md-12 text-end">
<button class="btn btn-primary" onclick="applyFilters()">
<i class="bi bi-funnel"></i> Filtrele
</button>
<button class="btn btn-outline-secondary ms-2" onclick="resetFilters()">
<i class="bi bi-arrow-clockwise"></i> Sıfırla
</button>
</div>
</div>
</div>
<!-- Listings -->
<div class="row mb-4" id="listingsContainer">
<!-- İlanlar buraya yüklenecek -->
</div>
<!-- Pagination -->
<nav aria-label="Page navigation">
<ul class="pagination justify-content-center" id="pagination">
<!-- Sayfalama buraya yüklenecek -->
</ul>
</nav>
</div>
<!-- Listing Detail Page -->
<div id="listingDetailPage" class="d-none">
<div class="d-flex justify-content-between align-items-center mb-4">
<button class="btn btn-outline-secondary" onclick="showListings()">
<i class="bi bi-arrow-left"></i> İlanlara Dön
</button>
</div>
<div class="row">
<div class="col-md-8">
<div class="detail-info">
<img id="detailImage" src="" alt="" class="detail-image mb-4">
<h1 id="detailTitle" class="detail-title"></h1>
<p id="detailDescription" class="mb-4"></p>
<h4>İlan Bilgileri</h4>
<table class="table table-striped">
<tr>
<th>Kategori</th>
<td id="detailCategory"></td>
</tr>
<tr>
<th>İlan Tarihi</th>
<td id="detailDate"></td>
</tr>
<tr>
<th>İlan No</th>
<td id="detailId"></td>
</tr>
</table>
</div>
</div>
<div class="col-md-4">
<div class="detail-info">
<h2 id="detailPrice" class="detail-price"></h2>
<div class="mb-3">
<h5>İlan Yeri</h5>
<p id="detailLocation"></p>
</div>
<div class="mb-3">
<h5>Satıcı Bilgileri</h5>
<p id="detailSeller"></p>
</div>
<button class="btn contact-button w-100 mb-2">
<i class="bi bi-telephone"></i> Telefonu Göster
</button>
<button class="btn btn-outline-primary w-100">
<i class="bi bi-envelope"></i> Mesaj Gönder
</button>
</div>
</div>
</div>
</div>
<!-- Add Listing Page -->
<div id="addListingPage" class="d-none">
<div class="d-flex justify-content-between align-items-center mb-4">
<h2>Yeni İlan Ekle</h2>
<button class="btn btn-outline-secondary" onclick="showHome()">
<i class="bi bi-x-circle"></i> İptal
</button>
</div>
<div class="add-listing-form">
<form id="addListingForm">
<div class="row mb-3">
<div class="col-md-6">
<label class="form-label">İlan Başlığı</label>
<input type="text" class="form-control" id="listingTitleInput" required>
</div>
<div class="col-md-6">
<label class="form-label">Kategori</label>
<select class="form-select" id="listingCategoryInput" required>
<option value="">Kategori Seçin</option>
</select>
</div>
</div>
<div class="row mb-3">
<div class="col-md-6">
<label class="form-label">Fiyat (TL)</label>
<input type="number" class="form-control" id="listingPriceInput" required>
</div>
<div class="col-md-6">
<label class="form-label">Şehir</label>
<select class="form-select" id="listingCityInput" required>
<option value="">Şehir Seçin</option>
<option value="İstanbul">İstanbul</option>
<option value="Ankara">Ankara</option>
<option value="İzmir">İzmir</option>
<option value="Bursa">Bursa</option>
<option value="Antalya">Antalya</option>
</select>
</div>
</div>
<div class="mb-3">
<label class="form-label">Açıklama</label>
<textarea class="form-control" id="listingDescriptionInput" rows="4" required></textarea>
</div>
<div class="mb-3">
<label class="form-label">İlan Resmi URL</label>
<input type="text" class="form-control" id="listingImageInput" placeholder="https://example.com/image.jpg">
</div>
<div class="mb-3">
<label class="form-label">İletişim Bilgileri</label>
<input type="text" class="form-control" id="listingSellerInput" placeholder="Adınız ve iletişim bilgileriniz" required>
</div>
<div class="text-center">
<button type="submit" class="submit-button">
<i class="bi bi-check-circle"></i> İlanı Yayınla
</button>
</div>
</form>
</div>
</div>
</div>
<script>
// Kategoriler
const categories = [
{ id: 1, name: "Emlak", icon: "bi-house" },
{ id: 2, name: "Vasıta", icon: "bi-car-front" },
{ id: 3, name: "Elektronik", icon: "bi-phone" },
{ id: 4, name: "Moda", icon: "bi-bag" },
{ id: 5, name: "Yedek Parça", icon: "bi-tools" },
{ id: 6, name: "İş Makinaları", icon: "bi-gear" },
{ id: 7, name: "Hizmet", icon: "bi-person-workspace" },
{ id: 8, name: "Yanıtlayarak Kazan", icon: "bi-question-circle" }
];
// İlanlar
let listings = [
{
id: 1001,
title: "İstanbul Kadıköy'de Satılık Daire",
description: "Kadıköy merkezde, deniz manzaralı, 2+1 daire. Metrobüse ve M4 hattına yürüme mesafesinde. Asansörlü, otoparklı, güvenlikli site.",
price: 2500000,
category: "Emlak",
city: "İstanbul",
location: "Kadıköy, İstanbul",
image: "https://picsum.photos/seed/house1/800/600",
date: "2023-10-15",
seller: "Ahmet Yılmaz",
featured: true
},
{
id: 1002,
title: "2018 Model Volkswagen Passat",
description: "2018 model, 1.6 TDI BlueMotion, 65.000 km'de. Full bakımlı, orijinal, sigortalı. Takaslı.",
price: 750000,
category: "Vasıta",
city: "Ankara",
location: "Çankaya, Ankara",
image: "https://picsum.photos/seed/car1/800/600",
date: "2023-10-20",
seller: "Mehmet Kaya",
featured: true
},
{
id: 1003,
title: "iPhone 13 Pro 128GB",
description: "Sıfır ayarında, kutusu ve tüm aksesuarları mevcut. Garantisi devam ediyor. Fiyat son.",
price: 22000,
category: "Elektronik",
city: "İzmir",
location: "Konak, İzmir",
image: "https://picsum.photos/seed/phone1/800/600",
date: "2023-10-22",
seller: "Ayşe Demir",
featured: false
},
{
id: 1004,
title: "Adidas Originals Sneaker",
description: "Numara 42, siyah renk. Defolu olmayan, temiz kullanılmış. Fiyatı uygun.",
price: 450,
category: "Moda",
city: "Bursa",
location: "Osmangazi, Bursa",
image: "https://picsum.photos/seed/shoes1/800/600",
date: "2023-10-23",
seller: "Fatma Öztürk",
featured: false
},
{
id: 1005,
title: "Opel Astra Yedek Parça",
description: "2010 model Opel Astra H için sağ ön kapı. Orjinal, boyasız. Fiyat pazarlık payı vardır.",
price: 800,
category: "Yedek Parça",
city: "Antalya",
location: "Muratpaşa, Antalya",
image: "https://picsum.photos/seed/part1/800/600",
date: "2023-10-24",
seller: "Mustafa Çelik",
featured: false
},
{
id: 1006,
title: "İş Makinası Operatörü",
description: "10 yıl deneyimli, C sınıfı ehliyetli, operatör belgeli. İş arıyorum.",
price: 0,
category: "Hizmet",
city: "İstanbul",
location: "Pendik, İstanbul",
image: "https://picsum.photos/seed/service1/800/600",
date: "2023-10-25",
seller: "Ali Yıldız",
featured: false
},
{
id: 1007,
title: "Antalya Lara'da Satılık Villa",
description: "Denize sıfır, yüzme havuzlu, bahçeli, 4+1 villa. Tamamı eşyalı. Hemen tapu.",
price: 8500000,
category: "Emlak",
city: "Antalya",
location: "Lara, Antalya",
image: "https://picsum.photos/seed/villa1/800/600",
date: "2023-10-26",
seller: "Zeynep Arslan",
featured: true
},
{
id: 1008,
title: "2020 Model Honda Civic",
description: "2020 model, 1.6 Elegance, 30.000 km'de. Full extras, sigortalı. Takas düşünülür.",
price: 850000,
category: "Vasıta",
city: "İstanbul",
location: "Şişli, İstanbul",
image: "https://picsum.photos/seed/car2/800/600",
date: "2023-10-27",
seller: "Hüseyin Şahin",
featured: false
}
];
// Filtrelenmiş ilanlar
let filteredListings = [...listings];
let currentCategory = "";
let currentPage = 1;
const itemsPerPage = 6;
// Sayfa yüklendiğinde
window.onload = function() {
showHome();
populateCategoryFilters();
};
// Ana sayfayı göster
function showHome() {
document.getElementById('homePage').classList.remove('d-none');
document.getElementById('listingsPage').classList.add('d-none');
document.getElementById('listingDetailPage').classList.add('d-none');
document.getElementById('addListingPage').classList.add('d-none');
// Kategorileri yükle
const categoriesContainer = document.getElementById('categoriesContainer');
categoriesContainer.innerHTML = categories.map(category => `
<div class="col-md-3 col-sm-6 mb-4">
<div class="category-card text-center p-4" onclick="showListingsByCategory('${category.name}')">
<i class="bi ${category.icon} category-icon"></i>
<h5>${category.name}</h5>
</div>
</div>
`).join('');
// Öne çıkan ilanları yükle
const featuredListings = listings.filter(listing => listing.featured);
const featuredContainer = document.getElementById('featuredListings');
featuredContainer.innerHTML = renderListings(featuredListings);
// En yeni ilanları yükle
const recentListings = [...listings].sort((a, b) => new Date(b.date) - new Date(a.date));
const recentContainer = document.getElementById('recentListings');
recentContainer.innerHTML = renderListings(recentListings);
}
// İlanları render et
function renderListings(listingsToRender) {
return listingsToRender.map(listing => `
<div class="col-md-4 col-sm-6 mb-4">
<div class="listing-card" onclick="showListingDetail(${listing.id})">
<div class="position-relative">
<img src="${listing.image}" alt="${listing.title}" class="listing-image">
${listing.featured ? '<span class="featured-badge">Öne Çıkan</span>' : ''}
</div>
<div class="listing-info">
<h5 class="listing-title">${listing.title}</h5>
<p class="listing-price">${listing.price > 0 ? `${listing.price.toLocaleString('tr-TR')} TL` : 'Ücretsiz'}</p>
<p class="listing-location"><i class="bi bi-geo-alt"></i> ${listing.location}</p>
<p class="listing-date"><i class="bi bi-calendar"></i> ${formatDate(listing.date)}</p>
</div>
</div>
</div>
`).join('');
}
// Tarihi formatla
function formatDate(dateString) {
const options = { year: 'numeric', month: 'long', day: 'numeric' };
return new Date(dateString).toLocaleDateString('tr-TR', options);
}
// Kategoriye göre ilanları göster
function showListingsByCategory(categoryName) {
currentCategory = categoryName;
currentPage = 1;
filteredListings = listings.filter(listing => listing.category === categoryName);
showListings();
}
// İlanlar sayfasını göster
function showListings() {
document.getElementById('homePage').classList.add('d-none');
document.getElementById('listingsPage').classList.remove('d-none');
document.getElementById('listingDetailPage').classList.add('d-none');
document.getElementById('addListingPage').classList.add('d-none');
// Başlığı ayarla
const listingsTitle = document.getElementById('listingsTitle');
listingsTitle.textContent = currentCategory ? `${currentCategory} İlanları` : 'Tüm İlanlar';
// İlanları göster
renderListingsPage();
}
// İlanlar sayfasını render et
function renderListingsPage() {
const listingsContainer = document.getElementById('listingsContainer');
// Sayfalama için ilanları filtrele
const startIndex = (currentPage - 1) * itemsPerPage;
const endIndex = startIndex + itemsPerPage;
const paginatedListings = filteredListings.slice(startIndex, endIndex);
listingsContainer.innerHTML = renderListings(paginatedListings);
// Sayfalamayı render et
renderPagination();
}
// Sayfalamayı render et
function renderPagination() {
const pagination = document.getElementById('pagination');
const totalPages = Math.ceil(filteredListings.length / itemsPerPage);
let paginationHTML = '';
// Önceki butonu
paginationHTML += `
<li class="page-item ${currentPage === 1 ? 'disabled' : ''}">
<a class="page-link" href="#" onclick="changePage(${currentPage - 1})">Önceki</a>
</li>
`;
// Sayfa numaraları
for (let i = 1; i <= totalPages; i++) {
if (i === 1 || i === totalPages || (i >= currentPage - 1 && i <= currentPage + 1)) {
paginationHTML += `
<li class="page-item ${i === currentPage ? 'active' : ''}">
<a class="page-link" href="#" onclick="changePage(${i})">${i}</a>
</li>
`;
} else if (i === currentPage - 2 || i === currentPage + 2) {
paginationHTML += `<li class="page-item disabled"><span class="page-link">...</span></li>`;
}
}
// Sonraki butonu
paginationHTML += `
<li class="page-item ${currentPage === totalPages ? 'disabled' : ''}">
<a class="page-link" href="#" onclick="changePage(${currentPage + 1})">Sonraki</a>
</li>
`;
pagination.innerHTML = paginationHTML;
}
// Sayfa değiştir
function changePage(page) {
const totalPages = Math.ceil(filteredListings.length / itemsPerPage);
if (page >= 1 && page <= totalPages) {
currentPage = page;
renderListingsPage();
}
}
// İlan detayını göster
function showListingDetail(listingId) {
const listing = listings.find(l => l.id === listingId);
if (!listing) return;
document.getElementById('homePage').classList.add('d-none');
document.getElementById('listingsPage').classList.add('d-none');
document.getElementById('listingDetailPage').classList.remove('d-none');
document.getElementById('addListingPage').classList.add('d-none');
// Detayları doldur
document.getElementById('detailImage').src = listing.image;
document.getElementById('detailImage').alt = listing.title;
document.getElementById('detailTitle').textContent = listing.title;
document.getElementById('detailDescription').textContent = listing.description;
document.getElementById('detailCategory').textContent = listing.category;
document.getElementById('detailDate').textContent = formatDate(listing.date);
document.getElementById('detailId').textContent = listing.id;
document.getElementById('detailPrice').textContent = listing.price > 0 ? `${listing.price.toLocaleString('tr-TR')} TL` : 'Ücretsiz';
document.getElementById('detailLocation').textContent = listing.location;
document.getElementById('detailSeller').textContent = listing.seller;
}
// İlan ekleme sayfasını göster
function showAddListing() {
document.getElementById('homePage').classList.add('d-none');
document.getElementById('listingsPage').classList.add('d-none');
document.getElementById('listingDetailPage').classList.add('d-none');
document.getElementById('addListingPage').classList.remove('d-none');
// Kategori seçeneklerini doldur
const categorySelect = document.getElementById('listingCategoryInput');
categorySelect.innerHTML = '<option value="">Kategori Seçin</option>';
categories.forEach(category => {
categorySelect.innerHTML += `<option value="${category.name}">${category.name}</option>`;
});
}
// Kategori filtrelerini doldur
function populateCategoryFilters() {
const categoryFilter = document.getElementById('categoryFilter');
categories.forEach(category => {
categoryFilter.innerHTML += `<option value="${category.name}">${category.name}</option>`;
});
}
// Filtreleri uygula
function applyFilters() {
const categoryFilter = document.getElementById('categoryFilter').value;
const cityFilter = document.getElementById('cityFilter').value;
const minPriceFilter = document.getElementById('minPriceFilter').value;
const maxPriceFilter = document.getElementById('maxPriceFilter').value;
filteredListings = listings.filter(listing => {
// Kategori filtresi
if (categoryFilter && listing.category !== categoryFilter) {
return false;
}
// Şehir filtresi
if (cityFilter && listing.city !== cityFilter) {
return false;
}
// Min fiyat filtresi
if (minPriceFilter && listing.price < parseInt(minPriceFilter)) {
return false;
}
// Max fiyat filtresi
if (maxPriceFilter && listing.price > parseInt(maxPriceFilter)) {
return false;
}
return true;
});
currentCategory = categoryFilter;
currentPage = 1;
showListings();
}
// Filtreleri sıfırla
function resetFilters() {
document.getElementById('categoryFilter').value = '';
document.getElementById('cityFilter').value = '';
document.getElementById('minPriceFilter').value = '';
document.getElementById('maxPriceFilter').value = '';
filteredListings = [...listings];
currentCategory = "";
currentPage = 1;
showListings();
}
// İlan ekleme formunu gönder
document.getElementById('addListingForm').addEventListener('submit', function(e) {
e.preventDefault();
// Form verilerini al
const title = document.getElementById('listingTitleInput').value;
const category = document.getElementById('listingCategoryInput').value;
const price = parseInt(document.getElementById('listingPriceInput').value);
const city = document.getElementById('listingCityInput').value;
const description = document.getElementById('listingDescriptionInput').value;
const image = document.getElementById('listingImageInput').value || `https://picsum.photos/seed/listing${Date.now()}/800/600`;
const seller = document.getElementById('listingSellerInput').value;
// Yeni ilan oluştur
const newListing = {
id: Date.now(),
title,
description,
price,
category,
city,
location: city,
image,
date: new Date().toISOString().split('T')[0],
seller,
featured: false
};
// İlanları güncelle
listings.unshift(newListing);
filteredListings = [...listings];
// Ana sayfaya dön
showHome();
// Başarı mesajı göster
alert('İlanınız başarıyla yayınlandı!');
});
// Arama fonksiyonu
document.getElementById('searchInput').addEventListener('keyup', function(e) {
if (e.key === 'Enter') {
const searchTerm = e.target.value.toLowerCase();
if (searchTerm) {
filteredListings = listings.filter(listing =>
listing.title.toLowerCase().includes(searchTerm) ||
listing.description.toLowerCase().includes(searchTerm) ||
listing.id.toString().includes(searchTerm)
);
currentCategory = "";
currentPage = 1;
showListings();
}
}
});
</script>
</body>
</html>
Selamlar yapay zeka ile yapılan basit bir sarı site prototipi sizlere verdim geliştirmesi size kalmış iyi forumlar dilerim
