Skip to content

Instantly share code, notes, and snippets.

@nattadasu

nattadasu/ryuuganimeAnimei18nTest.html

Last active August 4, 2020 13:56
Show Gist options
  • Save nattadasu/82d3000d90afcc5cae631a44c61d7682 to your computer and use it in GitHub Desktop.
Save nattadasu/82d3000d90afcc5cae631a44c61d7682 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
ryuuganimeAnimei18nTest.html
<html lang="id-id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="jquery-3.5.1.min.js"></script>
</head>
<body>
<img src="" width="640" />
<br /><br />
<!--more-->
<button id="id-id" class="translate">Bahasa Indonesia</button>
<button id="en-us" class="translate">English (United States)</button>
<br />
<br />
<h2 class="lang" key="synopsis"></h2>
<div style="text-align: justify;">
<p id="synopsis$ID"><span class="lang" key="noSynopsis"></span></p>
</div>
<br />
<br />
<h2 class="lang" key="information"></h2>
<p>
<strong><span class="lang" key="romajiTitle"></span>: <span id=title$en_Latn>-</span></strong><br />
<strong><span class="lang" key="nativeTitle"></span>: <span id=title$native>-</span></strong><br />
<strong><span class="lang" key="alternativeTitle"></span>:</strong>
<ul>
<li><span class="lang" key="arabicMsa"></span>: <span id="title$AR">-</span></li>
<li><span class="lang" key="indonesian"></span>: <span id="title$ID">-</span></li>
<li><span class="lang" key="english"></span>: <span id="title$US">-</span></li>
<li><span class="lang" key="japan"></span>: <span id="title$JP">-</span></li>
<li><span class="lang" key="german"></span>: <span id="title$DE">-</span></li>
<li><span class="lang" key="korean"></span>: <span id="title$KR">-</span></li>
<li><span class="lang" key="french"></span>: <span id="title$FR">-</span></li>
<li><span class="lang" key="portuguese"></span>: <span id="title$PT">-</span></li>
<li><span class="lang" key="russian"></span>: <span id="title$RU">-</span></li>
<li><span class="lang" key="spanish"></span>: <span id="title$ES">-</span></li>
<li><span class="lang" key="chineseSimplified"></span>: <span id="title$zh_Hans">-</span></li>
<li><span class="lang" key="chineseTraditional"></span>: <span id="title$zh_Hant">-</span></li>
<li><span class="lang" key="vietnamese"></span>: <span id="title$VN">-</span></li>
</ul>
<strong><span class="lang" key="synonyms"></span>:</strong> <span id="synonyms">-</span><br />
<strong><span class="lang" key="type"></span>:</strong> <span id="type$ID">-</span><br />
<strong><span class="lang" key="totalEpisodes"></span>:</strong> <span id="episode">NaN</span><br />
<strong><span class="lang" key="airingStatus"></span>:</strong> <span id="status">-</span><br />
<strong><span class="lang" key="genre"></span>:</strong> <span id="serialGenre$ID">-</span><br />
<strong><span class="lang" key="tags"></span>:</strong> <span id="serialTags$ID">-</span><br />
<strong><span class="lang" key="season"></span>:</strong> <span id="releaseSeason$ID">NaN</span> <span id="releaseYear">NaN</span><br />
<strong><span class="lang" key="airingDate"></span>:</strong> <span id="releaseDate">NaN</span> - <span id="endDate">NaN</span><br />
<strong><span class="lang" key="duration"></span>:</strong> <span id="duration">NaN</span> <span class="lang" key="minutes"></span><br />
<strong><span class="lang" key="studio"></span>:</strong> <span id="studio">-</span><br />
<strong><span class="lang" key="rating"></span>:</strong> <span id="rating">-</span><br />
<strong><span class="lang" key="NSFW"></span>:</strong> <span id="nsfwTag">tidak</span><br />
<strong><span class="lang" key="adaptation"></span>:</strong> <span id="adaptation$ID">-</span><br />
<strong><span class="lang" key="country"></span>:</strong> <span id="country$ID">-</span>
</p>
<br />
<br />
<h2 id="skor"><span class="lang" key="showScores"></span></h2>
<table>
<tr>
<th><span class="lang" key="onlineDatabaseSite"></span></th>
<th><span class="lang" key="score"></span></th>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=anidb.net" /> aniDB</td>
<td><span id="aniDB$score">NaN</span></td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=anilist.co" /> AniList</td>
<td><span id="AniList$score">NaN</span>%</td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=www.anime-planet.com" /> Anime-Planet</td>
<td><span id="AnimePlanet$score">NaN</span> <span class="lang" key="from"></span> 5</td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=www.animenewsnetwork.com" /> Anime News
Network&emsp;</td>
<td><span id="ANN$score">NaN</span></td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=www.anisearch.com" /> AniSearch</td>
<td><span id="AniSearch$score">NaN</span>%</td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=annict.jp" /> Annict</td>
<td><span id="Annict$score">NaN</span>%</td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=imdb.com" /> IMDb</td>
<td><span id="IMDb$score">NaN</span></td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=kinopoisk.ru" /> KinoPoisk</td>
<td><span id="KinoPoisk$score">NaN</span></td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=kitsu.io" /> Kitsu</td>
<td><span id="Kitsu$score">NaN</span>%</td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=livechart.me" /> LiveChart</td>
<td><span id="LiveChart$score">NaN</span></td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=myanimelist.net" /> MyAnimeList</td>
<td><span id="MyAnimeList$score">NaN</span></td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=en.myshows.me"> MyShows</td>
<td><span id="MyShows$score">NaN</span> <span class="lang" key="from"></span> 5</td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=www.nautiljon.com" /> Nautiljon</td>
<td><span id="Nautiljon$score">NaN</span></td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=notify.moe" /> Notify</td>
<td><span id="Notify$score">NaN</span></td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=otakotaku.com" /> Otak Otaku</td>
<td><span id="OtakOtaku$score">NaN</span></td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=shikimori.org" /> Shikimori</td>
<td><span id="Shikimori$Score">NaN</span></td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=simkl.com" /> SIMKL</td>
<td><span id="SIMKL$score">NaN</span></td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=themoviedb.org" /> The Movie Database</td>
<td><span id="TMDB$score">NaN</span>%</td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=trakt.tv" /> Trakt</td>
<td><span id="Trakt$score">NaN</span>%</td>
</tr>
<tr>
<td><img src="https://www.google.com/s2/favicons?domain=www.tvtime.com" /> TVTime</td>
<td><span id="TVTime$score">NaN</span></td>
</tr>
</table>
<div style="text-align: right; font-size: xx-small;">
<i><span class="lang" key="latestUpdate"></span>: <span id="updatedDate">NaN</span></i></div>
<br />
<br />
<h2 id="fansub"><span class="lang" key="fansubLinks"></span></h2>
<div id="fansubInfo">
<h3><span class="lang" key="indonesian"></span></h3>
<p id="fansub$idn">
<span class="lang" key="empty"></span>
</p>
<br />
<h3><span class="lang" key="english"></span></h3>
<p id="fansub$eng">
<span class="lang" key="empty"></span>
</p>
</div>
<br />
<br />
<h2 id="fanstream"><span class="lang" key="fanstreamLinks"></span></h2>
<div id="fanstreamInfo">
<h3><span class="lang" key="indonesian"></span></h3>
<p id="fanstream$idn">
<span class="lang" key="empty"></span>
</p>
<br />
<h3><span class="lang" key="english"></span></h3>
<p id="fanstream$eng">
<span class="lang" key="empty"></span>
</p>
</div>
<br />
<br />
<h2 id="fanshare"><span class="lang" key="fanshareLinks"></span></h2>
<div id="fanshareInfo">
<h3><span class="lang" key="indonesian"></span></h3>
<p id="fanshare$idn">
<span class="lang" key="empty"></span>
</p>
<br />
<h3><span class="lang" key="english"></span></h3>
<p id="fanshare$eng">
<span class="lang" key="empty"></span>
</p>
</div>
<br />
<br />
<h2 id="pustaka"><span class="lang" key="libraryLinks"></span></h2>
<p id="libraryInfo">
<span class="lang" key="empty"></span>
</p>
<script type="text/javascript">
// Add definitions
var arrLang = {
"en-us": {
"synopsis": "Synopsis",
"noSynopsis": "No synopsis available",
"information": "Information",
"romajiTitle": "Romaji Title",
"nativeTitle": "Native Title",
"alternativeTitle": "Alternative Title",
"arabicMsa": "Arabic (MSA)",
"indonesian": "Indonesian",
"english": "English",
"japan": "Japanese",
"german": "German",
"korean": "Korean",
"french": "French",
"portuguese": "Portuguese",
"russian": "Russian",
"spanish": "Spanish",
"chineseSimplified": "Chinese (Simplified)",
"chineseTraditional": "Chinese (Traditional)",
"vietnamese": "Vietnamese",
"synonyms": "Synonyms",
"type": "Type",
"totalEpisodes": "Total episodes",
"airingStatus": "Airing Status",
"genre": "Genre",
"tags": "Tags",
"season": "Season",
"airingDate": "Airing Date",
"duration": "Duration per episode",
"studio": "Studio",
"rating": "rating",
"NSFW": "Is it NSFW",
"adaptation": "Adaptation",
"country": "Country of origin",
"showScores": "Show Scores",
"onlineDatabaseSite": "Online Database Site",
"score": "Score",
"from": "by",
"latestUpdate": "Updated at",
"fansubLinks": "Fansub Links",
"fanshareLinks": "Fanshare Links",
"fanstreamLinks": "Fanstream Links",
"libraryLinks": "Library Links",
"empty": "Empty",
"minutes": "minutes"
},
"id-id": {
"synopsis": "Sinopsis",
"noSynopsis": "Tidak ada sinopsis",
"information": "Informasi",
"romajiTitle": "Judul Romaji",
"nativeTitle": "Judul Asli",
"alternativeTitle": "Judul Alternatif",
"arabicMsa": "Arab (MSA)",
"indonesian": "Indonesia",
"english": "Inggris",
"japan": "Jepang",
"german": "Jerman",
"korean": "Korea",
"french": "Perancis",
"portuguese": "Portugis",
"russian": "Rusia",
"spanish": "Spanyol",
"chineseSimplified": "Cina (Sederhana)",
"chineseTraditional": "Cina (Tradisional",
"vietnamese": "Vietnam",
"synonyms": "Sinonim",
"type": "Tipe",
"totalEpisodes": "Total Episode",
"airingStatus": "Status Penayangan",
"genre": "Genre",
"tags": "Label",
"season": "Musim",
"airingDate": "Tanggal Penayangan",
"duration": "Durasi per Episode",
"studio": "Studio",
"rating": "Rating",
"NSFW": "NSFW",
"adaptation": "Sumber Adaptasi",
"country": "Asal Negara",
"showScores": "Skor Tayangan",
"onlineDatabaseSite": "Situs Pangkalan Data Daring",
"score": "Skor",
"from": "dari",
"latestUpdate": "Pembaruan terakhir pada",
"fansubLinks": "Tautan Fansub",
"fanshareLinks": "Tautan Fanshare",
"fanstreamLinks": "Tautan Fanstream",
"libraryLinks": "Tautan Pustaka",
"empty": "Kosong",
"minutes": "menit"
}
};
// Function for translation
$(document).ready(function () {
var lang = "en-us";
$(".lang").each(function (index, element) {
$(this).text(arrLang[lang][$(this).attr("key")]);
});
});
// get/set the selected language
$(".translate").click(function () {
var lang = $(this).attr("id");
$(".lang").each(function (index, element) {
$(this).text(arrLang[lang][$(this).attr("key")]);
});
});
// save, in your .translate click handler
localStorage.setItem('lang', $(this).attr('id'));
// Load on DOMContentLoaded
var lang = localStorage.getItem('lang') || navigator.language.slice(0, 2);
if (!Object.keys(arrLang).includes(lang)) lang = 'en';
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment