Commit 614085f5 authored by SpinShare's avatar SpinShare

added 2.0.0 adjustments, fixed download issues

parent 5ae0bc17
......@@ -5244,7 +5244,8 @@
"eventemitter3": {
"version": "4.0.4",
"resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.4.tgz",
"integrity": "sha512-rlaVLnVxtxvoyLsQQFBx53YmXHDxRIzzTLbdfxqi4yocpSjAxXwkU0cScM5JgSKMqEhrZpnvQ2D9gjylR0AimQ=="
"integrity": "sha512-rlaVLnVxtxvoyLsQQFBx53YmXHDxRIzzTLbdfxqi4yocpSjAxXwkU0cScM5JgSKMqEhrZpnvQ2D9gjylR0AimQ==",
"dev": true
},
"events": {
"version": "3.1.0",
......@@ -5706,6 +5707,7 @@
"version": "1.11.0",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.11.0.tgz",
"integrity": "sha512-KZm0V+ll8PfBrKwMzdo5D13b1bur9Iq9Zd/RMmAoQQcl2PxxFml8cxXPaaPYVbV0RjNjq1CU7zIzAOqtUPudmA==",
"dev": true,
"requires": {
"debug": "^3.0.0"
},
......@@ -5714,6 +5716,7 @@
"version": "3.2.6",
"resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
"integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
"dev": true,
"requires": {
"ms": "^2.1.1"
}
......@@ -6972,6 +6975,7 @@
"version": "1.18.1",
"resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.1.tgz",
"integrity": "sha512-7mz/721AbnJwIVbnaSv1Cz3Am0ZLT/UBwkC92VlxhXv/k/BBQfM2fXElQNC27BVGr0uwUpplYPQM9LnaBMR5NQ==",
"dev": true,
"requires": {
"eventemitter3": "^4.0.0",
"follow-redirects": "^1.0.0",
......@@ -7017,7 +7021,6 @@
"version": "0.4.24",
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
"integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
"dev": true,
"requires": {
"safer-buffer": ">= 2.1.2 < 3"
}
......@@ -8520,6 +8523,26 @@
"resolved": "https://registry.npmjs.org/ncp/-/ncp-2.0.0.tgz",
"integrity": "sha1-GVoh1sRuNh0vsSgbo4uR6d9727M="
},
"needle": {
"version": "2.5.0",
"resolved": "https://registry.npmjs.org/needle/-/needle-2.5.0.tgz",
"integrity": "sha512-o/qITSDR0JCyCKEQ1/1bnUXMmznxabbwi/Y4WwJElf+evwJNFNwIDMCCt5IigFVxgeGBJESLohGtIS9gEzo1fA==",
"requires": {
"debug": "^3.2.6",
"iconv-lite": "^0.4.4",
"sax": "^1.2.4"
},
"dependencies": {
"debug": {
"version": "3.2.6",
"resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
"integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
"requires": {
"ms": "^2.1.1"
}
}
}
},
"negotiator": {
"version": "0.6.2",
"resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.2.tgz",
......@@ -10606,7 +10629,8 @@
"requires-port": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
"integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8="
"integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=",
"dev": true
},
"resolve": {
"version": "1.16.0",
......@@ -10756,8 +10780,7 @@
"safer-buffer": {
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
"integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
"dev": true
"integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
},
"sanitize-filename": {
"version": "1.6.3",
......@@ -10771,8 +10794,7 @@
"sax": {
"version": "1.2.4",
"resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
"integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==",
"dev": true
"integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw=="
},
"schema-utils": {
"version": "2.6.5",
......
......@@ -23,6 +23,7 @@
"glob": "^7.1.6",
"moment": "^2.26.0",
"ncp": "^2.0.0",
"needle": "^2.5.0",
"rimraf": "^3.0.2",
"uniqid": "^5.2.0",
"vue": "^2.6.11",
......
......@@ -271,6 +271,39 @@
}
}
}
input[type='range'] {
overflow: hidden;
width: 100%;
outline: none;
-webkit-appearance: none;
background-color: #ddd;
}
input[type='range']::-webkit-slider-runnable-track {
height: 10px;
-webkit-appearance: none;
color: #13bba4;
margin-top: -1px;
}
input[type='range']::-webkit-slider-thumb {
width: 10px;
-webkit-appearance: none;
height: 10px;
cursor: ew-resize;
background: #000;
box-shadow: -800px 0 0 800px rgb(226, 44, 120);
}
/** FF*/
input[type="range"]::-moz-range-progress {
background-color: rgb(226, 44, 120);
}
input[type="range"]::-moz-range-track {
background-color: #ddd;
}
/* IE*/
input[type="range"]::-ms-fill-lower {
background-color: rgb(226, 44, 120);
}
.fade-enter-active, .fade-leave-active {
transition: opacity .2s;
}
......
......@@ -2,7 +2,7 @@ const { app, protocol, BrowserWindow, ipcMain, dialog } = require('electron');
const { createProtocol } = require('vue-cli-plugin-electron-builder/lib');
const isDevelopment = process.env.NODE_ENV !== 'production';
const fs = require('fs');
const http = require('http');
const https = require('https');
const path = require('path');
const uniqid = require('uniqid');
......@@ -160,7 +160,7 @@ ipcMain.on("getDeeplink", (event) => {
function download(url, fileName, cb) {
let dest = path.join(app.getPath('temp'), fileName + ".zip");
let file = fs.createWriteStream(dest);
let request = http.get(url, function(response) {
let request = https.get(url, function(response) {
response.pipe(file);
file.on('finish', function() {
file.close(cb(null, dest)); // async call of the callback
......
......@@ -107,7 +107,7 @@
left: 0px;
bottom: 0px;
right: 0px;
background: linear-gradient(135deg, #fd2f85, #7a34ec);
background: rgb(226, 44, 120);
opacity: 0;
z-index: 0;
}
......
......@@ -50,7 +50,9 @@
},
methods: {
showContextMenu: function(e) {
e.preventDefault();
if(e != undefined) {
e.preventDefault();
}
this.$root.$emit('showContextMenu', {
x: e.pageX,
......@@ -62,14 +64,18 @@
]});
},
shortDownload: function(e) {
e.preventDefault();
if(e != undefined) {
e.preventDefault();
}
if(e.which == 2) {
this.download(e);
}
},
download: function(e) {
e.preventDefault();
if(e != undefined) {
e.preventDefault();
}
this.$root.$emit('download', {id: this.$props.id, cover: this.$props.cover, title: this.$props.title, artist: this.$props.artist, downloadPath: this.$props.zip});
}
......
<template>
<section :class="!apiFinished ? 'section-song-detail-loading' : 'section-song-detail'">
<div class="song-detail-background" v-if="apiFinished" :style="'background-image: url(' + cover + '), url(' + require('@/assets/img/defaultAlbumArt.jpg') + ');'">
<div class="song-detail-background-cover"></div>
</div>
<div class="song-detail" v-if="apiFinished">
<div class="song-meta">
<div class="cover" :style="'background-image: url(' + cover + '), url(' + require('@/assets/img/defaultAlbumArt.jpg') + ');'"></div>
......@@ -222,12 +225,32 @@
grid-template-columns: 500px 1fr;
grid-gap: 25px;
padding: 50px;
& .song-detail-background {
background-position: center;
background-size: cover;
position: absolute;
top: 0px;
left: 60px;
right: 0px;
height: 300px;
z-index: -1;
& .song-detail-background-cover {
position: absolute;
top: 0px;
left: 0px;
bottom: 0px;
right: 0px;
background: linear-gradient(180deg, rgba(33,38,41,0.7) 0%, rgba(33,38,41,1) 100%);
}
}
& .song-detail {
& .song-meta {
display: grid;
grid-template-columns: auto 1fr;
background: rgba(255,255,255,0.1);
background: #383C3F;
border-radius: 4px;
overflow: hidden;
......@@ -267,14 +290,15 @@
transition: all 0.2s ease-in-out;
border-radius: 4px;
overflow: hidden;
background: #fff;
& .action, & .action-player {
background: linear-gradient(135deg, rgba(255,255,255,0.3), rgba(255,255,255,0.1));
background: linear-gradient(135deg, rgba(0,0,0,0.1), rgba(0,0,0,0.3));
width: 25%;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
color: #222;
text-decoration: none;
transition: all 0.2s ease-in-out;
cursor: pointer;
......@@ -366,33 +390,37 @@
}
}
& .song-description {
background: rgba(255,255,255,0.1);
background: #383C3F;
border-radius: 4px;
margin-top: 25px;
display: grid;
grid-gap: 0px;
grid-gap: 20px;
padding: 20px;
& .text {
line-height: 1.5em;
padding: 20px;
opacity: 0.7;
}
& .tags {
padding: 20px;
display: flex;
flex-wrap: wrap;
& .tag {
display: block;
margin-right: 10px;
background: #fff;
color: #000;
border-radius: 50px;
padding: 7px 14px;
margin-bottom: 10px;
color: #fff;
background: rgba(255,255,255,0.2);
padding: 4px 8px;
border-radius: 4px;
font-size: 12px;
text-decoration: none;
transition: 0.2s ease-in-out opacity;
transition: 0.2s ease-in-out all;
&:hover {
cursor: pointer;
opacity: 0.6;
color: #222;
background: #fff;
}
}
}
......@@ -410,27 +438,26 @@
padding: 15px 40px;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
opacity: 0.4;
background: rgba(0,0,0,0.4);
background: #1C2022;
color: rgba(255,255,255,0.4);
transition: 0.2s ease-in-out all;
color: #fff;
text-decoration: none;
&:not(.active):hover {
cursor: pointer;
opacity: 0.75;
}
&.active {
background: #272c2e;
color: rgba(255,255,255,0.75);
}
&.router-link-exact-active {
opacity: 1;
background: rgba(255,255,255,0.1);
opacity: 1;
color: rgba(255,255,255,1);
background: #383C3F;
}
}
}
& .tab {
background: rgba(255,255,255,0.1);
background: #383C3F;
border-radius: 4px;
border-top-left-radius: 0px;
padding: 20px;
......
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