一大波更新
宇天
parent
263d401790
commit
e3e2e55db7
File diff suppressed because one or more lines are too long
44
css/app.scss
44
css/app.scss
|
|
@ -9,7 +9,7 @@
|
|||
@import "./var.scss";
|
||||
|
||||
@font-face {font-family: "sonist font";
|
||||
src: url('data:application/x-font-woff;charset=utf-8;base64,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') format('woff')
|
||||
src: url('data:application/x-font-woff;charset=utf-8;base64,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') format('woff')
|
||||
}
|
||||
|
||||
[class^="s-icon-"], [class*=" s-icon-"] {display:inline-block;font-family:"sonist font" !important;font-style:normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
|
||||
|
|
@ -18,17 +18,17 @@
|
|||
.s-icon-eq:before { content: "\e715"; }
|
||||
.s-icon-heart:before { content: "\e716"; }
|
||||
.s-icon-music:before { content: "\e717"; }
|
||||
.s-icon-prev:before { content: "\e718"; }
|
||||
.s-icon-play-list:before { content: "\e719"; }
|
||||
.s-icon-pause:before { content: "\e71a"; }
|
||||
.s-icon-play:before { content: "\e71b"; }
|
||||
.s-icon-next:before { content: "\e71c"; }
|
||||
.s-icon-mv:before { content: "\e71d"; }
|
||||
.s-icon-rank:before { content: "\e71e"; }
|
||||
.s-icon-singer:before { content: "\e71f"; }
|
||||
.s-icon-random:before { content: "\e720"; }
|
||||
.s-icon-radio:before { content: "\e721"; }
|
||||
.s-icon-single:before { content: "\e722"; }
|
||||
.s-icon-next:before { content: "\e723"; }
|
||||
.s-icon-prev:before { content: "\e724"; }
|
||||
.s-icon-pause:before { content: "\e725"; }
|
||||
.s-icon-play:before { content: "\e726"; }
|
||||
|
||||
.do-fn-drag {-webkit-app-region:drag;user-select: none;}
|
||||
.do-fn-nodrag {-webkit-app-region:no-drag;}
|
||||
|
|
@ -57,26 +57,35 @@ table {overflow:auto;display:table;width:100%;line-height:2.5rem;
|
|||
|
||||
.menubar {position:absolute;left:1.2rem;top:0;z-index:99;width:auto;height:3rem;padding:.9rem 0;
|
||||
|
||||
.item {display:inline-block;width:1.2rem;height:1.2rem;margin:0 .2rem;background:url(/images/btn_gray@2x.png) no-repeat;background-size:cover;}
|
||||
.item {display:inline-block;width:1.2rem;height:1.2rem;margin:0 .2rem;background:url(/images/btn-grey.svg) no-repeat;background-size:cover;}
|
||||
|
||||
&.focus {
|
||||
.quit {background-image:url(/images/btn_close_focus@2x.png);}
|
||||
.min {background-image:url(/images/btn_min_focus@2x.png);}
|
||||
.max {background-image:url(/images/btn_max_focus@2x.png);}
|
||||
.quit {background-image:url(/images/btn-close.svg);}
|
||||
.min {background-image:url(/images/btn-mini.svg);}
|
||||
.max {background-image:url(/images/btn-maxi.svg);}
|
||||
}
|
||||
&:hover {
|
||||
.quit {background-image:url(/images/btn_close_hover@2x.png);}
|
||||
.min {background-image:url(/images/btn_min_hover@2x.png);}
|
||||
.max {background-image:url(/images/btn_max_hover@2x.png);}
|
||||
.quit {background-image:url(/images/btn-close_a.svg);}
|
||||
.min {background-image:url(/images/btn-mini_a.svg);}
|
||||
.max {background-image:url(/images/btn-maxi_a.svg);}
|
||||
}
|
||||
}
|
||||
|
||||
.menubar-win {position:absolute;right:1.2rem;top:0;z-index:99;width:auto;height:4rem;padding:.9rem 0;line-height:1.8rem;
|
||||
|
||||
.item {display:inline-block;width:2.2rem;height:2.2rem;margin:0 .2rem;padding:.2rem;font-size:1.6rem;
|
||||
.item,.opt {position:relative;display:inline-block;width:2.2rem;height:2.2rem;margin:0 .2rem;padding:.2rem;font-size:1.6rem;
|
||||
}
|
||||
.item:hover {transform:scale(1.1)}
|
||||
|
||||
&:hover {transform:scale(1.1)}
|
||||
&.opt {font-size:1.8rem;}
|
||||
.opt i {font-size:1.8rem;}
|
||||
|
||||
.opt-list {position:absolute;z-index:100;right:0;top:2.2rem;width:13rem;height:auto;padding:.8rem 0;background:#fff;box-shadow:0 .5rem 2rem rgba(0, 0, 0, .1);font-size:1.4rem;
|
||||
span {display:flex;align-items:center;height:3rem;padding:0 2rem;line-height:3rem;
|
||||
|
||||
i {padding-right:.8rem;}
|
||||
&.pipe {height:.1rem;margin:.5rem 0;border-bottom:.1rem solid nth($cp, 1)}
|
||||
&:hover {background:nth($cp, 1)}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -101,6 +110,7 @@ table {overflow:auto;display:table;width:100%;line-height:2.5rem;
|
|||
dd.item {height:3rem;margin:.3rem 0;padding:0 .8rem;line-height:3rem;color:nth($cgr, 3);
|
||||
|
||||
.icon {float:left;width:3rem;height:3rem;padding:0 .5rem;font-size:2.4rem;}
|
||||
&:hover {padding-left:.9rem;color:nth($ct, 1);}
|
||||
&.active {border-radius:.3rem;background:nth($ct, 1);color:#fff;}
|
||||
&.disabled {opacity:.25}
|
||||
}
|
||||
|
|
@ -111,8 +121,8 @@ table {overflow:auto;display:table;width:100%;line-height:2.5rem;
|
|||
|
||||
.item {position:absolute;top:2rem;width:4rem;height:4rem;line-height:4rem;font-size:3.5rem;text-align:center;color:nth($ct, 2);@include ts();
|
||||
|
||||
&:hover {color:nth($ct, 1)}
|
||||
&:active {color:nth($ct, 3)}
|
||||
&:hover {color:nth($cp, 3)}
|
||||
&:active {color:nth($ct, 1);transform:scale(1.1)}
|
||||
}
|
||||
.prev {left:2.5rem;}
|
||||
.play {left:50%;top:1.5rem;width:5rem;height:5rem;margin-left:-2.5rem;line-height:5rem;font-size:4.5rem;}
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
.do-mod-artist{position:relative;display:flex;width:100%;height:100%}.do-mod-artist .filter-box{flex:0 1 12rem;border-right:0.1rem solid #f3f5fb;text-align:right}.do-mod-artist .filter-box .item{width:100%;height:2.4rem;padding:0 1.2rem;line-height:2.4rem;color:#98acae}.do-mod-artist .filter-box .item.active{color:#3fc2a7;font-weight:bold}.do-mod-artist .filter-box .item:hover{padding-right:1.3rem;color:#3fc2a7}.do-mod-artist .filter-box .pipe{display:block;width:100%;height:.7rem}.do-mod-artist .list-box{overflow-y:auto;display:flex;flex-flow:row wrap;flex:1;padding:0 1rem}.do-mod-artist .list-box .item{display:flex;justify-content:center;align-items:center;flex:45%;height:7rem;margin:1rem 2.5%;padding:.5rem;background:#f3f5fb}.do-mod-artist .list-box .item img{flex:0 1 6rem;height:6rem}.do-mod-artist .list-box .item summary{flex:2;padding:0 1rem}.do-mod-artist .list-box .item strong{font-size:1.6rem}.do-mod-artist .list-box .item p{font-size:1.2rem;color:#98acae}.do-mod-artist .artist-box{position:absolute;left:0;top:0;z-index:9;width:100%;height:100%;background-size:cover;background-repeat:no-repeat;background-position:center center}.do-mod-artist .artist-box .content{display:flex;flex-flow:column wrap;width:100%;height:100%;padding:1.5rem 2.5rem;background:linear-gradient(to bottom, #fff 2%, rgba(255,255,255,0.75), #fff 98%);-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem)}.do-mod-artist .artist-box .content .name{flex:0 1 3.6rem;font-size:1.4rem;font-style:italic;font-weight:normal}.do-mod-artist .artist-box .content .name a{text-decoration:underline;color:#3fc2a7}.do-mod-artist .artist-box .content .name i{color:#98acae}.do-mod-artist .artist-box .content .desc{flex:0 1 3rem;font-size:1.2rem;color:#98acae}.do-mod-artist .artist-box .content .desc span{padding:0 .5rem;text-decoration:underline;color:#3fc2a7}.do-mod-artist .artist-box .content .song-album{flex:1;display:flex;flex-flow:column wrap}.do-mod-artist .artist-box .content .tab{flex:0 1 3rem;display:flex;padding:0 .5rem;line-height:2.9rem;border-bottom:0.1rem solid #e8ebf4;text-align:center}.do-mod-artist .artist-box .content .tab .item{flex:0 0 7.5rem;height:3rem;margin:0 .3rem}.do-mod-artist .artist-box .content .tab .item.active{border-bottom:0.2rem solid #3fc2a7;color:#3fc2a7}.do-mod-artist .artist-box .content .tab .item.disabled{opacity:.25}.do-mod-local{flex:1;display:flex;flex-flow:column wrap}.do-mod-local .toolbar{flex:0 1 3rem;padding:0 1rem;line-height:2.9rem;border-bottom:0.1rem solid #e8ebf4}.do-mod-local .toolbar .refresh{margin-left:1rem;color:#3fc2a7;text-decoration:underline}.do-mod-local .table{overflow:auto;flex:1}.do-mod-local .table .stat{width:2.6rem;height:2.6rem;line-height:2.6rem}.do-mod-local .table .ac{text-align:center}.do-mod-local .table .active{color:#3fc2a7}.do-mod-local .table .active i{-webkit-animation:play 2s infinite linear;animation:play 2s infinite linear}.do-mod-search{flex:1;display:flex;flex-flow:column wrap}.do-mod-search .tabbar{flex:0 1 3rem;display:flex;padding:0 .5rem;line-height:2.9rem;border-bottom:0.1rem solid #e8ebf4;text-align:center}.do-mod-search .tabbar .item{flex:0 0 7.5rem;height:3rem;margin:0 .3rem;border:0.1rem solid #e8ebf4;background:#fff;color:#dae1e9}.do-mod-search .tabbar .item.active{border-bottom-color:transparent;color:#62778d}.do-mod-search .tabbar .item i{color:#ff5061}.do-mod-search .table{overflow:auto;flex:1}.do-mod-search .table .active{color:#3fc2a7}.do-mod-search .table .ac{text-align:center}.do-mod-profile{overflow-y:auto;padding:0 3rem}.do-mod-profile .title{position:relative;width:100%;height:6rem;line-height:6rem;border-bottom:0.1rem solid #dae1e9;font-size:1.8rem}.do-mod-profile .title .save{position:absolute;bottom:.3rem;right:0}.do-mod-profile .block{display:flex;justify-content:center;align-items:center;width:100%;padding:2rem 0;border-bottom:0.1rem solid #f3f5fb}.do-mod-profile .block .label{flex:0 1 20rem}.do-mod-profile .block .field{flex:1;display:flex;align-items:center}.do-mod-profile .block .do-radio{margin-right:2rem}.do-mod-profile .block .desc{line-height:2}.do-mod-profile .block .desc p{margin-top:1.5rem}.artist-desc-layer{width:60rem;height:30rem}.artist-desc-layer .layer-content{overflow-y:auto;height:85% !important;padding:1rem;line-height:2;text-indent:2em}
|
||||
.do-mod-artist{position:relative;display:flex;width:100%;height:100%}.do-mod-artist .filter-box{flex:0 1 12rem;border-right:0.1rem solid #f3f5fb;text-align:right}.do-mod-artist .filter-box .item{width:100%;height:2.4rem;padding:0 1.2rem;line-height:2.4rem;color:#98acae}.do-mod-artist .filter-box .item.active{color:#3fc2a7;font-weight:bold}.do-mod-artist .filter-box .item:hover{padding-right:1.3rem;color:#3fc2a7}.do-mod-artist .filter-box .pipe{display:block;width:100%;height:.7rem}.do-mod-artist .list-box{overflow-y:auto;display:flex;flex-flow:row wrap;flex:1;padding:0 1rem}.do-mod-artist .list-box .item{display:flex;justify-content:center;align-items:center;flex:45%;height:7rem;margin:1rem 2.5%;padding:.5rem;background:#f3f5fb}.do-mod-artist .list-box .item img{flex:0 1 6rem;height:6rem}.do-mod-artist .list-box .item summary{flex:2;padding:0 1rem}.do-mod-artist .list-box .item strong{font-size:1.6rem}.do-mod-artist .list-box .item p{font-size:1.2rem;color:#98acae}.do-mod-artist .artist-box{position:absolute;left:0;top:0;z-index:9;width:100%;height:100%;background-size:cover;background-repeat:no-repeat;background-position:center center}.do-mod-artist .artist-box .content{display:flex;flex-flow:column wrap;width:100%;height:100%;padding:1.5rem 2.5rem;background:linear-gradient(to bottom, #fff 2%, rgba(255,255,255,0.75), #fff 98%);-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem)}.do-mod-artist .artist-box .content .name{flex:0 1 3.6rem;font-size:1.4rem;font-style:italic;font-weight:normal}.do-mod-artist .artist-box .content .name a{text-decoration:underline;color:#3fc2a7}.do-mod-artist .artist-box .content .name i{color:#98acae}.do-mod-artist .artist-box .content .desc{flex:0 1 3rem;font-size:1.2rem;color:#98acae}.do-mod-artist .artist-box .content .desc span{padding:0 .5rem;text-decoration:underline;color:#3fc2a7}.do-mod-artist .artist-box .content .song-album{flex:1;display:flex;flex-flow:column wrap}.do-mod-artist .artist-box .content .tab{flex:0 1 3rem;display:flex;padding:0 .5rem;line-height:2.9rem;border-bottom:0.1rem solid #e8ebf4;text-align:center}.do-mod-artist .artist-box .content .tab .item{flex:0 0 7.5rem;height:3rem;margin:0 .3rem}.do-mod-artist .artist-box .content .tab .item.active{border-bottom:0.2rem solid #3fc2a7;color:#3fc2a7}.do-mod-artist .artist-box .content .tab .item.disabled{opacity:.25}.do-mod-local{flex:1;display:flex;flex-flow:column wrap}.do-mod-local .toolbar{flex:0 1 3rem;padding:0 1rem;line-height:2.9rem;border-bottom:0.1rem solid #e8ebf4}.do-mod-local .toolbar .refresh{margin-left:1rem;color:#3fc2a7;text-decoration:underline}.do-mod-local .toolbar .refresh:hover{color:#dae1e9}.do-mod-local .toolbar .refresh:active{color:#3fc2a7;-webkit-transform:scale(1.1);transform:scale(1.1)}.do-mod-local .table{overflow:auto;flex:1}.do-mod-local .table .stat{width:2.6rem;height:2.6rem;line-height:2.6rem}.do-mod-local .table .ac{text-align:center}.do-mod-local .table .active{color:#3fc2a7;background:#f3f5fb}.do-mod-local .table .active i{-webkit-animation:play 2s infinite linear;animation:play 2s infinite linear}.do-mod-search{flex:1;display:flex;flex-flow:column wrap}.do-mod-search .tabbar{flex:0 1 3rem;display:flex;padding:0 .5rem;line-height:2.9rem;border-bottom:0.1rem solid #e8ebf4;text-align:center}.do-mod-search .tabbar .item{flex:0 0 7.5rem;height:3rem;margin:0 .3rem;border:0.1rem solid #e8ebf4;background:#fff;color:#dae1e9}.do-mod-search .tabbar .item.active{border-bottom-color:transparent;color:#62778d}.do-mod-search .tabbar .item i{color:#ff5061}.do-mod-search .table{overflow:auto;flex:1}.do-mod-search .table .active{color:#3fc2a7}.do-mod-search .table .ac{text-align:center}.do-mod-profile{overflow-y:auto;padding:0 3rem}.do-mod-profile .title{position:relative;width:100%;height:6rem;line-height:6rem;border-bottom:0.1rem solid #dae1e9;font-size:1.8rem}.do-mod-profile .title .save{position:absolute;bottom:.3rem;right:0}.do-mod-profile .block{display:flex;justify-content:center;align-items:center;width:100%;padding:2rem 0;border-bottom:0.1rem solid #f3f5fb}.do-mod-profile .block .label{flex:0 1 20rem}.do-mod-profile .block .field{flex:1;display:flex;align-items:center}.do-mod-profile .block .do-radio{margin-right:2rem}.do-mod-profile .block .desc{line-height:2}.do-mod-profile .block .desc p{margin-top:1.5rem}.artist-desc-layer{width:60rem;height:30rem}.artist-desc-layer .layer-content{overflow-y:auto;height:85% !important;padding:1rem;line-height:2;text-indent:2em}
|
||||
|
|
|
|||
|
|
@ -76,7 +76,11 @@
|
|||
|
||||
.toolbar {flex:0 1 3rem;padding:0 1rem;line-height:2.9rem;border-bottom:.1rem solid nth($cp, 2);
|
||||
|
||||
.refresh {margin-left:1rem;color:nth($ct, 1);text-decoration:underline;}
|
||||
.refresh {margin-left:1rem;color:nth($ct, 1);text-decoration:underline;
|
||||
|
||||
&:hover {color:nth($cp, 3)}
|
||||
&:active {color:nth($ct, 1);transform:scale(1.1)}
|
||||
}
|
||||
}
|
||||
|
||||
.table {overflow:auto;flex:1;
|
||||
|
|
@ -84,7 +88,7 @@
|
|||
.stat {width:2.6rem;height:2.6rem;line-height:2.6rem;}
|
||||
.ac {text-align:center}
|
||||
|
||||
.active {color:nth($ct, 1);
|
||||
.active {color:nth($ct, 1);background:nth($cp, 1);
|
||||
|
||||
i {animation: play 2s infinite linear;}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -40,35 +40,6 @@ class AudioPlayer {
|
|||
)
|
||||
}
|
||||
|
||||
static ID3(song) {
|
||||
let cmd = `ffprobe -v quiet -print_format json -show_entries format "${song}"`
|
||||
let pc = exec(cmd)
|
||||
let buf = []
|
||||
return new Promise((resolve, reject) => {
|
||||
pc.stdout.on('data', _ => {
|
||||
buf.push(_)
|
||||
})
|
||||
|
||||
pc.stderr.on('data', reject)
|
||||
|
||||
pc.stdout.on('close', _ => {
|
||||
let { format } = Buffer.from(buf)
|
||||
try {
|
||||
res = JSON.parse(res)
|
||||
resolve({
|
||||
title: format.tags.TITLE || format.tags.title,
|
||||
album: format.tags.ALBUM || format.tags.album,
|
||||
artist: format.tags.ARTIST || format.tags.artist,
|
||||
duration: +format.duration,
|
||||
size: +(format.size / 1024 / 1024).toFixed(2)
|
||||
})
|
||||
} catch (err) {
|
||||
reject(err)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
get stat() {
|
||||
return this.__LIST__.length ? 'ready' : 'stop'
|
||||
}
|
||||
|
|
@ -158,6 +129,7 @@ class AudioPlayer {
|
|||
this.__PLAYER__.src = song.path
|
||||
this.__PLAYER__.play()
|
||||
|
||||
Anot.ls('last-play', id)
|
||||
return Promise.resolve(song)
|
||||
}
|
||||
return Promise.reject('song not found')
|
||||
|
|
@ -201,4 +173,33 @@ class AudioPlayer {
|
|||
|
||||
util.inherits(AudioPlayer, EventEmitter)
|
||||
|
||||
export const ID3 = song => {
|
||||
let cmd = `ffprobe -v quiet -print_format json -show_entries format "${song}"`
|
||||
let pc = exec(cmd)
|
||||
let buf = []
|
||||
return new Promise((resolve, reject) => {
|
||||
pc.stdout.on('data', _ => {
|
||||
buf.push(_)
|
||||
})
|
||||
|
||||
pc.stderr.on('data', reject)
|
||||
|
||||
pc.stdout.on('close', _ => {
|
||||
let { format } = Buffer.from(buf)
|
||||
try {
|
||||
res = JSON.parse(res)
|
||||
resolve({
|
||||
title: format.tags.TITLE || format.tags.title,
|
||||
album: format.tags.ALBUM || format.tags.album,
|
||||
artist: format.tags.ARTIST || format.tags.artist,
|
||||
duration: +format.duration,
|
||||
size: +(format.size / 1024 / 1024).toFixed(2)
|
||||
})
|
||||
} catch (err) {
|
||||
reject(err)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
export default AudioPlayer
|
||||
|
|
|
|||
BIN
images/album.jpg
BIN
images/album.jpg
Binary file not shown.
|
Before Width: | Height: | Size: 26 KiB |
|
|
@ -0,0 +1,19 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #f55449;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #333;
|
||||
opacity: 0.1;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<title>btn_close_hover</title>
|
||||
<g id="red">
|
||||
<circle class="cls-1" cx="512" cy="512" r="512"/>
|
||||
<path class="cls-2" d="M512,1024A512.13,512.13,0,0,1,312.7,40.24,512.13,512.13,0,0,1,711.3,983.76,508.81,508.81,0,0,1,512,1024Zm0-984A472.13,472.13,0,0,0,328.28,946.92,472.13,472.13,0,0,0,695.72,77.08,469,469,0,0,0,512,40Z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 594 B |
|
|
@ -0,0 +1,25 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #f55449;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #333;
|
||||
opacity: 0.1;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
opacity: 0.7;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<title>btn_close_hover</title>
|
||||
<g id="red">
|
||||
<circle class="cls-1" cx="512" cy="512" r="512"/>
|
||||
<path class="cls-2" d="M512,1024A512.13,512.13,0,0,1,312.7,40.24,512.13,512.13,0,0,1,711.3,983.76,508.81,508.81,0,0,1,512,1024Zm0-984A472.13,472.13,0,0,0,328.28,946.92,472.13,472.13,0,0,0,695.72,77.08,469,469,0,0,0,512,40Z"/>
|
||||
<rect class="cls-3" x="192" y="476" width="640" height="72" rx="36" ry="36" transform="translate(512 1236.08) rotate(-135)"/>
|
||||
<rect class="cls-3" x="191" y="475" width="640" height="72" rx="36" ry="36" transform="translate(1233.66 511) rotate(135)"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 899 B |
|
|
@ -0,0 +1,19 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #dee1e3;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #333;
|
||||
opacity: 0.1;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<title>btn_grey</title>
|
||||
<g id="grey">
|
||||
<circle class="cls-1" cx="512" cy="512" r="512"/>
|
||||
<path class="cls-2" d="M512,1024A512.13,512.13,0,0,1,312.7,40.24,512.13,512.13,0,0,1,711.3,983.76,508.81,508.81,0,0,1,512,1024Zm0-984A472.13,472.13,0,0,0,328.28,946.92,472.13,472.13,0,0,0,695.72,77.08,469,469,0,0,0,512,40Z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 588 B |
|
|
@ -0,0 +1,19 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #39ea49;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #333;
|
||||
opacity: 0.1;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<title>btn_max_hover</title>
|
||||
<g id="green">
|
||||
<circle class="cls-1" cx="512" cy="512" r="512"/>
|
||||
<path class="cls-2" d="M512,1024A512.13,512.13,0,0,1,312.7,40.24,512.13,512.13,0,0,1,711.3,983.76,508.81,508.81,0,0,1,512,1024Zm0-984A472.13,472.13,0,0,0,328.28,946.92,472.13,472.13,0,0,0,695.72,77.08,469,469,0,0,0,512,40Z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 594 B |
|
|
@ -0,0 +1,24 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #39ea49;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #333;
|
||||
opacity: 0.1;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
opacity: 0.7;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<title>btn_max_hover</title>
|
||||
<g id="green">
|
||||
<circle class="cls-1" cx="512" cy="512" r="512"/>
|
||||
<path class="cls-2" d="M512,1024A512.13,512.13,0,0,1,312.7,40.24,512.13,512.13,0,0,1,711.3,983.76,508.81,508.81,0,0,1,512,1024Zm0-984A472.13,472.13,0,0,0,328.28,946.92,472.13,472.13,0,0,0,695.72,77.08,469,469,0,0,0,512,40Z"/>
|
||||
<path class="cls-3" d="M395.93,267.8a31.32,31.32,0,0,1,22.86-9.48l319.33-2.55A31.25,31.25,0,0,1,770,287.64l-2.5,319.29A32,32,0,0,1,758,629.79a31.06,31.06,0,0,1-22.86,9.48,30.67,30.67,0,0,1-22.72-9.15L395.65,313.33c-6.22-6.13-9.24-13.67-9.15-22.72a31.28,31.28,0,0,1,9.43-22.82ZM629.84,758A31.32,31.32,0,0,1,607,767.45L287.64,770a31.25,31.25,0,0,1-31.87-31.87l2.5-319.29A32,32,0,0,1,267.75,396a31.06,31.06,0,0,1,22.86-9.48,30.67,30.67,0,0,1,22.72,9.15L630.12,712.44c6.22,6.13,9.24,13.67,9.15,22.72A31.28,31.28,0,0,1,629.84,758Z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
|
|
@ -0,0 +1,19 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #fac536;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #333;
|
||||
opacity: 0.1;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<title>btn_min_hover</title>
|
||||
<g id="yellow">
|
||||
<circle class="cls-1" cx="512" cy="512" r="512"/>
|
||||
<path class="cls-2" d="M512,1024A512.13,512.13,0,0,1,312.7,40.24,512.13,512.13,0,0,1,711.3,983.76,508.81,508.81,0,0,1,512,1024Zm0-984A472.13,472.13,0,0,0,328.28,946.92,472.13,472.13,0,0,0,695.72,77.08,469,469,0,0,0,512,40Z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 595 B |
|
|
@ -0,0 +1,24 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #fac536;
|
||||
}
|
||||
|
||||
.cls-2 {
|
||||
fill: #333;
|
||||
opacity: 0.1;
|
||||
}
|
||||
|
||||
.cls-3 {
|
||||
opacity: 0.7;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<title>btn_min_hover</title>
|
||||
<g id="yellow">
|
||||
<circle class="cls-1" cx="512" cy="512" r="512"/>
|
||||
<path class="cls-2" d="M512,1024A512.13,512.13,0,0,1,312.7,40.24,512.13,512.13,0,0,1,711.3,983.76,508.81,508.81,0,0,1,512,1024Zm0-984A472.13,472.13,0,0,0,328.28,946.92,472.13,472.13,0,0,0,695.72,77.08,469,469,0,0,0,512,40Z"/>
|
||||
<rect class="cls-3" x="192" y="476" width="640" height="72" rx="36" ry="36"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 723 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 910 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 916 B |
Binary file not shown.
|
Before Width: | Height: | Size: 998 B |
|
Before Width: | Height: | Size: 586 B After Width: | Height: | Size: 586 B |
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.2 KiB |
13
index.html
13
index.html
|
|
@ -22,7 +22,18 @@
|
|||
</nav>
|
||||
|
||||
<nav class="menubar-win do-fn-nodrag">
|
||||
<i class="item opt do-icon-menu-right" :click="toggleModule('profile')"></i>
|
||||
<div class="opt">
|
||||
<i class="do-icon-menu-right" :click="toggleOptBox"></i>
|
||||
<section class="opt-list" :visible="optBoxShow">
|
||||
<span><i class="do-icon-maximized"></i> 迷你模式</span>
|
||||
<span :click="toggleModule('profile')">
|
||||
<i class="do-icon-setting"></i> 首选项
|
||||
</span>
|
||||
<span class="pipe"></span>
|
||||
<span :click="quit(true)"><i class="do-icon-logout"></i> 退出</span>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<span :if="theme === 2">
|
||||
<i class="item do-icon-minimize" :click="minimize"></i>
|
||||
<i class="item do-icon-maximize" :click="maximize"></i>
|
||||
|
|
|
|||
84
js/app.js
84
js/app.js
|
|
@ -19,15 +19,12 @@ const log = console.log
|
|||
|
||||
const fs = require('iofs')
|
||||
const path = require('path')
|
||||
const crypto = require('crypto.js')
|
||||
const { exec } = require('child_process')
|
||||
const {
|
||||
remote: { app }
|
||||
} = require('electron')
|
||||
|
||||
const HOME_PATH = app.getPath('appData')
|
||||
const { remote } = require('electron')
|
||||
|
||||
const WIN = remote.getCurrentWindow()
|
||||
const HOME_PATH = remote.app.getPath('appData')
|
||||
const APP_INI_PATH = path.join(HOME_PATH, 'app.ini')
|
||||
const MUSIC_DB_PATH = path.join(HOME_PATH, 'music.db')
|
||||
const PLAY_MODE = {
|
||||
0: 'all',
|
||||
1: 'single',
|
||||
|
|
@ -43,55 +40,20 @@ window.TS = store.collection('temp')
|
|||
window.SONIST = new AudioPlayer()
|
||||
|
||||
let appInit = fs.cat(APP_INI_PATH)
|
||||
let dbCache = fs.cat(MUSIC_DB_PATH)
|
||||
|
||||
dbCache = JSON.parse(dbCache)
|
||||
Anot.ss('app-init', appInit + '')
|
||||
|
||||
appInit = JSON.parse(appInit)
|
||||
LS.insert(dbCache)
|
||||
|
||||
dbCache = null
|
||||
|
||||
let list = fs.ls('/Volumes/extends/music')
|
||||
|
||||
let hasNew = false
|
||||
// list.forEach(it => {
|
||||
// let name = path.basename(it)
|
||||
// if (name.startsWith('.')) {
|
||||
// return
|
||||
// }
|
||||
// let hash = crypto.md5Sign(it)
|
||||
// if (LS.get(hash)) {
|
||||
// return
|
||||
// }
|
||||
// hasNew = true
|
||||
// AudioPlayer.ID3(it).then(tag => {
|
||||
// LS.insert({
|
||||
// id: hash,
|
||||
// title: tag.title,
|
||||
// album: tag.album,
|
||||
// artist: tag.artist,
|
||||
// path: `file://${it}`,
|
||||
// duration: tag.duration
|
||||
// })
|
||||
// })
|
||||
// })
|
||||
|
||||
if (hasNew) {
|
||||
setTimeout(() => {
|
||||
dbCache = JSON.stringify(LS.getAll(), '', 2)
|
||||
log(dbCache, MUSIC_DB_PATH)
|
||||
fs.echo(dbCache, MUSIC_DB_PATH)
|
||||
}, 500)
|
||||
}
|
||||
|
||||
Anot({
|
||||
$id: 'app',
|
||||
state: {
|
||||
theme: 1, // 1:macos, 2: deepin
|
||||
winFocus: true,
|
||||
winFocus: false,
|
||||
mod: 'local',
|
||||
playMode: Anot.ls('play-mode') >>> 0, // 0:all | 1:single | 2:random
|
||||
isPlaying: false,
|
||||
optBoxShow: false,
|
||||
curr: {
|
||||
id: '',
|
||||
index: 0,
|
||||
|
|
@ -103,8 +65,7 @@ Anot({
|
|||
},
|
||||
|
||||
currTimeBar: '',
|
||||
currTimeBarPercent: 0,
|
||||
__DEG__: 0.01
|
||||
currTimeBarPercent: 0
|
||||
},
|
||||
skip: [],
|
||||
computed: {
|
||||
|
|
@ -138,6 +99,8 @@ Anot({
|
|||
canvas.height = this.__HEIGHT__
|
||||
this.__CTX__ = canvas.getContext('2d')
|
||||
|
||||
this.draw()
|
||||
|
||||
// 修改歌曲进度
|
||||
canvas.addEventListener(
|
||||
'click',
|
||||
|
|
@ -170,9 +133,26 @@ Anot({
|
|||
})
|
||||
|
||||
this.activeModule(this.mod)
|
||||
|
||||
remote.app.on('browser-window-focus', _ => {
|
||||
this.winFocus = true
|
||||
})
|
||||
remote.app.on('browser-window-blur', _ => {
|
||||
this.winFocus = false
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
quit() {},
|
||||
quit(force) {
|
||||
if (force) {
|
||||
remote.app.exit()
|
||||
} else {
|
||||
if (appInit.allowPlayOnBack) {
|
||||
WIN.hide()
|
||||
} else {
|
||||
remote.app.exit()
|
||||
}
|
||||
}
|
||||
},
|
||||
minimize() {},
|
||||
maximize() {},
|
||||
|
||||
|
|
@ -191,10 +171,15 @@ Anot({
|
|||
break
|
||||
}
|
||||
},
|
||||
|
||||
toggleOptBox() {
|
||||
this.optBoxShow = !this.optBoxShow
|
||||
},
|
||||
toggleModule(mod) {
|
||||
if (['radio', 'mv'].includes(mod)) {
|
||||
return
|
||||
}
|
||||
this.optBoxShow = false
|
||||
this.mod = mod
|
||||
},
|
||||
togglePlayMode() {
|
||||
|
|
@ -281,6 +266,7 @@ Anot({
|
|||
|
||||
Promise.all([p1.promise, p2.promise]).then(_ => {
|
||||
clearInterval(this.timer)
|
||||
this.__DEG__ = 0.01
|
||||
if (play) {
|
||||
this.timer = setInterval(() => {
|
||||
draw(img1, img2, play, rx, ry)
|
||||
|
|
|
|||
|
|
@ -7,27 +7,46 @@
|
|||
'use strict'
|
||||
|
||||
import Api from '/js/api.js'
|
||||
import { ID3 } from '/dist/audio/index.js'
|
||||
|
||||
const fs = require('iofs')
|
||||
const path = require('path')
|
||||
const crypto = require('crypto.js')
|
||||
const { app, dialog } = require('electron').remote
|
||||
|
||||
const log = console.log
|
||||
const HOME_PATH = app.getPath('appData')
|
||||
const MUSIC_DB_PATH = path.join(HOME_PATH, 'music.db')
|
||||
|
||||
let appInit = {}
|
||||
let dbCache = fs.cat(MUSIC_DB_PATH)
|
||||
dbCache = JSON.parse(dbCache)
|
||||
|
||||
export default Anot({
|
||||
$id: 'local',
|
||||
state: {
|
||||
list: [],
|
||||
curr: ''
|
||||
curr: '',
|
||||
__APP__: null
|
||||
},
|
||||
__APP__: null,
|
||||
mounted() {
|
||||
LS.insert(dbCache)
|
||||
appInit = JSON.parse(Anot.ss('app-init'))
|
||||
|
||||
dbCache = null
|
||||
this.__APP__ = Anot.vmodels.app
|
||||
this.list = LS.getAll()
|
||||
let lastPlay = Anot.ls('last-play') || 0
|
||||
|
||||
SONIST.clear()
|
||||
SONIST.push(LS.getAll())
|
||||
SONIST.play(lastPlay).then(it => {
|
||||
this.__APP__.play(it)
|
||||
this.curr = it.id
|
||||
})
|
||||
|
||||
// if (appInit.autoPlay) {
|
||||
// SONIST.play(lastPlay).then(it => {
|
||||
// this.__APP__.play(it)
|
||||
// this.curr = it.id
|
||||
// })
|
||||
// }
|
||||
},
|
||||
watch: {
|
||||
'props.curr'(v) {
|
||||
|
|
@ -35,13 +54,71 @@ export default Anot({
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
__init__() {},
|
||||
__init__() {
|
||||
appInit = JSON.parse(Anot.ss('app-init'))
|
||||
log(appInit)
|
||||
},
|
||||
|
||||
play(idx) {
|
||||
SONIST.play(idx).then(it => {
|
||||
this.__APP__.play(it)
|
||||
this.curr = it.id
|
||||
})
|
||||
},
|
||||
|
||||
__checkSong__() {
|
||||
let song = this.__LIST__.pop()
|
||||
|
||||
if (!song) {
|
||||
if (this.__NEW_NUM__ > 0) {
|
||||
dbCache = LS.getAll()
|
||||
this.list.clear()
|
||||
this.list.pushArray(dbCache)
|
||||
SONIST.clear()
|
||||
SONIST.push(dbCache)
|
||||
fs.echo(JSON.stringify(dbCache, '', 2), MUSIC_DB_PATH)
|
||||
dbCache = null
|
||||
}
|
||||
|
||||
layer.close(this.__load__)
|
||||
layer.toast(`刷新缓存完成,新增${this.__NEW_NUM__}首`)
|
||||
delete this.__load__
|
||||
return
|
||||
}
|
||||
|
||||
Anot.nextTick(() => {
|
||||
let name = path.basename(song)
|
||||
if (name.startsWith('.')) {
|
||||
return this.__checkSong__()
|
||||
}
|
||||
let hash = crypto.md5Sign(song)
|
||||
if (LS.get(hash)) {
|
||||
return this.__checkSong__()
|
||||
}
|
||||
this.__NEW_NUM__++
|
||||
ID3(song).then(tag => {
|
||||
LS.insert({
|
||||
id: hash,
|
||||
title: tag.title,
|
||||
album: tag.album,
|
||||
artist: tag.artist,
|
||||
path: `file://${song}`,
|
||||
duration: tag.duration
|
||||
})
|
||||
this.__checkSong__()
|
||||
})
|
||||
})
|
||||
},
|
||||
refresh() {
|
||||
if (this.__load__) {
|
||||
return
|
||||
}
|
||||
if (appInit.musicPath) {
|
||||
this.__load__ = layer.load(4)
|
||||
this.__LIST__ = fs.ls('/Volumes/extends/music')
|
||||
this.__NEW_NUM__ = 0
|
||||
this.__checkSong__()
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@ export default Anot({
|
|||
$id: 'profile',
|
||||
state: {
|
||||
setting: {
|
||||
autoPlay: appInit.autoPlay,
|
||||
allowPlayOnBack: appInit.allowPlayOnBack,
|
||||
autoLrc: appInit.autoLrc,
|
||||
theme: appInit.theme || 1,
|
||||
musicPath: appInit.musicPath
|
||||
|
|
@ -58,7 +58,9 @@ export default Anot({
|
|||
|
||||
Object.assign(appInit, setting)
|
||||
|
||||
fs.echo(JSON.stringify(appInit, '', 2), APP_INI_PATH)
|
||||
let cache = JSON.stringify(appInit, '', 2)
|
||||
fs.echo(cache, APP_INI_PATH)
|
||||
Anot.ss('app-init', cache)
|
||||
|
||||
layer.toast('保存成功')
|
||||
}
|
||||
|
|
|
|||
11
main.js
11
main.js
|
|
@ -1,4 +1,4 @@
|
|||
const { app, BrowserWindow, protocol } = require('electron')
|
||||
const { app, BrowserWindow, protocol, Tray } = require('electron')
|
||||
const path = require('path')
|
||||
const fs = require('iofs')
|
||||
const log = console.log
|
||||
|
|
@ -16,6 +16,7 @@ const MIME_TYPES = {
|
|||
}
|
||||
|
||||
let win = null
|
||||
let tray = null
|
||||
|
||||
function createWindow() {
|
||||
// 创建浏览器窗口
|
||||
|
|
@ -53,6 +54,14 @@ app.on('ready', () => {
|
|||
let buf = fs.cat(path.resolve(ROOT, file))
|
||||
cb({ data: buf, mimeType: MIME_TYPES[ext] })
|
||||
})
|
||||
|
||||
tray = new Tray('./images/trays/trayTemplate.png')
|
||||
|
||||
tray.on('click', _ => {
|
||||
win.show()
|
||||
})
|
||||
|
||||
createWindow()
|
||||
win.tray = tray
|
||||
win.webContents.openDevTools()
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<div class="do-mod-local" anot="local">
|
||||
<div class="toolbar">
|
||||
本地音乐({{list.length}}首)<span class="refresh">重新扫描</span>
|
||||
本地音乐({{list.length}}首)<span class="refresh" :click="refresh">重新扫描</span>
|
||||
</div>
|
||||
|
||||
<div class="table">
|
||||
|
|
|
|||
|
|
@ -5,9 +5,9 @@
|
|||
</h3>
|
||||
|
||||
<section class="block">
|
||||
<span class="label">app启动自动播放</span>
|
||||
<span class="label">允许后台播放</span>
|
||||
<div class="field">
|
||||
<anot-switch :value="setting.autoPlay"></anot-switch>
|
||||
<anot-switch :value="setting.allowPlayOnBack"></anot-switch>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
|
|
|||
Reference in New Issue