feat: add reversed mode & improvements to lyrics animation #1226
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Someone is attempting to deploy a commit to a Personal Account owned by @qier222 on Vercel. @qier222 first needs to authorize it. |
GalvinGao
changed the title
memorydream
reviewed
Jan 12, 2022
pan93412
requested changes
Jan 12, 2022
| } | ||
| set reversed(reversed) { | ||
| if (this._isPersonalFM) return; | ||
| if (reversed !== true && reversed !== false) { |
There was a problem hiding this comment.
檢查類型建議用 typeof: typeof reversed !== 'boolean'
| @@ -180,27 +193,43 @@ export default class { | |||
| }, 1000); | |||
| } | |||
| _getNextTrack() { | |||
| const next = this._reversed ? this.current - 1 : this.current + 1; | |||
There was a problem hiding this comment.
const next = this.current + (this._reversed ? -1 : 1);
個人拙見。
| // 当歌曲是列表最后一首 && 循环模式开启 | ||
| if (this.list.length === this.current + 1 && this.repeatMode === 'on') { | ||
| return [this.list[0], 0]; | ||
| // 循环模式开启，则重新播放当前模式下的相对的下一首 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Reversed Mode
Allows the user to play music in a reversed order, opposite to the normal top-to-bottom direction. I found this feature plays quite nice with old playlists that I want to go back and have a taste with. With that saying, it is hidden by default behind a settings item located in the settings menu, to avoid confusion and clutter introduced to all users.
Lyrics Animation
Inspired by Apple Music, I've tried to replicate the same effect by using
font-sizeanimation. On my MacBook Pro 2021 it looks quite smoothly and it looks astonishing with dynamic background. This is just to try and have some fun and it turns out to be quite nicely.I also added a slight different styling to the translated lyrics, making it a bit transparent and a bit smaller to the original lyrics to distinguish the two.
Also I've get rid of
v-htmlby usingv-ifandv-if-else, just to make the code more readable and to get rid of extra DOM parsing.