mirror of
https://github.com/ThaUnknown/miru.git
synced 2026-03-28 15:58:43 +00:00
- Minor formatting and QoL changes
This commit is contained in:
parent
7a1fdd9032
commit
4ced5ff9fe
2 changed files with 195 additions and 173 deletions
|
|
@ -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 = `
|
||||
|
||||
<div class="row h-full">
|
||||
<div class="col-4">
|
||||
<img src="${media.coverImage.extraLarge}"
|
||||
class="cover-img w-full h-full">
|
||||
</div>
|
||||
<div class="col-8 h-full card-grid">
|
||||
<div class="px-15 py-10">
|
||||
<h5 class="m-0 text-capitalize font-weight-bold">${!!media.title.english ? media.title.english : media.title.romaji}</h5>
|
||||
<p class="text-muted m-0 text-capitalize details">
|
||||
${(!!media.format ? (media.format == "TV" ? "<span>" + media.format + " Show" : "<span>" + media.format) : "") + "</span>"}
|
||||
${!!media.episodes ? "<span>" + media.episodes + " Episodes</span>" : (!!media.duration ? "<span>" + media.duration + " Minutes</span>" : "")}
|
||||
${!!media.status ? "<span>" + media.status.toLowerCase() + "</span>" : ""}
|
||||
${"<span>" + (!!media.season ? media.season.toLowerCase() + " " : "") + (!!media.seasonYear ? media.seasonYear : "") + "</span>"}
|
||||
</p>
|
||||
<div class="row h-full">
|
||||
<div class="col-4">
|
||||
<img src="${media.coverImage.extraLarge}"
|
||||
class="cover-img w-full h-full">
|
||||
</div>
|
||||
<div class="col-8 h-full card-grid">
|
||||
<div class="px-15 py-10">
|
||||
<h5 class="m-0 text-capitalize font-weight-bold">${!!media.title.english ? media.title.english : media.title.romaji}</h5>
|
||||
<p class="text-muted m-0 text-capitalize details">
|
||||
${(!!media.format ? (media.format == "TV" ? "<span>" + media.format + " Show" : "<span>" + media.format) : "") + "</span>"}
|
||||
${!!media.episodes ? "<span>" + media.episodes + " Episodes</span>" : (!!media.duration ? "<span>" + media.duration + " Minutes</span>" : "")}
|
||||
${!!media.status ? "<span>" + media.status.toLowerCase() + "</span>" : ""}
|
||||
${"<span>" + (!!media.season ? media.season.toLowerCase() + " " : "") + (!!media.seasonYear ? media.seasonYear : "") + "</span>"}
|
||||
</p>
|
||||
</div>
|
||||
<div class="overflow-y-scroll px-15 py-10 bg-very-dark card-desc">
|
||||
${media.description}
|
||||
</div>
|
||||
<div class="px-15 pb-10 pt-5">
|
||||
${media.genres.map(key => (`<span class="badge badge-pill badge-primary mt-5">${key}</span> `)).join('')}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="overflow-y-scroll px-15 py-10 bg-very-dark card-desc">
|
||||
${media.description}
|
||||
</div>
|
||||
<div class="px-15 pb-10 pt-5">
|
||||
${media.genres.map(key => (`<span class="badge badge-pill badge-primary mt-5">${key}</span> `)).join('')}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
`
|
||||
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 += `
|
||||
<th>${(index + 1)}</th>
|
||||
<td>${i("title").textContent}</td>
|
||||
|
|
@ -293,6 +300,7 @@ async function rssFetch(url) {
|
|||
console.error(e)
|
||||
}
|
||||
})
|
||||
|
||||
return frag
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
|
|
|
|||
Loading…
Reference in a new issue