pvb3xqpfw
/
YepMusic
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix: revert some code

Browse Source
master
qier222 4 years ago
parent 6e57766433
commit 94ef0934a5
No known key found for this signature in database
GPG Key ID: 9C85007ED905F14D
19 changed files with 54 additions and 455 deletions
Show Stats Download Patch File Download Diff File

38
public/index.html
Unescape View File

@ -1,23 +1,25 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="referrer" content="no-referrer" />
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body>
<noscript>
<strong
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="referrer" content="no-referrer" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title>
<%= htmlWebpackPlugin.options.title %>
</title>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
properly without JavaScript enabled. Please enable it to
continue.</strong
>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

24
src/App.vue
Unescape View File

@ -91,15 +91,6 @@ export default {
--color-navbar-bg: rgba(255, 255, 255, 0.86);
--color-primary-bg-for-transparent: rgba(189, 207, 255, 0.28);
--color-secondary-bg-for-transparent: rgba(209, 209, 214, 0.28);
--main-content-padding-x: 10vw;
--main-content-padding: 0 var(--main-content-padding-x);
}
@media (max-width: 1336px) {
:root {
--main-content-padding-x: 5vw;
}
}
[data-theme="dark"] {
@ -126,18 +117,27 @@ input {
}
body {
background-color: var(--color-body-bg);
margin: 0;
}
html {
overflow-y: overlay;
min-width: 340px;
min-width: 768px;
overscroll-behavior: none;
}
main {
max-width: 100vw;
margin-top: 84px;
margin-bottom: 96px;
padding: {
right: 10vw;
left: 10vw;
}
}
@media (max-width: 1336px) {
main {
padding: 0 5vw;
}
}
select,

26
src/components/CoverRow.vue
Unescape View File

@ -1,9 +1,5 @@
<template>
<div
class="cover-row"
:style="rowStyles"
:class="{ 'without-padding': withoutPadding }"
>
<div class="cover-row" :style="rowStyles">
<div
class="item"
v-for="item in items"
@ -54,7 +50,6 @@ export default {
showPlayCount: { type: Boolean, default: false },
columnNumber: { type: Number, default: 5 },
gap: { type: String, default: "44px 24px" },
withoutPadding: { type: Boolean, default: false },
},
computed: {
rowStyles() {
@ -119,13 +114,6 @@ export default {
<style lang="scss" scoped>
.cover-row {
display: grid;
padding: var(--main-content-padding);
max-width: calc(100vw - var(--main-content-padding-x));
overflow-x: scroll;
}
.cover-row.without-padding {
padding: 0;
}
.item {
@ -155,18 +143,6 @@ export default {
}
}
@media (max-width: 800px) {
.item {
width: 256px;
}
}
@media (max-width: 600px) {
.item {
width: 192px;
}
}
.item.artist {
display: flex;
flex-direction: column;

78
src/components/Navbar.vue
Unescape View File

@ -1,5 +1,5 @@
<template>
<nav :class="{ 'search-box-open': isSearchBoxOpen }">
<nav>
<div class="win32-titlebar">
<div class="title">YesPlayMusic</div>
<div class="controls">
@ -51,9 +51,6 @@
v-if="settings.showGithubIcon !== false"
><svg-icon icon-class="github" class="github"
/></a>
<button-icon @click.native="toggleSearchBox()" class="search-button">
<svg-icon icon-class="search" />
</button-icon>
<div class="search-box">
<div class="container" :class="{ active: inputFocus }">
<svg-icon icon-class="search" />
@ -96,7 +93,6 @@ export default {
inputFocus: false,
langs: ["zh-CN", "en"],
keywords: "",
isSearchBoxOpen: false,
windowIsMaximized: win ? win.isMaximized() : true,
};
},
@ -121,9 +117,6 @@ export default {
params: { keywords: this.keywords },
});
},
toggleSearchBox() {
this.isSearchBoxOpen = !this.isSearchBoxOpen;
},
windowMinimize() {
win.minimize();
},
@ -158,9 +151,6 @@ nav {
left: 10vw;
}
backdrop-filter: saturate(180%) blur(20px);
border-bottom: 1px solid transparent;
transition-property: padding-bottom, border-bottom;
transition-duration: 0.4s;
background-color: var(--color-navbar-bg);
z-index: 100;
@ -368,75 +358,9 @@ nav {
color: var(--color-text);
-webkit-app-region: no-drag;
}
@media (max-width: 400px) {
.github {
display: none;
}
}
.search-button {
display: none;
-webkit-app-region: no-drag;
}
@media (max-width: 600px) {
.search-button {
display: flex;
}
}
}
@media (max-width: 600px) {
.right-part {
flex: 0;
}
}
@media (max-width: 800px) {
.navigation-links > a {
margin: 4px;
}
}
@media (max-width: 700px) {
.navigation-buttons {
display: none;
}
}
@media (max-width: 600px) {
nav.search-box-open {
padding-bottom: 36px;
border-bottom-color: var(--color-secondary-bg-for-transparent);
}
.search-box {
display: block;
position: fixed;
top: 56px;
left: 16px;
right: 16px;
.container {
width: 100%;
opacity: 0;
height: 0;
overflow: hidden;
transition-property: height, opacity;
transition-duration: 0.4s;
.input {
width: 100%;
}
}
}
[data-electron-platform-win32="yes"] {
.search-box {
// Add more 20px to top for title bar
top: calc(56px + 20px);
}
}
nav.search-box-open .container {
opacity: 1;
height: 32px;
}
}
</style>

33
src/components/Player.vue
Unescape View File

@ -62,10 +62,7 @@
<div class="middle-control-buttons">
<div class="blank"></div>
<div class="container" @click.stop>
<button-icon
@click.native="previous"
:title="$t('player.previous')"
class="auto-hide"
<button-icon @click.native="previous" :title="$t('player.previous')"
><svg-icon icon-class="previous"
/></button-icon>
<button-icon
@ -81,7 +78,7 @@
</div>
<div class="blank"></div>
</div>
<div class="right-control-buttons auto-hide">
<div class="right-control-buttons">
<div class="blank"></div>
<div class="container" @click.stop>
<button-icon
@ -346,18 +343,6 @@ export default {
display: flex;
}
@media (max-width: 700px) {
.controls {
display: flex;
}
.playing {
flex: 1;
}
.playing .container {
pointer-events: none;
}
}
.playing .container {
display: flex;
align-items: center;
@ -463,20 +448,6 @@ export default {
margin-left: 16px;
}
@media (max-width: 700px) {
.controls {
grid-template-columns: repeat(2, 1fr);
}
.middle-control-buttons {
justify-content: flex-end;
margin-left: auto;
}
.auto-hide,
.blank {
display: none;
}
}
// .lyrics-button {
// position: fixed;
// right: 18px;

47
src/components/TrackList.vue
Unescape View File

@ -1,5 +1,5 @@
<template>
<div class="track-list" :class="{ 'without-padding': withoutPadding }">
<div class="track-list">
<ContextMenu ref="menu">
<div class="item-info">
<img :src="rightClickedTrack.al.picUrl | resizeImage(224)" />
@ -26,7 +26,7 @@
>
<div class="item" @click="addTrackToPlaylist">添加到歌单</div>
</ContextMenu>
<div :style="listStyles" class="track-list-inner-container">
<div :style="listStyles">
<TrackListItem
v-for="(track, index) in tracks"
:track="track"
@ -78,6 +78,10 @@ export default {
return []; // 'removeTrackFromPlaylist'
},
},
columnNumber: {
type: Number,
default: 4,
},
highlightPlayingTrack: {
type: Boolean,
default: true,
@ -86,10 +90,6 @@ export default {
type: String,
default: "id",
},
withoutPadding: {
type: Boolean,
default: false,
},
},
data() {
return {
@ -107,6 +107,7 @@ export default {
this.listStyles = {
display: "grid",
gap: "4px",
gridTemplateColumns: `repeat(${this.columnNumber}, 1fr)`,
};
}
},
@ -239,36 +240,4 @@ export default {
};
</script>
<style lang="scss" scoped>
.track-list {
--col-num: 4;
padding: var(--main-content-padding);
.track-list-inner-container {
grid-template-columns: repeat(var(--col-num), 1fr);
}
}
.track-list.without-padding {
padding: 0;
}
@media (max-width: 800px) {
.track-list {
--col-num: 3;
padding: var(--main-content-padding);
}
}
@media (max-width: 700px) {
.track-list {
--col-num: 2;
}
}
@media (max-width: 550px) {
.track-list {
--col-num: 1;
}
}
</style>
<style lang="scss" scoped></style>

13
src/components/TrackListItem.vue
Unescape View File

@ -193,7 +193,6 @@ button {
padding: 8px;
border-radius: 12px;
user-select: none;
transition: all 0.3s;
.no {
display: flex;
@ -294,11 +293,6 @@ button {
-webkit-line-clamp: 2;
overflow: hidden;
}
@media (max-width: 600px) {
.album {
flex: 0;
}
}
.time {
font-size: 16px;
width: 50px;
@ -313,6 +307,7 @@ button {
}
.track.focus {
transition: all 0.3s;
background: var(--color-secondary-bg);
}
@ -359,12 +354,6 @@ button {
justify-content: flex-end;
}
@media (max-width: 600px) {
.actions {
width: auto;
}
}
.track.playing {
background: var(--color-primary-bg);
color: var(--color-primary);

26
src/views/album.vue
Unescape View File

@ -276,7 +276,6 @@ export default {
display: flex;
width: 78vw;
margin-bottom: 72px;
padding: var(--main-content-padding);
.info {
display: flex;
flex-direction: column;
@ -331,29 +330,6 @@ export default {
}
}
@media (max-width: 600px) {
.playlist-info {
width: calc(100vw - 2 * var(--main-content-padding-x));
padding: var(--main-content-padding);
display: block;
.cover {
display: flex;
justify-content: center;
align-items: center;
}
.info {
margin-top: 24px;
margin-left: 0;
.title {
font-size: 48px;
}
}
}
}
.explicit-symbol {
opacity: 0.28;
color: var(--color-text);
@ -369,7 +345,6 @@ export default {
font-size: 12px;
opacity: 0.48;
color: var(--color-text);
padding: var(--main-content-padding);
div {
margin-bottom: 4px;
}
@ -388,7 +363,6 @@ export default {
opacity: 0.88;
color: var(--color-text);
margin-bottom: 20px;
padding: var(--main-content-padding);
}
}
.description-fulltext {

34
src/views/artist.vue
Unescape View File

@ -4,7 +4,7 @@
<div class="head">
<img :src="artist.img1v1Url | resizeImage(1024)" />
</div>
<div class="info">
<div>
<div class="name">{{ artist.name }}</div>
<div class="artist">{{ $t("artist.artist") }}</div>
<div class="statistics">
@ -253,7 +253,6 @@ export default {
align-items: center;
margin-bottom: 26px;
color: var(--color-text);
padding: var(--main-content-padding);
img {
height: 192px;
width: 192px;
@ -290,37 +289,12 @@ export default {
}
}
@media (max-width: 600px) {
.artist-info {
display: block;
.head {
display: flex;
justify-content: center;
align-items: center;
}
.info {
margin-top: 24px;
}
.name {
font-size: 36px;
}
img {
margin: 0;
}
}
}
.section-title {
font-weight: 600;
font-size: 22px;
opacity: 0.88;
color: var(--color-text);
margin-bottom: 16px;
padding: var(--main-content-padding);
padding-top: 46px;
display: flex;
@ -335,11 +309,6 @@ export default {
.latest-release {
color: var(--color-text);
padding: var(--main-content-padding);
.section-title {
padding-left: 0;
padding-right: 0;
}
.release {
display: flex;
}
@ -374,7 +343,6 @@ export default {
.popular-tracks {
.show-more {
display: flex;
padding: var(--main-content-padding);
button {
padding: 4px 8px;

1
src/views/artistMV.vue
Unescape View File

@ -81,7 +81,6 @@ export default {
h1 {
font-size: 42px;
color: var(--color-text);
padding: var(--main-content-padding);
.avatar {
height: 44px;
margin-right: 12px;

34
src/views/explore.vue
Unescape View File

@ -20,7 +20,7 @@
</div>
</div>
<div class="panel" v-bind:class="{ show: showCatOptions }">
<div class="panel" v-show="showCatOptions">
<div class="big-cat" v-for="bigCat in allBigCats" :key="bigCat">
<div class="name">{{ bigCat }}</div>
<div class="cats">
@ -174,23 +174,6 @@ export default {
},
},
activated() {
var updatePanelHeight = () => {
var panelChildren = this.$el.getElementsByClassName("panel")[0].children;
this.$el.style.setProperty(
"--explore-panel-children-height",
`${
Math.abs(
panelChildren[0].getBoundingClientRect().y -
(panelChildren[panelChildren.length - 1].getBoundingClientRect()
.y +
panelChildren[panelChildren.length - 1].clientHeight)
) + 16
}px`
);
};
window.addEventListener("load", updatePanelHeight);
window.addEventListener("resize", updatePanelHeight);
this.loadData();
},
beforeRouteUpdate(to, from, next) {
@ -210,12 +193,10 @@ export default {
h1 {
color: var(--color-text);
font-size: 56px;
padding: var(--main-content-padding);
}
.buttons {
display: flex;
flex-wrap: wrap;
padding: var(--main-content-padding);
}
.button {
user-select: none;
@ -245,19 +226,8 @@ h1 {
margin-top: 10px;
background: var(--color-secondary-bg);
border-radius: 10px;
padding: 0 8px;
margin: var(--main-content-padding);
padding: 8px;
color: var(--color-text);
height: 0;
opacity: 0;
overflow: hidden;
transition: all 0.3s;
&.show {
height: var(--explore-panel-children-height);
opacity: 1;
padding: 8px;
}
.big-cat {
display: flex;

1
src/views/home.vue
Unescape View File

@ -152,7 +152,6 @@ export default {
font-size: 28px;
font-weight: 700;
color: var(--color-text);
padding: var(--main-content-padding);
a {
font-size: 13px;
font-weight: 600;

14
src/views/library.vue
Unescape View File

@ -39,7 +39,6 @@
:id="likedSongsPlaylist.id"
dbclickTrackFunc="playPlaylistByID"
:columnNumber="3"
:withoutPadding="true"
/>
</div>
</div>
@ -356,7 +355,6 @@ h1 {
color: var(--color-text);
display: flex;
align-items: center;
padding: var(--main-content-padding);
.avatar {
height: 44px;
margin-right: 12px;
@ -375,7 +373,6 @@ h1 {
.section-one {
display: flex;
margin-top: 24px;
padding: var(--main-content-padding);
.songs {
flex: 7;
margin-top: 8px;
@ -384,16 +381,6 @@ h1 {
}
}
@media (max-width: 800px) {
.section-one {
display: block;
.songs {
margin-top: 20px;
margin-left: 0;
}
}
}
.liked-songs {
flex: 3;
margin-top: 8px;
@ -473,7 +460,6 @@ h1 {
display: flex;
justify-content: space-between;
margin-bottom: 24px;
padding: var(--main-content-padding);
}
.tabs {

1
src/views/loginUsername.vue
Unescape View File

@ -106,7 +106,6 @@ export default {
.login {
display: flex;
color: var(--color-text);
padding: var(--main-content-padding);
}
.title {

4
src/views/mv.vue
Unescape View File

@ -146,13 +146,11 @@ export default {
background: transparent;
overflow: hidden;
max-height: 100vh;
margin: var(--main-content-padding);
}
.video-info {
margin-top: 12px;
color: var(--color-text);
padding: var(--main-content-padding);
.title {
font-size: 24px;
font-weight: 600;
@ -177,8 +175,6 @@ export default {
font-weight: 600;
color: var(--color-text);
opacity: 0.88;
padding: var(--main-content-padding);
margin-bottom: 8px;
}
}

122
src/views/playlist.vue
Unescape View File

@ -135,22 +135,8 @@
</h1>
</div>
<div class="search-box">
<div class="container" :class="{ active: inputFocus }">
<svg-icon icon-class="search" />
<div class="input">
<input
v-model="playlistKeyword"
:placeholder="inputFocus ? '' : $t('playlist.search')"
@focus="inputFocus = true"
@blur="inputFocus = false"
/>
</div>
</div>
</div>
<TrackList
:tracks="filteredTracks"
:tracks="tracks"
:type="'playlist'"
:id="playlist.id"
:extraContextMenuItem="
@ -316,8 +302,6 @@ export default {
tracks: [],
loadingMore: false,
lastLoadedTrackIndex: 9,
playlistKeyword: "",
inputFocus: false,
};
},
created() {
@ -344,22 +328,6 @@ export default {
this.playlist.id !== this.data.likedSongPlaylistID
);
},
filteredTracks() {
return this.tracks.filter(
(song) =>
song.name
.toLowerCase()
.includes(this.playlistKeyword.toLowerCase()) ||
song.al.name
.toLowerCase()
.includes(this.playlistKeyword.toLowerCase()) ||
song.ar.find((artist) =>
artist.name
.toLowerCase()
.includes(this.playlistKeyword.toLowerCase())
)
);
},
},
methods: {
...mapMutations(["appendTrackToPlayerList"]),
@ -406,11 +374,6 @@ export default {
this.lastLoadedTrackIndex = data.playlist.tracks.length - 1;
if (this.playlist.trackCount > this.tracks.length) {
window.addEventListener("scroll", this.handleScroll, true);
window.addEventListener(
"input",
this.handleSearch,
this.playlistKeyword
);
}
return data;
})
@ -421,11 +384,11 @@ export default {
}
});
},
loadMore(loadNum = 50) {
loadMore() {
let trackIDs = this.playlist.trackIds.filter((t, index) => {
if (
index > this.lastLoadedTrackIndex &&
index <= this.lastLoadedTrackIndex + loadNum
index <= this.lastLoadedTrackIndex + 50
)
return t;
});
@ -452,15 +415,6 @@ export default {
this.loadMore();
}
},
handleSearch() {
if (
this.lastLoadedTrackIndex + 1 === this.playlist.trackIds.length ||
this.loadingMore
)
return;
this.loadingMore = true;
this.loadMore(this.playlist.trackIds.length - this.lastLoadedTrackIndex);
},
openMenu(e) {
this.$refs.playlistMenu.openMenu(e);
},
@ -498,8 +452,7 @@ export default {
<style lang="scss" scoped>
.playlist-info {
display: flex;
margin-bottom: 40px;
padding: var(--main-content-padding);
margin-bottom: 72px;
.info {
display: flex;
flex-direction: column;
@ -558,25 +511,6 @@ export default {
}
}
@media (max-width: 600px) {
.playlist-info {
width: calc(100vw - 2 * var(--main-content-padding-x));
display: block;
.cover {
display: flex;
justify-content: center;
align-items: center;
}
.info {
margin-top: 24px;
margin-left: 0;
.title {
font-size: 48px;
}
}
}
}
.special-playlist {
margin-top: 192px;
margin-bottom: 128px;
@ -645,54 +579,6 @@ export default {
}
}
.search-box {
display: flex;
justify-content: flex-end;
margin-bottom: 10px;
-webkit-app-region: no-drag;
padding: var(--main-content-padding);
.container {
display: flex;
align-items: center;
height: 32px;
background: var(--color-secondary-bg-for-transparent);
border-radius: 8px;
width: 200px;
}
.svg-icon {
height: 15px;
width: 15px;
color: var(--color-text);
opacity: 0.28;
margin: {
left: 8px;
right: 4px;
bottom: 4px;
}
}
input {
font-size: 16px;
border: none;
background: transparent;
width: 96%;
font-weight: 600;
margin-top: -1px;
color: var(--color-text);
}
.active {
background: var(--color-primary-bg-for-transparent);
input,
.svg-icon {
opacity: 1;
color: var(--color-primary);
}
}
}
.gradient-test {
background-image: linear-gradient(to left, #92fe9d 0%, #00c9ff 100%);
}

11
src/views/search.vue
Unescape View File

@ -13,7 +13,6 @@
:columnNumber="3"
:items="artists.slice(0, 3)"
gap="34px 24px"
:withoutPadding="true"
/>
</div>
@ -31,7 +30,6 @@
:columnNumber="3"
subTextFontSize="14px"
gap="34px 24px"
:withoutPadding="true"
/>
</div>
</div>
@ -43,7 +41,7 @@
$t("home.seeMore")
}}</router-link></div
>
<TrackList :tracks="tracks" type="tracklist" :withoutPadding="true" />
<TrackList :tracks="tracks" type="tracklist" />
</div>
<div class="music-videos" v-show="musicVideos.length > 0">
@ -53,7 +51,7 @@
$t("home.seeMore")
}}</router-link></div
>
<MvRow :mvs="musicVideos.slice(0, 5)" :withoutPadding="true" />
<MvRow :mvs="musicVideos.slice(0, 5)" />
</div>
<div class="playlists" v-show="playlists.length > 0">
@ -70,7 +68,6 @@
:columnNumber="6"
subTextFontSize="14px"
gap="34px 24px"
:withoutPadding="true"
/>
</div>
@ -218,10 +215,6 @@ export default {
</script>
<style lang="scss" scoped>
.search {
padding: var(--main-content-padding);
}
.section-title {
font-weight: 600;
font-size: 22px;

1
src/views/searchType.vue
Unescape View File

@ -140,7 +140,6 @@ export default {
h1 {
margin-top: -10px;
margin-bottom: 28px;
padding: var(--main-content-padding);
color: var(--color-text);
span {
opacity: 0.58;

1
src/views/settings.vue
Unescape View File

@ -460,7 +460,6 @@ export default {
.settings {
display: flex;
justify-content: center;
padding: var(--main-content-padding);
}
.container {
margin-top: 24px;

Write Preview
Loading…
Cancel
Save