<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Film ve Dizi Öneri Botu</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f4f4f9;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
}
.container {
text-align: center;
background-color: white;
padding: 20px;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
width: 90%;
max-width: 400px;
}
h1 {
color: #333;
}
select, button {
padding: 10px;
margin: 10px 5px;
font-size: 16px;
cursor: pointer;
}
button {
background-color: #007bff;
color: white;
border: none;
border-radius: 5px;
font-weight: bold;
}
button:hover {
background-color: #0056b3;
}
img {
width: 100%;
max-width: 300px;
border-radius: 10px;
margin-top: 10px;
}
.info {
text-align: left;
margin-top: 10px;
}
</style>
</head>
<body>
<div class="container">
<h1>Film ve Dizi Öneri Botu</h1>
<label for="category">Seçim Yap:</label>
<select id="category">
<option value="movie">Film</option>
<option value="tv">Dizi</option>
</select>
<label for="filter">Kategori:</label>
<select id="filter">
<option value="popular">Popüler</option>
<option value="now_playing">Yeni Çıkanlar</option>
<option value="top_rated">En İyiler</option>
<option value="upcoming">Yakında Gelecekler</option>
<option value="old">Eski Filmler</option>
</select>
<label for="genre">Tür Seç:</label>
<select id="genre">
<option value="">Tüm Türler</option>
</select>
<button onclick="getRandomRecommendation()">Rastgele Öner</button>
<h2>Sonuç:</h2>
<img id="poster" src="" alt="" style="display: none;">
<div class="info">
<p><strong>Adı:</strong> <span id="title"></span></p>
<p><strong>Tür:</strong> <span id="genres"></span></p>
<p><strong>Özet:</strong> <span id="overview"></span></p>
</div>
</div>
<script>
const API_KEY = "KEYİ BURAYA GİRİN";
const genreDropdown = document.getElementById('genre');
const categorySelect = document.getElementById('category');
// Türleri getir
async function fetchGenres() {
const category = categorySelect.value;
const GENRE_URL = `https://api.themoviedb.org/3/genre/${category}/list?api_key=${API_KEY}&language=tr-TR`;
try {
const response = await fetch(GENRE_URL);
const data = await response.json();
genreDropdown.innerHTML = `<option value="">Tüm Türler</option>`;
data.genres.forEach(genre => {
genreDropdown.innerHTML += `<option value="${genre.id}">${genre.name}</option>`;
});
} catch (error) {
console.error("Tür bilgisi alınamadı:", error);
}
}
categorySelect.addEventListener("change", fetchGenres);
fetchGenres();
// Rastgele içerik getir
async function getRandomRecommendation() {
const category = document.getElementById('category').value;
const filter = document.getElementById('filter').value;
const genreId = document.getElementById('genre').value;
const RANDOM_PAGE = Math.floor(Math.random() * 50) + 1;
let API_URL = `https://api.themoviedb.org/3/${category}/${filter}?api_key=${API_KEY}&language=tr-TR&page=${RANDOM_PAGE}`;
// Kategoriye göre URL'yi değiştir
if (filter === "top_rated") {
API_URL = `https://api.themoviedb.org/3/${category}/top_rated?api_key=${API_KEY}&language=tr-TR&page=${RANDOM_PAGE}`;
} else if (filter === "now_playing") {
API_URL = `https://api.themoviedb.org/3/${category}/now_playing?api_key=${API_KEY}&language=tr-TR&page=${RANDOM_PAGE}`;
} else if (filter === "upcoming") {
API_URL = `https://api.themoviedb.org/3/${category}/upcoming?api_key=${API_KEY}&language=tr-TR&page=${RANDOM_PAGE}`;
} else if (filter === "old") {
// Eski Filmler için filtre ekleyelim
API_URL = `https://api.themoviedb.org/3/discover/${category}?api_key=${API_KEY}&language=tr-TR&sort_by=release_date.asc&release_date.lte=1990-01-01&page=${RANDOM_PAGE}`;
}
if (genreId) {
API_URL = `https://api.themoviedb.org/3/discover/${category}?api_key=${API_KEY}&language=tr-TR&with_genres=${genreId}&page=${RANDOM_PAGE}`;
}
try {
const response = await fetch(API_URL);
const data = await response.json();
if (data.results.length > 0) {
const randomIndex = Math.floor(Math.random() * data.results.length);
const randomItem = data.results[randomIndex];
displayResult(randomItem);
} else {
alert("Öneri bulunamadı.");
}
} catch (error) {
console.error("Rastgele seçim sırasında hata oluştu:", error);
}
}
async function displayResult(item) {
document.getElementById('title').textContent = item.title || item.name;
document.getElementById('overview').textContent = item.overview || "Özet bulunamadı.";
document.getElementById('poster').src = item.poster_path ? `https://image.tmdb.org/t/p/w500${item.poster_path}` : "";
document.getElementById('poster').style.display = item.poster_path ? "block" : "none";
const genreNames = await getGenres(item.genre_ids);
document.getElementById('genres').textContent = genreNames.join(", ") || "Bilinmiyor";
}
async function getGenres(genreIds) {
const category = categorySelect.value;
const GENRE_URL = `https://api.themoviedb.org/3/genre/${category}/list?api_key=${API_KEY}&language=tr-TR`;
try {
const response = await fetch(GENRE_URL);
const data = await response.json();
const genreMap = new Map(data.genres.map(g => [g.id, g.name]));
return genreIds.map(id => genreMap.get(id)).filter(Boolean);
} catch (error) {
console.error("Tür bilgisi alınamadı:", error);
return [];
}
}
</script>
</body>
</html>apikey için https://www.themoviedb.org/movie bu siteye üye olun resimdeki aşamayı yapın
burada iki seçenek olacak ilk seçeneği seçin kazancsız olan kısmı random doldurun gelen api keyi html de yazdığım yere atın çalışacaktır
dizayn bu şekilde
örnek öneri resim - isim ve özet bilgisi ile geliyor bazen gelmeyebilir
seçim bilgileri
kategori bilgileri
tür bilgileri
Selamlar kendinize ait film - dizi öneri botu ile geldim bugün ne izlesem diye düşünenler , film önerisi istiyorum diyenler , sizler için artık kendiniz seçip gelen öneriye göre film ve dizi izleyebilirsin hem de kendinize ait bir sistem ücretsiz iyi forumlar (FİLM VE DİZİ ÖNERİ BOTUDUR İZLEME VS DEĞİLDİR)
