Skip to content

D
Desktop Client
Commit 69b916f5 authored by SpinShare's avatar SpinShare
Browse files
Options

added download queue

parent edefd63d
Show whitespace changes
Inline Side-by-side
Showing with 352 additions and 124 deletions
package-lock.json
View file @ 69b916f5
...@@ -5007,16 +5007,6 @@ ...@@ -5007,16 +5007,6 @@
"extract-zip": "^1.6.7" "extract-zip": "^1.6.7"
} }
}, },
"electron-dl": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/electron-dl/-/electron-dl-3.0.0.tgz",
"integrity": "sha512-TeBRv+vQgNVLGf/XLV4EYfYIBMI4TQcw84aDlM8xEm/1Lgxux3PUXDzaingivf+6jMvRojXSRPTHmiWI/6LrqQ==",
"requires": {
"ext-name": "^5.0.0",
"pupa": "^2.0.1",
"unused-filename": "^2.1.0"
}
},
"electron-download": { "electron-download": {
"version": "4.1.1", "version": "4.1.1",
"resolved": "https://registry.npmjs.org/electron-download/-/electron-download-4.1.1.tgz", "resolved": "https://registry.npmjs.org/electron-download/-/electron-download-4.1.1.tgz",
...@@ -5056,6 +5046,11 @@ ...@@ -5056,6 +5046,11 @@
} }
} }
}, },
"electron-download-manager": {
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/electron-download-manager/-/electron-download-manager-2.1.2.tgz",
"integrity": "sha512-9v8aeMVZTX69NjEveKlKfTlJY74twpKktTXrmDI+UcQHZg7FtwuqxWw0ZNrjtVAOBcVNKzwG4ekn44B+xhz1tg=="
},
"electron-publish": { "electron-publish": {
"version": "21.2.0", "version": "21.2.0",
"resolved": "https://registry.npmjs.org/electron-publish/-/electron-publish-21.2.0.tgz", "resolved": "https://registry.npmjs.org/electron-publish/-/electron-publish-21.2.0.tgz",
...@@ -5224,11 +5219,6 @@ ...@@ -5224,11 +5219,6 @@
"is-symbol": "^1.0.2" "is-symbol": "^1.0.2"
} }
}, },
"escape-goat": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/escape-goat/-/escape-goat-2.1.1.tgz",
"integrity": "sha512-8/uIhbG12Csjy2JEW7D9pHbreaVaS/OpN3ycnyvElTdwM5n6GY6W6e2IPemfvGZeUMqZ9A/3GqIZMgKnBhAw/Q=="
},
"escape-html": { "escape-html": {
"version": "1.0.3", "version": "1.0.3",
"resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz", "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
...@@ -5447,23 +5437,6 @@ ...@@ -5447,23 +5437,6 @@
} }
} }
}, },
"ext-list": {
"version": "2.2.2",
"resolved": "https://registry.npmjs.org/ext-list/-/ext-list-2.2.2.tgz",
"integrity": "sha512-u+SQgsubraE6zItfVA0tBuCBhfU9ogSRnsvygI7wht9TS510oLkBRXBsqopeUG/GBOIQyKZO9wjTqIu/sf5zFA==",
"requires": {
"mime-db": "^1.28.0"
}
},
"ext-name": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/ext-name/-/ext-name-5.0.0.tgz",
"integrity": "sha512-yblEwXAbGv1VQDmow7s38W77hzAgJAO50ztBLMcUyUBfxv1HC+LGwtiEN+Co6LtlqT/5uwVOxsD4TNIilWhwdQ==",
"requires": {
"ext-list": "^2.0.0",
"sort-keys-length": "^1.0.0"
}
},
"extend": { "extend": {
"version": "3.0.2", "version": "3.0.2",
"resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz", "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
...@@ -7586,7 +7559,8 @@ ...@@ -7586,7 +7559,8 @@
"is-plain-obj": { "is-plain-obj": {
"version": "1.1.0", "version": "1.1.0",
"resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz", "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz",
"integrity": "sha1-caUMhCnfync8kqOQpKA7OfzVHT4=" "integrity": "sha1-caUMhCnfync8kqOQpKA7OfzVHT4=",
"dev": true
}, },
"is-plain-object": { "is-plain-object": {
"version": "2.0.4", "version": "2.0.4",
...@@ -8384,7 +8358,8 @@ ...@@ -8384,7 +8358,8 @@
"mime-db": { "mime-db": {
"version": "1.43.0", "version": "1.43.0",
"resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.43.0.tgz", "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.43.0.tgz",
"integrity": "sha512-+5dsGEEovYbT8UY9yD7eE4XTc4UwJ1jBYlgaQQF38ENsKR3wj/8q8RFZrF9WIZpB2V1ArTVFUva8sAul1NzRzQ==" "integrity": "sha512-+5dsGEEovYbT8UY9yD7eE4XTc4UwJ1jBYlgaQQF38ENsKR3wj/8q8RFZrF9WIZpB2V1ArTVFUva8sAul1NzRzQ==",
"dev": true
}, },
"mime-types": { "mime-types": {
"version": "2.1.26", "version": "2.1.26",
...@@ -8560,11 +8535,6 @@ ...@@ -8560,11 +8535,6 @@
"minimist": "^1.2.5" "minimist": "^1.2.5"
} }
}, },
"modify-filename": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/modify-filename/-/modify-filename-1.1.0.tgz",
"integrity": "sha1-mi3sg4Bvuy2XXyK+7IWcoms5OqE="
},
"move-concurrently": { "move-concurrently": {
"version": "1.0.1", "version": "1.0.1",
"resolved": "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz", "resolved": "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz",
...@@ -10274,14 +10244,6 @@ ...@@ -10274,14 +10244,6 @@
"integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==", "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==",
"dev": true "dev": true
}, },
"pupa": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/pupa/-/pupa-2.0.1.tgz",
"integrity": "sha512-hEJH0s8PXLY/cdXh66tNEQGndDrIKNqNC5xmrysZy3i5C3oEoLna7YAOad+7u125+zH1HNXUmGEkrhb3c2VriA==",
"requires": {
"escape-goat": "^2.0.0"
}
},
"q": { "q": {
"version": "1.5.1", "version": "1.5.1",
"resolved": "https://registry.npmjs.org/q/-/q-1.5.1.tgz", "resolved": "https://registry.npmjs.org/q/-/q-1.5.1.tgz",
...@@ -11437,18 +11399,11 @@ ...@@ -11437,18 +11399,11 @@
"version": "1.1.2", "version": "1.1.2",
"resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-1.1.2.tgz", "resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-1.1.2.tgz",
"integrity": "sha1-RBttTTRnmPG05J6JIK37oOVD+a0=", "integrity": "sha1-RBttTTRnmPG05J6JIK37oOVD+a0=",
"dev": true,
"requires": { "requires": {
"is-plain-obj": "^1.0.0" "is-plain-obj": "^1.0.0"
} }
}, },
"sort-keys-length": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/sort-keys-length/-/sort-keys-length-1.0.1.tgz",
"integrity": "sha1-nLb09OnkgVWmqgZx7dM2/xR5oYg=",
"requires": {
"sort-keys": "^1.0.0"
}
},
"source-list-map": { "source-list-map": {
"version": "2.0.1", "version": "2.0.1",
"resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz", "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.1.tgz",
...@@ -12567,22 +12522,6 @@ ...@@ -12567,22 +12522,6 @@
} }
} }
}, },
"unused-filename": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/unused-filename/-/unused-filename-2.1.0.tgz",
"integrity": "sha512-BMiNwJbuWmqCpAM1FqxCTD7lXF97AvfQC8Kr/DIeA6VtvhJaMDupZ82+inbjl5yVP44PcxOuCSxye1QMS0wZyg==",
"requires": {
"modify-filename": "^1.1.0",
"path-exists": "^4.0.0"
},
"dependencies": {
"path-exists": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
"integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w=="
}
}
},
"unzip-crx": { "unzip-crx": {
"version": "0.2.0", "version": "0.2.0",
"resolved": "https://registry.npmjs.org/unzip-crx/-/unzip-crx-0.2.0.tgz", "resolved": "https://registry.npmjs.org/unzip-crx/-/unzip-crx-0.2.0.tgz",
......
package.json
View file @ 69b916f5
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
"dependencies": { "dependencies": {
"axios": "^0.19.2", "axios": "^0.19.2",
"core-js": "^3.6.4", "core-js": "^3.6.4",
"electron-dl": "^3.0.0", "electron-download-manager": "^2.1.2",
"glob": "^7.1.6", "glob": "^7.1.6",
"ncp": "^2.0.0", "ncp": "^2.0.0",
"rimraf": "^3.0.2", "rimraf": "^3.0.2",
......
src/App.vue
View file @ 69b916f5
<template> <template>
<div id="app"> <div id="app" tabindex="-1" v-on:keydown.esc="closeOverlays()">
<main> <main>
<Navigation /> <Navigation v-bind:downloadQueueCount="downloadQueue.length" v-bind:downloadOverlayShown="showDownloadOverlay" />
<router-view /> <router-view />
</main> </main>
<ContextMenu> <ContextMenu></ContextMenu>
</ContextMenu>
<transition name="fade">
<UpdateOverlay v-if="showUpdateOverlay" v-bind:isAvailable="isUpdateAvailable"></UpdateOverlay> <UpdateOverlay v-if="showUpdateOverlay" v-bind:isAvailable="isUpdateAvailable"></UpdateOverlay>
</transition>
<transition name="slideDownloadOverlay">
<DownloadOverlay v-if="showDownloadOverlay" v-bind:downloadQueue="downloadQueue"></DownloadOverlay>
</transition>
</div> </div>
</template> </template>
<script> <script>
import { remote } from 'electron'; import { remote, ipcRenderer } from 'electron';
const { app, dialog } = remote; const { app, dialog } = remote;
import fs from 'fs'; import fs from 'fs';
import glob from 'glob'; import glob from 'glob';
import path from 'path'; import path from 'path';
import ncp from 'ncp';
import UserSettings from '@/modules/module.usersettings.js'; import UserSettings from '@/modules/module.usersettings.js';
import SSAPI from '@/modules/module.api.js'; import SSAPI from '@/modules/module.api.js';
import SRXD from '@/modules/module.srxd.js';
import Navigation from '@/components/Navigation/Navigation.vue'; import Navigation from '@/components/Navigation/Navigation.vue';
import ContextMenu from '@/components/ContextMenu/ContextMenu.vue'; import ContextMenu from '@/components/ContextMenu/ContextMenu.vue';
import UpdateOverlay from '@/components/Overlays/UpdateOverlay.vue'; import UpdateOverlay from '@/components/Overlays/UpdateOverlay.vue';
import DownloadOverlay from '@/components/Overlays/DownloadOverlay.vue';
export default { export default {
name: 'App', name: 'App',
components: { components: {
Navigation, Navigation,
ContextMenu, ContextMenu,
UpdateOverlay UpdateOverlay,
DownloadOverlay
}, },
data: function() { data: function() {
return { return {
downloadQueue: [], downloadQueue: [],
downloadQueueProcessing: false,
showUpdateOverlay: false, showUpdateOverlay: false,
showDownloadOverlay: false,
isUpdateAvailable: false isUpdateAvailable: false
} }
}, },
...@@ -45,6 +56,15 @@ ...@@ -45,6 +56,15 @@
this.$root.$on('download', (url) => { this.$root.$on('download', (url) => {
this.addToQueue(url); this.addToQueue(url);
}); });
this.$root.$on('showDownloadOverlay', () => {
this.$data.showDownloadOverlay = true;
});
this.$root.$on('toggleDownloadOverlay', () => {
this.$data.showDownloadOverlay = !this.$data.showDownloadOverlay;
});
this.$root.$on('hideDownloadOverlay', () => {
this.$data.showDownloadOverlay = false;
});
this.$root.$on('showUpdateOverlay', (isAvailable) => { this.$root.$on('showUpdateOverlay', (isAvailable) => {
this.$data.showUpdateOverlay = true; this.$data.showUpdateOverlay = true;
...@@ -63,17 +83,69 @@ ...@@ -63,17 +83,69 @@
this.$data.isUpdateAvailable = true; this.$data.isUpdateAvailable = true;
} }
}); });
ipcRenderer.on("download-complete", (event, downloadItem) => {
let srxdControl = new SRXD();
let userSettings = new UserSettings();
srxdControl.extractBackup(downloadItem.downloadPath, path.basename(downloadItem.downloadPath)).then((extractResult) => {
if(extractResult) {
this.installBackup(extractResult, userSettings.get('gameDirectory')).then((result) => {
this.$data.downloadQueueProcessing = false;
console.log("Queue Remaining: " + this.$data.downloadQueue.length);
this.$data.downloadQueue.splice(this.$data.downloadQueue.findIndex(function(i) {
return i.id === downloadItem.id;
}), 1);
if(this.$data.downloadQueue.length > 0) {
this.processQueue();
}
}).catch(error => {
console.error(error);
});
} else {
console.error("Backup could not be loaded!");
}
}).catch(error => {
console.error(error);
});
});
}, },
methods: { methods: {
addToQueue: function(url) { addToQueue: function(url) {
this.$data.downloadQueue.push(url); this.$data.downloadQueue.push(url);
console.log("Added " + url + " to queue"); if(!this.$data.downloadQueueProcessing) {
this.processQueue();
} }
}, },
watch: { processQueue: function() {
downloadQueue: function(queue) { this.$data.downloadQueueProcessing = true;
console.log("Downloading first item");
console.log(this.$data.downloadQueue); if(this.$data.downloadQueue.length > 0) {
let downloadItem = this.$data.downloadQueue[0];
ipcRenderer.send("download", {
queueItem: downloadItem
});
}
},
closeOverlays: function() {
this.$data.showUpdateOverlay = false;
this.$data.showDownloadOverlay = false;
},
installBackup: async function(backupLocation, gameDirLocation) {
await ncp(backupLocation, gameDirLocation, function(error) {
if(error) {
console.error(error);
console.error("Couldn't copy backup!");
return true;
}
console.log("Copied Backup!");
});
return true;
} }
} }
} }
...@@ -108,6 +180,10 @@ ...@@ -108,6 +180,10 @@
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
background: #fff; background: #fff;
} }
a { text-decoration: none; }
#app:focus {
outline: none;
}
main { main {
display: grid; display: grid;
margin-left: 60px; margin-left: 60px;
...@@ -154,4 +230,17 @@ ...@@ -154,4 +230,17 @@
} }
} }
} }
.fade-enter-active, .fade-leave-active {
transition: opacity .2s;
}
.fade-enter, .fade-leave-to {
opacity: 0;
}
.slideDownloadOverlay-enter-active, .slideDownloadOverlay-leave-active {
transform: translateX(0px);
transition: transform .5s;
}
.slideDownloadOverlay-enter, .slideDownloadOverlay-leave-to {
transform: translateX(-400px);
}
</style> </style>
src/background.js
View file @ 69b916f5
const { app, protocol, BrowserWindow, ipcMain } = require('electron'); const { app, protocol, BrowserWindow, ipcMain } = require('electron');
const { download } = require('electron-dl'); const DownloadManager = require("electron-download-manager");
const { createProtocol } = require('vue-cli-plugin-electron-builder/lib'); const { createProtocol } = require('vue-cli-plugin-electron-builder/lib');
const isDevelopment = process.env.NODE_ENV !== 'production'; const isDevelopment = process.env.NODE_ENV !== 'production';
...@@ -7,6 +7,10 @@ let win; ...@@ -7,6 +7,10 @@ let win;
let deeplinkingUrl; let deeplinkingUrl;
let deeplinkingType; let deeplinkingType;
DownloadManager.register({
downloadFolder: app.getPath("temp")
});
protocol.registerSchemesAsPrivileged([{scheme: 'app', privileges: { secure: true, standard: true } }]); protocol.registerSchemesAsPrivileged([{scheme: 'app', privileges: { secure: true, standard: true } }]);
protocol.registerSchemesAsPrivileged([{scheme: 'app', privileges: { secure: true, standard: true } }]); protocol.registerSchemesAsPrivileged([{scheme: 'app', privileges: { secure: true, standard: true } }]);
protocol.registerSchemesAsPrivileged([{scheme: 'app', privileges: { secure: true, standard: true } }]); protocol.registerSchemesAsPrivileged([{scheme: 'app', privileges: { secure: true, standard: true } }]);
...@@ -68,8 +72,20 @@ if (isDevelopment) { ...@@ -68,8 +72,20 @@ if (isDevelopment) {
} }
} }
ipcMain.on("download", (event, info) => { ipcMain.on("download", (event, ipcData) => {
console.log("Download Request Received"); console.log("Download: " + ipcData.queueItem.title);
download(BrowserWindow.getFocusedWindow(), info.url, info.properties)
.then(dl => win.webContents.send("download-complete", dl.getSavePath())); DownloadManager.download({url: ipcData.queueItem.downloadPath}, (error, dlInfo) => {
if (error) {
console.log(error);
return;
}
let downloadItem = {
id: ipcData.queueItem.id,
downloadPath: dlInfo.filePath
}
win.webContents.send("download-complete", downloadItem);
});
}); });
\ No newline at end of file
src/components/Navigation/Navigation.vue
View file @ 69b916f5
...@@ -9,6 +9,10 @@ ...@@ -9,6 +9,10 @@
<nav> <nav>
<div v-on:click="openExternal('steam://run/1058830');" class="item"><i class="mdi mdi-play-outline"></i></div> <div v-on:click="openExternal('steam://run/1058830');" class="item"><i class="mdi mdi-play-outline"></i></div>
<div v-on:click="showDownloadOverlay();" :class="'item ' + (downloadOverlayShown ? 'router-link-active' : '')">
<i class="mdi mdi-download-outline"></i>
<span class="badge" v-show="downloadQueueCount > 0">{{ downloadQueueCount }}</span>
</div>
<router-link to="/settings" class="item"><i class="mdi mdi-cog-outline"></i></router-link> <router-link to="/settings" class="item"><i class="mdi mdi-cog-outline"></i></router-link>
</nav> </nav>
</aside> </aside>
...@@ -20,7 +24,14 @@ ...@@ -20,7 +24,14 @@
export default { export default {
name: 'Navigation', name: 'Navigation',
props: [
'downloadQueueCount',
'downloadOverlayShown'
],
methods: { methods: {
showDownloadOverlay: function() {
this.$root.$emit('toggleDownloadOverlay');
},
openExternal: function(url) { openExternal: function(url) {
shell.openExternal(url); shell.openExternal(url);
} }
...@@ -30,9 +41,10 @@ ...@@ -30,9 +41,10 @@
<style scoped lang="less"> <style scoped lang="less">
aside { aside {
background: rgba(255,255,255,0.1); background: #383C3F;
display: grid; display: grid;
position: fixed; position: fixed;
z-index: 50;
top: 0px; top: 0px;
left: 0px; left: 0px;
bottom: 0px; bottom: 0px;
...@@ -41,8 +53,8 @@ ...@@ -41,8 +53,8 @@
& .item, & .external-item { & .item, & .external-item {
width: 60px; width: 60px;
height: 60px; height: 60px;
opacity: 0.4;
display: flex; display: flex;
position: relative;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
background: transparent; background: transparent;
...@@ -50,16 +62,54 @@ ...@@ -50,16 +62,54 @@
transition: 0.2s ease opacity, 0.2s ease background; transition: 0.2s ease opacity, 0.2s ease background;
&:hover { &:hover {
opacity: 1;
cursor: pointer; cursor: pointer;
& .mdi {
opacity: 1;
}
} }
&.router-link-active { &.router-link-active {
opacity: 1; opacity: 1;
background: linear-gradient(135deg, #fd2f85, #7a34ec);
&:before {
transition: 0.2s ease-in-out opacity;
opacity: 1;
}
& .mdi {
opacity: 1;
}
} }
& .mdi { & .mdi {
font-size: 22px; font-size: 22px;
opacity: 0.4;
position: relative;
z-index: 2;
}
& .badge {
position: absolute;
z-index: 3;
bottom: 5px;
right: 5px;
font-size: 12px;
font-weight: bold;
padding: 2px 6px;
border-radius: 5px;
background: rgba(255,255,255,0.2);
}
&:before {
content: "";
position: absolute;
top: 0px;
left: 0px;
bottom: 0px;
right: 0px;
background: linear-gradient(135deg, #fd2f85, #7a34ec);
opacity: 0;
z-index: 0;
} }
} }
} }
......
src/components/Overlays/DownloadOverlay.vue 0 → 100644
View file @ 69b916f5
<template>
<div class="download-overlay">
<header>
<div class="title">
Download Queue
</div>
<div class="icon" v-on:click="close()">
<i class="mdi mdi-close"></i>
</div>
</header>
<div class="download-list">
<div class="download-item" v-for="item in downloadQueue">
<div class="cover" :style="'background-image: url(' + item.cover + '), url(' + require('@/assets/img/defaultAlbumArt.jpg') + ');'"></div>
<div class="meta">
<div class="title">{{ item.title }}</div>
<div class="artist">{{ item.artist }}</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { remote } from 'electron';
const { shell } = remote;
export default {
name: 'DownloadOverlay',
props: [
'downloadQueue'
],
data: function() {
return {
showUpdateOverlay: false,
showDownloadManager: false,
isUpdateAvailable: false
}
},
methods: {
close() {
this.$root.$emit('hideDownloadOverlay');
}
}
}
</script>
<style scoped lang="less">
.download-overlay {
position: fixed;
z-index: 10;
top: 0px;
bottom: 0px;
left: 60px;
width: 400px;
background: #383C3F;
display: grid;
grid-template-rows: auto 1fr;
grid-gap: 15px;
box-shadow: 4px 0px 16px rgba(0,0,0,0.3);
& header {
padding: 25px;
padding-bottom: 0px;
display: grid;
grid-template-columns: 1fr auto;
grid-gap: 15px;
& .title {
align-self: center;
letter-spacing: 0.25em;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
}
& .icon {
font-size: 22px;
transition: 0.2s ease-in-out opacity;
&:hover {
opacity: 0.6;
cursor: pointer;
}
}
}
& .download-list {
overflow-y: auto;
padding: 0px 25px;
margin-bottom: 25px;
& .download-item {
display: grid;
grid-template-columns: 50px 1fr;
grid-gap: 10px;
background: rgba(255,255,255,0.1);
margin-bottom: 5px;
padding: 10px;
border-radius: 5px;
& .cover {
width: 50px;
height: 50px;
background-position: center;
background-size: cover;
border-radius: 5px;
}
& .meta {
align-self: center;
overflow: hidden;
& .title {
font-weight: bold;
overflow: hidden;
white-space: nowrap;
}
& .artist {
margin-top: 5px;
opacity: 0.6;
overflow: hidden;
white-space: nowrap;
}
}
}
}
}
</style>
src/components/Song/SongItem.vue
View file @ 69b916f5
<template> <template>
<router-link :to="{ name: 'SongDetail', params: { id: id } }" class="song-item" v-on:contextmenu="showContextMenu($event)"> <div class="song-item" v-on:contextmenu="showContextMenu($event)">
<router-link :to="{ name: 'SongDetail', params: { id: id } }">
<div class="song-cover" :style="'background-image: url(' + cover + '), url(' + require('@/assets/img/defaultAlbumArt.jpg') + ');'"> <div class="song-cover" :style="'background-image: url(' + cover + '), url(' + require('@/assets/img/defaultAlbumArt.jpg') + ');'">
<div class="song-charter-info"> <div class="song-charter-info">
<div class="song-charter"><i class="mdi mdi-account-circle"></i><span>{{ charter }}</span></div> <div class="song-charter"><i class="mdi mdi-account-circle"></i><span>{{ charter }}</span></div>
...@@ -17,6 +18,7 @@ ...@@ -17,6 +18,7 @@
</div> </div>
</div> </div>
</router-link> </router-link>
</div>
</template> </template>
<script> <script>
...@@ -48,14 +50,19 @@ ...@@ -48,14 +50,19 @@
}, },
methods: { methods: {
showContextMenu: function(e) { showContextMenu: function(e) {
e.preventDefault();
this.$root.$emit('showContextMenu', { this.$root.$emit('showContextMenu', {
x: e.pageX, x: e.pageX,
y: e.pageY, y: e.pageY,
items: [ items: [
{ icon: "eye", title: "Open", method: () => { alert('TODO') } }, { icon: "eye", title: "Open", method: () => { this.$router.push({ name: 'SongDetail', params: { id: this.$props.id } }) } },
{ icon: "link", title: "Copy Link", method: () => { clipboard.writeText('https://spinsha.re/song/' + this.$props.id) } }, { icon: "link", title: "Copy Link", method: () => { clipboard.writeText('https://spinsha.re/song/' + this.$props.id) } },
{ icon: "download", title: "Download", method: () => { this.$root.$emit('download', this.$props.zip); } } { icon: "download", title: "Download", method: () => { this.download(); } }
]}); ]});
},
download: function() {
this.$root.$emit('download', {id: this.$props.id, cover: this.$props.cover, title: this.$props.title, artist: this.$props.artist, downloadPath: this.$props.zip});
} }
} }
} }
...@@ -67,8 +74,6 @@ ...@@ -67,8 +74,6 @@
transition: 0.2s ease-in-out transform, 0.2s ease-in-out box-shadow; transition: 0.2s ease-in-out transform, 0.2s ease-in-out box-shadow;
overflow: hidden; overflow: hidden;
border-radius: 6px; border-radius: 6px;
color: #fff;
text-decoration: none;
& .song-cover { & .song-cover {
background: rgba(255,255,255,0.1); background: rgba(255,255,255,0.1);
...@@ -80,6 +85,8 @@ ...@@ -80,6 +85,8 @@
& .song-charter { & .song-charter {
position: absolute; position: absolute;
color: #fff;
text-decoration: none;
top: 0px; top: 0px;
left: 0px; left: 0px;
right: 0px; right: 0px;
...@@ -114,6 +121,8 @@ ...@@ -114,6 +121,8 @@
& .song-metadata { & .song-metadata {
padding: 15px; padding: 15px;
color: #fff;
text-decoration: none;
& .song-title { & .song-title {
font-weight: bold; font-weight: bold;
......
src/modules/module.srxd.js
View file @ 69b916f5
...@@ -4,6 +4,7 @@ const path = require('path'); ...@@ -4,6 +4,7 @@ const path = require('path');
const rimraf = require('rimraf'); const rimraf = require('rimraf');
const unzipper = require('unzipper'); const unzipper = require('unzipper');
const uniqid = require('uniqid'); const uniqid = require('uniqid');
const { app } = require('electron').remote;
const UserSettings = require('./module.usersettings'); const UserSettings = require('./module.usersettings');
class SRXD { class SRXD {
...@@ -25,14 +26,12 @@ class SRXD { ...@@ -25,14 +26,12 @@ class SRXD {
console.log("Extracting Backup."); console.log("Extracting Backup.");
this.backupLocation = path.join(tempDirLocation, "extract-" + uniqid()); this.backupLocation = path.join(app.getPath('temp'), "extract-" + uniqid());
console.info(this.backupLocation); console.info(this.backupLocation);
// Unzip to temp/CustomSpeens/Song // Unzip to temp/CustomSpeens/Song
await fs.createReadStream(filePath).pipe(unzipper.Extract({ path: this.backupLocation })).promise(); await fs.createReadStream(filePath).pipe(unzipper.Extract({ path: this.backupLocation })).promise();
console.log("Loading Backup.");
// Find SRTB & OGG files // Find SRTB & OGG files
let srtbFilesInBackupLocation = this.getFilesFromPath(this.backupLocation, ".srtb"); let srtbFilesInBackupLocation = this.getFilesFromPath(this.backupLocation, ".srtb");
...@@ -157,7 +156,6 @@ class SRXD { ...@@ -157,7 +156,6 @@ class SRXD {
} }
catch(err){} catch(err){}
}); });
RefreshLibrary();
} }
} }
......
src/views/Library.vue
View file @ 69b916f5
...@@ -53,7 +53,6 @@ ...@@ -53,7 +53,6 @@
this.$on('delete', (file) => { this.$on('delete', (file) => {
this.$data.showDeleteOverlay = true; this.$data.showDeleteOverlay = true;
this.$data.deleteFiles = this.getConnectedFiles(file); this.$data.deleteFiles = this.getConnectedFiles(file);
console.log(this.$data.deleteFiles);
}); });
this.$on('deleteDeny', () => { this.$on('deleteDeny', () => {
this.$data.showDeleteOverlay = false; this.$data.showDeleteOverlay = false;
...@@ -97,7 +96,7 @@ ...@@ -97,7 +96,7 @@
isSpinShare: songSpinShareReference isSpinShare: songSpinShareReference
}; };
this.$data.librarySongs.push(librarySong) this.$data.librarySongs.push(librarySong);
}); });
}); });
}, },
......
src/views/SongDetail.vue
View file @ 69b916f5
...@@ -100,7 +100,7 @@ ...@@ -100,7 +100,7 @@
}, },
methods: { methods: {
AddToQueue: function() { AddToQueue: function() {
this.$root.$emit('download', {id: this.$data.id, cover: this.$data.cover, title: this.$data.title, artist: this.$data.artist, downloadPath: this.$data.downloadPath});
}, },
PlayPreview: function() { PlayPreview: function() {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment