body { font-family: Arial, sans-serif; margin: 20px; background-color: rgba(0, 0, 0, 0.7); background-size: cover; background-position: center; color: white; } input, button { margin-bottom: 10px; padding: 10px; } #movie-details { margin-top: 20px; padding: 20px; background-color: rgba(0, 0, 0, 0.7); border-radius: 10px; color: white; max-width: 50%; flex: 1; } #movie-poster { max-width: 200px; height: auto; border-radius: 10px; } #content-wrapper { display: flex; justify-content: space-between; width: 100%; } #movie-frame { width: 800px; height: 450px; border: none; border-radius: 10px; } h1 { text-align: center; text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); } button { background-color: #007BFF; color: white; border: none; padding: 10px 20px; border-radius: 5px; cursor: pointer; } button:hover { background-color: #0056b3; } .widget-title { text-align: center; font-size: 2.5em; margin-bottom: 20px; text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7); } .movie-grid { display: flex; flex-wrap: wrap; gap: 15px; padding: 10px; background-color: rgba(0, 0, 0, 0.6); border-radius: 10px; max-width: 100%; } .movie { position: relative; overflow: hidden; width: 200px; } .movie-title { position: absolute; bottom: 0; left: 0; right: 0; background-color: rgba(0, 0, 0, 0.7); color: white; padding: 5px; text-align: center; font-weight: bold; } .movie img { width: 100%; height: auto; border-radius: 8px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); transition: transform 0.2s; cursor: pointer; /* Cursor verandert naar pointer */ } .movie img:hover { transform: scale(1.05); }

Film Embed URL = https://vidsrc.io/embed/movie/ + ID film voor VCAP Downloader

Films online bekijken bij externe party/h2>

const apiKey = '1cf50e6248dc270629e802686245c2c8'; // Vul hier je eigen TMDB API sleutel in document.addEventListener("DOMContentLoaded", () => { const storedMovies = JSON.parse(localStorage.getItem('movies')) || []; storedMovies.forEach(movie => addMovieToGrid(movie)); }); function searchMovie() { const title = document.getElementById('movie-title').value; if (title.trim() === '') { alert('Voer een filmtitel in'); return; } const url = `https://api.themoviedb.org/3/search/movie?api_key=${apiKey}&query=${encodeURIComponent(title)}`; fetch(url) .then(response => response.json()) .then(data => { if (data.results.length > 0) { const movie = data.results[0]; const movieId = movie.id; const posterPath = movie.poster_path ? `https://image.tmdb.org/t/p/w200${movie.poster_path}` : ''; const title = movie.title; const voteAverage = movie.vote_average; const plot = movie.overview; const releaseDate = movie.release_date ? movie.release_date.split('-')[0] : ''; const genres = movie.genre_ids.map(id => genreMap[id]).join(', '); document.getElementById('movie-id').value = movieId; document.getElementById('movie-title-display').textContent = title; document.getElementById('movie-poster').src = posterPath; document.getElementById('movie-year').textContent = releaseDate ? `Jaar: ${releaseDate}` : ''; document.getElementById('movie-genre').textContent = genres ? `Genre: ${genres}` : ''; document.getElementById('movie-vote-average').textContent = voteAverage; translatePlot(plot); const movieData = { id: movieId, title: title, year: releaseDate, poster: posterPath, link: `https://vidsrc.io/embed/movie/${movieId}` }; if (!isMovieInStorage(movieId)) { addMovieToGrid(movieData); saveMovie(movieData); } else { alert('Deze film is al toegevoegd.'); } } else { alert('Geen films gevonden'); } }) .catch(error => { console.error('Error:', error); alert('Er is een fout opgetreden'); }); } function translatePlot(plot) { if (!plot || plot.trim() === '') { document.getElementById('movie-plot').textContent = 'Geen plot beschikbaar voor vertaling'; return; } const apiKey = 'AIzaSyBWDj0QJvVIx8XOhRegXX5_SrRWxhT5Hs4'; // Vervang dit door je eigen Google API-sleutel const url = `https://translation.googleapis.com/language/translate/v2?key=${apiKey}`; const data = { q: plot, target: 'nl', format: 'text' }; fetch(url, { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify(data) }) .then(response => response.json()) .then(data => { if (data.data && data.data.translations.length > 0) { document.getElementById('movie-plot').textContent = data.data.translations[0].translatedText; } else { document.getElementById('movie-plot').textContent = 'Geen vertaling beschikbaar'; } }) .catch(error => { console.error('Error:', error); document.getElementById('movie-plot').textContent = 'Fout bij het vertalen van de plot'; }); } function updateIframe() { const movieId = document.getElementById('movie-id').value; if (movieId.trim() === '') { alert('Voer een TMDB ID in'); return; } const iframe = document.getElementById('movie-frame'); iframe.src = `https://vidsrc.io/embed/movie/${movieId}`; iframe.onerror = function() { alert('De film kan niet worden geladen. Controleer de URL.'); }; } function updateMovieDetails() { const movieId = document.getElementById('movie-id').value; if (movieId.trim() === '') { alert('Voer een TMDB ID in'); return; } const url = `https://api.themoviedb.org/3/movie/${movieId}?api_key=${apiKey}`; fetch(url) .then(response => response.json()) .then(movie => { const posterPath = movie.poster_path ? `https://image.tmdb.org/t/p/w200${movie.poster_path}` : ''; const title = movie.title; const voteAverage = movie.vote_average; const plot = movie.overview; const releaseDate = movie.release_date ? movie.release_date.split('-')[0] : ''; const genres = movie.genres.map(genre => genre.name).join(', '); document.getElementById('movie-title-display').textContent = title; document.getElementById('movie-poster').src = posterPath; document.getElementById('movie-year').textContent = releaseDate ? `Jaar: ${releaseDate}` : ''; document.getElementById('movie-genre').textContent = genres ? `Genre: ${genres}` : ''; document.getElementById('movie-vote-average').textContent = voteAverage; document.getElementById('movie-plot').textContent = plot; const movieData = { id: movie.id, title: title, year: releaseDate, poster: posterPath, link: `https://vidsrc.io/embed/movie/${movie.id}` }; if (!isMovieInStorage(movie.id)) { addMovieToGrid(movieData); saveMovie(movieData); } else { alert('Deze film is al toegevoegd.'); } // Scroll naar de bovenkant van de pagina window.scrollTo({ top: 0, behavior: 'smooth' }); }) .catch(error => { console.error('Error:', error); alert('Er is een fout opgetreden'); }); } function addMovieToGrid(movie) { const grid = document.getElementById('movie-grid'); const movieElement = document.createElement('div'); movieElement.className = 'movie'; movieElement.innerHTML = `

${movie.title} (${movie.year})

`; // Voeg een event listener toe voor het rechtermuisklikmenu movieElement.oncontextmenu = function(event) { event.preventDefault(); if (confirm('Weet je zeker dat je deze film wilt verwijderen?')) { grid.removeChild(movieElement); removeMovieFromStorage(movie.id); } }; // Voeg de nieuwe film bovenaan de grid toe grid.insertBefore(movieElement, grid.firstChild); } function playMovie(movieId) { document.getElementById('movie-id').value = movieId; updateIframe(); // Scroll naar de bovenkant van de pagina window.scrollTo({ top: 0, behavior: 'smooth' }); } function saveMovie(movie) { const storedMovies = JSON.parse(localStorage.getItem('movies')) || []; storedMovies.push(movie); localStorage.setItem('movies', JSON.stringify(storedMovies)); } function removeMovieFromStorage(movieId) { let storedMovies = JSON.parse(localStorage.getItem('movies')) || []; storedMovies = storedMovies.filter(movie => movie.id !== movieId); localStorage.setItem('movies', JSON.stringify(storedMovies)); } function isMovieInStorage(movieId) { const storedMovies = JSON.parse(localStorage.getItem('movies')) || []; return storedMovies.some(movie => movie.id === movieId); } const genreMap = { 28: 'Actie', 12: 'Avontuur', 16: 'Animatie', 35: 'Komedi', 80: 'Misdaad', 99: 'Documentaire', 18: 'Drama', 14: 'Fantasy', 27: 'Horror', 10402: 'Muziek', 9648: 'Mysterie', 10749: 'Romantiek', 878: 'Sciencefiction', 10770: 'Tv-film', 53: 'Thriller', 10752: 'Oorlog', 37: 'Western', };