fix: vibrant worker error

This commit is contained in:
hawtimzhang 2022-05-02 14:30:11 +08:00
parent fab099c6fb
commit 35edd84c22
3 changed files with 15 additions and 24 deletions

View File

@ -14,19 +14,20 @@
</div> </div>
<div class="controls"> <div class="controls">
<div class="buttons"> <div class="buttons">
<button-icon title="不喜欢" @click.native="moveToFMTrash" <button-icon title="不喜欢" @click.native="moveToFMTrash">
><svg-icon id="thumbs-down" icon-class="thumbs-down" <svg-icon id="thumbs-down" icon-class="thumbs-down" />
/></button-icon> </button-icon>
<button-icon <button-icon
:title="$t(isPlaying ? 'player.pause' : 'player.play')" :title="$t(isPlaying ? 'player.pause' : 'player.play')"
class="play" class="play"
@click.native="play" @click.native="play"
> >
<svg-icon :icon-class="isPlaying ? 'pause' : 'play'" <svg-icon :icon-class="isPlaying ? 'pause' : 'play'" />
/></button-icon> </button-icon>
<button-icon :title="$t('player.next')" @click.native="next" <button-icon :title="$t('player.next')" @click.native="next">
><svg-icon icon-class="next" /></button-icon <svg-icon icon-class="next" />
></div> </button-icon>
</div>
<div class="card-name"><svg-icon icon-class="fm" />私人FM</div> <div class="card-name"><svg-icon icon-class="fm" />私人FM</div>
</div> </div>
</div> </div>
@ -37,7 +38,7 @@
import ButtonIcon from '@/components/ButtonIcon.vue'; import ButtonIcon from '@/components/ButtonIcon.vue';
import ArtistsInLine from '@/components/ArtistsInLine.vue'; import ArtistsInLine from '@/components/ArtistsInLine.vue';
import { mapState } from 'vuex'; import { mapState } from 'vuex';
import * as Vibrant from 'node-vibrant'; import * as Vibrant from 'node-vibrant/dist/vibrant.worker.min.js';
import Color from 'color'; import Color from 'color';
export default { export default {

View File

@ -225,7 +225,7 @@ import { formatTrackTime } from '@/utils/common';
import { getLyric } from '@/api/track'; import { getLyric } from '@/api/track';
import { lyricParser } from '@/utils/lyrics'; import { lyricParser } from '@/utils/lyrics';
import ButtonIcon from '@/components/ButtonIcon.vue'; import ButtonIcon from '@/components/ButtonIcon.vue';
import * as Vibrant from 'node-vibrant'; import * as Vibrant from 'node-vibrant/dist/vibrant.worker.min.js';
import Color from 'color'; import Color from 'color';
import { hasListSource, getListSourcePath } from '@/utils/playList'; import { hasListSource, getListSourcePath } from '@/utils/playList';
@ -431,13 +431,13 @@ export default {
}, },
getCoverColor() { getCoverColor() {
if (this.settings.lyricsBackground !== true) return; if (this.settings.lyricsBackground !== true) return;
const cover = this.currentTrack.al?.picUrl + '?param=1024y1024'; const cover = this.currentTrack.al?.picUrl + '?param=256y256';
Vibrant.from(cover, { colorCount: 1 }) Vibrant.from(cover, { colorCount: 1 })
.getPalette() .getPalette()
.then(palette => { .then(palette => {
const orignColor = Color.rgb(palette.DarkMuted._rgb); const originColor = Color.rgb(palette.DarkMuted._rgb);
const color = orignColor.darken(0.1).rgb().string(); const color = originColor.darken(0.1).rgb().string();
const color2 = orignColor.lighten(0.28).rotate(-30).rgb().string(); const color2 = originColor.lighten(0.28).rotate(-30).rgb().string();
this.background = `linear-gradient(to top left, ${color}, ${color2})`; this.background = `linear-gradient(to top left, ${color}, ${color2})`;
}); });
}, },

View File

@ -2771,11 +2771,6 @@ atob@^2.1.2:
resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9" resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9"
integrity sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg== integrity sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==
atomic-sleep@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/atomic-sleep/-/atomic-sleep-1.0.0.tgz#eb85b77a601fc932cfe432c5acd364a9e2c9075b"
integrity sha512-kNOjDqAh7px0XWNI+4QbzoiR/nTkHAWNud2uvnJquD1/x5a7EQZMJT0AczqK0Qn67oY/TTQ1LbUKajZpp3I9tQ==
atomically@^1.7.0: atomically@^1.7.0:
version "1.7.0" version "1.7.0"
resolved "https://registry.yarnpkg.com/atomically/-/atomically-1.7.0.tgz#c07a0458432ea6dbc9a3506fffa424b48bccaafe" resolved "https://registry.yarnpkg.com/atomically/-/atomically-1.7.0.tgz#c07a0458432ea6dbc9a3506fffa424b48bccaafe"
@ -3870,11 +3865,6 @@ color@^4.2.3:
color-convert "^2.0.1" color-convert "^2.0.1"
color-string "^1.9.0" color-string "^1.9.0"
colorette@^2.0.7:
version "2.0.16"
resolved "https://registry.yarnpkg.com/colorette/-/colorette-2.0.16.tgz#713b9af84fdb000139f04546bd4a93f62a5085da"
integrity sha512-hUewv7oMjCp+wkBv5Rm0v87eJhq4woh5rSR+42YSQJKecCqgIqNkZ6lAlQms/BwHPJA5NKMRlpxPRv0n8HQW6g==
colors@1.0.3: colors@1.0.3:
version "1.0.3" version "1.0.3"
resolved "https://registry.yarnpkg.com/colors/-/colors-1.0.3.tgz#0433f44d809680fdeb60ed260f1b0c262e82a40b" resolved "https://registry.yarnpkg.com/colors/-/colors-1.0.3.tgz#0433f44d809680fdeb60ed260f1b0c262e82a40b"