This repository has been archived on 2023-08-30. You can view files and clone it, but cannot push or open issues/pull-requests.
appcat
/
sonist
Archived
1
0
Fork 0
Code Issues Pull Requests Wiki Activity

优化桌面歌词

2.x
宇天 2019-01-27 00:32:06 +08:00
parent ac2daedc1b
commit f9eddcec1c
6 changed files with 26 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/css/app.scss
View File

@ -266,7 +266,7 @@
&:nth-child(6) {animation:play 1.5s linear infinite;} &:nth-child(6) {animation:play 1.5s linear infinite;}
&:nth-child(7) {background-image:url(/images/load2.png);animation:load2 2.5s linear infinite;} &:nth-child(7) {background-image:url(/images/load2.png);animation:load2 2.5s linear infinite;}
} }
cite {font-size:2.4rem} cite {font-size:2.4rem;}
} }
} }

2
src/css/desktop-lrc.css
View File

@ -1 +1 @@
body{background:transparent}body .lrc-box{position:absolute;left:0;top:0;display:flex;flex-flow:column wrap;width:100%;height:100%;padding:0 5rem;line-height:5rem;color:#fff;font-size:3rem}body .lrc-box section{flex:1;display:flex}body .lrc-box section.left{justify-content:flex-start}body .lrc-box section.right{justify-content:flex-end}body .lrc-box section span{-webkit-background-clip:text !important;background-clip:text !important;color:transparent}body .lrc-box section span.shadow{text-shadow:0 0 0.5rem rgba(0,0,0,0.5)}body .touch-bar{position:absolute;left:0;top:0;z-index:9;width:100%;height:2rem}body .quit,body .lock{visibility:hidden;position:absolute;right:1rem;top:.5rem;font-size:1.8rem;font-weight:bold}body .quit:hover,body .lock:hover{color:#ff5061}body .lock{right:4rem}body .lock.active{color:#dae1e9}body:hover{background:rgba(29,35,44,0.2)}body:hover .quit,body:hover .lock{visibility:visible} body{background:transparent}body .lrc-box{position:absolute;left:0;top:0;display:flex;flex-flow:column wrap;width:100%;height:100%;padding:0 5rem;line-height:5rem;color:#fff;font-size:3rem}body .lrc-box section{flex:1;display:flex}body .lrc-box section.left{justify-content:flex-start}body .lrc-box section.right{justify-content:flex-end}body .lrc-box section span{-webkit-background-clip:text !important;background-clip:text !important;color:transparent}body .lrc-box section span.shadow{text-shadow:0 0 0.5rem rgba(0,0,0,0.5)}body .touch-bar{position:absolute;left:0;top:0;z-index:9;width:100%;height:2rem}body .quit,body .lock{visibility:hidden;position:absolute;right:1rem;top:.5rem;font-size:1.8rem;font-weight:bold}body .quit:hover,body .lock:hover{color:#ff5061}body .quit:active,body .lock:active{color:#ffb618}body .lock{right:4rem}body .lock.active{color:#3fc2a7}body:hover{background:rgba(29,35,44,0.2)}body:hover .quit,body:hover .lock{visibility:visible}

3
src/css/desktop-lrc.scss
View File

@ -31,10 +31,11 @@ body {background:transparent;
.quit, .quit,
.lock {visibility:hidden;position:absolute;right:1rem;top:.5rem;font-size:1.8rem;font-weight:bold; .lock {visibility:hidden;position:absolute;right:1rem;top:.5rem;font-size:1.8rem;font-weight:bold;
&:hover {color:nth($cr, 1)} &:hover {color:nth($cr, 1)}
&:active {color:nth($co, 1)}
} }
.lock {right:4rem; .lock {right:4rem;
&.active {color:nth($cp, 3)} &.active {color:nth($ct, 1)}
} }

9
src/desktop-lrc.html
View File

@ -9,7 +9,7 @@
<script>window.LIBS_BASE_URL = location.origin + '/lib';</script> <script>window.LIBS_BASE_URL = location.origin + '/lib';</script>
<script type="module" src="js/desktop-lrc.js"></script> <script type="module" src="js/desktop-lrc.js"></script>
</head> </head>
<body class="do-fn-noselect" anot="lrc"> <body class="do-fn-noselect" :class="{'do-fn-drag': isMac || !isLock}" anot="lrc">
<div class="lrc-box"> <div class="lrc-box">
<section class="left"> <section class="left">
<span class="shadow" :text="lrc.l.txt"></span> <span class="shadow" :text="lrc.l.txt"></span>
@ -27,9 +27,10 @@
</section> </section>
</div> </div>
<div class="touch-bar do-fn-drag">
<a class="do-icon-lock lock do-fn-nodrag" :class="{active: isLock}" :click="lock"></a> <div class="touch-bar do-fn-nodrag">
<a class="do-icon-close quit do-fn-nodrag" :click="quit"></a> <a class="do-icon-lock lock" :class="{active: isLock}" :click="lock"></a>
<a class="do-icon-close quit" :click="quit"></a>
</div> </div>
</body> </body>
</html> </html>

2
src/js/app.js
View File

@ -52,6 +52,8 @@ Anot.ss('app-init', appInit)
const LRC_WIN = createDesktopLrcWindow(MAIN_SCREEN) const LRC_WIN = createDesktopLrcWindow(MAIN_SCREEN)
const MINI_WIN = createMiniWindow(MAIN_SCREEN, WIN) const MINI_WIN = createMiniWindow(MAIN_SCREEN, WIN)
// LRC_WIN.showInactive()
Anot({ Anot({
$id: 'app', $id: 'app',
state: { state: {

18
src/js/desktop-lrc.js
View File

@ -12,28 +12,40 @@ const { remote } = require('electron')
const WIN = remote.getCurrentWindow() const WIN = remote.getCurrentWindow()
const $doc = Anot(document)
const log = console.log
window.WIN = WIN
Anot({ Anot({
$id: 'lrc', $id: 'lrc',
state: { state: {
isMac: process.platform === 'darwin',
lrc: { lrc: {
l: { bg: '#fff', txt: '暂无歌词...' }, l: { bg: '#fff', txt: '暂无歌词...' },
r: { bg: '', txt: '' } r: { bg: '', txt: '' }
}, },
isLock: false isLock: JSON.parse(Anot.ss('lock'))
}, },
mounted() { mounted() {
WIN.openDevTools()
WIN.on('ktv-lrc', lrc => { WIN.on('ktv-lrc', lrc => {
this.lrc = lrc this.lrc = lrc
}) })
}, },
skip: ['isMac'],
methods: { methods: {
quit(force) { quit(force) {
// WIN.close()
WIN.hide() WIN.hide()
}, },
lock() { lock() {
WIN.setMovable(this.isLock)
this.isLock = !this.isLock this.isLock = !this.isLock
Anot.ss('lock', this.isLock)
if (this.isMac) {
WIN.setMovable(!this.isLock)
} else {
// location.reload()
}
} }
} }
}) })