* c2lc

* fix typo

* text formatting

---------

Co-authored-by: booploops <49113086+booploops@users.noreply.github.com>
This commit is contained in:
yazninja 2023-05-12 20:55:44 +03:00 committed by GitHub
parent 3e99848ab7
commit ba7999af34
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 419 additions and 202 deletions

View file

@ -1,28 +1,29 @@
<div class="app-navigation" v-cloak>
<div
class="app-navigation"
v-cloak>
<transition name="wpfade">
<div class="usermenu-container" v-if="chrome.menuOpened">
<div
class="usermenu-container"
v-if="chrome.menuOpened">
<div class="usermenu-body">
<button class="app-sidebar-button" style="width: 100%" @click="appRoute('apple-account-settings')">
<img class="sidebar-user-icon" loading="lazy"
<button
class="app-sidebar-button"
style="width: 100%"
@click="appRoute('apple-account-settings')">
<img
class="sidebar-user-icon"
loading="lazy"
:src="getMediaItemArtwork(chrome.hideUserInfo ? './assets/logocut.png' : (chrome.userinfo.attributes['artwork'] ? chrome.userinfo.attributes['artwork']['url'] : ''), 26)" />
<div class="sidebar-user-text" v-if="!chrome.hideUserInfo">
<div
class="sidebar-user-text"
v-if="!chrome.hideUserInfo">
<template v-if="chrome.userinfo.id || mk.isAuthorized">
<div class="fullname text-overflow-elipsis">
{{
chrome.userinfo != null &&
chrome.userinfo.attributes != null
? chrome.userinfo.attributes.name ?? ""
: ""
}}
{{ chrome.userinfo != null && chrome.userinfo.attributes != null ? chrome.userinfo.attributes.name ?? "" : "" }}
</div>
<div class="handle-text text-overflow-elipsis">
{{
chrome.userinfo != null &&
chrome.userinfo.attributes != null
? chrome.userinfo.attributes.handle ?? ""
: ""
}}
{{ chrome.userinfo != null && chrome.userinfo.attributes != null ? chrome.userinfo.attributes.handle ?? "" : "" }}
</div>
</template>
<template v-else>
@ -31,88 +32,102 @@
</div>
</template>
</div>
<div class="sidebar-user-text" v-else>
<div
class="sidebar-user-text"
v-else>
{{ $root.getLz("app.name") }}
</div>
</button>
<!-- Use 20px SVG for usermenu icon -->
<button class="usermenu-item" v-if="cfg.general.privateEnabled" @click="cfg.general.privateEnabled = false">
<span class="usermenu-item-icon">
<%- include("../svg/x.svg") %>
</span>
<span class="usermenu-item-name">{{
$root.getLz("term.disablePrivateSession")
}}</span>
<button
class="usermenu-item"
v-if="cfg.general.privateEnabled"
@click="cfg.general.privateEnabled = false">
<span class="usermenu-item-icon"> <%- include("../svg/x.svg") %> </span>
<span class="usermenu-item-name">{{ $root.getLz("term.disablePrivateSession") }}</span>
</button>
<button class="usermenu-item" @click="appRoute('remote-pair')">
<span class="usermenu-item-icon">
<%- include("../svg/smartphone.svg") %>
</span>
<span class="usermenu-item-name">{{
$root.getLz("action.showWebRemoteQR")
}}</span>
<button
class="usermenu-item"
@click="appRoute('remote-pair')">
<span class="usermenu-item-icon"> <%- include("../svg/smartphone.svg") %> </span>
<span class="usermenu-item-name">{{ $root.getLz("action.showWebRemoteQR") }}</span>
</button>
<button class="usermenu-item" @click="modals.castMenu = true">
<span class="usermenu-item-icon">
<%- include("../svg/cast.svg") %>
</span>
<span class="usermenu-item-name">{{
$root.getLz("term.cast")
}}</span>
<button
class="usermenu-item"
@click="modals.castMenu = true">
<span class="usermenu-item-icon"> <%- include("../svg/cast.svg") %> </span>
<span class="usermenu-item-name">{{ $root.getLz("term.cast") }}</span>
</button>
<button class="usermenu-item" @click="modals.audioSettings = true">
<span class="usermenu-item-icon">
<%- include("../svg/headphones.svg") %>
</span>
<span class="usermenu-item-name">{{
$root.getLz("term.audioSettings")
}}</span>
<button
class="usermenu-item"
@click="modals.audioSettings = true">
<span class="usermenu-item-icon"> <%- include("../svg/headphones.svg") %> </span>
<span class="usermenu-item-name">{{ $root.getLz("term.audioSettings") }}</span>
</button>
<button class="usermenu-item" v-if="pluginInstalled" @click="modals.pluginMenu = true">
<span class="usermenu-item-icon">
<button
class="usermenu-item"
v-if="pluginInstalled"
@click="modals.pluginMenu = true">
<span class="usermenu-item-icon"> <%- include("../svg/grid.svg") %> </span>
<span class="usermenu-item-name">{{ $root.getLz("term.plugin") }}</span>
</button>
<button
class="usermenu-item"
@click="appRoute('about')">
<span class="usermenu-item-icon"> <%- include("../svg/info.svg") %> </span>
<span class="usermenu-item-name">{{ $root.getLz("term.about") }}</span>
</button>
<button
class="usermenu-item"
@click="modals.settings = true">
<span class="usermenu-item-icon"> <%- include("../svg/settings.svg") %> </span>
<span class="usermenu-item-name">{{ $root.getLz("term.settings") }}</span>
</button>
<button
class="usermenu-item"
v-for="entry in $root.pluginMenuTopEntries"
@click="entry.onClick()">
<span
class="usermenu-item-icon"
style="right: 2.5px">
<%- include("../svg/grid.svg") %>
</span>
<span class="usermenu-item-name">{{
$root.getLz("term.plugin")
}}</span>
<span class="usermenu-item-name">{{ entry.name }}</span>
</button>
<button class="usermenu-item" @click="appRoute('about')">
<span class="usermenu-item-icon">
<%- include("../svg/info.svg") %>
</span>
<span class="usermenu-item-name">{{
$root.getLz("term.about")
}}</span>
</button>
<button class="usermenu-item" @click="modals.settings = true">
<span class="usermenu-item-icon">
<%- include("../svg/settings.svg") %>
</span>
<span class="usermenu-item-name">{{
$root.getLz("term.settings")
}}</span>
</button>
<button class="usermenu-item" v-for="entry in $root.pluginMenuTopEntries" @click="entry.onClick()">
<span class="usermenu-item-icon" style="right: 2.5px">
<%- include("../svg/grid.svg") %>
</span>
<span class="usermenu-item-name">{{entry.name}}</span>
</button>
<button class="usermenu-item" @click="unauthorize()">
<span class="usermenu-item-icon" style="right: 2.5px">
<button
class="usermenu-item"
@click="unauthorize()">
<span
class="usermenu-item-icon"
style="right: 2.5px">
<%- include("../svg/log-out.svg") %>
</span>
<span class="usermenu-item-name">{{
$root.getLz("term.logout")
}}</span>
<span class="usermenu-item-name">{{ $root.getLz("term.logout") }}</span>
</button>
<button class="usermenu-item" @click="quit()">
<span class="usermenu-item-icon" style="right: 2.5px">
<button
class="usermenu-item"
@click="quit()">
<span
class="usermenu-item-icon"
style="right: 2.5px">
<%- include("../svg/x.svg") %>
</span>
<span class="usermenu-item-name">{{
$root.getLz("term.quit")
}}</span>
<span class="usermenu-item-name">{{ $root.getLz("term.quit") }}</span>
</button>
<button
v-if="!chrome.noC2Upgrade"
class="usermenu-item"
@click="c2offer()">
<span
class="usermenu-item-icon"
style="right: 1.5px">
<img
class="sidebar-user-icon"
loading="lazy"
style="height: 16px; width: 16px"
src="./assets/logocut.png" />
</span>
<span class="usermenu-item-name">Cider 2 Upgrade</span>
</button>
</div>
</div>
@ -122,30 +137,48 @@
</transition>
<app-content-area></app-content-area>
<transition name="drawertransition">
<div class="app-drawer"
<div
class="app-drawer"
v-if="drawer.open && drawer.panel == 'lyrics' && lyrics && lyrics != [] && lyrics.length > 0">
<div class="bgArtworkMaterial">
<div class="bg-artwork-container">
<img v-if="(cfg.visual.bg_artwork_rotation && animateBackground)" class="bg-artwork a"
:src="$store.state.artwork.playerLCD">
<img v-if="(cfg.visual.bg_artwork_rotation && animateBackground)" class="bg-artwork b"
:src="$store.state.artwork.playerLCD">
<img v-if="!(cfg.visual.bg_artwork_rotation && animateBackground)" class="bg-artwork no-animation"
:src="$store.state.artwork.playerLCD">
<img
v-if="(cfg.visual.bg_artwork_rotation && animateBackground)"
class="bg-artwork a"
:src="$store.state.artwork.playerLCD" />
<img
v-if="(cfg.visual.bg_artwork_rotation && animateBackground)"
class="bg-artwork b"
:src="$store.state.artwork.playerLCD" />
<img
v-if="!(cfg.visual.bg_artwork_rotation && animateBackground)"
class="bg-artwork no-animation"
:src="$store.state.artwork.playerLCD" />
</div>
</div>
<lyrics-view v-if="drawer.panel == 'lyrics'" :time="mk.currentPlaybackTime - lyricOffset" :lyrics="lyrics"
<lyrics-view
v-if="drawer.panel == 'lyrics'"
:time="mk.currentPlaybackTime - lyricOffset"
:lyrics="lyrics"
:richlyrics="richlyrics"></lyrics-view>
<div v-if="drawer.panel == 'lyrics'" class="lyric-footer">
<button class="md-btn" @click="modularUITest(!fullscreenLyrics)">{{fullscreenLyrics ?
$root.getLz('term.defaultView'): $root.getLz('term.fullscreenView')}}
<div
v-if="drawer.panel == 'lyrics'"
class="lyric-footer">
<button
class="md-btn"
@click="modularUITest(!fullscreenLyrics)">
{{ fullscreenLyrics ? $root.getLz("term.defaultView") : $root.getLz("term.fullscreenView") }}
</button>
</div>
</div>
</transition>
<transition name="drawertransition">
<div class="app-drawer" v-if="drawer.open && drawer.panel == 'queue'">
<cider-queue ref="queue" v-if="drawer.panel == 'queue'"></cider-queue>
<div
class="app-drawer"
v-if="drawer.open && drawer.panel == 'queue'">
<cider-queue
ref="queue"
v-if="drawer.panel == 'queue'"></cider-queue>
</div>
</transition>
</div>