window.onload = preload; let history; let mainav; let data; function getListElements() { return Array.from(document.getElementsByClassName('list')).filter(x => x.id != 'sample-list'); } function scrolimate() { items = getListElements(); for (let i = 0; i < items.length; i++) { if (items[i].getBoundingClientRect().top - (window.innerHeight) <= 0) { if (!items[i].classList.contains(items[i].dataset.enteranimation)) { items[i].classList.replace('animate-enter', items[i].dataset.enteranimation); } } else { items[i].classList.replace(items[i].dataset.enteranimation, 'animate-enter'); } } if (mainav.getBoundingClientRect().top <= 0) { mainav.style.position = 'fixed'; mainav.style.top = '0'; } if (document.documentElement.scrollTop <= 80) { mainav.style.position = ''; mainav.style.top = ''; } } function category_toggle() { document.getElementsByClassName('category')[0].classList.toggle("on") } function setGenre(g){ data.genre = (data.genre == g)?'':g; data.page = 0; document.getElementById('catmenu').innerHTML = (data.genre=='')?'Genre':data.genre; refresh_content(document.getElementById('searchtxt').value); } function refresh_content() { if(data.page==0)document.getElementById('prev').style.display='none'; let items = getListElements(); for (let i = items.length; i--;) { items[i].style.display = 'none' } document.getElementById('content-load').style.display = 'flex'; let q = `page[limit]=10&page[offset]=${data.page*10}`; if (data.search) q += `&filter[text]=${data.search}`; if (data.genre) q += `&filter[genres]=${data.genre}`; if (!data.search) q += '&sort=-averageRating'; loadAnime(q).then(result => { let items = getListElements(); for (let i = items.length; i--;) { items[i].parentNode.removeChild(items[i]); } data.animelist = result; history.add(data); data = JSON.parse(JSON.stringify(data)); createLists(result); window.scrollTo({top:100,left:100,behavior:'smooth' }); }).catch(()=>{ alert('something is wrong'); }).finally(()=>{ document.getElementById('content-load').style.display = ''; }) } function loadAnime(params) { return new Promise((resolve, reject) => { let xhr = new XMLHttpRequest(); xhr.open('get', encodeURI("https://kitsu.io/api/edge/anime?" + params + "&include=genres")); xhr.send(); xhr.onreadystatechange = () => { if (xhr.readyState == 4) if (xhr.status == 200) resolve(JSON.parse(xhr.responseText)) else reject(xhr.status); } }); } function createLists(data) { let inc = data.included; data = data.data; let genre=inc.filter(x=>x.type=='genres'); if(data.length<10)document.getElementById('next').style.display='none'; for (let i = 0; i < data.length; i++) { let x = document.getElementById('sample-list').cloneNode(true); x.id = data[i].id; document.getElementById('sample-list').parentNode.appendChild(x); let titles = Object.values(data[i].attributes.titles).filter(x=> x).map(x => "『" + x + "』"); let genres = Object.values(data[i].relationships.genres.data).filter(x=>x.type=='genres').map(x=>genre.filter(y=>y.id==x.id)[0].attributes.name); data[i]._genres = genres; findChild(x, "title").innerHTML = data[i].attributes.canonicalTitle; findChild(x, "cover").style.backgroundImage = "url('" + data[i].attributes.posterImage.small + "')"; findChild(x, "titlealt").innerHTML = titles.join(', '); findChild(x,"rating").innerHTML = (data[i].attributes.averageRating || "n/a")+"★"; findChild(x,"genre").innerHTML = genres.join(", "); x.style.display = ''; } scrolimate(); } function findChild(parent, className) { let x; function re(parent) { for (let child of Array.from(parent.childNodes).filter(e => e.tagName != undefined)) { if ((child.className.split(' ').indexOf(className) >= 0)) { x = child; return child; } else if (!x); re(child); } } re(parent) return x; } function preload() { history = new History(10); data={ page: 0, genre: '', search:'', animelist:{} }; history.add(data); loadAnime('&sort=-averageRating').then(res => { data.animelist=res; data = JSON.parse(JSON.stringify(history.last)); createLists(res); }); mainav = document.getElementById('mainav') let gg = document.getElementById('catlis'); for (let g of catcat.sort()) { let x = document.createElement('div'); x.innerHTML = g; x.addEventListener('click',e=>{ setGenre(g); }); gg.appendChild(x); } if(data.page==0)document.getElementById('prev').style.display='none'; document.getElementById('firstloader').classList.toggle('hidden'); setTimeout(() => { document.getElementById('firstloader').style.display = 'none' }, 500); document.getElementById('homenu').addEventListener('click',e=>{ data.page=0; data.genre=''; document.getElementById('searchtxt').value=''; refresh_content(); }); document.getElementById('catmenu').addEventListener('click', category_toggle) window.addEventListener('scroll', scrolimate); window.addEventListener('orientationchange', scrolimate); scrolimate(); document.getElementById('searchbtn').addEventListener('click', (e) => { data.search = document.getElementById('searchtxt').value; refresh_content(document.getElementById('searchtxt').value); }); document.getElementById('searchtxt').addEventListener('keyup',(e) => { if(e.key == "Enter"){ data.search = document.getElementById('searchtxt').value; refresh_content(); } }); document.getElementById('next').addEventListener('click',(e)=>{ data.page++; refresh_content(); }); document.getElementById('prev').addEventListener('click',(e)=>{ data.page--; refresh_content(); }); } let catcat = [ "Comedy", "Action", "Romance", "Fantasy", "School Life", "Drama", "Sports", "Mecha", "Music", "Horror" ]; let peek = [ "https://cdn130.picsart.com/291247122008211.png?r1024x1024", "https://cdn.inquisitr.com/wp-content/uploads/2017/07/Eromanga-Sensei-Sagiri-Gun.png", "https://orig00.deviantart.net/a659/f/2017/122/e/a/aqua_laughing_by_neinwott-db7wffa.png", "http://66.media.tumblr.com/647f33e7d1b9cbb36a76dbca65c422a2/tumblr_n901cohgvK1ttojmzo1_500.png", "http://xusooot34wmwpyvd.onion.link/foolfuuka/boards/a/image/1453/33/1453339719541.png", "https://avatanplus.com/files/resources/mid/56770d730c4a3151c10c896a.png", "https://78.media.tumblr.com/9a52b979df103c9e220582745d52935e/tumblr_p59ipu97pH1wo8pf8o1_500.png", "http://images1.wikia.nocookie.net/__cb20120505051242/fairytail/es/images/e/ec/Kyon.png", "https://68.media.tumblr.com/ba8c8388d1292a0a08b3d6ae34360570/tumblr_nquha5YITA1r0l19go1_500.png" ] class History{ constructor(max=-1){ this.data=[]; this.now=-1; this.max=max; } add(data){ if(this.max>=0 && this.data.length == this.max) this.data.shift(); if(data==this.data[this.now])return data; while(this.now < this.data.length-1) this.data.pop(); this.now = this.data.length; this.data[this.data.length] = data; return data; } get undo(){ return (this.now>0)?this.data[--this.now]:this.data[0]; } get redo(){ return (this.now

Anime & Things