AL completion

src/index.js

@@ -37,7 +37,7 @@ function createWindow () {
     icon: path.join(__dirname, '/renderer/public/favicon.ico'),
     show: false
   })
-  mainWindow.removeMenu()
+  // mainWindow.removeMenu()
   mainWindow.webContents.session.webRequest.onBeforeSendHeaders(
     (details, callback) => {
       const { requestHeaders } = details

src/renderer/src/lib/Sidebar.svelte

@@ -1,11 +1,13 @@
 <script>
   import { getContext } from 'svelte'
   import { alID } from '@/modules/anilist.js'
+  import { media } from './pages/Player.svelte'
   const sidebar = getContext('sidebar')
+  const view = getContext('view')
   export let page
   const links = [
     {
-      click: ()=>{
+      click: () => {
         $sidebar = !$sidebar
       },
       image: 'logo_cut.png',
@@ -28,7 +30,7 @@
     },
     {
       click: () => {
-        // TODO: open now playing
+        if (media) $view = media
       },
       icon: 'queue_music',
       text: 'Now Playing'

src/renderer/src/lib/pages/Player.svelte

@@ -1,38 +1,52 @@
 <script context="module">
-    async function mediaChange(current, image) {
-    if (current) {
-      const { release_group, anime_title, episode_number, episode_title } = await anitomyscript(current.name)
-      // honestly, this is made for anime, but works fantastic for everything else.
-      const name = [anime_title, episode_number, episode_title].filter(i => i).join(' - ')
-      if ('mediaSession' in navigator) {
-        const metadata = image
-          ? new MediaMetadata({
-              title: name || 'Video Player',
-              artwork: [
-                {
-                  src: image,
-                  sizes: '256x256',
-                  type: 'image/jpg'
-                }
-              ]
-            })
-          : new MediaMetadata({
-              title: name || 'Video Player'
-            })
-        if (release_group) metadata.artist = release_group
-        navigator.mediaSession.metadata = metadata
-      }
-    }
+  export let media = null
+  let fileMedia = null
+  let hadImage = false
+  export function updateMedia(fileMed) {
+    fileMedia = fileMed
+    media = fileMedia.media
+    const name = [fileMedia.mediaTitle, fileMedia.episodeNumber, fileMedia.episodeTitle].filter(i => i).join(' - ')
+
+    fileMedia.episodeThumbnail = !!fileMedia.episodeThumbnail
+    const metadata =
+      fileMedia.episodeThumbnail || fileMedia.mediaCover
+        ? new MediaMetadata({
+            title: name || 'Miru',
+            artwork: [
+              {
+                src: fileMedia.episodeThumbnail || fileMedia.mediaCover,
+                sizes: '256x256',
+                type: 'image/jpg'
+              }
+            ]
+          })
+        : new MediaMetadata({
+            title: name || 'Miru'
+          })
+    if (fileMedia.parseObject.release_group) metadata.artist = fileMedia.parseObject.release_group
+    navigator.mediaSession.metadata = metadata
   }
 </script>
 
 <script>
+  import { alEntry } from '@/modules/anilist.js'
+  import { resolveFileMedia } from '@/modules/anime.js'
   import Peer from '@/modules/Peer.js'
   import Subtitles from '@/modules/subtitles.js'
   import { toTS, videoRx } from '@/modules/util.js'
-  import anitomyscript from 'anitomyscript'
   import Keyboard from './Keyboard.svelte'
 
+  async function mediaChange(current, image) {
+    if (current && 'mediaSession' in navigator) {
+      if (!media || (!hadImage && image)) {
+        // filename is already mapped so this *should* be fine
+        const data = await resolveFileMedia({ fileName: current.name })
+        if (image) data.episodeThumbnail = image
+        updateMedia(data)
+      }
+    }
+  }
+
   export let miniplayer = false
   export let page
   $: updateFiles(files)
@@ -145,10 +159,14 @@
         interval: undefined,
         video: undefined
       })
+      src = ''
+      video?.load()
+      completed = false
       file.getStreamURL((err, url) => {
         src = url
         current = file
         video?.load()
+        currentTime = 0
       })
     }
   }
@@ -599,6 +617,18 @@
     target.classList.toggle('active')
     target.closest('.dropdown').classList.toggle('show')
   }
+
+  let completed = false
+  function checkCompletion() {
+    if (!completed && duration - 180 < currentTime) {
+      if (fileMedia?.media?.episodes || fileMedia?.media?.nextAiringEpisode?.episode) {
+        if (fileMedia.media.episodes || fileMedia.media.nextAiringEpisode?.episode > fileMedia.episodeNumber) {
+          completed = true
+          alEntry(fileMedia)
+        }
+      }
+    }
+  }
 </script>
 
 <svelte:window on:keydown={handleKeydown} bind:innerWidth bind:innerHeight />
@@ -640,6 +670,7 @@
       bind:muted
       bind:playbackRate
       on:timeupdate={() => createThumbnail()}
+      on:timeupdate={checkCompletion}
       on:waiting={showBuffering}
       on:loadeddata={hideBuffering}
       on:canplay={hideBuffering}

src/renderer/src/lib/pages/Settings.svelte

@@ -54,12 +54,12 @@
 </script>
 
 <Tabs>
-  <div class="d-flex w-full h-full root">
+  <div class="d-flex w-full h-full">
     <div class="d-flex flex-column h-full w-300 bg-dark border-left">
-      <div class="px-20 py-15 font-size-20 font-weight-semi-bold border-bottom">Settings</div>
+      <div class="px-20 py-15 font-size-20 font-weight-semi-bold border-bottom root">Settings</div>
       {#each Object.values(groups) as group}
         <TabLabel>
-          <div class="px-20 py-15 d-flex">
+          <div class="px-20 py-15 d-flex root">
             <span class="material-icons font-size-24 pr-10">{group.icon}</span>
             <div>
               <div class="font-weight-bold font-size-16">{group.name}</div>

src/renderer/src/modules/anilist.js

@@ -24,7 +24,7 @@ async function handleRequest (opts) {
 }
 
 export function alEntry (filemedia) {
-  if (filemedia.media && localStorage.getItem('ALtoken')) {
+  if (filemedia.media && alToken) {
     alRequest({ method: 'SearchIDStatus', id: filemedia.media.id }).then(res => {
       if ((res.errors && res.errors[0].status === 404) || res.data.MediaList.progress <= filemedia.episodeNumber || filemedia.episodes === 1) {
         const query = `
@@ -51,7 +51,7 @@ mutation ($id: Int, $status: MediaListStatus, $episode: Int, $repeat: Int) {
         const options = {
           method: 'POST',
           headers: {
-            Authorization: 'Bearer ' + localStorage.getItem('ALtoken'),
+            Authorization: 'Bearer ' + alToken,
             'Content-Type': 'application/json',
             Accept: 'application/json'
           },