Added option to update page title with stats.

README.md

@@ -91,6 +91,7 @@ Certain values can be set via environment variables, using the `-e` parameter on
 * __YTP_EXTRACT_INFO_TIMEOUT__: The timeout for extracting video information. Defaults to `70`.
 * __YTP_DB_FILE__: The path to the SQLite database file. Defaults to `{config_path}/ytptube.db`.
 * __YTP_MANUAL_ARCHIVE__: The path to the manual archive file. Defaults to `{config_path}/manual_archive.log`.
+* __YTP_UI_UPDATE_TITLE__: Whether to update the title of the page with the current stats. Defaults to `true`.
 
 ## Running behind a reverse proxy
 

app/library/config.py

@@ -55,6 +55,7 @@ class Config:
 
     db_file: str = "{config_path}/ytptube.db"
     manual_archive: str = "{config_path}/archive.manual.log"
+    ui_update_title: bool = True
 
     # immutable config vars.
     version: str = APP_VERSION
@@ -144,6 +145,7 @@ class Config:
         "access_log",
         "remove_files",
         "ignore_ui",
+        "ui_update_title",
     )
 
     _frontend_vars: tuple = (
@@ -156,6 +158,7 @@ class Config:
         "started",
         "url_prefix",
         "remove_files",
+        "ui_update_title",
     )
 
     @staticmethod

ui/layouts/default.vue

@@ -31,7 +31,7 @@
         </div>
 
         <div class="navbar-item" v-if="config.tasks.length > 0">
-          <NuxtLink  class="button is-dark has-tooltip-bottom" to="/tasks">
+          <NuxtLink class="button is-dark has-tooltip-bottom" to="/tasks">
             <span class="icon"><i class="fa-solid fa-tasks" /></span>
             <span class="is-hidden-mobile">Tasks</span>
           </NuxtLink>
@@ -135,6 +135,14 @@ const applyPreferredColorScheme = scheme => {
 
 onMounted(async () => {
   try {
+    if (config.app.ui_update_title) {
+      const s = useStateStore()
+      useHead({ title: `YTPTube: ( ${Object.keys(s.queue).length || 0} | ${Object.keys(s.history).length || 0} )` })
+      watch([s.queue, s.history], () => {
+        const title = `YTPTube: ( ${Object.keys(s.queue.length) || 0} | ${Object.keys(s.history.length) || 0} )`
+        useHead({ title })
+      })
+    }
     applyPreferredColorScheme(selectedTheme.value)
   } catch (e) {
   }

ui/stores/ConfigStore.js

@@ -4,6 +4,7 @@ const CONFIG_KEYS = {
     download_path: '/downloads',
     keep_archive: false,
     remove_files: false,
+    ui_update_title: true,
     output_template: '',
     ytdlp_version: '',
     version: '',