diff --git a/app/animeHandler.js b/app/animeHandler.js index e18c3a4..c23bcfc 100644 --- a/app/animeHandler.js +++ b/app/animeHandler.js @@ -1,23 +1,23 @@ -var query, - variables = { - type: "ANIME", - page: 1, - perPage: 50 - }, - request; +var query; +var variables = { + type: "ANIME", + page: 1, + perPage: 50 +} +var request; -var url = 'https://graphql.anilist.co', - options = { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - 'Accept': 'application/json' - }, - body: JSON.stringify({ - query: query, - variables: variables - }) - }; +var url = 'https://graphql.anilist.co' +var options = { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + 'Accept': 'application/json' + }, + body: JSON.stringify({ + query: query, + variables: variables + }) +} function search() { let search = document.querySelector("#search").value @@ -33,92 +33,92 @@ function alRequest(a) { variables.sort = "TRENDING_DESC" delete variables.search query = ` - query ($page: Int, $perPage: Int, $sort: [MediaSort], $type: MediaType) { - Page (page: $page, perPage: $perPage) { - pageInfo { - total - currentPage - lastPage - hasNextPage - perPage - } - media(type: $type, sort: $sort) { - id - title { - romaji - english - native - } - description( - asHtml: true - ) - season - seasonYear - format - status - episodes - duration - averageScore - genres - coverImage { - extraLarge - medium - } - bannerImage - synonyms - nextAiringEpisode { - timeUntilAiring - episode + query ($page: Int, $perPage: Int, $sort: [MediaSort], $type: MediaType) { + Page (page: $page, perPage: $perPage) { + pageInfo { + total + currentPage + lastPage + hasNextPage + perPage + } + media(type: $type, sort: $sort) { + id + title { + romaji + english + native + } + description( + asHtml: true + ) + season + seasonYear + format + status + episodes + duration + averageScore + genres + coverImage { + extraLarge + medium + } + bannerImage + synonyms + nextAiringEpisode { + timeUntilAiring + episode + } + } } } - } -} -` + ` } else { variables.search = a delete variables.sort query = ` - query ($page: Int, $perPage: Int, $search: String, $type: MediaType) { - Page (page: $page, perPage: $perPage) { - pageInfo { - total - currentPage - lastPage - hasNextPage - perPage - } - media (type: $type, search: $search) { - id - title { - romaji - english - native - } - description( - asHtml: true - ) - season - seasonYear - format - status - episodes - duration - averageScore - genres - coverImage { - extraLarge - medium - } - bannerImage - synonyms - nextAiringEpisode { - timeUntilAiring - episode + query ($page: Int, $perPage: Int, $search: String, $type: MediaType) { + Page (page: $page, perPage: $perPage) { + pageInfo { + total + currentPage + lastPage + hasNextPage + perPage + } + media (type: $type, search: $search) { + id + title { + romaji + english + native + } + description( + asHtml: true + ) + season + seasonYear + format + status + episodes + duration + averageScore + genres + coverImage { + extraLarge + medium + } + bannerImage + synonyms + nextAiringEpisode { + timeUntilAiring + episode + } + } } } - } -} -` + ` } options.body = JSON.stringify({ query: query, @@ -138,37 +138,37 @@ function alRequest(a) { function handleData(data) { request = data console.log(request); - let frag = document.createDocumentFragment(), - hasBegun = true + let frag = document.createDocumentFragment() + let hasBegun = true try { data.data.Page.media.forEach((media, index) => { let template = document.createElement("div") template.classList.add("card", "m-0", "p-0") template.innerHTML = ` -
-
- -
-
-
-
${!!media.title.english ? media.title.english : media.title.romaji}
-

- ${(!!media.format ? (media.format == "TV" ? "" + media.format + " Show" : "" + media.format) : "") + ""} - ${!!media.episodes ? "" + media.episodes + " Episodes" : (!!media.duration ? "" + media.duration + " Minutes" : "")} - ${!!media.status ? "" + media.status.toLowerCase() + "" : ""} - ${"" + (!!media.season ? media.season.toLowerCase() + " " : "") + (!!media.seasonYear ? media.seasonYear : "") + ""} -

+
+
+ +
+
+
+
${!!media.title.english ? media.title.english : media.title.romaji}
+

+ ${(!!media.format ? (media.format == "TV" ? "" + media.format + " Show" : "" + media.format) : "") + ""} + ${!!media.episodes ? "" + media.episodes + " Episodes" : (!!media.duration ? "" + media.duration + " Minutes" : "")} + ${!!media.status ? "" + media.status.toLowerCase() + "" : ""} + ${"" + (!!media.season ? media.season.toLowerCase() + " " : "") + (!!media.seasonYear ? media.seasonYear : "") + ""} +

+
+
+ ${media.description} +
+
+ ${media.genres.map(key => (`${key} `)).join('')} +
+
-
- ${media.description} -
-
- ${media.genres.map(key => (`${key} `)).join('')} -
-
-
` template.onclick = function () { @@ -185,23 +185,24 @@ function handleData(data) { } document.querySelector(".gallery").appendChild(frag) } -let detailsfrag = document.createDocumentFragment(), - details = { - averageScore: "Average Score", - duration: "Episode Duration", - episodes: "Episodes", - format: "Format", - genres: "Genres", - season: "Season", - seasonYear: "Year", - status: "Status", - english: "English", - romaji: "Romaji", - native: "Native", - synonyms: "Synonyms" - } -function viewAnime(media) { +let detailsfrag = document.createDocumentFragment() +let details = { + averageScore: "Average Score", + duration: "Episode Duration", + episodes: "Episodes", + format: "Format", + genres: "Genres", + season: "Season", + seasonYear: "Year", + status: "Status", + english: "English", + romaji: "Romaji", + native: "Native", + synonyms: "Synonyms" +} + +function viewAnime(media) { halfmoon.toggleModal("view") document.querySelector(".view .banner img").src = "" document.querySelector(".view .banner img").src = media.bannerImage @@ -213,6 +214,7 @@ function viewAnime(media) { detailsCreator(media) document.querySelector(".view .details").appendChild(detailsfrag) } + function detailsCreator(entry) { if (entry != undefined) { Object.entries(entry).forEach(value => { @@ -235,33 +237,37 @@ function detailsCreator(entry) { }) } } -const DOMPARSER = new DOMParser().parseFromString.bind(new DOMParser()), - searchTitle = document.querySelector("#title"), - searchEpisode = document.querySelector("#ep") -var selected +const DOMPARSER = new DOMParser().parseFromString.bind(new DOMParser()) +const searchTitle = document.querySelector("#title") +const searchEpisode = document.querySelector("#ep") + +var selected; async function nyaaSearch(media, episode) { if (parseInt(episode) < 10) { episode = `0${episode}` } - let titles = Object.values(media.title).concat(media.synonyms).filter(name => name != null), - table = document.querySelector("tbody.results"), - results = document.createDocumentFragment() + + let titles = Object.values(media.title).concat(media.synonyms).filter(name => name != null) + let table = document.querySelector("tbody.results") + let results = document.createDocumentFragment() + for (let title of titles) { if (results.children.length == 0) { title = title.replace(/ /g, "+") let url = new URL(`https://nyaa.si/?page=rss&c=1_2&f=2&s=seeders&o=desc&q=${title}"+${episode}+"`) results = await rssFetch(url) } - }; + } + if (results.children.length == 0) { halfmoon.initStickyAlert({ content: `Couldn't find torrent for ${!!media.title.english ? media.title.english : media.title.romaji} Episode ${parseInt(episode)}! Try specifying a torrent manually.`, title: "Search Failed", alertType: "alert-danger", fillType: "" - }); + }) } else { table.textContent = "" table.appendChild(results) @@ -272,13 +278,14 @@ async function nyaaSearch(media, episode) { async function rssFetch(url) { let frag = document.createDocumentFragment() + res = await fetch(url) await res.text().then((xmlTxt) => { try { let doc = DOMPARSER(xmlTxt, "text/xml") doc.querySelectorAll("item").forEach((item, index) => { - let i = item.querySelector.bind(item), - template = document.createElement("tr") + let i = item.querySelector.bind(item) + let template = document.createElement("tr") template.innerHTML += ` ${(index + 1)} ${i("title").textContent} @@ -293,6 +300,7 @@ async function rssFetch(url) { console.error(e) } }) + return frag } diff --git a/app/playerHandler.js b/app/playerHandler.js index f8338b1..253dd88 100644 --- a/app/playerHandler.js +++ b/app/playerHandler.js @@ -16,7 +16,7 @@ const controls = document.getElementsByClassName('ctrl'), thumbnail = document.querySelector("#dThumb") -//event listeners +// event listeners volume.addEventListener("input", function () { updateVolume() }); @@ -45,25 +45,29 @@ for (let i = 0; i < controls.length; i++) { // progress bar and display function updateDisplay() { - let progressPercent = (video.currentTime / video.duration * 100), - bufferPercent = video.buffered.length == 0 ? 0 : video.buffered.end(video.buffered.length - 1) / video.duration * 100 + let progressPercent = (video.currentTime / video.duration * 100) + let bufferPercent = video.buffered.length == 0 ? 0 : video.buffered.end(video.buffered.length - 1) / video.duration * 100 progress.style.setProperty("--buffer", bufferPercent + "%"); updateBar(progressPercent || progress.value / 10); createThumbnail(video); } + function dragBar() { video.pause() updateBar(progress.value / 10) } + function dragBarEnd() { video.currentTime = currentTime || 0 playVideo() } + async function dragBarStart() { await video.pause() updateBar(progress.value / 10) } -let currentTime + +let currentTime; function updateBar(progressPercent) { currentTime = video.duration * progressPercent / 100 progress.style.setProperty("--progress", progressPercent + "%"); @@ -77,12 +81,11 @@ function updateBar(progressPercent) { } // dynamic thumbnails -let thumbnails = [], - ratio, - canvas = document.createElement("canvas"), - context = canvas.getContext('2d'), - w = 150, - h +let thumbnails = [] +let ratio +let canvas = document.createElement("canvas") +let context = canvas.getContext('2d') +let w = 150, h function initThumbnail() { thumbnails = [] @@ -92,6 +95,7 @@ function initThumbnail() { canvas.height = h; progress.style.setProperty("--height", h + "px"); } + function createThumbnail(vid) { let index = Math.floor(vid.currentTime / 5) if (!thumbnails[index] && h) { @@ -100,6 +104,7 @@ function createThumbnail(vid) { thumbnails[index] = canvas.toDataURL("image/jpeg") } } + function finishThumbnails() { let thumbVid = document.createElement("video") thumbVid.src = video.src @@ -122,7 +127,7 @@ function finishThumbnails() { } -//bufering spinner +// bufering spinner let buffer; function resetBuffer() { @@ -136,13 +141,14 @@ function resetBuffer() { function isBuffering() { buffer = setTimeout(displayBuffer, 150) } + function displayBuffer() { buffering.classList.remove('hidden') resetTimer() } -//immerse timeout -let immerseTime; +// immerse timeout +let immerseTime; document.onmousemove = resetTimer; document.onkeypress = resetTimer; @@ -155,22 +161,26 @@ function resetTimer() { player.classList.remove('immersed') immerseTime = setTimeout(immersePlayer, 3000) } -let islooped; +let islooped; function toTS(sec) { if (Number.isNaN(sec)) { return "--:--"; } - let hours = Math.floor(sec / 3600), - minutes = Math.floor((sec - (hours * 3600)) / 60), - seconds = Math.floor(sec - (hours * 3600) - (minutes * 60)); + + let hours = Math.floor(sec / 3600) + let minutes = Math.floor((sec - (hours * 3600)) / 60) + let seconds = Math.floor(sec - (hours * 3600) - (minutes * 60)); + if (minutes < 10) { minutes = `0${minutes}`; } + if (seconds < 10) { seconds = `0${seconds}`; } + if (hours > 0) { return `${hours}:${minutes}:${seconds}`; } else { @@ -178,7 +188,7 @@ function toTS(sec) { } } -//play/pause button +// play/pause button async function playVideo() { try { await video.play(); @@ -187,6 +197,7 @@ async function playVideo() { btnpp.innerHTML = "play_arrow"; } } + function bpp() { if (video.paused) { playVideo(); @@ -200,7 +211,7 @@ function bnext() { nyaaSearch(nowPlaying[0], nowPlaying[1] + 1) } -//volume shit +// volume shit let oldlevel; @@ -228,7 +239,7 @@ function updateVolume(a) { } -//PiP +// PiP async function bpip() { if (video !== document.pictureInPictureElement) { @@ -238,13 +249,13 @@ async function bpip() { } } -//theathe mode +// theathe mode function btheatre() { halfmoon.toggleSidebar(); } -//fullscreen +// fullscreen function bfull() { if (!document.fullscreenElement) { @@ -261,7 +272,7 @@ function seek(a) { video.currentTime += a; updateDisplay() } -//subtitles button, generates content every single time its opened because fuck knows when the parser will find new shit +// subtitles button, generates content every single time its opened because fuck knows when the parser will find new shit let off function bcap() { let frag = document.createDocumentFragment() @@ -304,7 +315,7 @@ function selectLang(lang) { } bcap() } -//keybinds +// keybinds document.onkeydown = function (a) { if (document.location.href.endsWith("#player")) { @@ -341,7 +352,8 @@ document.onkeydown = function (a) { } } } -//media session + +// media session function nowPlaying(sel) { nowPlaying = sel if ('mediaSession' in navigator) { @@ -359,6 +371,7 @@ function nowPlaying(sel) { }); } } + function updatePositionState() { if ('setPositionState' in navigator.mediaSession) { navigator.mediaSession.setPositionState({ @@ -368,6 +381,7 @@ function updatePositionState() { }); } } + if ('mediaSession' in navigator) { navigator.mediaSession.setActionHandler('play', bpp); navigator.mediaSession.setActionHandler('pause', bpp);