From 4073a137f051a0bd90aff06a3ce125965b68aa85 Mon Sep 17 00:00:00 2001
From: Maitray Bhardwaj <maitraybhardwaj@gmail.com>
Date: Mon, 13 Jun 2022 15:57:36 +0530
Subject: [PATCH] Fixed the bug if image is not found

- Added a Not Available image, which will be used as the image for movie if poster_path is null or image is not available.
- To see it working, search "Interstellar".
---
 movie-app/script.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/movie-app/script.js b/movie-app/script.js
index 469f141..ad3df8e 100644
--- a/movie-app/script.js
+++ b/movie-app/script.js
@@ -6,6 +6,8 @@ const main = document.getElementById('main')
 const form = document.getElementById('form')
 const search = document.getElementById('search')
 
+const naImg = 'https://feb.kuleuven.be/drc/LEER/visiting-scholars-1/image-not-available.jpg/image'
+
 // Get initial movies
 getMovies(API_URL)
 
@@ -25,8 +27,10 @@ function showMovies(movies) {
         const movieEl = document.createElement('div')
         movieEl.classList.add('movie')
 
+        const imgSrc = poster_path == null ? naImg : IMG_PATH + poster_path
+
         movieEl.innerHTML = `
-            <img src="${IMG_PATH + poster_path}" alt="${title}">
+            <img src="${imgSrc}" alt="${title}">
             <div class="movie-info">
           <h3>${title}</h3>
           <span class="${getClassByRate(vote_average)}">${vote_average}</span>