fixed DeleteOverlay

src/App.vue

@@ -2,13 +2,11 @@
     <div id="app">
         <main>
             <Navigation />
-            <router-view />
+            <router-view ref="currentView" />
         </main>
 
         <ContextMenu>
         </ContextMenu>
-
-        <DeleteOverlay v-if="showDeleteOverlay" v-bind:deleteFiles="deleteFiles" />
     </div>
 </template>
 
@@ -21,77 +19,27 @@
 
     import Navigation from '@/components/Navigation/Navigation.vue';
     import ContextMenu from '@/components/ContextMenu/ContextMenu.vue';
-    import DeleteOverlay from '@/components/Overlays/DeleteOverlay.vue';
 
     export default {
         name: 'App',
         components: {
             Navigation,
-            ContextMenu,
-            DeleteOverlay
+            ContextMenu
         },
         data: function() {
             return {
-                downloadQueue: [],
-                showDeleteOverlay: false,
-                deleteFiles: []
+                downloadQueue: []
             }
         },
         mounted: function() {
             this.$root.$on('download', (url) => {
                 this.addToQueue(url);
             });
-            this.$root.$on('delete', (file) => {
-                this.$data.showDeleteOverlay = true;
-                this.$data.deleteFiles = this.getConnectedFiles(file);
-                console.log(this.$data.deleteFiles);
-            });
-            this.$root.$on('deleteDeny', () => {
-                this.$data.showDeleteOverlay = false;
-                this.$data.deleteFiles = "";
-            });
-            this.$root.$on('deleteConfirmed', () => {
-                this.$data.deleteFiles.forEach((file) => {
-                    fs.unlinkSync(file);
-                });
-                this.$data.showDeleteOverlay = false;
-                this.$data.deleteFiles = "";
-            });
         },
         methods: {
             addToQueue: function(url) {
                 this.$data.downloadQueue.push(url);
                 console.log("Added " + url + " to queue");
-            },
-            getConnectedFiles: function(srtbFilePath) {
-                let userSettings = new UserSettings();
-                let srtbContent = JSON.parse( fs.readFileSync(srtbFilePath) );
-                let connectedFiles = [];
-
-                connectedFiles.push(srtbFilePath);
-
-                let stringValueContainers = srtbContent['largeStringValuesContainer'].values;
-
-                stringValueContainers.forEach((stringValueContainer) => {
-                    if(stringValueContainer.key == "SO_TrackInfo_TrackInfo") {
-                        let rawTrackInfo = JSON.parse( stringValueContainer.val );
-                        let coverPath = glob.sync(path.join(userSettings.get('gameDirectory'), "AlbumArt", rawTrackInfo.albumArtReference.assetName + ".*"))[0];
-
-                        if(coverPath) {
-                            connectedFiles.push(coverPath);
-                        }
-                    }
-                    if(stringValueContainer.key.includes("SO_ClipInfo")) {
-                        let rawClipInfo = JSON.parse( stringValueContainer.val );
-                        let clipPath = glob.sync(path.join(userSettings.get('gameDirectory'), "AudioClips", rawClipInfo.clipAssetReference.assetName + ".*"))[0];
-
-                        if(clipPath) {
-                            connectedFiles.push(clipPath);
-                        }
-                    }
-                });
-
-                return connectedFiles;
             }
         },
         watch: {

src/components/Overlays/DeleteOverlay.vue

@@ -9,7 +9,7 @@
                 </div>
             </div>
             <div class="delete-actions">
-                <button class="button">Delete</button>
+                <button class="button" v-on:click="confirm()">Delete</button>
                 <button class="button" v-on:click="close()">Close</button>
             </div>
         </div>
@@ -27,10 +27,11 @@
         ],
         methods: {
             confirm() {
-                this.$root.$emit('deleteConfirm');
+                console.log("confirm");
+                this.$parent.$emit('deleteConfirm');
             },
             close() {
-                this.$root.$emit('deleteDeny');
+                this.$parent.$emit('deleteDeny');
             }
         }
     }

src/components/Song/SongLocalItem.vue

@@ -38,7 +38,7 @@
                     x: e.pageX,
                     y: e.pageY,
                     items: [
-                        { icon: "delete", title: "Delete", method: () => { this.$root.$emit('delete', this.$props.file); } }
+                        { icon: "delete", title: "Delete", method: () => { this.$parent.$parent.$emit('delete', this.$props.file); } }
                     ]});
             }
         }

src/views/Library.vue

@@ -14,17 +14,20 @@
                     v-bind="song" />
             </template>
         </SongRow>
+
+        <DeleteOverlay v-if="showDeleteOverlay" v-bind:deleteFiles="deleteFiles" />
     </section>
 </template>
 
 <script>
-    import glob from 'glob';
     import fs from 'fs';
+    import glob from 'glob';
     import path from 'path';
 
     import UserSettings from '@/modules/module.usersettings.js';
     import SRXD from '@/modules/module.srxd.js';
 
+    import DeleteOverlay from '@/components/Overlays/DeleteOverlay.vue';
     import SongRow from '@/components/Song/SongRow.vue';
     import SongLocalItem from '@/components/Song/SongLocalItem.vue';
     import SongInstallItem from '@/components/Song/SongInstallItem.vue';
@@ -33,16 +36,37 @@
         name: 'Library',
         data: function() {
             return {
-                librarySongs: []
+                librarySongs: [],
+                showDeleteOverlay: false,
+                deleteFiles: []
             }
         },
         components: {
             SongRow,
             SongLocalItem,
-            SongInstallItem
+            SongInstallItem,
+            DeleteOverlay
         },
         mounted: function() {
             this.refreshLibrary();
+            
+            this.$on('delete', (file) => {
+                this.$data.showDeleteOverlay = true;
+                this.$data.deleteFiles = this.getConnectedFiles(file);
+                console.log(this.$data.deleteFiles);
+            });
+            this.$on('deleteDeny', () => {
+                this.$data.showDeleteOverlay = false;
+                this.$data.deleteFiles = "";
+            });
+            this.$on('deleteConfirm', () => {
+                this.$data.deleteFiles.forEach((file) => {
+                    fs.unlinkSync(file);
+                });
+                this.refreshLibrary();
+                this.$data.showDeleteOverlay = false;
+                this.$data.deleteFiles = "";
+            });
         },
         methods: {
             refreshLibrary: function() {
@@ -96,6 +120,36 @@
                 });
                         
                 return trackInfo;
+            },
+            getConnectedFiles: function(srtbFilePath) {
+                let userSettings = new UserSettings();
+                let srtbContent = JSON.parse( fs.readFileSync(srtbFilePath) );
+                let connectedFiles = [];
+
+                connectedFiles.push(srtbFilePath);
+
+                let stringValueContainers = srtbContent['largeStringValuesContainer'].values;
+
+                stringValueContainers.forEach((stringValueContainer) => {
+                    if(stringValueContainer.key == "SO_TrackInfo_TrackInfo") {
+                        let rawTrackInfo = JSON.parse( stringValueContainer.val );
+                        let coverPath = glob.sync(path.join(userSettings.get('gameDirectory'), "AlbumArt", rawTrackInfo.albumArtReference.assetName + ".*"))[0];
+
+                        if(coverPath) {
+                            connectedFiles.push(coverPath);
+                        }
+                    }
+                    if(stringValueContainer.key.includes("SO_ClipInfo")) {
+                        let rawClipInfo = JSON.parse( stringValueContainer.val );
+                        let clipPath = glob.sync(path.join(userSettings.get('gameDirectory'), "AudioClips", rawClipInfo.clipAssetReference.assetName + ".*"))[0];
+
+                        if(clipPath) {
+                            connectedFiles.push(clipPath);
+                        }
+                    }
+                });
+
+                return connectedFiles;
             }
         }
     }