From 19d5e374ad769cb9d37539d2df16de2a4519334c Mon Sep 17 00:00:00 2001
From: Hannes Thaller <hannes.thaller.at@gmail.com>
Date: Tue, 28 Apr 2020 23:28:16 +0200
Subject: [PATCH] Added character blacklisting

Bumped version to 0.2.0
---
 package.json                     |   2 +-
 src/assets/EpisodeService.js     |  12 ++-
 src/assets/FileService.js        |   1 +
 src/components/EpisodeList.vue   | 100 +++++++++++-----------
 src/components/FileList.vue      |   2 +-
 src/components/SettingsPopup.vue | 139 ++++++++++++++++++-------------
 src/components/Toolbar.vue       |   2 +-
 src/store.js                     |   3 +-
 8 files changed, 147 insertions(+), 114 deletions(-)

diff --git a/package.json b/package.json
index 8af022f..05fc1cf 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
   "author": "Hannes Thaller",
   "email": "hannes.thaller.at@gmail.com",
   "homepage": "https://tallic.github.io/name-it/",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "private": true,
   "license": "MIT",
   "repository": "https://github.com/Tallic/name-it",
diff --git a/src/assets/EpisodeService.js b/src/assets/EpisodeService.js
index 9200a7f..1487cfc 100644
--- a/src/assets/EpisodeService.js
+++ b/src/assets/EpisodeService.js
@@ -64,7 +64,15 @@ export default {
             }
         }).sort((a, b) => a.episodeNumber - b.episodeNumber)
     },
-    formatEpisodeName(episode, format) {
+    normalizeFileNames(name, blacklist) {
+        if(blacklist === null || blacklist.length === 0 || name === null || name.length === 0 ){
+            return name
+        }
+
+        const blacklistSet = new Set(blacklist)
+        return Array.from(name).map(c => blacklistSet.has(c) ? '' : c).join('')
+    },
+    formatEpisodeName(episode, format, blacklist) {
         let name = format.replace("{series}", episode.seriesTitle)
             .replace("{episode}", episode.episodeTitle);
 
@@ -73,6 +81,6 @@ export default {
         name = replaceNumberPattern(name, episode.seasonNumber, seasonNumberRegex);
         name = replaceNumberPattern(name, episode.seasonNumber, seasonNumberRegexPrefix, "S");
 
-        return name
+        return this.normalizeFileNames(name, blacklist)
     }
 }
diff --git a/src/assets/FileService.js b/src/assets/FileService.js
index 3c4eef2..cd5086c 100644
--- a/src/assets/FileService.js
+++ b/src/assets/FileService.js
@@ -39,6 +39,7 @@ export default {
 
         return _.sortBy(files, ["weight"])
     },
+
     async renameFiles(files, names) {
 
         let promises = [];
diff --git a/src/components/EpisodeList.vue b/src/components/EpisodeList.vue
index efcb887..82dc208 100644
--- a/src/components/EpisodeList.vue
+++ b/src/components/EpisodeList.vue
@@ -1,61 +1,61 @@
 <template>
-  <v-card class="mx-auto scroll" tile>
+    <v-card class="mx-auto scroll" tile>
 
-    <v-toolbar flat>
-      <v-subheader>Episodes</v-subheader>
-      <v-spacer></v-spacer>
-      <v-btn :color="previewColor"
-             @click="preview = !preview"
-             class="mx-1" icon>
-        <v-icon>mdi-set-center-right</v-icon>
-      </v-btn>
-      <v-btn class="mx-1" @click="$store.commit('setSearchRequest', true)"
-             :loading="$store.state.loadingEpisodes"
-             icon>
-        <v-icon>mdi-magnify</v-icon>
-      </v-btn>
-      <v-chip class="mx-1" :color="chipColor" outlined>{{episodes.length}}</v-chip>
-    </v-toolbar>
+        <v-toolbar flat>
+            <v-subheader>Episodes</v-subheader>
+            <v-spacer></v-spacer>
+            <v-btn :color="previewColor"
+                   @click="preview = !preview"
+                   class="mx-1" icon>
+                <v-icon>mdi-set-center-right</v-icon>
+            </v-btn>
+            <v-btn class="mx-1" @click="$store.commit('setSearchRequest', true)"
+                   :loading="$store.state.loadingEpisodes"
+                   icon>
+                <v-icon>mdi-magnify</v-icon>
+            </v-btn>
+            <v-chip class="mx-1" :color="chipColor" outlined>{{episodes.length}}</v-chip>
+        </v-toolbar>
 
-    <v-divider></v-divider>
+        <v-divider></v-divider>
 
-    <v-list shaped :dense="$store.state.denseLists">
-      <v-list-item v-for="(it, i) in episodes"
-                   :key="it.id"
-                   class="pr-0 my-1">
+        <v-list shaped :dense="$store.state.denseLists">
+            <v-list-item v-for="(it, i) in episodes"
+                         :key="it.id"
+                         class="pr-0 my-1">
 
-        <v-list-item-action class="mr-2 my-0">
-          <v-btn icon @click="removeElement(it.id)">
-            <v-icon>mdi-close</v-icon>
-          </v-btn>
-        </v-list-item-action>
+                <v-list-item-action class="mr-2 my-0">
+                    <v-btn icon @click="removeElement(it.id)">
+                        <v-icon>mdi-close</v-icon>
+                    </v-btn>
+                </v-list-item-action>
 
-        <v-divider vertical></v-divider>
+                <v-divider vertical></v-divider>
 
-        <v-list-item-group v-model="selectedItem" color="primary" style="width: 100%">
-          <v-list-item :value="i">
-            <template v-slot:default="{active}">
-              <v-list-item-content>
-                <span v-if="preview">{{formatEpisodeName(it)}}</span>
-                <span v-else>{{it.episodeNumber}}. {{it.episodeTitle}}</span>
-                <span class="grey--text caption" v-if="active">aired on {{it.date}}</span>
-              </v-list-item-content>
-            </template>
-          </v-list-item>
-        </v-list-item-group>
+                <v-list-item-group v-model="selectedItem" color="primary" style="width: 100%">
+                    <v-list-item :value="i">
+                        <template v-slot:default="{active}">
+                            <v-list-item-content>
+                                <span v-if="preview">{{formatEpisodeName(it)}}</span>
+                                <span v-else>{{it.episodeNumber}}. {{it.episodeTitle}}</span>
+                                <span class="grey--text caption" v-if="active">aired on {{it.date}}</span>
+                            </v-list-item-content>
+                        </template>
+                    </v-list-item>
+                </v-list-item-group>
 
-      </v-list-item>
-    </v-list>
+            </v-list-item>
+        </v-list>
 
-    <v-card-actions>
-      <div class="flex-grow-1"></div>
-      <v-btn :disabled="episodes.length === 0"
-             @click="clearEpisodes"
-             text>
-        clear
-      </v-btn>
-    </v-card-actions>
-  </v-card>
+        <v-card-actions>
+            <div class="flex-grow-1"></div>
+            <v-btn :disabled="episodes.length === 0"
+                   @click="clearEpisodes"
+                   text>
+                clear
+            </v-btn>
+        </v-card-actions>
+    </v-card>
 </template>
 
 <script>
@@ -114,7 +114,7 @@
                 this.episodes = this.episodes.filter(it => it.id !== id)
             },
             formatEpisodeName: function (episode) {
-                return EpisodeService.formatEpisodeName(episode, this.$store.state.nameFormat)
+                return EpisodeService.formatEpisodeName(episode, this.$store.state.nameFormat, this.$store.state.blacklist)
             }
         }
     }
diff --git a/src/components/FileList.vue b/src/components/FileList.vue
index 4d7308a..727203d 100644
--- a/src/components/FileList.vue
+++ b/src/components/FileList.vue
@@ -115,7 +115,7 @@
             },
             rename: function () {
                 this.renamingInProgress = true;
-                const names = this.$store.state.episodes.map(it => EpisodeService.formatEpisodeName(it, this.$store.state.nameFormat))
+                const names = this.$store.state.episodes.map(it => EpisodeService.formatEpisodeName(it, this.$store.state.nameFormat, this.$store.state.blacklist))
                 FileService.renameFiles(this.$store.state.files, names)
                     .then(newFiles => {
                         this.files = newFiles;
diff --git a/src/components/SettingsPopup.vue b/src/components/SettingsPopup.vue
index 8218eb2..22554a6 100644
--- a/src/components/SettingsPopup.vue
+++ b/src/components/SettingsPopup.vue
@@ -1,69 +1,76 @@
 <template>
-  <v-dialog v-model="openSettings" width="75%" max-width="75%">
-    <v-card>
-      <v-card-title class="headline grey lighten-2" primary-title>
-        Settings
-      </v-card-title>
-      <v-container>
-        <span class="title">Language</span>
-        <v-row>
-          <v-col cols="4">
-            <v-combobox v-model="languageSelection"
-                        :items="languages"
-                        item-text="name"
-                        item-value="code"
-                        label="Select"
-                        persistent-hint
-                        allow-overflow
-                        single-line></v-combobox>
-          </v-col>
-        </v-row>
-        <span class="title">Renaming Format</span>
-        <v-row>
-          <v-col cols="12">
-            <v-text-field v-model="format"
-                          :label="helpEpisodeRenamed"></v-text-field>
-          </v-col>
-        </v-row>
-        <v-row>
-          <v-col cols="12">
-            Examples
-            <v-list dense>
-              <v-list-item-group v-model="format" color="primary">
+    <v-dialog v-model="openSettings" width="75%" max-width="75%">
+        <v-card>
+            <v-card-title class="headline grey lighten-2" primary-title>
+                Settings
+            </v-card-title>
+            <v-container>
+                <span class="title">Language</span>
+                <v-row>
+                    <v-col cols="4">
+                        <v-combobox v-model="languageSelection"
+                                    :items="languages"
+                                    item-text="name"
+                                    item-value="code"
+                                    label="Select"
+                                    persistent-hint
+                                    allow-overflow
+                                    single-line></v-combobox>
+                    </v-col>
+                </v-row>
+                <span class="title">Renaming Format</span>
+                <v-row>
+                    <v-col cols="12">
+                        <v-text-field v-model="format"
+                                      :label="helpEpisodeRenamed"></v-text-field>
+                    </v-col>
+                </v-row>
+                <v-row>
+                    <v-col cols="12">
+                        Examples
+                        <v-list dense>
+                            <v-list-item-group v-model="format" color="primary">
 
-                <v-list-item v-for="it in examples"
-                             :key="it.format"
-                             :value="it.format"
-                             @click="format = it.format">
-                  <template v-slot:default="{active}">
+                                <v-list-item v-for="it in examples"
+                                             :key="it.format"
+                                             :value="it.format"
+                                             @click="format = it.format">
+                                    <template v-slot:default="{active}">
 
-                    <v-list-item-content>
-                      <v-list-item-title>{{it.renamed}}</v-list-item-title>
-                      <v-list-item-subtitle>{{it.format}}</v-list-item-subtitle>
-                    </v-list-item-content>
+                                        <v-list-item-content>
+                                            <v-list-item-title>{{it.renamed}}</v-list-item-title>
+                                            <v-list-item-subtitle>{{it.format}}</v-list-item-subtitle>
+                                        </v-list-item-content>
 
-                  </template>
-                </v-list-item>
+                                    </template>
+                                </v-list-item>
 
-              </v-list-item-group>
-            </v-list>
-          </v-col>
-        </v-row>
-      </v-container>
+                            </v-list-item-group>
+                        </v-list>
+                    </v-col>
+                </v-row>
 
-      <v-card-actions>
-        <div class="flex-grow-1"></div>
-        <v-btn color="primary" @click="$store.commit('setSettings', false)" text>
-          Close
-        </v-btn>
-      </v-card-actions>
-    </v-card>
-  </v-dialog>
+                <span class="title">Character Blacklist</span>
+                <v-row>
+                    <v-col cols="12">
+                        <v-text-field v-model="blacklist"
+                                      label="Comma separated list of characters that are removed from the file name"></v-text-field>
+                    </v-col>
+                </v-row>
+            </v-container>
+
+            <v-card-actions>
+                <div class="flex-grow-1"></div>
+                <v-btn color="primary" @click="$store.commit('setSettings', false)" text>
+                    Close
+                </v-btn>
+            </v-card-actions>
+        </v-card>
+    </v-dialog>
 </template>
 
 <script>
     import EpisodeService from "../assets/EpisodeService";
-
     export default {
 
         name: "SettingsPopup",
@@ -84,6 +91,14 @@
                     "seriesTitle": "Game of Thrones",
                     "date": "2011-4-17",
                 },
+                helpEpisodeBroken: {
+                    "id": 1,
+                    "episodeTitle": "Winter Is Coming?",
+                    "episodeNumber": 1,
+                    "seasonNumber": 1,
+                    "seriesTitle": "Game of Thrones",
+                    "date": "2011-4-17",
+                },
                 languages: [
                     {name: "English", code: "en"},
                     {name: "German", code: "de"},
@@ -109,8 +124,16 @@
                     this.$store.commit("setNameFormat", value)
                 }
             },
+            blacklist: {
+                get: function () {
+                    return this.$store.state.blacklist
+                },
+                set: function (value) {
+                    this.$store.commit("setBlacklist", value)
+                }
+            },
             helpEpisodeRenamed: function () {
-                return EpisodeService.formatEpisodeName(this.helpEpisode, this.format)
+                return EpisodeService.formatEpisodeName(this.helpEpisode, this.format, this.$store.state.blacklist)
             },
             languageSelection: {
                 get: function () {
@@ -124,7 +147,7 @@
                 return this.formatExamples.map(it => {
                     return {
                         format: it,
-                        renamed: EpisodeService.formatEpisodeName(this.helpEpisode, it)
+                        renamed: EpisodeService.formatEpisodeName(this.helpEpisode, it, this.$store.state.blacklist)
                     }
                 })
             }
diff --git a/src/components/Toolbar.vue b/src/components/Toolbar.vue
index 80ccce0..f87e498 100644
--- a/src/components/Toolbar.vue
+++ b/src/components/Toolbar.vue
@@ -33,7 +33,7 @@
            @click="$store.commit('setSettings', true)"
            :color="settings"
            icon>
-      <v-icon>mdi-settings</v-icon>
+      <v-icon>mdi-cog</v-icon>
     </v-btn>
   </v-app-bar>
 </template>
diff --git a/src/store.js b/src/store.js
index a83b47b..4764e57 100644
--- a/src/store.js
+++ b/src/store.js
@@ -17,7 +17,8 @@ export default new Vuex.Store({
         language: {name: "English", code: "en"},
         notify: false,
         notificationText: null,
-        notificationColor: null
+        notificationColor: null,
+        blacklist: ['&', '$', '@', ':', ';', '?', ',', '%', '\\', '/', '<', '>']
     },
     mutations: {
         setSearchRequest(state, val) {