Material Grabber - rasgane

Ini hanya material atau dasar nya saja, jadi harus disesuaikan lagi sesuai kebutuhan blog kalian.

• Results
• Code

MyAnimeList ID

Title

Trailer Youtube (ID)

Images

English

Synonyms

Japanese

Type

Episode

Status

Aired

Season

Broadcast

Producers

Licensors

Studios

Source

Genres

Explicit Genres

Demographics

Themes

Duration

Rating

Score

Votes

Opening Song

Ending Song

Synopsis

<div class="grabber_box">
<form id="malID" class="grabberField">
  <div class="FieldTitle"><label for="meta_mal_api_input">MyAnimeList ID</label></div>
  <div class="FieldText">
    <div class="textField"><input size="30" type="text" id="idInput" class="rwmb-text " name="idInput" placeholder="input MyAnimeList ID here"></div><input type="submit" class="FieldGenerator" value="Generate">
  </div>
</form>
<div id="status-api"></div>
<div class="grabMAL">
  <div class="fileGrab">
    <h3>Title</h3><input id="mal-Title">
  </div>
  <div class="fileGrab">
    <h3>Trailer Youtube (ID)</h3><input id="mal-urlTrailer">
  </div>
  <div class="fileGrab">
    <h3>Images</h3><input id="mal-urlGambar">
  </div>
  <div class="fileGrab">
    <h3>English</h3><input id="mal-English">
  </div>
  <div class="fileGrab">
    <h3>Synonyms</h3><input id="mal-Synonyms">
  </div>
  <div class="fileGrab">
    <h3>Japanese</h3><input id="mal-Japanese">
  </div>
  <div class="fileGrab">
    <h3>Type</h3><input id="mal-Type">
  </div>
  <div class="fileGrab">
    <h3>Episode</h3><input id="mal-Episode">
  </div>
  <div class="fileGrab">
    <h3>Status</h3><input id="mal-Status">
  </div>
  <div class="fileGrab">
    <h3>Aired</h3><input id="mal-Aired">
  </div>
  <div class="fileGrab">
    <h3>Season</h3><input id="mal-Season">
  </div>
  <div class="fileGrab">
    <h3>Broadcast</h3><input id="mal-broadcast">
  </div>
  <div class="fileGrab">
    <h3>Producers</h3><input id="mal-Producers">
  </div>
  <div class="fileGrab">
    <h3>Licensors</h3><input id="mal-Licensors">
  </div>
  <div class="fileGrab">
    <h3>Studios</h3><input id="mal-Studios">
  </div>
  <div class="fileGrab">
    <h3>Source</h3><input id="mal-Source">
  </div>
  <div class="fileGrab">
    <h3>Genres</h3><input id="mal-Genres">
  </div>
  <div class="fileGrab">
    <h3>Explicit Genres</h3><input id="mal-explicitGenres">
  </div>
  <div class="fileGrab">
    <h3>Demographics</h3><input id="mal-demographics">
  </div>
  <div class="fileGrab">
    <h3>Themes</h3><input id="mal-theme">
  </div>
  <div class="fileGrab">
    <h3>Duration</h3><input id="mal-Duration">
  </div>
  <div class="fileGrab">
    <h3>Rating</h3><input id="mal-Rating">
  </div>
  <div class="fileGrab">
    <h3>Score</h3><input id="mal-Score">
  </div>
  <div class="fileGrab">
    <h3>Votes</h3><input id="mal-Votes">
  </div>
  <div class="fileGrab">
    <h3>Opening Song</h3><input id="mal-openingThemes">
  </div>
  <div class="fileGrab">
    <h3>Ending Song</h3><input id="mal-EndindThemes">
  </div>
  <div class="fileGrab">
    <h3>Synopsis</h3><input id="mal-Synopsis">
  </div>
</div>

.grabberField{padding:0 10px}
.grabberField .FieldTitle{font-size:16px;font-weight:500;line-height:1.6;margin-bottom:5px}
.grabberField .FieldText{display:flex}
.FieldText .textField input{outline:none;border:none;background:#f1f1f1;padding:8px 12px;border-radius:3px;color:#555;font-family:'Fira Sans';width:100%;box-sizing:border-box}
.FieldText .FieldGenerator{outline:none;border:none;margin-left:8px;border-radius:3px;color:#fff;font-family:'Fira Sans';padding:8px 12px;background:#1da1f2;cursor:pointer}
.grabMAL{display:flex;flex-wrap:wrap;margin-top:25px}
.grabMAL>div{flex:33.3333%;-webkit-flex:33.3333%;-ms-flex:33.3333%;max-width:33.3333%;padding:3px 10px;box-sizing:border-box;overflow:hidden}
.grabMAL h3{font-size:15px;line-height:1.6;font-weight:500;margin-bottom:5px}
.grabMAL input{box-sizing:border-box;padding:8px 12px;display:block;width:100%;outline:none;border:none;background:#f1f1f1;border-radius:3px;color:#333;font-family:'Fira Sans'}
@media screen and (max-width:640px){.grabMAL>div{flex:100%;-webkit-flex:100%;-ms-flex:100%;max-width:100%}}

"use strict";
var updateAttributes = function(e, t) {
    for (var n in t) e.setAttribute(n, t[n])
  },
  _grabberMyAnimelist = function() {
    var e = document.querySelectorAll(".fileGrab input");
    document.getElementById("malID").addEventListener("submit", function(t) {
        t.preventDefault();
        var n = document.getElementById("idInput").value;
      fetch("https://api.jikan.moe/v4/anime/" + n ).then(function(e) {
          return e.json()
        }).then(function(t) {
            console.log(t.synopsis), e[0].value = t.data.title, e[1].value = t.data.trailer.youtube_id, e[2].value = t.data.images.webp.large_image_url, e[3].value = t.data.title_english, e[4].value = t.data.title_synonyms.join(", "), e[5].value = t.data.title_japanese, e[6].value = t.data.type, e[7].value = t.data.episodes, e[8].value = t.data.status.replace("Currently Airing", "Ongoing"), e[9].value = t.data.aired.string, e[10].value = t.data.season + ' ' + t.data.year, e[11].value = t.data.broadcast.string, e[12].value = t.data.producers.map(function(e) {
                return e.name
            }).join(", "), e[13].value = t.data.licensors.map(function(e) {
                return e.name
            }).join(", "), e[14].value = t.data.studios.map(function(e) {
                return e.name
            }).join(", "), e[15].value = t.data.source, e[16].value = t.data.genres.map(function(e) {
                return e.name
            }).join(", "), e[17].value = t.data.explicit_genres.map(function(e) {
                return e.name
            }).join(", "), e[18].value = t.data.demographics.map(function(e) {
                return e.name
            }).join(", "), e[19].value = t.data.themes.map(function(e) {
                return e.name
            }).join(", "), e[20].value = t.data.duration, e[21].value = t.data.rating, e[22].value = t.data.score, e[23].value = t.data.scored_by, e[24].value = t.data.opening_themes, e[25].value = t.data.ending_themes, e[26].value = t.data.synopsis, e.forEach(function(e) {
                var t = e.getAttribute("id");
                0 === e.value.length && (e.value = "mal-Episode" == t || "mal-Status" == t || "mal-Aired" == t || "mal-Season" == t || "mal-Producers" == t || "mal-Licensors" == t || "mal-Studios" == t ? "Unknown" : "mal-urlTrailer" == t || "mal-urlGambar" == t ? "#" : "mal-Rating" == t ? "None" : "mal-Votes" == t ? "0 User" : "mal-Synopsis" == t ? "No Synopsis" : "N/A")
            })
        }).then(function() {
          document.getElementById("idInput").value = "Success!!", document.getElementById("idInput").removeAttribute("disabled")
      })
    }), _grabberMyAnimelist = {}
  };
document.addEventListener("DOMContentLoaded", _grabberMyAnimelist);

Referensi : https://www.kumapoi.my.id/p/anime-grabber.html