anilist sync, ui scaling

app/index.html

@@ -11,8 +11,7 @@
     <link rel="apple-touch-icon" href="logo.png">
     <meta charset="utf-8" />
     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
-    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
-    <meta name="viewport" content="width=device-width" />
+    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
     <title>Miru</title>
 
     <link href="https://cdn.jsdelivr.net/npm/halfmoon@1.1.1/css/halfmoon-variables.min.css" rel="stylesheet">
@@ -349,6 +348,26 @@
                         <input type="checkbox" id="torrent3">
                         <label for="torrent3">Trusted Only [Less results but higher quality and more seeders]</label>
                     </div>
+                    
+                    <h1 class="content-title font-size-22">
+                        Other
+                    </h1>
+                    <div class="input-group w-200 mb-10">
+                        <div class="input-group-prepend">
+                            <span class="input-group-text">UI Scale</span>
+                        </div>
+                        <input id="other1" type="number" value="100" min="1" max="1000" class="form-control">
+                        <div class="input-group-append">
+                            <span class="input-group-text">%</span>
+                        </div>
+                    </div>
+                    <div class="custom-switch mb-20">
+                        <input type="checkbox" id="other2">
+                        <label for="other2">AniList Sync [Requires <a href="https://anilist.co/api/v2/oauth/authorize?client_id=4254&response_type=token" target="_top">OAuth2 Login</a>]</label>
+                    </div>
+
+
+
                     <button class="btn btn-danger" type="button" id="setRes">Restore Defaults</button>
                     <p class="text-muted">
                         Restart may be required for some settings to take effect.

app/js/animeHandler.js

@@ -128,6 +128,36 @@ async function alRequest(a, b) {
         json = await res.json();
     return json
 }
+function alEntry() {
+    if (store[playerData.nowPlaying[0]]) {
+        let query = `
+mutation ($id: Int, $status: MediaListStatus, $episode: Int) {
+    SaveMediaListEntry (mediaId: $id, status: $status, progress: $episode) {
+        id
+        status
+        progress
+    }
+}`,
+            variables = {
+                id: parseInt(store[playerData.nowPlaying[0]].id),
+                status: "CURRENT",
+                episode: parseInt(playerData.nowPlaying[1])
+            },
+            options = {
+                method: 'POST',
+                headers: {
+                    'Authorization': 'Bearer ' + localStorage.getItem("ALtoken"),
+                    'Content-Type': 'application/json',
+                    'Accept': 'application/json'
+                },
+                body: JSON.stringify({
+                    query: query,
+                    variables: variables
+                })
+            }
+        fetch("https://graphql.anilist.co", options)
+    }
+}
 let alResponse
 async function searchAnime(a) {
     let frag = document.createDocumentFragment(),

app/js/playerHandler.js

@@ -37,6 +37,7 @@ function resetVideo() {
         fonts: [],
         nowPlaying: undefined,
         selected: undefined,
+        completed: undefined,
         thumbnails: []
     }
     video.pause()
@@ -67,6 +68,7 @@ function resetVideo() {
     video.addEventListener("waiting", isBuffering);
     video.addEventListener("timeupdate", updateDisplay);
     video.addEventListener("timeupdate", updatePositionState);
+    video.addEventListener("timeupdate", checkCompletion);
     player.prepend(video)
 }
 // progress bar and display
@@ -498,4 +500,12 @@ if ('mediaSession' in navigator) {
     navigator.mediaSession.setActionHandler('nexttrack', btnnext);
 }
 
+//AL entry auto add
+function checkCompletion(){
+    if(settings.other2 && video.duration - 120 < video.currentTime && !playerData.completed){
+        playerData.completed = true
+        alEntry()
+    }
+}
+
 resetVideo()

app/js/settingsHandler.js

@@ -13,7 +13,9 @@ const settingsElements = {
     torrent1: torrent1,
     torrent2: torrent2,
     torrent3: torrent3,
-    torrent4: torrent4
+    torrent4: torrent4,
+    other1: other1,
+    other2: other2
 }
 let settings
 function restoreDefaults() {
@@ -33,7 +35,9 @@ function restoreDefaults() {
         torrent1: "1080",
         torrent2: false,
         torrent3: true,
-        torrent4: "https://subsplease.org/rss/?r="
+        torrent4: "https://subsplease.org/rss/?r=",
+        other1: 100,
+        other2: true
     }
     localStorage.setItem("settings", JSON.stringify(settings))
     renderSettings()
@@ -69,4 +73,12 @@ if (!localStorage.getItem("settings")) {
 settings = JSON.parse(localStorage.getItem("settings"))
 renderSettings()
 setRes.addEventListener("click", restoreDefaults)
-settingsTab.addEventListener("click", applySettings)
+settingsTab.addEventListener("click", applySettings)
+
+let searchParams = new URLSearchParams(location.href)
+if (searchParams.get("access_token")) {
+    localStorage.setItem("ALtoken", searchParams.get("access_token"))
+    window.location = "/app/#settingsTab"
+}
+
+document.body.style.zoom = settings.other1 + "%"