feat: delete only ignored videos cleanup

Author: christian-fei

client/components/manage-disk-space-form.js

@@ -5,23 +5,18 @@ class ManageDiskSpaceForm extends HTMLElement {
   connectedCallback () {
     this.render()
     this.registerEvents()
-
-    const $diskSpaceUsed = document.getElementById('disk-space-used')
-    window.fetch('/api/disk-usage')
-    .then(response => response.text())
-    .then((diskSpaceUsed) => {
-      $diskSpaceUsed.innerText = diskSpaceUsed
-    })
-    .catch(err => console.error(err))
+    this.updateDiskSpaceUsed()
   }
   disconnectedCallback () {
     this.unregisterEvents()
   }
   registerEvents () {
     this.querySelector('#reclaim-disk-space').addEventListener('click', this.reclaimDiskSpace.bind(this))
+    this.querySelector('#delete-only-ignored').addEventListener('change', this.updateDiskSpaceUsed.bind(this))
   }
   unregisterEvents () {
     this.querySelector('#reclaim-disk-space').removeEventListener('click', this.reclaimDiskSpace.bind(this))
+    this.querySelector('#delete-only-ignored').removeEventListener('change', this.updateDiskSpaceUsed.bind(this))
   }
   render () {
     this.innerHTML = /*html*/`
@@ -30,7 +25,7 @@ class ManageDiskSpaceForm extends HTMLElement {
           <div>
             Delete downloaded videos to reclaim disk space
           </div>
-          <div>
+          <div class="user-select-none">
             <label for="delete-only-ignored">
               Only ignored videos
             </label>
@@ -43,12 +38,21 @@ class ManageDiskSpaceForm extends HTMLElement {
     `
   }
 
+  updateDiskSpaceUsed() {
+    const onlyIgnored = this.querySelector('#delete-only-ignored').checked
+    const $diskSpaceUsed = this.querySelector('#disk-space-used')
+    window.fetch(onlyIgnored ? '/api/disk-usage?onlyIgnored=true' : '/api/disk-usage')
+    .then(response => response.text())
+    .then((diskSpaceUsed) => {
+      $diskSpaceUsed.innerText = diskSpaceUsed
+    })
+    .catch(err => console.error(err))
+  }
+
   reclaimDiskSpace (event) {
     event.preventDefault()
     if (!confirm('About to delete downloaded videos, are you sure?')) return
-    console.log('reclaiming')
     const onlyIgnored = this.querySelector('#delete-only-ignored').checked
-    console.log({onlyIgnored})
     const $diskUsage = this.querySelector('#disk-usage')
     window.fetch('/api/reclaim-disk-space', {
       method: 'POST',

lib/server.js

@@ -1,6 +1,7 @@
 import http from 'http'
 import { URL } from 'url'
 import fs from 'fs'
+import querystring from 'querystring'
 import { summarizeVideo } from './subtitles-summary.js'
 import { handleSSE, broadcastSSE } from './sse.js'
 import { downloadVideo, extractIdFromUrl, isUnsupportedUrl, isYouTubeUrl } from './youtube.js'
@@ -114,6 +115,12 @@ export function createServer ({repo, connections = []}) {
     })
   }
 
+  function getQuery (req) {
+    return req.url.indexOf('?') >= 0
+     ? querystring.parse(req.url.substring(req.url.indexOf('?') + 1)) 
+     : {}
+  }
+
   async function addChannelHandler(req, res, repo, connections = []) {
     const body = await getBody(req)
     let { name } = JSON.parse(body)
@@ -304,11 +311,17 @@ export function createServer ({repo, connections = []}) {
   }
 
   function diskUsageHandler(req, res) {
+    const onlyIgnored = getQuery(req).onlyIgnored === 'true'
     const videos = repo.getVideos()
-    const ignoredVideos = videos.filter(video => video.downloaded)
-    const diskSpaceUsed = ignoredVideos.reduce((total, video) => {
+
+    const filterFn = onlyIgnored
+      ? video => video.downloaded && video.ignored 
+      : video => video.downloaded
+    
+    const diskSpaceUsed = videos.filter(filterFn)
+    .reduce((total, video) => {
       try {
-        return total + fs.statSync(`./data/videos/${video.id}.mp4`).size / 1000 / 1000 / 1000
+        return total + fs.statSync(`./data/videos/${video.id}.mp4`).size / Math.pow(10, 9)
       } catch (err) {
         return total
       }