|
| 1 | +// Variable to store if the current search need anime or manga |
| 2 | +var nameType = "Manga"; |
| 3 | +const api = "https://api.jikan.moe/v4/" |
| 4 | + |
| 5 | +// Changes the name type to anime or manga on window load |
| 6 | +window.onload = changeNameType(); |
| 7 | + |
| 8 | +// function to swap the name type |
| 9 | +function changeNameType() { |
| 10 | + nameType = nameType==="Manga"?"Anime":"Manga"; |
| 11 | + document.getElementById('output').innerHTML = nameType; |
| 12 | + document.getElementById('search-anime').innerHTML = nameType; |
| 13 | + document.getElementById('swap-anime').innerHTML = nameType==="Manga"?"Anime":"Manga"; |
| 14 | +}; |
| 15 | + |
| 16 | +function createElement(direct_url, image_url, title) { |
| 17 | + // <div class="card"> |
| 18 | + // <a href="https://myanimelist.net/anime/20/Naruto" target="_blank"> |
| 19 | + // <img |
| 20 | + // src="https://cdn.myanimelist.net/images/anime/13/17405.jpg" |
| 21 | + // alt="Naruto Poster" |
| 22 | + // /> |
| 23 | + // <h3>Naruto</h3> |
| 24 | + // </a> |
| 25 | + // </div> |
| 26 | + var card = document.createElement('div'); |
| 27 | + card.className = "card"; |
| 28 | + var link = document.createElement('a'); |
| 29 | + link.href = direct_url; |
| 30 | + link.target = "_blank"; |
| 31 | + var img = document.createElement('img'); |
| 32 | + img.src = image_url; |
| 33 | + img.alt = title + 'Poster'; |
| 34 | + var h3 = document.createElement('h3'); |
| 35 | + h3.innerHTML = title; |
| 36 | + link.appendChild(img); |
| 37 | + link.appendChild(h3); |
| 38 | + card.appendChild(link); |
| 39 | + return card; |
| 40 | +} |
| 41 | + |
| 42 | +// Removes all the children of the element |
| 43 | +function removeElemt(parent) { |
| 44 | + while (parent.firstChild) { |
| 45 | + parent.removeChild(parent.firstChild); |
| 46 | + } |
| 47 | +} |
| 48 | + |
| 49 | +// function to search anime or manga |
| 50 | +function searchWeeb() { |
| 51 | + const mainElement = document.getElementsByClassName('main')[0]; |
| 52 | + removeElemt(mainElement); |
| 53 | + fetch(api + nameType.toLowerCase() + "?q=" + document.getElementById('search').value) |
| 54 | + .then(response => response.json()) |
| 55 | + .then(data => data.data) |
| 56 | + .then(data => { |
| 57 | + data.forEach(element => { |
| 58 | + var card = createElement(element.url, element.images.webp.image_url, element.title); |
| 59 | + mainElement.appendChild(card); |
| 60 | + }) |
| 61 | + }) |
| 62 | + .catch(error => console.log(error)); |
| 63 | +}; |
0 commit comments