Add option to display distraction free titles

src/renderer/components/distraction-settings/distraction-settings.js

@@ -65,6 +65,9 @@ export default Vue.extend({
     hideChapters: function () {
       return this.$store.getters.getHideChapters
     },
+    showDistractionFreeTitles: function () {
+      return this.$store.getters.getShowDistractionFreeTitles
+    },
     channelsHidden: function () {
       return JSON.parse(this.$store.getters.getChannelsHidden)
     }
@@ -100,7 +103,8 @@ export default Vue.extend({
       'updateHideUpcomingPremieres',
       'updateHideSharingActions',
       'updateHideChapters',
-      'updateChannelsHidden'
+      'updateChannelsHidden',
+      'updateShowDistractionFreeTitles'
     ])
   }
 })

src/renderer/components/distraction-settings/distraction-settings.vue

@@ -102,6 +102,12 @@
           :default-value="hideComments"
           @change="updateHideComments"
         />
+        <ft-toggle-switch
+          :label="$t('Settings.Distraction Free Settings.Show distraction free titles')"
+          :compact="true"
+          :default-value="showDistractionFreeTitles"
+          @change="updateShowDistractionFreeTitles"
+        />
       </div>
     </div>
     <br>

src/renderer/components/ft-list-video/ft-list-video.js

@@ -7,7 +7,9 @@ import {
   formatDurationAsTimestamp,
   openExternalLink,
   showToast,
-  toLocalePublicationString
+  toLocalePublicationString,
+  toDistractionFreeTitle,
+
 } from '../../helpers/utils'
 
 export default Vue.extend({
@@ -282,7 +284,10 @@ export default Vue.extend({
 
     currentLocale: function () {
       return i18n.locale.replace('_', '-')
-    }
+    },
+    showDistractionFreeTitles: function () {
+      return this.$store.getters.getShowDistractionFreeTitles
+    },
   },
   mounted: function () {
     this.parseVideoData()
@@ -361,7 +366,12 @@ export default Vue.extend({
 
     parseVideoData: function () {
       this.id = this.data.videoId
-      this.title = this.data.title
+
+      if (this.showDistractionFreeTitles) {
+        this.title = toDistractionFreeTitle(this.data.title)
+      } else {
+        this.title = this.data.title
+      }
       // this.thumbnail = this.data.videoThumbnails[4].url
 
       this.channelName = this.data.author

src/renderer/helpers/utils.js

@@ -496,3 +496,26 @@ export function extractNumberFromString(str) {
     return NaN
   }
 }
+
+/**
+ * This will match sequences of upper case characters and convert them into title cased words.
+ * @param {string} title the title to process
+ * @param {number} minUpperCase the minimum number of consecutive upper case characters to match
+ * @returns {string} the title with upper case characters removed
+ */
+export function toDistractionFreeTitle(title, minUpperCase = 3) {
+  const firstValidCharIndex = (word) => {
+    const reg = /[\p{L}]/u
+    return word.search(reg)
+  }
+
+  const capitalizedWord = (word) => {
+    const chars = word.split('')
+    const index = firstValidCharIndex(word)
+    chars[index] = chars[index].toUpperCase()
+    return chars.join('')
+  }
+
+  const reg = RegExp(`[\\p{Lu}|']{${minUpperCase},}`, 'ug')
+  return title.replace(reg, x => capitalizedWord(x.toLowerCase()))
+}

src/renderer/store/modules/settings.js

@@ -213,6 +213,7 @@ const state = {
   hideWatchedSubs: false,
   hideLabelsSideBar: false,
   hideChapters: false,
+  showDistractionFreeTitles: false,
   landingPage: 'subscriptions',
   listType: 'grid',
   maxVideoPlaybackRate: 3,

static/locales/en-US.yaml

@@ -322,6 +322,7 @@ Settings:
     Hide Active Subscriptions: Hide Active Subscriptions
     Hide Video Description: Hide Video Description
     Hide Comments: Hide Comments
+    Show distraction free titles: Show distraction free titles
     Hide Live Streams: Hide Live Streams
     Hide Upcoming Premieres: Hide Upcoming Premieres
     Hide Sharing Actions: Hide Sharing Actions