solve-fetch-data-sifat-nav-color-error-manage-error-and-solve

README.md

@@ -28,7 +28,7 @@ Result of Movie Search
 
 ![Search Result](img/searchMovie.png)
 <br>
-
+[sifat] (https://github.com/SIFAT-AOC)
 #### Bugs
 A list of reported bugs can be found [here](https://github.com/hrishi7/streamIt/issues). If your bug has yet to be reported, feel free to open a [new issue here](https://github.com/hrishi7/streamIt/issues/new).
 

index.html

@@ -47,7 +47,7 @@
     <!-- Custom styles for this template -->
     <link href="css/style.css" rel="stylesheet" />
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
-    <script src="js/indexMovies.js"></script>
+    <!-- <script src="js/indexMovies.js"></script> -->
     <script type="text/javascript" src="js/movie.js"></script>
     <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
     <script src='https://kit.fontawesome.com/a076d05399.js' crossorigin='anonymous'></script>
@@ -241,12 +241,12 @@ <h2 class="text-uppercase">Project Name</h2>
           </div>
         </div>
       </div>
-    </div>-->
+    </div>
 
     <!-- Bootstrap core JavaScript -->
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.bundle.min.js"></script>
-
+<script src="./js/errorSOlve.js"></script>
     <!-- Plugin JavaScript -->
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>
   </body>

js/indexMovies.js

@@ -1,18 +1,12 @@
-$(document).ready(function () {
-  axios
-    .get(
-    'https://api.themoviedb.org/3/discover/movie?api_key=ca5d667528ca51e527d9e4f7830d97d2&language=en-US&sort_by=popularity.desc&include_adult=false'
-    )
-    .then((response) => {
-      let movies = response.data.results;
-      let output = "";
-      $.each(movies, (index, movie) => {
-        output += `
-      <div class="col-md-2 col-sm-4 portfolio-item">
-      let output = '';
-      $.each(movies, (index, movie) => {
-        output += `
-      <div class="col-md-4 col-sm-6 portfolio-item">
+
+fetch('https://api.themoviedb.org/3/discover/movie?api_key=ca5d667528ca51e527d9e4f7830d97d2&language=en-US&sort_by=popularity.desc&include_adult=false')
+.then(response => response.json())
+.then(data => {
+    let output = '';
+    let result = data.results;
+    $.each(result, (index, movie) => {
+         output += `
+        <div class="col-md-4 col-sm-6 portfolio-item">
         <a class="portfolio-link" data-toggle="modal" href="#" onclick="movieSelected('${movie.id}')">
           <img class="img-fluid" src="https://image.tmdb.org/t/p/w500/${movie.poster_path}" alt="${movie.title}">
         </a>
@@ -22,50 +16,29 @@ $(document).ready(function () {
         <a onclick="movieSelected('${movie.id}')" class="btn btn-primary" href="#">Movie Details</a>
         </div>
       </div>
-
-      `;
-      });
-      $("#home-movies").html(output);
-    })
-    .catch((err) => {
-      console.log(err);
+`
+console.log(movie);
+$("#home-movies").html(output);
     });
+})
+.catch(error => {
+  console.error(error);
 });
 
-//function to display navbar background-color on scroll
+// navbar background color changes when user scrolls
 window.onscroll = function () {
-  scrollFunction();
-};
-function scrollFunction() {
-  if (document.body.scrollTop > 10 || document.documentElement.scrollTop > 10) {
-    document.getElementById("mainNav").style.backgroundColor = "#323033";
-  } else {
-    document.getElementById("mainNav").style.backgroundColor = "transparent";
+    scrollFunction();
+  };
+  function scrollFunction() {
+    if (window.scrollY > 10) {
+      document.getElementById("mainNav").style.backgroundColor = "transparent";
+    } else {
+      document.getElementById("mainNav").style.backgroundColor = "#323033";
+    } 
   }
-}
-      $('#home-movies').html(output);
-
-      //function to display navbar background-color on scroll
-      $(window).scroll(function () {
-        if (
-          document.body.scrollTop > 20 ||
-          document.documentElement.scrollTop > 20
-        ) {
-          $('#mainNav').css({ 'background-color': '#323033' });
-          $('#gtp').css({ transform: 'scale(100%)' });
-        } else {
-          $('#mainNav').css({ 'background-color': 'transparent' });
-          $('#gtp').css({ transform: 'scale(0)' });
-        }
-      });
 
       //function to scroll to the top when the user clicks the "goToTop" button
-      $('#gtp').click(function () {
-        document.body.scrollTop = 0;
-        document.documentElement.scrollTop = 0;
-      });
-    })
-    .catch((err) => {
-      console.log(err);
-    });
-});
+$('#gtp').click(function () {
+document.body.scrollTop = 0;
+document.documentElement.scrollTop = 0;
+});

js/tv.js

@@ -9,8 +9,6 @@ function movieSelected(id){
   return false;
 }
 
-
-
 function getMovie(){
   let movieId = sessionStorage.getItem('movieId');