main #19

Merged
artem merged 39 commits from main into dev 2023-09-22 14:13:12 +02:00
36 changed files with 1821 additions and 462 deletions

378
package-lock.json generated
View File

@ -8,15 +8,15 @@
"name": "webplay-client", "name": "webplay-client",
"version": "0.1.0", "version": "0.1.0",
"dependencies": { "dependencies": {
"@fortawesome/fontawesome-svg-core": "^6.2.1", "@fortawesome/fontawesome-svg-core": "^6.3.0",
"@fortawesome/free-solid-svg-icons": "^6.2.1", "@fortawesome/free-solid-svg-icons": "^6.3.0",
"@fortawesome/vue-fontawesome": "^3.0.2", "@fortawesome/vue-fontawesome": "^3.0.3",
"axios": "^1.2.2", "axios": "^1.3.3",
"body-parser": "^1.19.1", "body-parser": "^1.20.1",
"core-js": "^3.27.1", "core-js": "^3.28.0",
"express": "^4.18.2", "express": "^4.18.2",
"mp3tag.js": "^3.3.2", "mp3tag.js": "^3.3.2",
"vue": "*", "vue": "^3.2.47",
"vue-router": "^4.1.6", "vue-router": "^4.1.6",
"vuex": "^4.1.0" "vuex": "^4.1.0"
}, },
@ -25,10 +25,10 @@
"@vue/cli-plugin-babel": "^5.0.8", "@vue/cli-plugin-babel": "^5.0.8",
"@vue/cli-plugin-eslint": "^5.0.8", "@vue/cli-plugin-eslint": "^5.0.8",
"@vue/cli-service": "^5.0.8", "@vue/cli-service": "^5.0.8",
"electron": "^22.0.0", "electron": "^23.1.0",
"electron-builder": "^23.6.0", "electron-builder": "^23.6.0",
"eslint": "^8.31.0", "eslint": "^8.34.0",
"eslint-plugin-vue": "^9.8.0" "eslint-plugin-vue": "^9.9.0"
} }
}, },
"node_modules/@achrinza/node-ipc": { "node_modules/@achrinza/node-ipc": {
@ -1870,42 +1870,42 @@
} }
}, },
"node_modules/@fortawesome/fontawesome-common-types": { "node_modules/@fortawesome/fontawesome-common-types": {
"version": "6.2.1", "version": "6.3.0",
"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.2.1.tgz", "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.3.0.tgz",
"integrity": "sha512-Sz07mnQrTekFWLz5BMjOzHl/+NooTdW8F8kDQxjWwbpOJcnoSg4vUDng8d/WR1wOxM0O+CY9Zw0nR054riNYtQ==", "integrity": "sha512-4BC1NMoacEBzSXRwKjZ/X/gmnbp/HU5Qqat7E8xqorUtBFZS+bwfGH5/wqOC2K6GV0rgEobp3OjGRMa5fK9pFg==",
"hasInstallScript": true, "hasInstallScript": true,
"engines": { "engines": {
"node": ">=6" "node": ">=6"
} }
}, },
"node_modules/@fortawesome/fontawesome-svg-core": { "node_modules/@fortawesome/fontawesome-svg-core": {
"version": "6.2.1", "version": "6.3.0",
"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.2.1.tgz", "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.3.0.tgz",
"integrity": "sha512-HELwwbCz6C1XEcjzyT1Jugmz2NNklMrSPjZOWMlc+ZsHIVk+XOvOXLGGQtFBwSyqfJDNgRq4xBCwWOaZ/d9DEA==", "integrity": "sha512-uz9YifyKlixV6AcKlOX8WNdtF7l6nakGyLYxYaCa823bEBqyj/U2ssqtctO38itNEwXb8/lMzjdoJ+aaJuOdrw==",
"hasInstallScript": true, "hasInstallScript": true,
"dependencies": { "dependencies": {
"@fortawesome/fontawesome-common-types": "6.2.1" "@fortawesome/fontawesome-common-types": "6.3.0"
}, },
"engines": { "engines": {
"node": ">=6" "node": ">=6"
} }
}, },
"node_modules/@fortawesome/free-solid-svg-icons": { "node_modules/@fortawesome/free-solid-svg-icons": {
"version": "6.2.1", "version": "6.3.0",
"resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.2.1.tgz", "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.3.0.tgz",
"integrity": "sha512-oKuqrP5jbfEPJWTij4sM+/RvgX+RMFwx3QZCZcK9PrBDgxC35zuc7AOFsyMjMd/PIFPeB2JxyqDr5zs/DZFPPw==", "integrity": "sha512-x5tMwzF2lTH8pyv8yeZRodItP2IVlzzmBuD1M7BjawWgg9XAvktqJJ91Qjgoaf8qJpHQ8FEU9VxRfOkLhh86QA==",
"hasInstallScript": true, "hasInstallScript": true,
"dependencies": { "dependencies": {
"@fortawesome/fontawesome-common-types": "6.2.1" "@fortawesome/fontawesome-common-types": "6.3.0"
}, },
"engines": { "engines": {
"node": ">=6" "node": ">=6"
} }
}, },
"node_modules/@fortawesome/vue-fontawesome": { "node_modules/@fortawesome/vue-fontawesome": {
"version": "3.0.2", "version": "3.0.3",
"resolved": "https://registry.npmjs.org/@fortawesome/vue-fontawesome/-/vue-fontawesome-3.0.2.tgz", "resolved": "https://registry.npmjs.org/@fortawesome/vue-fontawesome/-/vue-fontawesome-3.0.3.tgz",
"integrity": "sha512-xHVtVY8ASUeEvgcA/7vULUesENhD+pi/EirRHdMBqooHlXBqK+yrV6d8tUye1m5UKQKVgYAHMhUBfOnoiwvc8Q==", "integrity": "sha512-KCPHi9QemVXGMrfuwf3nNnNo129resAIQWut9QTAMXmXqL2ErABC6ohd2yY5Ipq0CLWNbKHk8TMdTXL/Zf3ZhA==",
"peerDependencies": { "peerDependencies": {
"@fortawesome/fontawesome-svg-core": "~1 || ~6", "@fortawesome/fontawesome-svg-core": "~1 || ~6",
"vue": ">= 3.0.0 < 4" "vue": ">= 3.0.0 < 4"
@ -3143,36 +3143,36 @@
"dev": true "dev": true
}, },
"node_modules/@vue/compiler-core": { "node_modules/@vue/compiler-core": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.2.47.tgz",
"integrity": "sha512-rcMj7H+PYe5wBV3iYeUgbCglC+pbpN8hBLTJvRiK2eKQiWqu+fG9F+8sW99JdL4LQi7Re178UOxn09puSXvn4A==", "integrity": "sha512-p4D7FDnQb7+YJmO2iPEv0SQNeNzcbHdGByJDsT4lynf63AFkOTFN07HsiRSvjGo0QrxR/o3d0hUyNCUnBU2Tig==",
"dependencies": { "dependencies": {
"@babel/parser": "^7.16.4", "@babel/parser": "^7.16.4",
"@vue/shared": "3.2.45", "@vue/shared": "3.2.47",
"estree-walker": "^2.0.2", "estree-walker": "^2.0.2",
"source-map": "^0.6.1" "source-map": "^0.6.1"
} }
}, },
"node_modules/@vue/compiler-dom": { "node_modules/@vue/compiler-dom": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.47.tgz",
"integrity": "sha512-tyYeUEuKqqZO137WrZkpwfPCdiiIeXYCcJ8L4gWz9vqaxzIQRccTSwSWZ/Axx5YR2z+LvpUbmPNXxuBU45lyRw==", "integrity": "sha512-dBBnEHEPoftUiS03a4ggEig74J2YBZ2UIeyfpcRM2tavgMWo4bsEfgCGsu+uJIL/vax9S+JztH8NmQerUo7shQ==",
"dependencies": { "dependencies": {
"@vue/compiler-core": "3.2.45", "@vue/compiler-core": "3.2.47",
"@vue/shared": "3.2.45" "@vue/shared": "3.2.47"
} }
}, },
"node_modules/@vue/compiler-sfc": { "node_modules/@vue/compiler-sfc": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.47.tgz",
"integrity": "sha512-1jXDuWah1ggsnSAOGsec8cFjT/K6TMZ0sPL3o3d84Ft2AYZi2jWJgRMjw4iaK0rBfA89L5gw427H4n1RZQBu6Q==", "integrity": "sha512-rog05W+2IFfxjMcFw10tM9+f7i/+FFpZJJ5XHX72NP9eC2uRD+42M3pYcQqDXVYoj74kHMSEdQ/WmCjt8JFksQ==",
"dependencies": { "dependencies": {
"@babel/parser": "^7.16.4", "@babel/parser": "^7.16.4",
"@vue/compiler-core": "3.2.45", "@vue/compiler-core": "3.2.47",
"@vue/compiler-dom": "3.2.45", "@vue/compiler-dom": "3.2.47",
"@vue/compiler-ssr": "3.2.45", "@vue/compiler-ssr": "3.2.47",
"@vue/reactivity-transform": "3.2.45", "@vue/reactivity-transform": "3.2.47",
"@vue/shared": "3.2.45", "@vue/shared": "3.2.47",
"estree-walker": "^2.0.2", "estree-walker": "^2.0.2",
"magic-string": "^0.25.7", "magic-string": "^0.25.7",
"postcss": "^8.1.10", "postcss": "^8.1.10",
@ -3180,12 +3180,12 @@
} }
}, },
"node_modules/@vue/compiler-ssr": { "node_modules/@vue/compiler-ssr": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.2.47.tgz",
"integrity": "sha512-6BRaggEGqhWht3lt24CrIbQSRD5O07MTmd+LjAn5fJj568+R9eUD2F7wMQJjX859seSlrYog7sUtrZSd7feqrQ==", "integrity": "sha512-wVXC+gszhulcMD8wpxMsqSOpvDZ6xKXSVWkf50Guf/S+28hTAXPDYRTbLQ3EDkOP5Xz/+SY37YiwDquKbJOgZw==",
"dependencies": { "dependencies": {
"@vue/compiler-dom": "3.2.45", "@vue/compiler-dom": "3.2.47",
"@vue/shared": "3.2.45" "@vue/shared": "3.2.47"
} }
}, },
"node_modules/@vue/component-compiler-utils": { "node_modules/@vue/component-compiler-utils": {
@ -3258,60 +3258,60 @@
"integrity": "sha512-JD5fcdIuFxU4fQyXUu3w2KpAJHzTVdN+p4iOX2lMWSHMOoQdMAcpFLZzm9Z/2nmsoZ1a96QEhZ26e50xLBsgOQ==" "integrity": "sha512-JD5fcdIuFxU4fQyXUu3w2KpAJHzTVdN+p4iOX2lMWSHMOoQdMAcpFLZzm9Z/2nmsoZ1a96QEhZ26e50xLBsgOQ=="
}, },
"node_modules/@vue/reactivity": { "node_modules/@vue/reactivity": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.47.tgz",
"integrity": "sha512-PRvhCcQcyEVohW0P8iQ7HDcIOXRjZfAsOds3N99X/Dzewy8TVhTCT4uXpAHfoKjVTJRA0O0K+6QNkDIZAxNi3A==", "integrity": "sha512-7khqQ/75oyyg+N/e+iwV6lpy1f5wq759NdlS1fpAhFXa8VeAIKGgk2E/C4VF59lx5b+Ezs5fpp/5WsRYXQiKxQ==",
"dependencies": { "dependencies": {
"@vue/shared": "3.2.45" "@vue/shared": "3.2.47"
} }
}, },
"node_modules/@vue/reactivity-transform": { "node_modules/@vue/reactivity-transform": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/reactivity-transform/-/reactivity-transform-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/reactivity-transform/-/reactivity-transform-3.2.47.tgz",
"integrity": "sha512-BHVmzYAvM7vcU5WmuYqXpwaBHjsS8T63jlKGWVtHxAHIoMIlmaMyurUSEs1Zcg46M4AYT5MtB1U274/2aNzjJQ==", "integrity": "sha512-m8lGXw8rdnPVVIdIFhf0LeQ/ixyHkH5plYuS83yop5n7ggVJU+z5v0zecwEnX7fa7HNLBhh2qngJJkxpwEEmYA==",
"dependencies": { "dependencies": {
"@babel/parser": "^7.16.4", "@babel/parser": "^7.16.4",
"@vue/compiler-core": "3.2.45", "@vue/compiler-core": "3.2.47",
"@vue/shared": "3.2.45", "@vue/shared": "3.2.47",
"estree-walker": "^2.0.2", "estree-walker": "^2.0.2",
"magic-string": "^0.25.7" "magic-string": "^0.25.7"
} }
}, },
"node_modules/@vue/runtime-core": { "node_modules/@vue/runtime-core": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.2.47.tgz",
"integrity": "sha512-gzJiTA3f74cgARptqzYswmoQx0fIA+gGYBfokYVhF8YSXjWTUA2SngRzZRku2HbGbjzB6LBYSbKGIaK8IW+s0A==", "integrity": "sha512-RZxbLQIRB/K0ev0K9FXhNbBzT32H9iRtYbaXb0ZIz2usLms/D55dJR2t6cIEUn6vyhS3ALNvNthI+Q95C+NOpA==",
"dependencies": { "dependencies": {
"@vue/reactivity": "3.2.45", "@vue/reactivity": "3.2.47",
"@vue/shared": "3.2.45" "@vue/shared": "3.2.47"
} }
}, },
"node_modules/@vue/runtime-dom": { "node_modules/@vue/runtime-dom": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.2.47.tgz",
"integrity": "sha512-cy88YpfP5Ue2bDBbj75Cb4bIEZUMM/mAkDMfqDTpUYVgTf/kuQ2VQ8LebuZ8k6EudgH8pYhsGWHlY0lcxlvTwA==", "integrity": "sha512-ArXrFTjS6TsDei4qwNvgrdmHtD930KgSKGhS5M+j8QxXrDJYLqYw4RRcDy1bz1m1wMmb6j+zGLifdVHtkXA7gA==",
"dependencies": { "dependencies": {
"@vue/runtime-core": "3.2.45", "@vue/runtime-core": "3.2.47",
"@vue/shared": "3.2.45", "@vue/shared": "3.2.47",
"csstype": "^2.6.8" "csstype": "^2.6.8"
} }
}, },
"node_modules/@vue/server-renderer": { "node_modules/@vue/server-renderer": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.2.47.tgz",
"integrity": "sha512-ebiMq7q24WBU1D6uhPK//2OTR1iRIyxjF5iVq/1a5I1SDMDyDu4Ts6fJaMnjrvD3MqnaiFkKQj+LKAgz5WIK3g==", "integrity": "sha512-dN9gc1i8EvmP9RCzvneONXsKfBRgqFeFZLurmHOveL7oH6HiFXJw5OGu294n1nHc/HMgTy6LulU/tv5/A7f/LA==",
"dependencies": { "dependencies": {
"@vue/compiler-ssr": "3.2.45", "@vue/compiler-ssr": "3.2.47",
"@vue/shared": "3.2.45" "@vue/shared": "3.2.47"
}, },
"peerDependencies": { "peerDependencies": {
"vue": "3.2.45" "vue": "3.2.47"
} }
}, },
"node_modules/@vue/shared": { "node_modules/@vue/shared": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.2.47.tgz",
"integrity": "sha512-Ewzq5Yhimg7pSztDV+RH1UDKBzmtqieXQlpTVm2AwraoRL/Rks96mvd8Vgi7Lj+h+TH8dv7mXD3FRZR3TUvbSg==" "integrity": "sha512-BHGyyGN3Q97EZx0taMQ+OLNuZcW3d37ZEVmEAyeoA9ERdGvm9Irc/0Fua8SNyOtV1w6BS4q25wbMzJujO9HIfQ=="
}, },
"node_modules/@vue/vue-loader-v15": { "node_modules/@vue/vue-loader-v15": {
"name": "vue-loader", "name": "vue-loader",
@ -3947,9 +3947,9 @@
} }
}, },
"node_modules/axios": { "node_modules/axios": {
"version": "1.2.2", "version": "1.3.3",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.2.2.tgz", "resolved": "https://registry.npmjs.org/axios/-/axios-1.3.3.tgz",
"integrity": "sha512-bz/J4gS2S3I7mpN/YZfGFTqhXTYzRho8Ay38w2otuuDR322KzFIWm/4W2K6gIwvWaws5n+mnb7D1lN9uD+QH6Q==", "integrity": "sha512-eYq77dYIFS77AQlhzEL937yUBSepBfPIe8FcgEDN35vMNZKMrs81pgnyrQpwfy4NF4b4XWX1Zgx7yX+25w8QJA==",
"dependencies": { "dependencies": {
"follow-redirects": "^1.15.0", "follow-redirects": "^1.15.0",
"form-data": "^4.0.0", "form-data": "^4.0.0",
@ -5087,9 +5087,9 @@
} }
}, },
"node_modules/core-js": { "node_modules/core-js": {
"version": "3.27.1", "version": "3.28.0",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.27.1.tgz", "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.28.0.tgz",
"integrity": "sha512-GutwJLBChfGCpwwhbYoqfv03LAfmiz7e7D/BNxzeMxwQf10GRSzqiOjx7AmtEk+heiD/JWmBuyBPgFtx0Sg1ww==", "integrity": "sha512-GiZn9D4Z/rSYvTeg1ljAIsEqFm0LaN9gVtwDCrKL80zHtS31p9BAjmTxVqTQDMpwlMolJZOFntUG2uwyj7DAqw==",
"hasInstallScript": true, "hasInstallScript": true,
"funding": { "funding": {
"type": "opencollective", "type": "opencollective",
@ -5945,9 +5945,9 @@
} }
}, },
"node_modules/electron": { "node_modules/electron": {
"version": "22.0.0", "version": "23.1.0",
"resolved": "https://registry.npmjs.org/electron/-/electron-22.0.0.tgz", "resolved": "https://registry.npmjs.org/electron/-/electron-23.1.0.tgz",
"integrity": "sha512-cgRc4wjyM+81A0E8UGv1HNJjL1HBI5cWNh/DUIjzYvoUuiEM0SS0hAH/zaFQ18xOz2ced6Yih8SybpOiOYJhdg==", "integrity": "sha512-LRgACMpVrmjfYWPgCSyJ+TFQ/FPeniOowpO57z0xUcTchfC7EH+5rUncgYN+uMvqePiYDce+ywZeCIFaO8x/Nw==",
"dev": true, "dev": true,
"hasInstallScript": true, "hasInstallScript": true,
"dependencies": { "dependencies": {
@ -6386,9 +6386,9 @@
} }
}, },
"node_modules/eslint": { "node_modules/eslint": {
"version": "8.31.0", "version": "8.34.0",
"resolved": "https://registry.npmjs.org/eslint/-/eslint-8.31.0.tgz", "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.34.0.tgz",
"integrity": "sha512-0tQQEVdmPZ1UtUKXjX7EMm9BlgJ08G90IhWh0PKDCb3ZLsgAOHI8fYSIzYVZej92zsgq+ft0FGsxhJ3xo2tbuA==", "integrity": "sha512-1Z8iFsucw+7kSqXNZVslXS8Ioa4u2KM7GPwuKtkTFAqZ/cHMcEaR+1+Br0wLlot49cNxIiZk5wp8EAbPcYZxTg==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@eslint/eslintrc": "^1.4.1", "@eslint/eslintrc": "^1.4.1",
@ -6442,9 +6442,9 @@
} }
}, },
"node_modules/eslint-plugin-vue": { "node_modules/eslint-plugin-vue": {
"version": "9.8.0", "version": "9.9.0",
"resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.8.0.tgz", "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.9.0.tgz",
"integrity": "sha512-E/AXwcTzunyzM83C2QqDHxepMzvI2y6x+mmeYHbVDQlKFqmKYvRrhaVixEeeG27uI44p9oKDFiyCRw4XxgtfHA==", "integrity": "sha512-YbubS7eK0J7DCf0U2LxvVP7LMfs6rC6UltihIgval3azO3gyDwEGVgsCMe1TmDiEkl6GdMKfRpaME6QxIYtzDQ==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"eslint-utils": "^3.0.0", "eslint-utils": "^3.0.0",
@ -7914,9 +7914,9 @@
} }
}, },
"node_modules/http-cache-semantics": { "node_modules/http-cache-semantics": {
"version": "4.1.0", "version": "4.1.1",
"resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.0.tgz", "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.1.tgz",
"integrity": "sha512-carPklcUh7ROWRK7Cv27RPtdhYhUsela/ue5/jKzjegVvXDqM2ILE9Q2BGn9JZJh1g87cp56su/FgQSzcWS8cQ==", "integrity": "sha512-er295DKPVsV82j5kw1Gjt+ADA/XYHsajl82cGNQG2eyoPkvgUhX+nDIyelzhIWbbsXP39EHcI6l5tYs2FYqYXQ==",
"dev": true "dev": true
}, },
"node_modules/http-deceiver": { "node_modules/http-deceiver": {
@ -12575,15 +12575,15 @@
} }
}, },
"node_modules/vue": { "node_modules/vue": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/vue/-/vue-3.2.45.tgz", "resolved": "https://registry.npmjs.org/vue/-/vue-3.2.47.tgz",
"integrity": "sha512-9Nx/Mg2b2xWlXykmCwiTUCWHbWIj53bnkizBxKai1g61f2Xit700A1ljowpTIM11e3uipOeiPcSqnmBg6gyiaA==", "integrity": "sha512-60188y/9Dc9WVrAZeUVSDxRQOZ+z+y5nO2ts9jWXSTkMvayiWxCWOWtBQoYjLeccfXkiiPZWAHcV+WTPhkqJHQ==",
"dependencies": { "dependencies": {
"@vue/compiler-dom": "3.2.45", "@vue/compiler-dom": "3.2.47",
"@vue/compiler-sfc": "3.2.45", "@vue/compiler-sfc": "3.2.47",
"@vue/runtime-dom": "3.2.45", "@vue/runtime-dom": "3.2.47",
"@vue/server-renderer": "3.2.45", "@vue/server-renderer": "3.2.47",
"@vue/shared": "3.2.45" "@vue/shared": "3.2.47"
} }
}, },
"node_modules/vue-eslint-parser": { "node_modules/vue-eslint-parser": {
@ -14949,30 +14949,30 @@
} }
}, },
"@fortawesome/fontawesome-common-types": { "@fortawesome/fontawesome-common-types": {
"version": "6.2.1", "version": "6.3.0",
"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.2.1.tgz", "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.3.0.tgz",
"integrity": "sha512-Sz07mnQrTekFWLz5BMjOzHl/+NooTdW8F8kDQxjWwbpOJcnoSg4vUDng8d/WR1wOxM0O+CY9Zw0nR054riNYtQ==" "integrity": "sha512-4BC1NMoacEBzSXRwKjZ/X/gmnbp/HU5Qqat7E8xqorUtBFZS+bwfGH5/wqOC2K6GV0rgEobp3OjGRMa5fK9pFg=="
}, },
"@fortawesome/fontawesome-svg-core": { "@fortawesome/fontawesome-svg-core": {
"version": "6.2.1", "version": "6.3.0",
"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.2.1.tgz", "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.3.0.tgz",
"integrity": "sha512-HELwwbCz6C1XEcjzyT1Jugmz2NNklMrSPjZOWMlc+ZsHIVk+XOvOXLGGQtFBwSyqfJDNgRq4xBCwWOaZ/d9DEA==", "integrity": "sha512-uz9YifyKlixV6AcKlOX8WNdtF7l6nakGyLYxYaCa823bEBqyj/U2ssqtctO38itNEwXb8/lMzjdoJ+aaJuOdrw==",
"requires": { "requires": {
"@fortawesome/fontawesome-common-types": "6.2.1" "@fortawesome/fontawesome-common-types": "6.3.0"
} }
}, },
"@fortawesome/free-solid-svg-icons": { "@fortawesome/free-solid-svg-icons": {
"version": "6.2.1", "version": "6.3.0",
"resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.2.1.tgz", "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.3.0.tgz",
"integrity": "sha512-oKuqrP5jbfEPJWTij4sM+/RvgX+RMFwx3QZCZcK9PrBDgxC35zuc7AOFsyMjMd/PIFPeB2JxyqDr5zs/DZFPPw==", "integrity": "sha512-x5tMwzF2lTH8pyv8yeZRodItP2IVlzzmBuD1M7BjawWgg9XAvktqJJ91Qjgoaf8qJpHQ8FEU9VxRfOkLhh86QA==",
"requires": { "requires": {
"@fortawesome/fontawesome-common-types": "6.2.1" "@fortawesome/fontawesome-common-types": "6.3.0"
} }
}, },
"@fortawesome/vue-fontawesome": { "@fortawesome/vue-fontawesome": {
"version": "3.0.2", "version": "3.0.3",
"resolved": "https://registry.npmjs.org/@fortawesome/vue-fontawesome/-/vue-fontawesome-3.0.2.tgz", "resolved": "https://registry.npmjs.org/@fortawesome/vue-fontawesome/-/vue-fontawesome-3.0.3.tgz",
"integrity": "sha512-xHVtVY8ASUeEvgcA/7vULUesENhD+pi/EirRHdMBqooHlXBqK+yrV6d8tUye1m5UKQKVgYAHMhUBfOnoiwvc8Q==", "integrity": "sha512-KCPHi9QemVXGMrfuwf3nNnNo129resAIQWut9QTAMXmXqL2ErABC6ohd2yY5Ipq0CLWNbKHk8TMdTXL/Zf3ZhA==",
"requires": {} "requires": {}
}, },
"@hapi/hoek": { "@hapi/hoek": {
@ -15990,36 +15990,36 @@
} }
}, },
"@vue/compiler-core": { "@vue/compiler-core": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.2.47.tgz",
"integrity": "sha512-rcMj7H+PYe5wBV3iYeUgbCglC+pbpN8hBLTJvRiK2eKQiWqu+fG9F+8sW99JdL4LQi7Re178UOxn09puSXvn4A==", "integrity": "sha512-p4D7FDnQb7+YJmO2iPEv0SQNeNzcbHdGByJDsT4lynf63AFkOTFN07HsiRSvjGo0QrxR/o3d0hUyNCUnBU2Tig==",
"requires": { "requires": {
"@babel/parser": "^7.16.4", "@babel/parser": "^7.16.4",
"@vue/shared": "3.2.45", "@vue/shared": "3.2.47",
"estree-walker": "^2.0.2", "estree-walker": "^2.0.2",
"source-map": "^0.6.1" "source-map": "^0.6.1"
} }
}, },
"@vue/compiler-dom": { "@vue/compiler-dom": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.47.tgz",
"integrity": "sha512-tyYeUEuKqqZO137WrZkpwfPCdiiIeXYCcJ8L4gWz9vqaxzIQRccTSwSWZ/Axx5YR2z+LvpUbmPNXxuBU45lyRw==", "integrity": "sha512-dBBnEHEPoftUiS03a4ggEig74J2YBZ2UIeyfpcRM2tavgMWo4bsEfgCGsu+uJIL/vax9S+JztH8NmQerUo7shQ==",
"requires": { "requires": {
"@vue/compiler-core": "3.2.45", "@vue/compiler-core": "3.2.47",
"@vue/shared": "3.2.45" "@vue/shared": "3.2.47"
} }
}, },
"@vue/compiler-sfc": { "@vue/compiler-sfc": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.47.tgz",
"integrity": "sha512-1jXDuWah1ggsnSAOGsec8cFjT/K6TMZ0sPL3o3d84Ft2AYZi2jWJgRMjw4iaK0rBfA89L5gw427H4n1RZQBu6Q==", "integrity": "sha512-rog05W+2IFfxjMcFw10tM9+f7i/+FFpZJJ5XHX72NP9eC2uRD+42M3pYcQqDXVYoj74kHMSEdQ/WmCjt8JFksQ==",
"requires": { "requires": {
"@babel/parser": "^7.16.4", "@babel/parser": "^7.16.4",
"@vue/compiler-core": "3.2.45", "@vue/compiler-core": "3.2.47",
"@vue/compiler-dom": "3.2.45", "@vue/compiler-dom": "3.2.47",
"@vue/compiler-ssr": "3.2.45", "@vue/compiler-ssr": "3.2.47",
"@vue/reactivity-transform": "3.2.45", "@vue/reactivity-transform": "3.2.47",
"@vue/shared": "3.2.45", "@vue/shared": "3.2.47",
"estree-walker": "^2.0.2", "estree-walker": "^2.0.2",
"magic-string": "^0.25.7", "magic-string": "^0.25.7",
"postcss": "^8.1.10", "postcss": "^8.1.10",
@ -16027,12 +16027,12 @@
} }
}, },
"@vue/compiler-ssr": { "@vue/compiler-ssr": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.2.47.tgz",
"integrity": "sha512-6BRaggEGqhWht3lt24CrIbQSRD5O07MTmd+LjAn5fJj568+R9eUD2F7wMQJjX859seSlrYog7sUtrZSd7feqrQ==", "integrity": "sha512-wVXC+gszhulcMD8wpxMsqSOpvDZ6xKXSVWkf50Guf/S+28hTAXPDYRTbLQ3EDkOP5Xz/+SY37YiwDquKbJOgZw==",
"requires": { "requires": {
"@vue/compiler-dom": "3.2.45", "@vue/compiler-dom": "3.2.47",
"@vue/shared": "3.2.45" "@vue/shared": "3.2.47"
} }
}, },
"@vue/component-compiler-utils": { "@vue/component-compiler-utils": {
@ -16098,57 +16098,57 @@
"integrity": "sha512-JD5fcdIuFxU4fQyXUu3w2KpAJHzTVdN+p4iOX2lMWSHMOoQdMAcpFLZzm9Z/2nmsoZ1a96QEhZ26e50xLBsgOQ==" "integrity": "sha512-JD5fcdIuFxU4fQyXUu3w2KpAJHzTVdN+p4iOX2lMWSHMOoQdMAcpFLZzm9Z/2nmsoZ1a96QEhZ26e50xLBsgOQ=="
}, },
"@vue/reactivity": { "@vue/reactivity": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.47.tgz",
"integrity": "sha512-PRvhCcQcyEVohW0P8iQ7HDcIOXRjZfAsOds3N99X/Dzewy8TVhTCT4uXpAHfoKjVTJRA0O0K+6QNkDIZAxNi3A==", "integrity": "sha512-7khqQ/75oyyg+N/e+iwV6lpy1f5wq759NdlS1fpAhFXa8VeAIKGgk2E/C4VF59lx5b+Ezs5fpp/5WsRYXQiKxQ==",
"requires": { "requires": {
"@vue/shared": "3.2.45" "@vue/shared": "3.2.47"
} }
}, },
"@vue/reactivity-transform": { "@vue/reactivity-transform": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/reactivity-transform/-/reactivity-transform-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/reactivity-transform/-/reactivity-transform-3.2.47.tgz",
"integrity": "sha512-BHVmzYAvM7vcU5WmuYqXpwaBHjsS8T63jlKGWVtHxAHIoMIlmaMyurUSEs1Zcg46M4AYT5MtB1U274/2aNzjJQ==", "integrity": "sha512-m8lGXw8rdnPVVIdIFhf0LeQ/ixyHkH5plYuS83yop5n7ggVJU+z5v0zecwEnX7fa7HNLBhh2qngJJkxpwEEmYA==",
"requires": { "requires": {
"@babel/parser": "^7.16.4", "@babel/parser": "^7.16.4",
"@vue/compiler-core": "3.2.45", "@vue/compiler-core": "3.2.47",
"@vue/shared": "3.2.45", "@vue/shared": "3.2.47",
"estree-walker": "^2.0.2", "estree-walker": "^2.0.2",
"magic-string": "^0.25.7" "magic-string": "^0.25.7"
} }
}, },
"@vue/runtime-core": { "@vue/runtime-core": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.2.47.tgz",
"integrity": "sha512-gzJiTA3f74cgARptqzYswmoQx0fIA+gGYBfokYVhF8YSXjWTUA2SngRzZRku2HbGbjzB6LBYSbKGIaK8IW+s0A==", "integrity": "sha512-RZxbLQIRB/K0ev0K9FXhNbBzT32H9iRtYbaXb0ZIz2usLms/D55dJR2t6cIEUn6vyhS3ALNvNthI+Q95C+NOpA==",
"requires": { "requires": {
"@vue/reactivity": "3.2.45", "@vue/reactivity": "3.2.47",
"@vue/shared": "3.2.45" "@vue/shared": "3.2.47"
} }
}, },
"@vue/runtime-dom": { "@vue/runtime-dom": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.2.47.tgz",
"integrity": "sha512-cy88YpfP5Ue2bDBbj75Cb4bIEZUMM/mAkDMfqDTpUYVgTf/kuQ2VQ8LebuZ8k6EudgH8pYhsGWHlY0lcxlvTwA==", "integrity": "sha512-ArXrFTjS6TsDei4qwNvgrdmHtD930KgSKGhS5M+j8QxXrDJYLqYw4RRcDy1bz1m1wMmb6j+zGLifdVHtkXA7gA==",
"requires": { "requires": {
"@vue/runtime-core": "3.2.45", "@vue/runtime-core": "3.2.47",
"@vue/shared": "3.2.45", "@vue/shared": "3.2.47",
"csstype": "^2.6.8" "csstype": "^2.6.8"
} }
}, },
"@vue/server-renderer": { "@vue/server-renderer": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.2.47.tgz",
"integrity": "sha512-ebiMq7q24WBU1D6uhPK//2OTR1iRIyxjF5iVq/1a5I1SDMDyDu4Ts6fJaMnjrvD3MqnaiFkKQj+LKAgz5WIK3g==", "integrity": "sha512-dN9gc1i8EvmP9RCzvneONXsKfBRgqFeFZLurmHOveL7oH6HiFXJw5OGu294n1nHc/HMgTy6LulU/tv5/A7f/LA==",
"requires": { "requires": {
"@vue/compiler-ssr": "3.2.45", "@vue/compiler-ssr": "3.2.47",
"@vue/shared": "3.2.45" "@vue/shared": "3.2.47"
} }
}, },
"@vue/shared": { "@vue/shared": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.2.45.tgz", "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.2.47.tgz",
"integrity": "sha512-Ewzq5Yhimg7pSztDV+RH1UDKBzmtqieXQlpTVm2AwraoRL/Rks96mvd8Vgi7Lj+h+TH8dv7mXD3FRZR3TUvbSg==" "integrity": "sha512-BHGyyGN3Q97EZx0taMQ+OLNuZcW3d37ZEVmEAyeoA9ERdGvm9Irc/0Fua8SNyOtV1w6BS4q25wbMzJujO9HIfQ=="
}, },
"@vue/vue-loader-v15": { "@vue/vue-loader-v15": {
"version": "npm:vue-loader@15.10.1", "version": "npm:vue-loader@15.10.1",
@ -16647,9 +16647,9 @@
} }
}, },
"axios": { "axios": {
"version": "1.2.2", "version": "1.3.3",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.2.2.tgz", "resolved": "https://registry.npmjs.org/axios/-/axios-1.3.3.tgz",
"integrity": "sha512-bz/J4gS2S3I7mpN/YZfGFTqhXTYzRho8Ay38w2otuuDR322KzFIWm/4W2K6gIwvWaws5n+mnb7D1lN9uD+QH6Q==", "integrity": "sha512-eYq77dYIFS77AQlhzEL937yUBSepBfPIe8FcgEDN35vMNZKMrs81pgnyrQpwfy4NF4b4XWX1Zgx7yX+25w8QJA==",
"requires": { "requires": {
"follow-redirects": "^1.15.0", "follow-redirects": "^1.15.0",
"form-data": "^4.0.0", "form-data": "^4.0.0",
@ -17513,9 +17513,9 @@
} }
}, },
"core-js": { "core-js": {
"version": "3.27.1", "version": "3.28.0",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.27.1.tgz", "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.28.0.tgz",
"integrity": "sha512-GutwJLBChfGCpwwhbYoqfv03LAfmiz7e7D/BNxzeMxwQf10GRSzqiOjx7AmtEk+heiD/JWmBuyBPgFtx0Sg1ww==" "integrity": "sha512-GiZn9D4Z/rSYvTeg1ljAIsEqFm0LaN9gVtwDCrKL80zHtS31p9BAjmTxVqTQDMpwlMolJZOFntUG2uwyj7DAqw=="
}, },
"core-js-compat": { "core-js-compat": {
"version": "3.27.1", "version": "3.27.1",
@ -18127,9 +18127,9 @@
} }
}, },
"electron": { "electron": {
"version": "22.0.0", "version": "23.1.0",
"resolved": "https://registry.npmjs.org/electron/-/electron-22.0.0.tgz", "resolved": "https://registry.npmjs.org/electron/-/electron-23.1.0.tgz",
"integrity": "sha512-cgRc4wjyM+81A0E8UGv1HNJjL1HBI5cWNh/DUIjzYvoUuiEM0SS0hAH/zaFQ18xOz2ced6Yih8SybpOiOYJhdg==", "integrity": "sha512-LRgACMpVrmjfYWPgCSyJ+TFQ/FPeniOowpO57z0xUcTchfC7EH+5rUncgYN+uMvqePiYDce+ywZeCIFaO8x/Nw==",
"dev": true, "dev": true,
"requires": { "requires": {
"@electron/get": "^2.0.0", "@electron/get": "^2.0.0",
@ -18471,9 +18471,9 @@
"dev": true "dev": true
}, },
"eslint": { "eslint": {
"version": "8.31.0", "version": "8.34.0",
"resolved": "https://registry.npmjs.org/eslint/-/eslint-8.31.0.tgz", "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.34.0.tgz",
"integrity": "sha512-0tQQEVdmPZ1UtUKXjX7EMm9BlgJ08G90IhWh0PKDCb3ZLsgAOHI8fYSIzYVZej92zsgq+ft0FGsxhJ3xo2tbuA==", "integrity": "sha512-1Z8iFsucw+7kSqXNZVslXS8Ioa4u2KM7GPwuKtkTFAqZ/cHMcEaR+1+Br0wLlot49cNxIiZk5wp8EAbPcYZxTg==",
"dev": true, "dev": true,
"requires": { "requires": {
"@eslint/eslintrc": "^1.4.1", "@eslint/eslintrc": "^1.4.1",
@ -18612,9 +18612,9 @@
} }
}, },
"eslint-plugin-vue": { "eslint-plugin-vue": {
"version": "9.8.0", "version": "9.9.0",
"resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.8.0.tgz", "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.9.0.tgz",
"integrity": "sha512-E/AXwcTzunyzM83C2QqDHxepMzvI2y6x+mmeYHbVDQlKFqmKYvRrhaVixEeeG27uI44p9oKDFiyCRw4XxgtfHA==", "integrity": "sha512-YbubS7eK0J7DCf0U2LxvVP7LMfs6rC6UltihIgval3azO3gyDwEGVgsCMe1TmDiEkl6GdMKfRpaME6QxIYtzDQ==",
"dev": true, "dev": true,
"requires": { "requires": {
"eslint-utils": "^3.0.0", "eslint-utils": "^3.0.0",
@ -19629,9 +19629,9 @@
} }
}, },
"http-cache-semantics": { "http-cache-semantics": {
"version": "4.1.0", "version": "4.1.1",
"resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.0.tgz", "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.1.tgz",
"integrity": "sha512-carPklcUh7ROWRK7Cv27RPtdhYhUsela/ue5/jKzjegVvXDqM2ILE9Q2BGn9JZJh1g87cp56su/FgQSzcWS8cQ==", "integrity": "sha512-er295DKPVsV82j5kw1Gjt+ADA/XYHsajl82cGNQG2eyoPkvgUhX+nDIyelzhIWbbsXP39EHcI6l5tYs2FYqYXQ==",
"dev": true "dev": true
}, },
"http-deceiver": { "http-deceiver": {
@ -23074,15 +23074,15 @@
} }
}, },
"vue": { "vue": {
"version": "3.2.45", "version": "3.2.47",
"resolved": "https://registry.npmjs.org/vue/-/vue-3.2.45.tgz", "resolved": "https://registry.npmjs.org/vue/-/vue-3.2.47.tgz",
"integrity": "sha512-9Nx/Mg2b2xWlXykmCwiTUCWHbWIj53bnkizBxKai1g61f2Xit700A1ljowpTIM11e3uipOeiPcSqnmBg6gyiaA==", "integrity": "sha512-60188y/9Dc9WVrAZeUVSDxRQOZ+z+y5nO2ts9jWXSTkMvayiWxCWOWtBQoYjLeccfXkiiPZWAHcV+WTPhkqJHQ==",
"requires": { "requires": {
"@vue/compiler-dom": "3.2.45", "@vue/compiler-dom": "3.2.47",
"@vue/compiler-sfc": "3.2.45", "@vue/compiler-sfc": "3.2.47",
"@vue/runtime-dom": "3.2.45", "@vue/runtime-dom": "3.2.47",
"@vue/server-renderer": "3.2.45", "@vue/server-renderer": "3.2.47",
"@vue/shared": "3.2.45" "@vue/shared": "3.2.47"
} }
}, },
"vue-eslint-parser": { "vue-eslint-parser": {

View File

@ -13,15 +13,15 @@
}, },
"main": "electron.js", "main": "electron.js",
"dependencies": { "dependencies": {
"@fortawesome/fontawesome-svg-core": "^6.2.1", "@fortawesome/fontawesome-svg-core": "^6.3.0",
"@fortawesome/free-solid-svg-icons": "^6.2.1", "@fortawesome/free-solid-svg-icons": "^6.3.0",
"@fortawesome/vue-fontawesome": "^3.0.2", "@fortawesome/vue-fontawesome": "^3.0.3",
"axios": "^1.2.2", "axios": "^1.3.3",
"body-parser": "^1.19.1", "body-parser": "^1.20.1",
"core-js": "^3.27.1", "core-js": "^3.28.0",
"express": "^4.18.2", "express": "^4.18.2",
"mp3tag.js": "^3.3.2", "mp3tag.js": "^3.3.2",
"vue": "*", "vue": "^3.2.47",
"vue-router": "^4.1.6", "vue-router": "^4.1.6",
"vuex": "^4.1.0" "vuex": "^4.1.0"
}, },
@ -30,10 +30,10 @@
"@vue/cli-plugin-babel": "^5.0.8", "@vue/cli-plugin-babel": "^5.0.8",
"@vue/cli-plugin-eslint": "^5.0.8", "@vue/cli-plugin-eslint": "^5.0.8",
"@vue/cli-service": "^5.0.8", "@vue/cli-service": "^5.0.8",
"electron": "^22.0.0", "electron": "^23.1.0",
"electron-builder": "^23.6.0", "electron-builder": "^23.6.0",
"eslint": "^8.31.0", "eslint": "^8.34.0",
"eslint-plugin-vue": "^9.8.0" "eslint-plugin-vue": "^9.9.0"
}, },
"eslintConfig": { "eslintConfig": {
"root": true, "root": true,

View File

@ -1,5 +1,5 @@
{ {
"backend_dev": "http://localhost:31204", "backend_de": "http://localhost:31204",
"backend_de": "https://webplay.rocks", "backend_dev": "https://webplay.rocks",
"backend": "https://webplay.rocks" "backend": "https://webplay.rocks"
} }

View File

@ -13,6 +13,16 @@
<link rel="icon" type="image/svg+xml" href="static/icon_32.svg" sizes="32x32" /> <link rel="icon" type="image/svg+xml" href="static/icon_32.svg" sizes="32x32" />
<link rel="icon" type="image/svg+xml" href="static/icon_48.svg" sizes="48x48" /> <link rel="icon" type="image/svg+xml" href="static/icon_48.svg" sizes="48x48" />
<link rel="icon" type="image/svg+xml" href="static/icon_64.svg" sizes="any" /> <link rel="icon" type="image/svg+xml" href="static/icon_64.svg" sizes="any" />
<link rel="apple-touch-icon-precomposed" href="static/icon_16.png" sizes="16x16" />
<link rel="apple-touch-icon-precomposed" href="static/icon_24.png" sizes="24x24" />
<link rel="apple-touch-icon-precomposed" href="static/icon_32_flat-dark.png" sizes="32x32" />
<link rel="apple-touch-icon-precomposed" href="static/icon_48_flat-dark.png" sizes="48x48" />
<link rel="apple-touch-icon-precomposed" href="static/icon_64_flat-dark.png" sizes="64x64" />
<link rel="apple-touch-icon-precomposed" href="static/icon_96_flat-dark.png" sizes="96x96" />
<link rel="apple-touch-icon-precomposed" href="static/icon_128_flat-dark.png" sizes="128x128" />
<link rel="apple-touch-icon-precomposed" href="static/icon_192_flat-dark.png" sizes="192x192" />
<title>WebPlay.rocks</title> <title>WebPlay.rocks</title>
<link rel="manifest" href="manifest.json" /> <link rel="manifest" href="manifest.json" />
<link rel="stylesheet" type="text/css" href="static/style.css" /> <link rel="stylesheet" type="text/css" href="static/style.css" />

View File

@ -7,6 +7,16 @@ body {
overflow-y: overlay; overflow-y: overlay;
} }
#popup-collection {
display: flex;
flex-direction: column;
position: fixed;
bottom: 16px;
left: -160px;
margin-left: 50%;
z-index: 1200;
}
h1 { h1 {
font-weight: 200; font-weight: 200;
font-size: 3rem; font-size: 3rem;
@ -56,7 +66,8 @@ td.fillCell>* {
#boxes, #boxes,
#radios, #radios,
#search, #search,
#welcome { #welcome,
#share {
display: flex; display: flex;
flex-grow: 1; flex-grow: 1;
flex-wrap: wrap; flex-wrap: wrap;
@ -65,6 +76,7 @@ td.fillCell>* {
} }
.componentTitle { .componentTitle {
border-top: 1px solid #ffffffc0;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
background-color: #ffffffb0; background-color: #ffffffb0;
@ -83,13 +95,23 @@ td.fillCell>* {
color: var(--yellow); color: var(--yellow);
} }
.keepPlaying {
z-index: 1;
position: absolute;
cursor: pointer;
right: 0;
}
/* /*
DIALOGS DIALOGS
*/ */
#artistViewer #background, #artistViewer #background,
#albumViewer #background, #albumViewer #background,
#boxViewer #background { #boxViewer #background,
#albumContent #background,
#boxContent #background {
background-size: cover; background-size: cover;
background-position: center; background-position: center;
top: -16px; top: -16px;
@ -591,6 +613,10 @@ td.fillCell>* {
animation: glow 1s infinite alternate; animation: glow 1s infinite alternate;
} }
.z-1 {
z-index: -1;
}
.z1 { .z1 {
z-index: 1; z-index: 1;
} }

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -0,0 +1,346 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="32"
height="32"
version="1.1"
id="svg94"
sodipodi:docname="icon_32_flat-dark.svg"
inkscape:version="1.3 (0e150ed6c4, 2023-07-21)"
inkscape:export-filename="icon_32_flat-dark.png"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:dc="http://purl.org/dc/elements/1.1/">
<metadata
id="metadata98">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
</cc:Work>
</rdf:RDF>
</metadata>
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1729"
inkscape:window-height="959"
id="namedview96"
showgrid="false"
inkscape:zoom="10.429825"
inkscape:cx="-9.0126153"
inkscape:cy="-9.5878886"
inkscape:window-x="124"
inkscape:window-y="40"
inkscape:window-maximized="0"
inkscape:current-layer="svg94"
inkscape:showpageshadow="2"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1" />
<defs
id="defs38">
<linearGradient
inkscape:collect="always"
id="linearGradient949">
<stop
style="stop-color:#545c64;stop-opacity:1"
offset="0"
id="stop945" />
<stop
style="stop-color:#31363b;stop-opacity:1"
offset="1"
id="stop947" />
</linearGradient>
<linearGradient
id="linearGradient4161"
x1="24"
x2="24"
y1="5"
y2="43"
gradientTransform="matrix(0.67567568,0,0,0.67567568,-0.21621703,-0.21620627)"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient3924-0" />
<linearGradient
id="linearGradient3924-0">
<stop
offset="0"
style="stop-color:#ffffff;stop-opacity:1"
id="stop3" />
<stop
offset=".063"
style="stop-color:#ffffff;stop-opacity:0.23529412"
id="stop5" />
<stop
offset=".951"
style="stop-color:#ffffff;stop-opacity:0.15686275"
id="stop7" />
<stop
offset="1"
style="stop-color:#ffffff;stop-opacity:0.39215687"
id="stop9" />
</linearGradient>
<radialGradient
id="radialGradient2976"
cx="4.993"
cy="43.5"
r="2.5"
fx="4.993"
fy="43.5"
gradientTransform="matrix(2.003784,0,0,1.4,27.98813,-17.4)"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient3688-166-749-6" />
<linearGradient
id="linearGradient3688-166-749-6">
<stop
offset="0"
style="stop-color:#181818;stop-opacity:1"
id="stop13" />
<stop
offset="1"
style="stop-color:#181818;stop-opacity:0"
id="stop15" />
</linearGradient>
<radialGradient
id="radialGradient2978"
cx="4.993"
cy="43.5"
r="2.5"
fx="4.993"
fy="43.5"
gradientTransform="matrix(2.003784,0,0,1.4,-20.01187,-104.4)"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient3688-464-309-7" />
<linearGradient
id="linearGradient3688-464-309-7">
<stop
offset="0"
style="stop-color:#181818;stop-opacity:1"
id="stop19" />
<stop
offset="1"
style="stop-color:#181818;stop-opacity:0"
id="stop21" />
</linearGradient>
<linearGradient
id="linearGradient2980"
x1="25.058"
x2="25.058"
y1="47.028"
y2="39.999"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient3702-501-757-3" />
<linearGradient
id="linearGradient3702-501-757-3">
<stop
offset="0"
style="stop-color:#181818;stop-opacity:0"
id="stop25" />
<stop
offset=".5"
style="stop-color:#181818;stop-opacity:1"
id="stop27" />
<stop
offset="1"
style="stop-color:#181818;stop-opacity:0"
id="stop29" />
</linearGradient>
<linearGradient
id="linearGradient4256">
<stop
offset="0"
style="stop-color:#1777ba;stop-opacity:1"
id="stop32" />
<stop
offset="1"
style="stop-color:#5cb7f6;stop-opacity:1"
id="stop34" />
</linearGradient>
<linearGradient
id="linearGradient4248"
x1="16"
x2="16"
y1="29"
y2="3"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient4256" />
<radialGradient
inkscape:collect="always"
xlink:href="#linearGradient949"
id="radialGradient951"
cx="8"
cy="16"
fx="8"
fy="16"
r="14"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(0,1.9935897,-2.1298809,0,50.078095,-13.484182)" />
</defs>
<rect
style="fill:url(#radialGradient951);fill-opacity:1;stroke:none;stroke-width:2.17991281;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect925"
width="32"
height="32"
x="0"
y="0"
ry="0" />
<path
d="M 16 5 C 11.560863 5 8.7693012 7.2360203 7.4296875 9.4726562 C 6.1060542 11.682611 6.0039063 13.894531 6.0039062 13.894531 C 6.0020435 13.927059 6.0002716 13.959606 6 13.992188 A 1.0001 1.0001 0 0 0 6 14 L 6 16.208984 C 5.4481455 16.432277 5.0000623 16.876571 5 17.5 L 5 19.5 C 5.0000816 20.3165 5.6834996 20.999918 6.5 21 L 6.5742188 21 L 7.1582031 22.167969 C 7.4105832 22.675344 7.933321 22.999486 8.5 23 L 9.8789062 23 L 10.439453 23.560547 C 10.720431 23.841561 11.102612 23.999924 11.5 24 L 12.5 24 C 13.3165 23.999918 13.999918 23.3165 14 22.5 L 14 15.5 C 13.999918 14.6835 13.3165 14.000082 12.5 14 L 11.5 14 C 10.933321 14.000513 10.410584 14.324656 10.158203 14.832031 L 10 15.146484 L 10 14.099609 C 9.9992628 14.112029 10.08956 12.812634 10.859375 11.527344 C 11.65569 10.197806 12.783237 9 16 9 C 19.216764 9 20.34431 10.197806 21.140625 11.527344 C 21.910439 12.812635 22.001422 14.123011 22 14.099609 L 22 15.146484 L 21.841797 14.832031 C 21.589416 14.324656 21.066679 14.000513 20.5 14 L 19.5 14 C 18.6835 14.000082 18.000082 14.6835 18 15.5 L 18 22.5 C 18.000082 23.3165 18.6835 23.999918 19.5 24 L 20.5 24 C 20.897388 23.999924 21.279569 23.841561 21.560547 23.560547 L 22.121094 23 L 23.5 23 C 24.066679 22.999487 24.589416 22.675344 24.841797 22.167969 L 25.425781 21 L 25.5 21 C 26.3165 20.999918 26.999918 20.3165 27 19.5 L 27 17.5 C 26.999938 16.876571 26.551855 16.432277 26 16.208984 L 26 14 A 1.0001 1.0001 0 0 0 26 13.990234 C 25.999707 13.958304 25.997894 13.926411 25.996094 13.894531 C 25.996094 13.894531 25.893947 11.682611 24.570312 9.4726562 C 23.230808 7.2359838 20.439137 5 16 5 z"
style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.15;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
id="path52" />
<path
d="M 16,6 C 11.886169,6 9.4723841,8.0073783 8.2871094,9.9863281 7.1018346,11.965278 7.0019531,13.945315 7.0019531,13.945312 A 1.0001,1.0001 0 0 0 7,14 l 0,3 -0.5,0 A 0.50005,0.50005 0 0 0 6,17.5 l 0,2 A 0.50005,0.50005 0 0 0 6.5,20 l 0.6914062,0 0.8613282,1.722656 A 0.50005,0.50005 0 0 0 8.5,22 l 1.792969,0 0.853515,0.853516 A 0.50005,0.50005 0 0 0 11.5,23 l 1,0 A 0.50005,0.50005 0 0 0 13,22.5 l 0,-7 A 0.50005,0.50005 0 0 0 12.5,15 l -1,0 a 0.50005,0.50005 0 0 0 -0.447266,0.277344 L 10.191406,17 9,17 9,14.042969 C 9.00117,14.024379 9.096555,12.525336 10.001953,11.013672 10.912973,9.4926217 12.499009,8 16,8 c 3.500992,0 5.087027,1.4926217 5.998047,3.013672 0.905398,1.511664 1.000787,3.01071 1.001953,3.029297 L 23,17 21.808594,17 20.947266,15.277344 A 0.50005,0.50005 0 0 0 20.5,15 l -1,0 A 0.50005,0.50005 0 0 0 19,15.5 l 0,7 a 0.50005,0.50005 0 0 0 0.5,0.5 l 1,0 a 0.50005,0.50005 0 0 0 0.353516,-0.146484 L 21.707031,22 23.5,22 a 0.50005,0.50005 0 0 0 0.447266,-0.277344 L 24.808594,20 25.5,20 A 0.50005,0.50005 0 0 0 26,19.5 l 0,-2 A 0.50005,0.50005 0 0 0 25.5,17 l -0.5,0 0,-3 a 1.0001,1.0001 0 0 0 -0.002,-0.05469 c 0,0 -0.09988,-1.980034 -1.285156,-3.9589839 C 22.52771,8.0073823 20.113831,6 16,6 Z"
style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.3;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
id="path54" />
<rect
style="opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="2"
height="1"
x="5"
y="26"
rx="0"
ry="0"
id="rect60" />
<rect
width="2"
height="1"
x="8"
y="26"
rx="0"
ry="0"
style="opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect62" />
<rect
style="opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="3"
height="1"
x="11"
y="26"
rx="0"
ry="0"
id="rect64" />
<rect
width="2"
height="1"
x="15"
y="26"
rx="0"
ry="0"
style="opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect66" />
<rect
style="opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="3"
height="1"
x="18"
y="26"
rx="0"
ry="0"
id="rect68" />
<rect
width="2"
height="1"
x="22"
y="26"
rx="0"
ry="0"
style="opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect70" />
<rect
width="2"
height="1"
x="5"
y="24"
rx="0"
ry="0"
style="opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect72" />
<rect
width="3"
height="1"
x="11"
y="24"
rx="0"
ry="0"
style="opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect74" />
<rect
style="opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="2"
height="1"
x="15"
y="24"
rx="0"
ry="0"
id="rect76" />
<rect
width="3"
height="1"
x="18"
y="24"
rx="0"
ry="0"
style="opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect78" />
<rect
width="2"
height="1"
x="15"
y="22"
rx="0"
ry="0"
style="opacity:0.4;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect80" />
<rect
style="opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="2"
height="1"
x="25"
y="26"
rx="0"
ry="0"
id="rect82" />
<rect
width="2"
height="1"
x="25"
y="24"
rx="0"
ry="0"
style="opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect84" />
<rect
style="opacity:0.4;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="2"
height="1"
x="25"
y="22"
rx="0"
ry="0"
id="rect86" />
<path
d="m 6.5,16.500017 0,2 1,0 1,2 2,0 1,1 1,0 0,-7 -1,0 -1,2 z"
style="display:inline;opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:1;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="path88" />
<path
d="m 8,16.000017 0,-3 c 0,0 0.3851775,-6.9999996 8,-6.9999996 7.614823,0 8,6.9999996 8,6.9999996 l 0,3"
style="display:inline;opacity:1;fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="path90" />
<path
style="display:inline;opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:1;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 25.5,16.500017 0,2 -1,0 -1,2 -2,0 -1,1 -1,0 0,-7 1,0 1,2 z"
id="path92" />
</svg>

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

View File

@ -0,0 +1,347 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="48"
height="48"
version="1.1"
id="svg2"
inkscape:version="1.3 (0e150ed6c4, 2023-07-21)"
sodipodi:docname="icon_48_flat-dark.svg"
inkscape:export-filename="icon_48_flat-dark.png"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:dc="http://purl.org/dc/elements/1.1/">
<metadata
id="metadata96">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
</cc:Work>
</rdf:RDF>
</metadata>
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1459"
inkscape:window-height="959"
id="namedview94"
showgrid="false"
inkscape:zoom="4.9166667"
inkscape:cx="5.4915254"
inkscape:cy="-19.728813"
inkscape:window-x="171"
inkscape:window-y="40"
inkscape:window-maximized="0"
inkscape:current-layer="svg2"
inkscape:showpageshadow="2"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1" />
<defs
id="defs4">
<linearGradient
inkscape:collect="always"
id="linearGradient877">
<stop
style="stop-color:#545c64;stop-opacity:1"
offset="0"
id="stop873" />
<stop
style="stop-color:#31363b;stop-opacity:1"
offset="1"
id="stop875" />
</linearGradient>
<linearGradient
id="linearGradient3058"
x1="24"
x2="24"
y1="5"
y2="43"
gradientTransform="translate(4e-6,1.000006)"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient3924-1" />
<linearGradient
id="linearGradient3924-1">
<stop
offset="0"
style="stop-color:#ffffff;stop-opacity:1"
id="stop8" />
<stop
offset=".063"
style="stop-color:#ffffff;stop-opacity:0.23529412"
id="stop10" />
<stop
offset=".951"
style="stop-color:#ffffff;stop-opacity:0.15686275"
id="stop12" />
<stop
offset="1"
style="stop-color:#ffffff;stop-opacity:0.39215687"
id="stop14" />
</linearGradient>
<radialGradient
id="radialGradient3013"
cx="4.993"
cy="43.5"
r="2.5"
fx="4.993"
fy="43.5"
gradientTransform="matrix(2.4045409,0,0,0.89999994,27.985756,4.600003)"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient3688-166-749" />
<linearGradient
id="linearGradient3688-166-749">
<stop
offset="0"
style="stop-color:#181818;stop-opacity:1"
id="stop18" />
<stop
offset="1"
style="stop-color:#181818;stop-opacity:0"
id="stop20" />
</linearGradient>
<radialGradient
id="radialGradient3015"
cx="4.993"
cy="43.5"
r="2.5"
fx="4.993"
fy="43.5"
gradientTransform="matrix(2.4045409,0,0,0.89999994,-20.014244,-82.899992)"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient3688-464-309" />
<linearGradient
id="linearGradient3688-464-309">
<stop
offset="0"
style="stop-color:#181818;stop-opacity:1"
id="stop24" />
<stop
offset="1"
style="stop-color:#181818;stop-opacity:0"
id="stop26" />
</linearGradient>
<linearGradient
id="linearGradient3702-501-757">
<stop
offset="0"
style="stop-color:#181818;stop-opacity:0"
id="stop29" />
<stop
offset=".5"
style="stop-color:#181818;stop-opacity:1"
id="stop31" />
<stop
offset="1"
style="stop-color:#181818;stop-opacity:0"
id="stop33" />
</linearGradient>
<linearGradient
id="linearGradient6647"
x1="25.058"
x2="25.058"
y1="47.028"
y2="39.999"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient3702-501-757"
gradientTransform="matrix(1.1428571,0,0,0.6428571,-3.4285711,15.785724)" />
<linearGradient
id="linearGradient4256">
<stop
offset="0"
style="stop-color:#1777ba;stop-opacity:1"
id="stop37" />
<stop
offset="1"
style="stop-color:#5cb7f6;stop-opacity:1"
id="stop39" />
</linearGradient>
<linearGradient
id="linearGradient4254"
x1="24"
x2="24"
y1="44"
y2="5.972"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient4256" />
<radialGradient
inkscape:collect="always"
xlink:href="#linearGradient877"
id="radialGradient879"
cx="24"
cy="3.0744331"
fx="24"
fy="3.0744331"
r="21"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(0,1.9467312,-2.2881356,0,31.03472,-43.647117)" />
</defs>
<rect
style="fill:url(#radialGradient879);fill-opacity:1;stroke:none;stroke-width:1.99050581;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect853"
width="48"
height="48"
x="0"
y="0"
ry="0" />
<path
style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.15;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:2;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
d="M 24,9 C 17.872945,9 14.350715,12.036316 12.691406,15.021484 11.032098,18.006653 11,20.974609 11,20.974609 A 1.50015,1.50015 0 0 0 11,21 l 0,4 -1.5,0 A 0.50005,0.50005 0 0 0 9,25.5 l 0,5 A 0.50005,0.50005 0 0 0 9.5,31 l 1.691406,0 0.861328,1.722656 A 0.50005,0.50005 0 0 0 12.5,33 l 2.691406,0 0.861328,1.722656 A 0.50005,0.50005 0 0 0 16.5,35 l 2,0 A 0.50005,0.50005 0 0 0 19,34.5 l 0,-11 A 0.50005,0.50005 0 0 0 18.5,23 l -2,0 a 0.50005,0.50005 0 0 0 -0.447266,0.277344 L 15.191406,25 14,25 14,21.025391 c 0,0 0.05359,-2.282044 1.3125,-4.546875 C 16.571408,14.213684 18.799922,12 24,12 c 5.200091,0 7.428595,2.213686 8.6875,4.478516 C 33.946405,18.743345 34,21.025391 34,21.025391 L 34,25 32.808594,25 31.947266,23.277344 A 0.50005,0.50005 0 0 0 31.5,23 l -2,0 A 0.50005,0.50005 0 0 0 29,23.5 l 0,11 a 0.50005,0.50005 0 0 0 0.5,0.5 l 2,0 a 0.50005,0.50005 0 0 0 0.447266,-0.277344 L 32.808594,33 35.5,33 a 0.50005,0.50005 0 0 0 0.447266,-0.277344 L 36.808594,31 38.5,31 A 0.50005,0.50005 0 0 0 39,30.5 l 0,-5 A 0.50005,0.50005 0 0 0 38.5,25 l -1.5,0 0,-4 a 1.50015,1.50015 0 0 0 0,-0.02539 c 0,0 -0.0321,-2.967955 -1.691406,-5.953125 C 33.649288,12.036312 30.127066,9 24,9 Z"
id="path52" />
<path
d="M 24,9 C 17.872945,9 14.350715,12.036316 12.691406,15.021484 11.032098,18.006653 11,20.974609 11,20.974609 A 1.50015,1.50015 0 0 0 11,21 l 0,4 -1.5,0 A 0.50005,0.50005 0 0 0 9,25.5 l 0,5 A 0.50005,0.50005 0 0 0 9.5,31 l 1.691406,0 0.861328,1.722656 A 0.50005,0.50005 0 0 0 12.5,33 l 2.691406,0 0.861328,1.722656 A 0.50005,0.50005 0 0 0 16.5,35 l 2,0 A 0.50005,0.50005 0 0 0 19,34.5 l 0,-11 A 0.50005,0.50005 0 0 0 18.5,23 l -2,0 a 0.50005,0.50005 0 0 0 -0.447266,0.277344 L 15.191406,25 14,25 14,21.025391 c 0,0 0.05359,-2.282044 1.3125,-4.546875 C 16.571408,14.213684 18.799922,12 24,12 c 5.200091,0 7.428595,2.213686 8.6875,4.478516 C 33.946405,18.743345 34,21.025391 34,21.025391 L 34,25 32.808594,25 31.947266,23.277344 A 0.50005,0.50005 0 0 0 31.5,23 l -2,0 A 0.50005,0.50005 0 0 0 29,23.5 l 0,11 a 0.50005,0.50005 0 0 0 0.5,0.5 l 2,0 a 0.50005,0.50005 0 0 0 0.447266,-0.277344 L 32.808594,33 35.5,33 a 0.50005,0.50005 0 0 0 0.447266,-0.277344 L 36.808594,31 38.5,31 A 0.50005,0.50005 0 0 0 39,30.5 l 0,-5 A 0.50005,0.50005 0 0 0 38.5,25 l -1.5,0 0,-4 a 1.50015,1.50015 0 0 0 0,-0.02539 c 0,0 -0.0321,-2.967955 -1.691406,-5.953125 C 33.649288,12.036312 30.127066,9 24,9 Z"
style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.3;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
id="path54" />
<path
d="m 9.5000062,24.499999 0,5 1.9999998,0 1,2 3,0 1,2 2,0 0,-11 -2,0 -1,2 z"
style="display:inline;opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:1;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="path60" />
<path
d="m 12.500006,24.478599 0,-4.4786 c 0,0 0.172867,-10.4999998 11.5,-10.4999998 11.327157,0 11.5,10.4999998 11.5,10.4999998 l 0,4.4786"
style="display:inline;opacity:1;fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="path62" />
<path
style="display:inline;opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:1;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 38.500006,24.499999 0,5 -2,0 -1,2 -3,0 -1,2 -2,0 0,-11 2,0 1,2 z"
id="path64" />
<rect
width="4"
height="2"
x="7"
y="39"
rx="0"
ry="0"
style="display:inline;opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect66" />
<rect
style="display:inline;opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="4"
height="2"
x="12"
y="39"
rx="0"
ry="0"
id="rect68" />
<rect
width="4"
height="2"
x="17"
y="39"
rx="0"
ry="0"
style="display:inline;opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect70" />
<rect
style="display:inline;opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="4"
height="2"
x="22"
y="39"
rx="0"
ry="0"
id="rect72" />
<rect
width="4"
height="2"
x="27"
y="39"
rx="0"
ry="0"
style="display:inline;opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect74" />
<rect
style="display:inline;opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="4"
height="2"
x="32"
y="39"
rx="0"
ry="0"
id="rect76" />
<rect
width="4"
height="2"
x="37"
y="39"
rx="0"
ry="0"
style="display:inline;opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect78" />
<rect
style="display:inline;opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="4"
height="2"
x="7"
y="36"
rx="0"
ry="0"
id="rect80" />
<rect
style="display:inline;opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="4"
height="2"
x="17"
y="36"
rx="0"
ry="0"
id="rect82" />
<rect
width="4"
height="2"
x="22"
y="36"
rx="0"
ry="0"
style="display:inline;opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect84" />
<rect
style="display:inline;opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="4"
height="2"
x="27"
y="36"
rx="0"
ry="0"
id="rect86" />
<rect
style="display:inline;opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="4"
height="2"
x="37"
y="36"
rx="0"
ry="0"
id="rect88" />
<rect
style="display:inline;opacity:0.4;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="4"
height="2"
x="22"
y="33"
rx="0"
ry="0"
id="rect90" />
<rect
width="4"
height="2"
x="37"
y="33"
rx="0"
ry="0"
style="display:inline;opacity:0.4;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect92" />
</svg>

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

View File

@ -0,0 +1,347 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="64"
height="64"
version="1.1"
id="svg2"
inkscape:version="1.3 (0e150ed6c4, 2023-07-21)"
sodipodi:docname="icon_64_flat-dark.svg"
inkscape:export-filename="icon_96_flat-dark.png"
inkscape:export-xdpi="144"
inkscape:export-ydpi="144"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:dc="http://purl.org/dc/elements/1.1/">
<metadata
id="metadata96">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
</cc:Work>
</rdf:RDF>
</metadata>
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1611"
inkscape:window-height="952"
id="namedview94"
showgrid="false"
inkscape:zoom="8"
inkscape:cx="32"
inkscape:cy="31.5625"
inkscape:window-x="172"
inkscape:window-y="47"
inkscape:window-maximized="0"
inkscape:current-layer="svg2"
inkscape:showpageshadow="2"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1" />
<defs
id="defs4">
<linearGradient
inkscape:collect="always"
id="linearGradient877">
<stop
style="stop-color:#535c65;stop-opacity:1"
offset="0"
id="stop873" />
<stop
style="stop-color:#31363b;stop-opacity:1"
offset="1"
id="stop875" />
</linearGradient>
<linearGradient
id="linearGradient4256">
<stop
style="stop-color:#1777ba;stop-opacity:1"
offset="0"
id="stop7" />
<stop
style="stop-color:#1777ba;stop-opacity:1"
offset="1"
id="stop9" />
</linearGradient>
<linearGradient
id="linearGradient3381-5-4"
x1="24"
x2="24"
y1="5"
y2="43"
gradientTransform="matrix(1.4324324,0,0,1.4362832,-2.378381,-2.4707782)"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient3924-2-2-5-8" />
<linearGradient
id="linearGradient3924-2-2-5-8">
<stop
style="stop-color:#ffffff;stop-opacity:1"
offset="0"
id="stop13" />
<stop
style="stop-color:#ffffff;stop-opacity:0.23529412"
offset=".063"
id="stop15" />
<stop
style="stop-color:#ffffff;stop-opacity:0.15686275"
offset=".951"
id="stop17" />
<stop
style="stop-color:#ffffff;stop-opacity:0.39215687"
offset="1"
id="stop19" />
</linearGradient>
<radialGradient
id="radialGradient3337-2-2"
cx="4.993"
cy="43.5"
r="2.5"
fx="4.993"
fy="43.5"
gradientTransform="matrix(3.2060543,0,0,0.99999998,37.981006,16.000001)"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient3688-166-749-4-0-3-8" />
<linearGradient
id="linearGradient3688-166-749-4-0-3-8">
<stop
style="stop-color:#181818;stop-opacity:1"
offset="0"
id="stop23" />
<stop
style="stop-color:#181818;stop-opacity:0"
offset="1"
id="stop25" />
</linearGradient>
<radialGradient
id="radialGradient3339-1-4"
cx="4.993"
cy="43.5"
r="2.5"
fx="4.993"
fy="43.5"
gradientTransform="matrix(3.2060543,0,0,0.99999998,-26.018992,-103)"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient3688-464-309-9-2-4-2" />
<linearGradient
id="linearGradient3688-464-309-9-2-4-2">
<stop
style="stop-color:#181818;stop-opacity:1"
offset="0"
id="stop29" />
<stop
style="stop-color:#181818;stop-opacity:0"
offset="1"
id="stop31" />
</linearGradient>
<linearGradient
id="linearGradient3702-501-757-8-4-1-1">
<stop
style="stop-color:#181818;stop-opacity:0"
offset="0"
id="stop34" />
<stop
style="stop-color:#181818;stop-opacity:1"
offset=".5"
id="stop36" />
<stop
style="stop-color:#181818;stop-opacity:0"
offset="1"
id="stop38" />
</linearGradient>
<linearGradient
id="linearGradient6394"
x1="25.058"
x2="25.058"
y1="47.028"
y2="39.999"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient3702-501-757-8-4-1-1"
gradientTransform="matrix(1.5714286,0,0,0.7142857,-5.7142853,28.428572)" />
<linearGradient
id="linearGradient4262"
x1="31"
x2="31"
y1="59"
y2="4.737"
gradientUnits="userSpaceOnUse"
xlink:href="#linearGradient4256" />
<radialGradient
inkscape:collect="always"
xlink:href="#linearGradient877"
id="radialGradient879"
cx="31.625"
cy="4"
fx="31.625"
fy="4"
r="28"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(0,1.9571706,-2.0851744,0,39.965698,-57.895519)" />
</defs>
<rect
style="fill:url(#radialGradient879);fill-opacity:1;stroke:none;stroke-width:2.85814881;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect853"
width="64"
height="64"
x="0"
y="0"
ry="0" />
<path
style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.15;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:2;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
d="M 32 8 C 22.542678 8 17.01237 12.828471 14.480469 17.591797 C 11.967919 22.318718 11.999934 26.988801 12 26.998047 L 12 27 L 12 27.003906 L 12 31 L 11.5 31 C 10.6835 31.000082 10.000082 31.6835 10 32.5 L 10 39.5 C 10.000082 40.3165 10.6835 40.999918 11.5 41 L 13.417969 41 L 14.076172 42.974609 C 14.27934 43.583587 14.858026 44.000335 15.5 44 L 17.417969 44 L 18.076172 45.974609 C 18.27934 46.583587 18.858026 47.000335 19.5 47 L 24.5 47 C 25.3165 46.999918 25.999918 46.3165 26 45.5 L 26 28.5 C 25.999918 27.6835 25.3165 27.000082 24.5 27 L 19.5 27 A 1.0001 1.0001 0 0 0 19.498047 27 C 18.815558 27.0011 18.210263 27.47456 18.044922 28.136719 L 18 28.316406 L 18 27.007812 L 18 27 C 17.9989 27.150353 18.04342 23.670266 19.777344 20.408203 C 21.536818 17.098064 24.422823 14 32 14 C 39.577196 14 42.463186 17.098064 44.222656 20.408203 C 45.959897 23.676524 46.001144 27.155119 46 27.007812 L 46 28.316406 L 45.955078 28.136719 C 45.789735 27.47456 45.184442 27.001063 44.501953 27 A 1.0001 1.0001 0 0 0 44.5 27 L 39.5 27 C 38.6835 27.000082 38.000082 27.6835 38 28.5 L 38 45.5 C 38.000082 46.3165 38.6835 46.999918 39.5 47 L 44.5 47 C 45.141974 47.000335 45.72066 46.583587 45.923828 45.974609 L 46.582031 44 L 48.5 44 C 49.141974 44.000335 49.72066 43.583587 49.923828 42.974609 L 50.582031 41 L 52.5 41 C 53.3165 40.999918 53.999918 40.3165 54 39.5 L 54 32.5 C 53.999918 31.6835 53.3165 31.000082 52.5 31 L 52 31 L 52 27.003906 L 52 27 C 52.000045 26.9938 52.03291 22.320279 49.519531 17.591797 C 46.987635 12.82862 41.457345 8 32 8 z"
id="path52" />
<path
style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.3;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
d="m 32,8.9999999 c -9.123144,0 -14.251477,4.5731351 -16.636719,9.0605471 C 12.97804,22.547959 13,26.998047 13,26.998047 A 2.0002,2.0002 0 0 0 13,27 l 0,5 -1.5,0 A 0.50005,0.50005 0 0 0 11,32.5 l 0,7 a 0.50005,0.50005 0 0 0 0.5,0.5 l 2.638672,0 0.886719,2.658203 A 0.50005,0.50005 0 0 0 15.5,43 l 2.638672,0 0.886719,2.658203 A 0.50005,0.50005 0 0 0 19.5,46 l 5,0 A 0.50005,0.50005 0 0 0 25,45.5 l 0,-17 A 0.50005,0.50005 0 0 0 24.5,28 l -5,0 a 0.50005,0.50005 0 0 0 -0.484375,0.378906 L 18.109375,32 17,32 17,27.001953 17,27 c 2.4e-5,-0.0031 0.02826,-3.549488 1.894531,-7.060547 C 20.761615,16.426865 24.132444,13 32,13 39.867575,13 43.23839,16.426866 45.105469,19.939453 46.971734,23.45051 46.999976,26.99691 47,27 l 0,5 -1.109375,0 -0.90625,-3.621094 A 0.50005,0.50005 0 0 0 44.5,28 l -5,0 A 0.50005,0.50005 0 0 0 39,28.5 l 0,17 a 0.50005,0.50005 0 0 0 0.5,0.5 l 5,0 a 0.50005,0.50005 0 0 0 0.474609,-0.341797 L 45.861328,43 48.5,43 a 0.50005,0.50005 0 0 0 0.474609,-0.341797 L 49.861328,40 52.5,40 A 0.50005,0.50005 0 0 0 53,39.5 l 0,-7 A 0.50005,0.50005 0 0 0 52.5,32 l -1.5,0 0,-5 a 2.0002,2.0002 0 0 0 0,-0.002 c 0,0 0.02196,-4.450087 -2.363281,-8.9375 C 46.251481,13.573227 41.123161,8.9999999 32,8.9999999 Z"
id="path54" />
<rect
style="opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="6"
height="4"
x="22"
y="52"
rx="0"
ry="0"
id="rect60" />
<rect
style="opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="6"
height="4"
x="22"
y="47"
rx="0"
ry="0"
id="rect62" />
<rect
style="opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="6"
height="4"
x="15"
y="52"
rx="0"
ry="0"
id="rect64" />
<rect
width="6"
height="4"
x="8"
y="52"
rx="0"
ry="0"
style="opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect66" />
<rect
style="opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="6"
height="4"
x="8"
y="47"
rx="0"
ry="0"
id="rect68" />
<rect
style="opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="6"
height="4"
x="29"
y="52"
rx="0"
ry="0"
id="rect70" />
<rect
style="opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="6"
height="4"
x="29"
y="47"
rx="0"
ry="0"
id="rect72" />
<rect
width="6"
height="4"
x="29"
y="42"
rx="0"
ry="0"
style="opacity:0.4;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect74" />
<rect
style="opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="6"
height="4"
x="36"
y="52"
rx="0"
ry="0"
id="rect76" />
<rect
style="opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="6"
height="4"
x="43"
y="52"
rx="0"
ry="0"
id="rect78" />
<rect
width="6"
height="4"
x="50"
y="52"
rx="0"
ry="0"
style="opacity:0.9;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect80" />
<rect
width="6"
height="4"
x="50"
y="47"
rx="0"
ry="0"
style="opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect82" />
<rect
style="opacity:0.4;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
width="6"
height="4"
x="50"
y="42"
rx="0"
ry="0"
id="rect84" />
<rect
width="6"
height="4"
x="36"
y="47"
rx="0"
ry="0"
style="opacity:0.65;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="rect86" />
<path
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1"
d="m 11.499998,31.49999 0,7 3,0 1,3 3,0 1,3 5,0 0,-17 -5,0 -1,4 z"
id="path88" />
<path
d="m 52.499998,31.49999 0,7 -3,0 -1,3 -3,0 -1,3 -5,0 0,-17 5,0 1,4 z"
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#ffffff;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1"
id="path90" />
<path
style="fill:none;fill-rule:evenodd;stroke:#ffffff;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 14.999998,30.99999 0,-5 c 0,0 0.0093,-16.0000004 17,-16.0000004 16.990736,0 17,16.0000004 17,16.0000004 l 0,5"
id="path92" />
</svg>

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.7 KiB

View File

@ -0,0 +1,71 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
data-name="Layer 1"
viewBox="0 0 48 48"
x="0px"
y="0px"
version="1.1"
id="svg6"
sodipodi:docname="radio.svg"
width="48"
height="48"
inkscape:version="1.3 (0e150ed6c4, 2023-07-21)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:dc="http://purl.org/dc/elements/1.1/">
<defs
id="defs6" />
<sodipodi:namedview
id="namedview6"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:zoom="13.033333"
inkscape:cx="27.199488"
inkscape:cy="24.55243"
inkscape:window-width="1920"
inkscape:window-height="959"
inkscape:window-x="0"
inkscape:window-y="40"
inkscape:window-maximized="1"
inkscape:current-layer="svg6" />
<title
id="title1">Artboard 47</title>
<path
d="m 35.61,14.29 -1.21,-1.59 -3.19,2.42 1.21,1.59 a 13,13 0 0 1 0,15.7 l -1.23,1.59 3.19,2.43 1.21,-1.6 a 17,17 0 0 0 0,-20.54 z"
id="path1"
style="fill:#7f8c8d;fill-opacity:1" />
<path
d="m 38.13,6.62 -2.9,2.75 1.37,1.45 a 20,20 0 0 1 1.54,25.61 L 37,38 l 3.22,2.38 1.19,-1.61 A 24,24 0 0 0 39.51,8.08 Z"
id="path2"
style="fill:#7f8c8d;fill-opacity:1" />
<path
d="m 13,24.55 a 12.88,12.88 0 0 1 2.63,-7.84 l 1.21,-1.59 -3.24,-2.42 -1.21,1.59 a 17,17 0 0 0 0,20.54 L 13.6,36.43 16.81,34 15.6,32.41 A 12.81,12.81 0 0 1 13,24.55 Z"
id="path3"
style="fill:#7f8c8d;fill-opacity:1" />
<path
d="M 6,24.55 A 20,20 0 0 1 11.4,10.82 L 12.77,9.37 9.87,6.62 8.49,8.08 A 24,24 0 0 0 6.64,38.81 L 7.83,40.42 11.05,38 9.86,36.43 A 19.84,19.84 0 0 1 6,24.55 Z"
id="path4"
style="fill:#7f8c8d;fill-opacity:1" />
<path
d="m 24.05,18.55 a 6,6 0 0 0 -2,11.65 v 10.35 h 4 V 30.2 a 6,6 0 0 0 -2,-11.65 z m 0,8 a 2,2 0 1 1 2,-2 2,2 0 0 1 -2,2 z"
id="path5"
style="fill:#7f8c8d;fill-opacity:1" />
<metadata
id="metadata6">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:title>Artboard 47</dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -136,6 +136,10 @@ h6.slim {
font-weight: normal; font-weight: normal;
} }
.relative {
position: relative;
}
input { input {
border-width: 1px; border-width: 1px;
border-style: solid; border-style: solid;
@ -511,6 +515,14 @@ label.yellow50 {
border-color: var(--yellow); border-color: var(--yellow);
} }
button.faded {
opacity: 0.25;
}
button.faded:hover {
opacity: 1;
}
button.medium { button.medium {
padding: 8px; padding: 8px;
} }

View File

@ -47,7 +47,7 @@
v-model.lazy="$store.state.search.term" v-model.lazy="$store.state.search.term"
placeholder="Search…" placeholder="Search…"
autocomplete="one-time-code" autocomplete="one-time-code"
class="hideOnMobile" class="hideOnMobilePortrait"
/> />
<DropDown v-if="user.token"> <DropDown v-if="user.token">
<template v-slot:default> <template v-slot:default>
@ -126,6 +126,13 @@
</keep-alive> </keep-alive>
</router-view> </router-view>
</div> </div>
<div id="popup-collection">
<PopUp
v-for="popup in $store.state.popups"
:key="popup.time"
:item="popup"
/>
</div>
<Player ref="player" /> <Player ref="player" />
<Users ref="dialogUsers" /> <Users ref="dialogUsers" />
<UserProfile ref="dialogUserProfile" /> <UserProfile ref="dialogUserProfile" />
@ -149,6 +156,7 @@ import ServerSettings from "./components/dialogs/ServerSettings";
import AudioUploadDialog from "./components/dialogs/AudioUpload"; import AudioUploadDialog from "./components/dialogs/AudioUpload";
import VideoUploadDialog from "./components/dialogs/VideoUpload"; import VideoUploadDialog from "./components/dialogs/VideoUpload";
import SharedItems from "./components/dialogs/SharedItems"; import SharedItems from "./components/dialogs/SharedItems";
import PopUp from "./components/base-components/PopUp";
import { mapGetters } from "vuex"; import { mapGetters } from "vuex";
@ -198,27 +206,14 @@ export default {
album: track.parent.title, album: track.parent.title,
artwork: [ artwork: [
{ {
src: track.parent.covers.cover32, src:
sizes: "32x32", track.parent.covers.cover128 || "/static/icons/dummy/album.svg",
type: "image/png",
},
{
src: track.parent.covers.cover64,
sizes: "64x64",
type: "image/png",
},
{
src: track.parent.covers.cover128,
sizes: "96x96",
type: "image/png",
},
{
src: track.parent.covers.cover128,
sizes: "128x128", sizes: "128x128",
type: "image/png", type: "image/png",
}, },
{ {
src: track.parent.covers.cover128, src:
track.parent.covers.cover128 || "/static/icons/dummy/album.svg",
sizes: "256x256", sizes: "256x256",
type: "image/png", type: "image/png",
}, },
@ -303,6 +298,7 @@ export default {
VideoScreen, VideoScreen,
VideoUploadDialog, VideoUploadDialog,
SharedItems, SharedItems,
PopUp,
}, },
}; };
</script> </script>

View File

@ -1,21 +1,24 @@
<template> <template>
<div id="content" class="flex-column"> <div id="albumContent" class="flex-column">
<div class="flex-column pa-horizontal border-bottom hideOnMobile"> <div class="flex-column pa-horizontal border-bottom hideOnMobile">
<h1>{{ album.title }}</h1> <h1>{{ album.title }}</h1>
<h2>{{ album.artist_name }}</h2> <h2>{{ album.artist_name }}</h2>
</div> </div>
<div id="tracks" class="flex-row"> <div id="album" class="flex-row">
<div class="flex-column"> <div id="header" class="flex-column relative">
<img id="cover" class="shadow ma24" :src="cover" /> <div id="background" :style="coverBackground" />
<img id="cover" class="shadow ma24 z1" :src="cover" />
<p class="center ma-off hideOnMobile"> <p class="center ma-off hideOnMobile">
<b>{{ album.tracks.length }}</b> Tracks <b>{{ album.tracks.length }}</b> Tracks
</p> </p>
</div> </div>
<ul id="trackList" class="tracks"> <div id="tracks" class="flex-column grow">
<li v-for="track in album.tracks" :key="track._id"> <ul id="trackList" class="tracks">
<TrackItem :track="track" :showCover="false" /> <li v-for="track in album.tracks" :key="track._id">
</li> <TrackItem :track="track" :showCover="false" />
</ul> </li>
</ul>
</div>
</div> </div>
</div> </div>
</template> </template>
@ -43,6 +46,9 @@ export default {
} }
return this.album.covers.cover256; return this.album.covers.cover256;
}, },
coverBackground() {
return "background-image: url('" + this.cover + "'); z-index: -1";
},
}, },
components: { components: {
TrackItem, TrackItem,
@ -56,16 +62,30 @@ export default {
width: 256px; width: 256px;
} }
#content, #albumContent {
#tracks { overflow: hidden;
width: 100%;
}
#album {
overflow: auto; overflow: auto;
} }
#header {
overflow: hidden;
}
#tracks {
background-color: var(--white);
overflow-y: auto;
}
@media (max-width: 480px) { @media (max-width: 480px) {
#tracks { #album {
flex-direction: column; flex-direction: column;
max-height: 100%;
} }
#trackList { #tracks {
border-top: 1px solid var(--light-border); border-top: 1px solid var(--light-border);
} }
} }

View File

@ -1,20 +1,23 @@
<template> <template>
<div id="content" class="flex-column"> <div id="boxContent" class="flex-column">
<div class="flex-column pa-horizontal border-bottom hideOnMobile"> <div class="flex-column pa-horizontal border-bottom hideOnMobile">
<h1>{{ box.title }}</h1> <h1>{{ box.title }}</h1>
</div> </div>
<div id="videos" class="flex-row"> <div id="box" class="flex-row">
<div class="flex-column"> <div id="header" class="flex-column relative">
<div id="background" :style="coverBackground" />
<img id="cover" class="shadow ma24" :src="cover" /> <img id="cover" class="shadow ma24" :src="cover" />
<p class="center ma-off hideOnMobile"> <p class="center ma-off hideOnMobile">
<b>{{ box.videos.length }}</b> Videos <b>{{ box.videos.length }}</b> Videos
</p> </p>
</div> </div>
<ul id="videoList" class="videos"> <div id="videos" class="flex-column grow">
<li v-for="video in box.videos" :key="video._id"> <ul id="videoList" class="videos">
<VideoItem :video="video" /> <li v-for="video in box.videos" :key="video._id">
</li> <VideoItem :video="video" />
</ul> </li>
</ul>
</div>
</div> </div>
</div> </div>
</template> </template>
@ -42,6 +45,9 @@ export default {
} }
return this.box.covers.cover256; return this.box.covers.cover256;
}, },
coverBackground() {
return "background-image: url('" + this.cover + "'); z-index: -1";
},
}, },
components: { components: {
VideoItem, VideoItem,
@ -55,20 +61,33 @@ export default {
width: 256px; width: 256px;
} }
#content, #boxContent {
#videos { overflow: hidden;
width: 100%;
}
#box {
overflow: auto; overflow: auto;
} }
#header {
overflow: hidden;
}
#videos {
background-color: var(--white);
overflow-y: auto;
}
.video { .video {
max-width: 256px; max-width: 256px;
} }
@media (max-width: 480px) { @media (max-width: 480px) {
#videos { #box {
flex-direction: column; flex-direction: column;
max-height: 100%;
} }
#videoList { #videos {
border-top: 1px solid var(--light-border); border-top: 1px solid var(--light-border);
} }
.video { .video {

View File

@ -1,30 +1,9 @@
<template> <template>
<div <div id="player" class="flex-column" v-show="selectedTrack._id || selectedRadio._id">
id="player" <input type="range" id="slider" min="0" max="100" step="0.1" v-model="selectedTrack.percent" @change="slideChanged" />
class="flex-column"
v-show="selectedTrack._id || selectedRadio._id"
>
<input
type="range"
id="slider"
min="0"
max="100"
step="0.1"
v-model="selectedTrack.percent"
@change="slideChanged"
/>
<div id="playerBar" class="flex-row"> <div id="playerBar" class="flex-row">
<div class="flex-row grow"> <div class="flex-row grow">
<img <img class="cover pointer" :src="cover" :title="selectedTrack.parent.title" @click="gotoContainer" />
class="cover pointer"
:src="
selectedTrack.parent.covers.cover64 ||
selectedRadio.cover64 ||
'/static/icons/dummy/album.svg'
"
:title="selectedTrack.parent.title"
@click="gotoContainer"
/>
<div v-if="selectedTrack._id" class="flex-column"> <div v-if="selectedTrack._id" class="flex-column">
<b>{{ selectedTrack.title }}</b> <b>{{ selectedTrack.title }}</b>
from from
@ -32,21 +11,9 @@
</div> </div>
</div> </div>
<div id="playerControls" class="flex-row center"> <div id="playerControls" class="flex-row center">
<button <button @click="switchShuffle" title="Shuffle mode" v-if="selectedTrack._id">
@click="switchShuffle" <img src="static/icons/media-shuffle-dark.svg" v-show="$store.getters['player/shuffle']" class="small" />
title="Shuffle mode" <img src="static/icons/media-consecutive-dark.svg" v-show="$store.getters['player/shuffle'] == false" class="small" />
v-if="selectedTrack._id"
>
<img
src="static/icons/media-shuffle-dark.svg"
v-show="$store.getters['player/shuffle']"
class="small"
/>
<img
src="static/icons/media-consecutive-dark.svg"
v-show="$store.getters['player/shuffle'] == false"
class="small"
/>
</button> </button>
<button @click="prevTrack" title="Back" v-if="selectedTrack._id"> <button @click="prevTrack" title="Back" v-if="selectedTrack._id">
<awesome-icon icon="backward" /> <awesome-icon icon="backward" />
@ -58,46 +25,17 @@
<button @click="nextTrack" title="Forward" v-if="selectedTrack._id"> <button @click="nextTrack" title="Forward" v-if="selectedTrack._id">
<awesome-icon icon="forward" /> <awesome-icon icon="forward" />
</button> </button>
<button <button @click="switchRepeatType" title="Repeat mode" v-if="selectedTrack._id">
@click="switchRepeatType" <img src="static/icons/media-repeat-dark.svg" class="small" v-show="$store.getters['player/repeatType'] == 'all'" />
title="Repeat mode" <img src="static/icons/media-repeat-song-dark.svg" class="small" v-show="$store.getters['player/repeatType'] == 'one'" />
v-if="selectedTrack._id" <img src="static/icons/media-no-repeat-dark.svg" class="small" v-show="$store.getters['player/repeatType'] == 'none'" />
>
<img
src="static/icons/media-repeat-dark.svg"
class="small"
v-show="$store.getters['player/repeatType'] == 'all'"
/>
<img
src="static/icons/media-repeat-song-dark.svg"
class="small"
v-show="$store.getters['player/repeatType'] == 'one'"
/>
<img
src="static/icons/media-no-repeat-dark.svg"
class="small"
v-show="$store.getters['player/repeatType'] == 'none'"
/>
</button> </button>
</div> </div>
<div <div class="flex-row ma-right hideOnMobilePortrait grow right" v-show="selectedTrack.title">
class="flex-row ma-right hideOnMobilePortrait grow right"
v-show="selectedTrack.title"
>
{{ formatedP }}&nbsp;|&nbsp;{{ formatedD }} {{ formatedP }}&nbsp;|&nbsp;{{ formatedD }}
</div> </div>
</div> </div>
<audio <audio preload="auto" ref="audioControl" type="audio/mpeg" @ended="nextTrack" @canplay="play" @playing="playing" @durationchange="durationChanged" @timeupdate="timeUpdate" src></audio>
preload="auto"
ref="audioControl"
type="audio/mpeg"
@ended="nextTrack"
@canplay="play"
@playing="playing"
@durationchange="durationChanged"
@timeupdate="timeUpdate"
src
></audio>
</div> </div>
</template> </template>
@ -109,7 +47,8 @@ export default {
audio: {}, audio: {},
duration: 0, duration: 0,
progress: 0, progress: 0,
interval: 0, intervalProgress: 0,
intervalState: 0,
preConvert: false, preConvert: false,
}; };
}, },
@ -123,19 +62,33 @@ export default {
methods: { methods: {
play() { play() {
if (this.audio.paused) { this.audio.play();
this.audio.play(); },
} pause() {
this.audio.pause();
window.clearInterval(this.intervalProgress);
window.clearInterval(this.intervalState);
this.pushState();
}, },
durationChanged() { durationChanged() {
this.duration = this.audio.duration; this.duration = this.audio.duration;
}, },
playing() { playing() {
window.clearInterval(this.interval); window.clearInterval(this.intervalProgress);
this.interval = setInterval(() => { window.clearInterval(this.intervalState);
this.intervalProgress = setInterval(() => {
this.progress = this.audio.currentTime; this.progress = this.audio.currentTime;
this.selectedTrack.percent = (100 / this.duration) * this.progress; this.selectedTrack.percent = (100 / this.duration) * this.progress;
}, 500); }, 500);
if (this.currentUser._id) {
this.intervalState = setInterval(() => {
this.pushState();
}, 10000);
}
}, },
audioReset() { audioReset() {
this.audio.pause(); this.audio.pause();
@ -156,6 +109,14 @@ export default {
this.audio.play(); this.audio.play();
} }
}, },
skipToSecond(second) {
let was_paused = this.audio.paused;
this.audio.pause();
this.audio.currentTime = second;
if (!was_paused) {
this.audio.play();
}
},
playRadio(radio) { playRadio(radio) {
this.$store.commit("tracks/resetSelectedTrack"); this.$store.commit("tracks/resetSelectedTrack");
this.audio.pause(); this.audio.pause();
@ -164,6 +125,7 @@ export default {
let item = { let item = {
id: this.selectedRadio._id, id: this.selectedRadio._id,
cover128: this.selectedRadio.cover128, cover128: this.selectedRadio.cover128,
name: this.selectedRadio.name,
type: "radio", type: "radio",
}; };
this.$store.dispatch("user/saveHistoryItem", item); this.$store.dispatch("user/saveHistoryItem", item);
@ -182,6 +144,16 @@ export default {
this.audio.src = url; this.audio.src = url;
this.pushHistoryItem(); this.pushHistoryItem();
if (this.currentTrackParent.progress) {
if (this.currentTrackParent.progress.id == this.selectedTrack._id) {
this.skipToSecond(this.currentTrackParent.progress.progress);
}
this.currentTrackParent.progress = undefined;
}
// Try to fix SAFARI
this.audio.play();
}, },
pushHistoryItem() { pushHistoryItem() {
if (!this.currentUser._id) { if (!this.currentUser._id) {
@ -228,13 +200,20 @@ export default {
return; return;
} }
if (!this.audio.paused) { if (!this.audio.paused) {
this.audio.pause(); this.pause();
} else if (this.audio.src != "") { } else if (this.audio.src != "") {
this.audio.play(); this.audio.play();
} }
}, },
reset() { reset(item) {
window.clearInterval(this.interval); let parentId = item.parent._id;
if (item.parent.parent && item.parent.parent.tracks) {
parentId = item.parent.parent._id;
}
this.$store.dispatch("user/resetProgress", parentId);
window.clearInterval(this.intervalProgress);
window.clearInterval(this.intervalState);
if (!this.audio.paused) { if (!this.audio.paused) {
this.audio.pause(); this.audio.pause();
} }
@ -244,10 +223,10 @@ export default {
if ("mediaSession" in navigator) { if ("mediaSession" in navigator) {
let me = this; let me = this;
navigator.mediaSession.setActionHandler("play", function () { navigator.mediaSession.setActionHandler("play", function () {
me.togglePlaying(); me.play();
}); });
navigator.mediaSession.setActionHandler("pause", function () { navigator.mediaSession.setActionHandler("pause", function () {
me.togglePlaying(); me.pause();
}); });
navigator.mediaSession.setActionHandler("seekto", function (details) { navigator.mediaSession.setActionHandler("seekto", function (details) {
if (details.fastSeek && "fastSeek" in me.audio) { if (details.fastSeek && "fastSeek" in me.audio) {
@ -295,6 +274,19 @@ export default {
} }
this.$store.dispatch("user/savePlayerSettings"); this.$store.dispatch("user/savePlayerSettings");
}, },
pushState() {
if (!this.currentUser._id) {
return;
}
this.progress = this.audio.currentTime;
let item = {
id: this.selectedTrack._id,
parentId: this.currentTrackParent._id,
type: "track",
progress: Math.round(this.progress)
}
this.$store.dispatch("user/saveProgress", item);
},
timeUpdate(event) { timeUpdate(event) {
let percent = (event.target.currentTime / event.target.duration) * 100; let percent = (event.target.currentTime / event.target.duration) * 100;
if (percent > 10 && !this.preConvert) { if (percent > 10 && !this.preConvert) {
@ -307,6 +299,27 @@ export default {
}, },
}, },
computed: { computed: {
cover() {
if (this.selectedTrack.title != "") {
let res = "/static/icons/dummy/album.svg";
if (this.selectedTrack.parent.covers.cover64) {
res = this.selectedTrack.parent.covers.cover64;
}
return res;
}
if (this.selectedRadio) {
let res = "/static/icons/dummy/radio.svg";
if (this.selectedRadio.cover64) {
res = this.selectedRadio.cover64;
}
return res;
}
return "";
},
selectedTrack() { selectedTrack() {
return this.$store.getters["tracks/selectedTrack"]; return this.$store.getters["tracks/selectedTrack"];
}, },
@ -365,11 +378,11 @@ export default {
this.reset(); this.reset();
} }
}, },
selectedTrack(newVal) { selectedTrack(newVal, oldVal) {
if (newVal._id) { if (newVal._id) {
this.playTrack(newVal); this.playTrack(newVal);
} else { } else {
this.reset(); this.reset(oldVal);
} }
}, },
}, },
@ -384,17 +397,21 @@ export default {
z-index: 1001; z-index: 1001;
box-shadow: 0 0px 4px var(--shadow); box-shadow: 0 0px 4px var(--shadow);
} }
#player .cover { #player .cover {
width: 52px; width: 52px;
margin-right: 4px; margin-right: 4px;
} }
#playerBar { #playerBar {
overflow: hidden; overflow: hidden;
max-height: 52px; max-height: 52px;
} }
#playerBar > div {
#playerBar>div {
align-items: center; align-items: center;
} }
#playerControls button { #playerControls button {
display: flex; display: flex;
padding: 4px 12px; padding: 4px 12px;

View File

@ -1,6 +1,6 @@
<template> <template>
<div :title="item.name" class="container radio" @click="clicked"> <div :title="item.name" class="container radio ma" @click="clicked">
<img class="radioCover shadow" :src="item.cover128" /> <img class="radioCover shadow" :src="cover" />
<p <p
class="radioTitle" class="radioTitle"
:class="{ selected: item == $store.state.selectedRadio }" :class="{ selected: item == $store.state.selectedRadio }"
@ -30,5 +30,14 @@ export default {
} }
}, },
}, },
computed: {
cover() {
let res = "/static/icons/dummy/radio.svg";
if (this.item && this.item.cover128) {
res = this.item.cover128;
}
return res;
},
},
}; };
</script> </script>

View File

@ -66,12 +66,14 @@ export default {
this.$nextTick(() => { this.$nextTick(() => {
element.scrollIntoView({ element.scrollIntoView({
block: "start", block: "start",
behavior: "smooth",
}); });
}); });
} else if (scrollUp) { } else if (scrollUp) {
this.$nextTick(() => { this.$nextTick(() => {
element.scrollIntoView({ element.scrollIntoView({
block: "end", block: "end",
behavior: "smooth",
}); });
}); });
} }

View File

@ -299,7 +299,7 @@ export default {
right: 0; right: 0;
bottom: 0; bottom: 0;
z-index: 1000; z-index: 1000;
animation: fadeIn ease 0.15s; animation: fadeIn ease 0.20s;
} }
.dialog-window { .dialog-window {
box-shadow: 0px 8px 32px var(--shadow); box-shadow: 0px 8px 32px var(--shadow);

View File

@ -0,0 +1,79 @@
<template>
<div
class="popup-control flex-column shadow ma8"
:class="{ fadeOut: fadeout }"
>
<div class="flex-row" :class="item.type">
<awesome-icon :icon="item.icon || 'circle-info'" size="2x" class="ma" />
<div class="flex-column pa8-top ma8-bottom ma8-right">
<h3 class="ma-off">{{ item.title }}</h3>
<p class="ma-off ma8-top">{{ item.message }}</p>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
fadeout: false,
};
},
props: {
item: {
type: Object,
default() {
return {
type: "default",
};
},
},
},
mounted() {
setTimeout(() => {
this.fadeout = true;
setTimeout(() => {
this.$store.dispatch("removePopUp", this.item);
}, 1000);
}, 4000);
},
};
</script>
<style scoped>
.popup-control {
width: 320px;
border-radius: 8px;
background-color: var(--white);
}
.default {
border-radius: 8px;
background-color: var(--white);
}
.danger {
border-radius: 8px;
background-color: var(--danger25);
}
.info {
border-radius: 8px;
background-color: var(--info);
}
.success {
border-radius: 8px;
background-color: var(--success);
}
.fadeOut {
animation: fadeOut ease 1s;
}
@keyframes fadeOut {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
</style>

View File

@ -1,25 +1,13 @@
<template> <template>
<DialogBase <DialogBase ref="dialogWindow" :title="album_title" @canceled="closed" :showFooter="false" :disableXscroll="true" :disableYscroll="true">
ref="dialogWindow"
:title="album_title"
@canceled="closed"
:showFooter="false"
:disableXscroll="true"
:disableYscroll="true"
>
<div id="albumViewer" class="flex-row"> <div id="albumViewer" class="flex-row">
<div id="header" class="flex-column"> <div id="header" class="flex-column">
<div id="background" :style="coverBackground" /> <div id="background" :style="coverBackground" />
<div class="grow z1 center flex-column"> <div class="grow z1 center flex-column">
<img class="glow ma24" :src="cover" @dblclick="dblclick" /> <img class="glow ma24" :src="cover" @dblclick="dblclick" />
</div> </div>
<awesome-icon <awesome-icon icon="star" size="2x" class="favourite ma4" :class="{ active: isFavourite }" @click="toggleFavourite" title="Favourite" />
icon="star" <awesome-icon icon="play" size="2x" class="keepPlaying ma4 primary-text" @click="playProgress" v-if="selectedAlbum.progress" title="Keep playing" />
size="2x"
class="favourite ma4"
:class="{ active: isFavourite }"
@click="toggleFavourite"
/>
<div id="stats" class="flex-row z1"> <div id="stats" class="flex-row z1">
<DropDown v-if="$store.getters['user/isAdministrator']"> <DropDown v-if="$store.getters['user/isAdministrator']">
<button class="flat center" :title="visibility_text"> <button class="flat center" :title="visibility_text">
@ -27,11 +15,7 @@
</button> </button>
<template v-slot:dropdown-content> <template v-slot:dropdown-content>
<div> <div>
<button <button v-for="(item, i) in $store.state.system.lists.visibility" :key="i" @click="setVisibility(item)">
v-for="(item, i) in $store.state.system.lists.visibility"
:key="i"
@click="setVisibility(item)"
>
<awesome-icon :icon="getVisibilityIcon(item)" />{{ <awesome-icon :icon="getVisibilityIcon(item)" />{{
getVisibilityText(item) getVisibilityText(item)
}} }}
@ -40,10 +24,7 @@
<button v-if="!selectedAlbum.share._id" @click="shareEnable"> <button v-if="!selectedAlbum.share._id" @click="shareEnable">
<awesome-icon icon="share" />Share this album <awesome-icon icon="share" />Share this album
</button> </button>
<button <button v-if="selectedAlbum.share._id" @click="addShareUrlToClipboard">
v-if="selectedAlbum.share._id"
@click="addShareUrlToClipboard"
>
<awesome-icon icon="clipboard" />Copy url into clipboard <awesome-icon icon="clipboard" />Copy url into clipboard
</button> </button>
<button v-if="selectedAlbum.share._id" @click="shareDisable"> <button v-if="selectedAlbum.share._id" @click="shareDisable">
@ -61,8 +42,7 @@
}}</b> }}</b>
<br /> <br />
<span v-if="album_year"> <span v-if="album_year">
from year <b>{{ album_year }}</b> </span from year <b>{{ album_year }}</b> </span><br />
><br />
<b>{{ album_tracks.length }}</b> Tracks with a duration of <b>{{ album_tracks.length }}</b> Tracks with a duration of
<b>{{ album_duration }}</b> <b>{{ album_duration }}</b>
</span> </span>
@ -89,7 +69,6 @@
</DropDown> </DropDown>
</div> </div>
</div> </div>
<ul id="trackList" class="tracks"> <ul id="trackList" class="tracks">
<li v-for="track in selectedAlbum.tracks" :key="track._id"> <li v-for="track in selectedAlbum.tracks" :key="track._id">
<TrackItem :track="track" :showCover="false" /> <TrackItem :track="track" :showCover="false" />
@ -156,6 +135,14 @@ export default {
} }
} }
}, },
playProgress() {
let track = this.selectedAlbum.tracks.find(
(f) => f._id == this.selectedAlbum.progress.id
);
if (track) {
this.$store.dispatch("tracks/play", track);
}
},
closed() { closed() {
if ( if (
(window.history.state.back && (window.history.state.back &&
@ -201,19 +188,19 @@ export default {
return visibility == "global" return visibility == "global"
? "globe" ? "globe"
: visibility == "instance" : visibility == "instance"
? "server" ? "server"
: visibility == "hidden" : visibility == "hidden"
? "eye-slash" ? "eye-slash"
: "user"; : "user";
}, },
getVisibilityText(visibility) { getVisibilityText(visibility) {
return visibility == "global" return visibility == "global"
? "Global" ? "Global"
: visibility == "instance" : visibility == "instance"
? "On this server" ? "On this server"
: visibility == "hidden" : visibility == "hidden"
? "Hide this Album" ? "Hide this Album"
: "Only for me"; : "Only for me";
}, },
selectAlbum(album) { selectAlbum(album) {
this.$store.dispatch("albums/selectAlbum", album); this.$store.dispatch("albums/selectAlbum", album);
@ -228,6 +215,15 @@ export default {
shareDisable() { shareDisable() {
this.$store.dispatch("albums/shareDisable", this.selectedAlbum); this.$store.dispatch("albums/shareDisable", this.selectedAlbum);
}, },
loadUserProgress() {
if (this.selectedTrack.parent._id != this.selectedAlbum._id) {
this.$store
.dispatch("user/getProgress", this.selectedAlbum)
.then(() => {
this.gotoTrack();
});
}
}
}, },
computed: { computed: {
...mapGetters({ ...mapGetters({
@ -287,19 +283,19 @@ export default {
return this.selectedAlbum.visibility == "global" return this.selectedAlbum.visibility == "global"
? "globe" ? "globe"
: this.selectedAlbum.visibility == "instance" : this.selectedAlbum.visibility == "instance"
? "server" ? "server"
: this.selectedAlbum.visibility == "hidden" : this.selectedAlbum.visibility == "hidden"
? "eye-slash" ? "eye-slash"
: "user"; : "user";
}, },
visibility_text() { visibility_text() {
return this.selectedAlbum.visibility == "global" return this.selectedAlbum.visibility == "global"
? "Visible for the whole world" ? "Visible for the whole world"
: this.selectedAlbum.visibility == "instance" : this.selectedAlbum.visibility == "instance"
? "Visible on this instance" ? "Visible on this instance"
: this.selectedAlbum.visibility == "hidden" : this.selectedAlbum.visibility == "hidden"
? "Hidden for all users" ? "Hidden for all users"
: "Visible only for me"; : "Visible only for me";
}, },
isFavourite() { isFavourite() {
return ( return (
@ -318,7 +314,7 @@ export default {
this.$refs.dialogWindow.open(); this.$refs.dialogWindow.open();
window.addEventListener("keydown", this.keydownListener); window.addEventListener("keydown", this.keydownListener);
} }
this.gotoTrack(); this.loadUserProgress();
} else { } else {
if (this.$refs.dialogWindow.visible) { if (this.$refs.dialogWindow.visible) {
this.$refs.dialogWindow.close(); this.$refs.dialogWindow.close();
@ -339,14 +335,17 @@ export default {
height: 366px; height: 366px;
width: 640px; width: 640px;
} }
#header { #header {
position: relative; position: relative;
background-color: black; background-color: black;
} }
#header img { #header img {
align-self: center; align-self: center;
width: 256px; width: 256px;
} }
#stats { #stats {
z-index: 2; z-index: 2;
align-items: center; align-items: center;
@ -357,10 +356,12 @@ export default {
border-top: 1px solid #ffffff20; border-top: 1px solid #ffffff20;
border-bottom: 1px solid #00000020; border-bottom: 1px solid #00000020;
} }
.dropdown-activator button { .dropdown-activator button {
width: 32px; width: 32px;
height: 32px; height: 32px;
} }
#trackList { #trackList {
background-color: var(--white); background-color: var(--white);
z-index: 1; z-index: 1;
@ -370,15 +371,19 @@ export default {
#header { #header {
width: 100%; width: 100%;
} }
#albumViewer { #albumViewer {
flex-direction: column; flex-direction: column;
} }
} }
@media (max-width: 480px), (max-height: 480px) {
@media (max-width: 480px),
(max-height: 480px) {
#albumViewer { #albumViewer {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
#trackList { #trackList {
height: initial; height: initial;
flex-grow: 1; flex-grow: 1;

View File

@ -1,24 +1,10 @@
<template> <template>
<DialogBase <DialogBase ref="dialogWindow" id="dialogWindow" :title="selectedArtist.name" @canceled="closed" :showFooter="false" :showFullscreenButton="true" :disableXscroll="true" :disableYscroll="true">
ref="dialogWindow"
id="dialogWindow"
:title="selectedArtist.name"
@canceled="closed"
:showFooter="false"
:showFullscreenButton="true"
:disableXscroll="true"
:disableYscroll="true"
>
<div id="artistViewer"> <div id="artistViewer">
<div id="header" class="flex-column"> <div id="header" class="flex-column">
<div id="background" :style="coverBackground" /> <div id="background" :style="coverBackground" />
<awesome-icon <awesome-icon icon="star" size="2x" class="favourite ma4" :class="{ active: isFavourite }" @click="toggleFavourite" />
icon="star" <awesome-icon icon="play" size="2x" class="keepPlaying ma4 primary-text" @click="playProgress" v-if="selectedArtist.progress" title="Keep playing" />
size="2x"
class="favourite ma4"
:class="{ active: isFavourite }"
@click="toggleFavourite"
/>
<h1 @dblclick="dblclick"> <h1 @dblclick="dblclick">
{{ selectedArtist.name }} {{ selectedArtist.name }}
</h1> </h1>
@ -28,41 +14,20 @@
<b>{{ artist_duration }}</b> <b>{{ artist_duration }}</b>
</span> </span>
<div id="albumList" class="flex-row showOnMobilePortrait"> <div id="albumList" class="flex-row showOnMobilePortrait">
<AlbumItem <AlbumItem class="ma" :class="{ playing: playingAlbumId == album._id }" v-for="album in selectedArtist.albums" :key="album._id" :item="album" @click="scrollToAlbum(album)" @dblclick="playAlbum(album)" />
class="ma"
:class="{ playing: playingAlbumId == album._id }"
v-for="album in selectedArtist.albums"
:key="album._id"
:item="album"
@click="scrollToAlbum(album)"
@dblclick="playAlbum(album)"
/>
</div> </div>
<div id="navigation" class="flex-row center"> <div id="navigation" class="flex-row center ma-top">
<div class="flex-row grow"></div> <div class="flex-row grow"></div>
<div class="flex-row"> <div class="flex-row">
<button <button @click="gotoPrevArtist" class="primary ma4" :title="prevArtist.name" :disabled="!prevArtist._id">
@click="gotoPrevArtist"
class="primary ma4"
:title="prevArtist.name"
:disabled="!prevArtist._id"
>
<awesome-icon icon="angle-left" class="ma4" /> <awesome-icon icon="angle-left" class="ma4" />
</button> </button>
<button <button @click="gotoNextArtist" class="primary ma4" :title="nextArtist.name" :disabled="!nextArtist._id">
@click="gotoNextArtist"
class="primary ma4"
:title="nextArtist.name"
:disabled="!nextArtist._id"
>
<awesome-icon icon="angle-right" class="ma4" /> <awesome-icon icon="angle-right" class="ma4" />
</button> </button>
</div> </div>
<div class="flex-row grow right center"> <div class="flex-row grow right center">
<DropDown <DropDown v-if="$store.getters['user/isAdministrator']" class="hideOnMobile">
v-if="$store.getters['user/isAdministrator']"
class="hideOnMobile"
>
<button class="flat pa8-left pa8-right"> <button class="flat pa8-left pa8-right">
<awesome-icon icon="ellipsis-v" /> <awesome-icon icon="ellipsis-v" />
</button> </button>
@ -86,23 +51,9 @@
</div> </div>
<div class="flex-row overflow-y"> <div class="flex-row overflow-y">
<div id="albumList" class="flex-column hideOnMobilePortrait"> <div id="albumList" class="flex-column hideOnMobilePortrait">
<AlbumItem <AlbumItem class="ma-top ma-left ma-right" :class="{ playing: playingAlbumId == album._id }" v-for="album in selectedArtist.albums" :key="album._id" :item="album" :id="album._id" :ref="album._id" @click="scrollToAlbum(album)" @dblclick="playAlbum(album)" />
class="ma-top ma-left ma-right"
:class="{ playing: playingAlbumId == album._id }"
v-for="album in selectedArtist.albums"
:key="album._id"
:item="album"
:id="album._id"
:ref="album._id"
@click="scrollToAlbum(album)"
@dblclick="playAlbum(album)"
/>
</div> </div>
<ul <ul id="trackList" class="tracks" :class="{ playing: selectedTrack._id != null }">
id="trackList"
class="tracks"
:class="{ playing: selectedTrack._id != null }"
>
<li v-for="track in selectedArtist.tracks" :key="track._id"> <li v-for="track in selectedArtist.tracks" :key="track._id">
<TrackItem :track="track" :ref="track._id" /> <TrackItem :track="track" :ref="track._id" />
</li> </li>
@ -143,6 +94,14 @@ export default {
} }
} }
}, },
playProgress() {
let track = this.selectedArtist.tracks.find(
(f) => f._id == this.selectedArtist.progress.id
);
if (track) {
this.$store.dispatch("tracks/play", track);
}
},
gotoNextArtist() { gotoNextArtist() {
this.$store.dispatch("artists/gotoNextArtist"); this.$store.dispatch("artists/gotoNextArtist");
}, },
@ -194,6 +153,15 @@ export default {
uploadNewCover() { uploadNewCover() {
this.$store.dispatch("artists/uploadNewCover", this.selectedArtist); this.$store.dispatch("artists/uploadNewCover", this.selectedArtist);
}, },
loadUserProgress() {
if (!this.isPlaying || !this.selectedTrack.parent.parent || this.selectedTrack.parent.parent._id != this.selectedArtist._id) {
this.$store.dispatch("user/getProgress", this.selectedArtist).then(() => {
this.gotoTrack();
});
} else {
this.gotoTrack();
}
}
}, },
computed: { computed: {
...mapGetters({ ...mapGetters({
@ -202,6 +170,7 @@ export default {
selectedArtist: ["artists/selectedArtist"], selectedArtist: ["artists/selectedArtist"],
selectedTrack: ["tracks/selectedTrack"], selectedTrack: ["tracks/selectedTrack"],
favourites: ["user/favourites"], favourites: ["user/favourites"],
isPlaying: ["player/isPlaying"]
}), }),
cover() { cover() {
let covers = this.selectedArtist.covers; let covers = this.selectedArtist.covers;
@ -266,7 +235,7 @@ export default {
this.$refs.dialogWindow.open(); this.$refs.dialogWindow.open();
window.addEventListener("keydown", this.keydownListener); window.addEventListener("keydown", this.keydownListener);
} }
this.gotoTrack(); this.loadUserProgress();
} else { } else {
if (this.$refs.dialogWindow.visible) { if (this.$refs.dialogWindow.visible) {
this.$refs.dialogWindow.close(); this.$refs.dialogWindow.close();
@ -289,6 +258,7 @@ export default {
flex-direction: column; flex-direction: column;
overflow: hidden; overflow: hidden;
} }
h1, h1,
#stats { #stats {
z-index: 1; z-index: 1;
@ -297,33 +267,40 @@ h1,
color: var(--white); color: var(--white);
text-shadow: 0 1px 2px black; text-shadow: 0 1px 2px black;
} }
#artistImage { #artistImage {
width: 512px; width: 512px;
max-height: 256px; max-height: 256px;
} }
#header { #header {
position: relative; position: relative;
background-color: black; background-color: black;
width: 760px; width: 760px;
max-width: 100%; max-width: 100%;
} }
#albumList { #albumList {
z-index: 1; z-index: 1;
overflow-y: auto; overflow-y: auto;
background-color: var(--white); background-color: var(--white);
} }
#albumList::-webkit-scrollbar { #albumList::-webkit-scrollbar {
display: none; display: none;
} }
#albumList .album:last-child { #albumList .album:last-child {
margin-bottom: 12px; margin-bottom: 12px;
} }
#navigation { #navigation {
z-index: 2; z-index: 2;
background-color: #ffffff40; background-color: #ffffff40;
border-top: 1px solid #ffffff20; border-top: 1px solid #ffffff20;
border-bottom: 1px solid #00000020; border-bottom: 1px solid #00000020;
} }
#trackList { #trackList {
z-index: 1; z-index: 1;
background-color: var(--white); background-color: var(--white);
@ -338,12 +315,15 @@ h1,
width: initial; width: initial;
height: initial; height: initial;
} }
.dialog-body button { .dialog-body button {
color: var(--darkgray); color: var(--darkgray);
} }
.container { .container {
flex-grow: 0; flex-grow: 0;
} }
@media (max-width: 480px) { @media (max-width: 480px) {
#albumList { #albumList {
background-color: initial; background-color: initial;
@ -353,19 +333,21 @@ h1,
} }
} }
@media (max-width: 480px), (max-height: 480px) { @media (max-width: 480px),
(max-height: 480px) {
#artistViewer { #artistViewer {
height: initial; height: initial;
} }
#trackList { #trackList {
width: initial; width: initial;
height: initial; height: initial;
} }
#header { #header {
width: initial; width: initial;
} }
} }
@media (max-height: 480px) { @media (max-height: 480px) {}
}
</style> </style>

View File

@ -53,7 +53,7 @@
<td> <td>
<img <img
class="radioCover" class="radioCover"
:src="radio.cover32" :src="cover(radio)"
@click="updateCover(radio)" @click="updateCover(radio)"
/> />
</td> </td>
@ -116,6 +116,13 @@ export default {
updateCover(radio) { updateCover(radio) {
this.$store.dispatch("radios/updateRadio", radio); this.$store.dispatch("radios/updateRadio", radio);
}, },
cover(radio) {
let res = "/static/icons/dummy/radio.svg";
if (radio.cover32) {
res = radio.cover32;
}
return res;
},
}, },
}; };
</script> </script>

View File

@ -1,6 +1,6 @@
<template> <template>
<DialogBase ref="dialogWindow" title="Shared items" button-text="close"> <DialogBase ref="dialogWindow" title="Shared items" button-text="close">
<div class="flex-column"> <div class="flex-column" id="sharedContent">
<ul v-if="shares.length > 0"> <ul v-if="shares.length > 0">
<li <li
class="flex-row pa4-top pa4-bottom" class="flex-row pa4-top pa4-bottom"
@ -21,8 +21,12 @@
<p class="grow ma-off"> <p class="grow ma-off">
{{ share.title }} {{ share.title }}
</p> </p>
<button class="flat danger" @click="shareDisable(share)"> <button
<awesome-icon icon="trash" /> class="flat danger faded"
@click="shareDisable(share)"
title="Disable Sharing"
>
<awesome-icon icon="trash-alt" />
</button> </button>
</div> </div>
</li> </li>
@ -107,4 +111,8 @@ li p {
li .cover { li .cover {
width: 32px; width: 32px;
} }
#sharedContent {
min-width: 320px;
}
</style> </style>

View File

@ -87,7 +87,7 @@
<button <button
@click="deleteUser(user)" @click="deleteUser(user)"
title="Remove Useraccount" title="Remove Useraccount"
class="flat danger" class="flat danger faded"
v-if="user._id != me._id" v-if="user._id != me._id"
> >
<awesome-icon icon="trash-alt" /> <awesome-icon icon="trash-alt" />
@ -198,12 +198,6 @@ export default {
#usersBody .me { #usersBody .me {
font-weight: bold; font-weight: bold;
} }
#usersBody table button {
opacity: 0.25;
}
#usersBody table button:hover {
opacity: 1;
}
#usersBody .user-role { #usersBody .user-role {
display: flex; display: flex;
align-items: center; align-items: center;

View File

@ -87,5 +87,12 @@ export default {
}, },
resetRedisCache(context) { resetRedisCache(context) {
axios.post(context.rootGetters.server + "/api/system/reset/redis", {}, context.rootGetters.headers); axios.post(context.rootGetters.server + "/api/system/reset/redis", {}, context.rootGetters.headers);
context.dispatch("addPoUp", { title: "Cache", message: "Cache was reseted", type: "info" })
},
addPoUp(context, item) {
context.commit("addPopUp", item);
},
removePopUp(context, item) {
context.commit("removePopUp", item);
} }
} }

View File

@ -165,6 +165,7 @@ export default {
axios.post(context.rootGetters.server + "/api/albums/" + album._id + "/share", {}, context.rootGetters.headers).then(res => { axios.post(context.rootGetters.server + "/api/albums/" + album._id + "/share", {}, context.rootGetters.headers).then(res => {
album.share = res.data; album.share = res.data;
resolve(); resolve();
context.dispatch("addPoUp", { title: "Share successful", message: "Url was copied into your clipboard", type: "success", icon:"share" }, { root: true });
}); });
}); });
}, },

View File

@ -141,6 +141,7 @@ export default {
axios.post(context.rootGetters.server + "/api/boxes/" + box._id + "/share", {}, context.rootGetters.headers).then(res => { axios.post(context.rootGetters.server + "/api/boxes/" + box._id + "/share", {}, context.rootGetters.headers).then(res => {
box.share = res.data; box.share = res.data;
resolve(); resolve();
context.dispatch("addPoUp", { title: "Share successful", message: "Url was copied into your clipboard", type: "success", icon: "share" }, { root: true });
}); });
}); });
}, },

View File

@ -80,6 +80,34 @@ export default {
context.commit("setHistory", res.data); context.commit("setHistory", res.data);
}); });
}, },
saveProgress(context, item) {
if (context.state._id == -1) {
return;
}
axios
.post(context.rootGetters.server + "/api/user/progress", item, context.rootGetters.headers);
},
getProgress(context, parent) {
return new Promise((resolve) => {
if (context.state._id == -1) {
resolve();
} else {
axios
.get(context.rootGetters.server + "/api/user/progress/" + parent._id, context.rootGetters.headers)
.then((res) => {
parent.progress = res.data;
resolve();
});
}
});
},
resetProgress(context, parentId) {
if (context.state._id == -1) {
return;
}
axios
.delete(context.rootGetters.server + "/api/user/progress/" + parentId, context.rootGetters.headers);
},
savePlayerSettings(context) { savePlayerSettings(context) {
let body = { let body = {
repeat: context.rootGetters["player/repeatType"], repeat: context.rootGetters["player/repeatType"],

View File

@ -25,5 +25,13 @@ export default {
}, },
setServerInfo(state, info) { setServerInfo(state, info) {
state.serverInfo = info; state.serverInfo = info;
},
addPopUp(state, item) {
item.time = Date.now();
state.popups.unshift(item);
},
removePopUp(state, item) {
let index = state.popups.indexOf(item);
state.popups.splice(index, 1);
} }
} }

View File

@ -15,6 +15,6 @@ export default {
videos: 0, videos: 0,
users: 0 users: 0
} }
} },
popups: []
} }

View File

@ -3,7 +3,7 @@
<div id="loginViewer"> <div id="loginViewer">
<div id="loginLogin" class="flex-column"> <div id="loginLogin" class="flex-column">
<img id="loginLogo" src="static/icon_64_flat.svg" /> <img id="loginLogo" src="static/icon_64_flat.svg" />
<h1>Web Play</h1> <h1>WebPlay</h1>
<form id="loginForm" @submit.prevent="login" method="POST"> <form id="loginForm" @submit.prevent="login" method="POST">
<p> <p>
<input <input
@ -96,6 +96,9 @@
</div> </div>
</div> </div>
</div> </div>
<div id="loginFooter" class="ma">
create your own <a href="https://code.anufrij.de/WebPlay/docker#setup-your-own-webplay-instance" target="webplay">WebPlay</a> instance
</div>
</div> </div>
</template> </template>
@ -219,4 +222,18 @@ export default {
}, },
components: { ExpanderControl }, components: { ExpanderControl },
}; };
</script> </script>
<style scoped>
#loginFooter {
position: absolute;
bottom: 0;
}
#loginFooter a {
display: initial;
color: var(--white);
font-weight: bold;
}
</style>

View File

@ -1,5 +1,5 @@
<template> <template>
<div ref="share" id="share" class="flex-column"> <div ref="share" id="share">
<AlbumContent ref="album" v-if="type == 'album'" /> <AlbumContent ref="album" v-if="type == 'album'" />
<BoxContent ref="box" v-if="type == 'box'" /> <BoxContent ref="box" v-if="type == 'box'" />
</div> </div>
@ -68,6 +68,6 @@ export default {
<style scoped> <style scoped>
#share { #share {
overflow: auto; flex-direction: column;
} }
</style> </style>