okseby/orchard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

added framework for c2 parity

Browse source
This commit is contained in:
booploops 2022-07-20 23:22:43 -07:00
parent a0b6a85ee2
commit 94a1cabf30
30 changed files with 17188 additions and 78 deletions
Download patch file Download diff file Expand all files Collapse all files

481
src/renderer/less/helpers.css Normal file
View file

@ -0,0 +1,481 @@
.notyf__toast {
-webkit-app-region: no-drag;
cursor: pointer;
}
.notyf-info {
background: var(--keyColor);
}
.tooltip-inner {
background: #2f2f2f;
opacity: 1;
border: 1px solid rgba(0, 0, 0, 0.35);
transition: all 0.3s ease-in-out;
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.25);
}
.modal-fullscreen {
display: flex;
justify-content: center;
align-items: center;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.3);
z-index: 1000;
}
.modal-fullscreen .modal-window {
background: #333;
border-radius: 10px;
box-shadow: var(--mediaItemShadow-Shadow);
display: flex;
flex-flow: column;
max-height: 500px;
max-width: 360px;
background: #121212;
width: 100%;
position: relative;
}
.modal-fullscreen .modal-window:after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
box-shadow: var(--mediaItemShadow);
z-index: 1;
border-radius: inherit;
}
.modal-fullscreen .modal-window .modal-header {
width: 100%;
padding: 6px;
}
.modal-fullscreen .modal-window .modal-content {
width: 100%;
height: 100%;
overflow: hidden;
overflow-y: overlay;
}
.spatialproperties-panel .modal-window {
overflow: hidden;
}
.spatialproperties-panel .modal-window:not(.airplay-modal) {
height: 700px;
max-height: 700px;
width: 800px;
max-width: 800px;
}
.spatialproperties-panel .modal-window .info-header {
padding-left: 12px;
}
.spatialproperties-panel .modal-window .visual-container {
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
}
.spatialproperties-panel .modal-window .visual {
position: relative;
height: 250px;
width: 300px;
display: inline-flex;
align-items: flex-end;
justify-content: center;
filter: drop-shadow(2px 12px 6px rgba(0, 0, 0, 0.25));
margin: 0 auto;
}
.spatialproperties-panel .modal-window .visual .face {
position: absolute;
width: calc(12px * 6);
height: calc(12px * 6);
border-radius: 6px;
transform: rotateX(60deg) rotateZ(-45deg);
transition: transform 0.2s linear, width 0.2s linear, height 0.2s linear;
}
.spatialproperties-panel .modal-window .visual .listener {
position: absolute;
width: 32px;
height: 32px;
border-radius: 6px;
transform: rotateX(60deg) rotateZ(-45deg);
transition: transform 0.2s linear, width 0.2s linear, height 0.2s linear;
background: white;
color: black;
z-index: 2;
}
.spatialproperties-panel .modal-window .visual .audiosource {
position: absolute;
width: 32px;
height: 32px;
border-radius: 6px;
transform: rotateX(60deg) rotateZ(-45deg);
transition: transform 0.2s linear, width 0.2s linear, height 0.2s linear;
background: yellow;
z-index: 2;
}
.spatialproperties-panel .modal-window .visual .face:nth-of-type(1) {
background: linear-gradient(45deg, #28223a, #1f2038);
z-index: 1;
}
.spatialproperties-panel .modal-window .visual .face:nth-of-type(2) {
background: linear-gradient(45deg, #7d53ad, #5763ff);
transform: rotateX(60deg) rotateZ(-45deg) translateZ(30px);
opacity: 0.7;
z-index: 3;
}
.spatialproperties-panel .modal-window .modal-header {
padding: 16px;
position: relative;
overflow: hidden;
}
.spatialproperties-panel .modal-window .modal-header .modal-title {
text-align: center;
}
.spatialproperties-panel .modal-window .modal-header .close-btn {
width: 36px;
height: 36px;
background-position: center;
background-repeat: no-repeat;
-webkit-app-region: no-drag;
appearance: none;
border: 0;
background-color: transparent;
position: absolute;
top: 10px;
right: 10px;
border-radius: 50px;
display: grid;
align-content: center;
}
.spatialproperties-panel .modal-window .modal-header .close-btn:before {
content: "";
font-family: "codicon";
color: var(--textColor);
font-size: 20px;
}
.spatialproperties-panel .modal-window .modal-header .close-btn:hover {
background-color: #c42b1c;
}
.addtoplaylist-panel .modal-window {
max-height: 600px;
max-width: 400px;
background: rgba(18, 18, 18, 0.9);
overflow: hidden;
backdrop-filter: blur(16px) saturate(180%);
}
.addtoplaylist-panel .modal-window .modal-header {
padding: 16px;
position: relative;
}
.addtoplaylist-panel .modal-window .modal-header .modal-title {
text-align: center;
}
.addtoplaylist-panel .modal-window .modal-header .close-btn {
width: 36px;
height: 36px;
background-position: center;
background-repeat: no-repeat;
-webkit-app-region: no-drag;
appearance: none;
border: 0;
background-color: transparent;
position: absolute;
top: 10px;
right: 10px;
border-radius: 50px;
display: grid;
align-content: center;
}
.addtoplaylist-panel .modal-window .modal-header .close-btn:before {
content: "";
font-family: "codicon";
color: var(--textColor);
font-size: 20px;
}
.addtoplaylist-panel .modal-window .modal-header .close-btn:hover {
background-color: #c42b1c;
}
.addtoplaylist-panel .modal-window .modal-search {
width: 100%;
padding: 0px 16px;
position: relative;
}
.addtoplaylist-panel .modal-window .playlist-item {
appearance: none;
border: 0px;
text-align: left;
width: 100%;
margin: 0;
display: flex;
background: rgba(32, 32, 32, 0.46);
color: #eee;
font-family: inherit;
font-size: 0.98em;
padding: 6px 12px;
align-items: center;
flex-flow: row;
}
.addtoplaylist-panel .modal-window .playlist-item .icon {
pointer-events: none;
width: 32px;
height: 32px;
display: flex;
justify-content: center;
align-items: center;
margin-right: 6px;
}
.addtoplaylist-panel .modal-window .playlist-item .name {
position: relative;
}
.addtoplaylist-panel .modal-window .playlist-item:hover {
background: var(--selected);
}
.addtoplaylist-panel .modal-window .playlist-item:active {
background: var(--selected-click);
}
.addtoplaylist-panel .modal-window .playlist-item.focused {
background: var(--keyColor);
}
.addtoplaylist-panel .modal-window .playlist-item:last-child {
border-bottom: 0px;
}
.menu-panel {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 100001;
display: flex;
justify-content: center;
align-items: center;
-webkit-app-region: no-drag;
}
.menu-panel .menu-header-body {
padding: 6px;
display: flex;
background: rgba(200, 200, 200, 0.1);
}
.menu-panel .menu-header-body .menu-option-header {
width: 40px;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
border-radius: var(--mediaItemRadius);
appearance: none;
border: 0;
background: transparent;
}
.menu-panel .menu-header-body .menu-option-header.active .sidebar-icon > .svg-icon {
--color: var(--keyColor);
}
.menu-panel .menu-header-body .menu-option-header:hover {
background: var(--selected);
}
.menu-panel .menu-header-body .menu-option-header:active {
background: var(--selected-click);
}
.menu-panel .menu-panel-body {
display: flex;
flex-flow: column;
background: rgba(30, 30, 30, 0.45);
backdrop-filter: blur(32px) saturate(180%);
position: relative;
min-width: 200px;
box-shadow: var(--ciderShadow-Generic);
border-radius: var(--panelRadius);
overflow: hidden;
font-size: 13px;
}
.menu-panel .menu-panel-body .menu-option {
text-align: left;
display: flex;
appearance: none;
border: 0px;
font: inherit;
background: transparent;
color: inherit;
margin: 0 auto;
position: relative;
width: 100%;
padding: 9px 14px;
align-items: center;
}
.menu-panel .menu-panel-body .menu-option::before {
background: var(--hover);
border-radius: 6px;
content: "";
--sizeY: 3px;
--sizeX: 4px;
top: var(--sizeY);
left: var(--sizeX);
bottom: var(--sizeY);
right: var(--sizeX);
position: absolute;
opacity: 0;
transform: scale(0.98);
z-index: -1;
transition: transform 0.25s ease-out, opacity 0.25s ease-out;
}
.menu-panel .menu-panel-body .menu-option:hover::before {
transition: transform 0s ease-in, opacity 0s ease-in;
opacity: 1;
transform: scale(1);
}
.menu-panel .menu-panel-body .menu-option:active::before {
transition: transform 0.1s ease-in-out, opacity 0.1s ease-in-out;
opacity: 1;
transform: scale(0.98);
background: var(--selected-click);
}
.menu-panel .menu-header-text {
margin: 18px 6px;
}
.menu-panel .menu-header-text .close-btn {
width: 36px;
height: 36px;
background-position: center;
background-repeat: no-repeat;
-webkit-app-region: no-drag;
appearance: none;
border: 0;
background-color: transparent;
position: absolute;
top: 10px;
right: 10px;
border-radius: 50px;
display: grid;
align-content: center;
}
.menu-panel .menu-header-text .close-btn:before {
content: "";
font-family: "codicon";
color: var(--textColor);
font-size: 20px;
}
.menu-panel .menu-header-text .close-btn:hover {
background-color: #c42b1c;
}
.menu-panel .menu-body {
overflow: overlay;
height: 100%;
display: flex;
flex-flow: column;
gap: 0px;
padding: 0px;
position: relative;
}
.menu-panel .menu-footer {
width: 100%;
padding: 12px;
}
.queue-panel {
height: 100%;
width: 100%;
display: flex;
flex-flow: column;
}
.queue-panel .queue-header-text {
margin: 18px 6px;
}
.queue-panel .queue-body {
overflow: overlay;
height: 100%;
}
.queue-panel .queue-footer {
width: 100%;
padding: 12px;
}
.queue-panel .autoplay {
background: rgba(200, 200, 200, 0.15);
display: flex;
justify-content: center;
appearance: none;
border: 0;
border-radius: 6px;
height: 32px;
width: 32px;
}
.queue-panel .infinity {
content: url("assets/infinity.svg");
margin: auto;
}
.moreinfo-modal .modal-window {
height: 70%;
max-height: 100%;
width: 45%;
max-width: 100%;
overflow: hidden;
line-height: 1.25;
}
.moreinfo-modal .modal-content {
padding: 1em;
font-size: 0.8rem;
}
.moreinfo-modal .modal-content br {
display: block;
/* makes it have a width */
content: "";
/* clears default height */
margin: 2em;
margin-bottom: -0.6rem;
}
.moreinfo-modal .modal-header {
flex-direction: column;
}
.moreinfo-modal .modal-header .modal-title {
text-align: unset !important;
width: 100%;
}
.moreinfo-modal .modal-header .modal-title:not(.modal-subtitle) {
font-size: 25px;
}
.mediainfo-popover {
user-select: none;
background-color: #000000;
overflow: hidden;
}
.mediainfo-popover .content .shadow-artwork {
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: -1;
filter: blur(32px) brightness(50%) saturate(280%);
}
.mediainfo-popover .content .popover-artwork {
width: 200px;
height: 200px;
margin: 0 auto;
margin-bottom: 20px;
}
.mediainfo-popover .content .song-name {
font-weight: 600;
}
.mediainfo-popover .content .song-artist,
.mediainfo-popover .content .song-album {
opacity: 0.75;
cursor: pointer;
}
.mediainfo-popover .content .song-artist:hover,
.mediainfo-popover .content .song-album:hover {
text-decoration: underline;
}
._svg-icon {
--icon: url("assets/chevron-left.svg");
--size: 1em;
width: var(--size);
height: var(--size);
-webkit-mask-image: var(--icon);
-webkit-mask-position: center;
-webkit-mask-size: contain;
background: rgba(255, 255, 255, 0.76);
-webkit-mask-repeat: no-repeat;
}
._svg-icon.svg-md {
--size: 1.2em;
}

2
src/renderer/less/helpers.less
View file

@ -518,7 +518,7 @@
background: rgb(255 255 255 / 76%);
-webkit-mask-repeat: no-repeat;
&.md {
&.svg-md {
--size: 1.2em;
}
}

1886
src/renderer/less/pages.css Normal file
View file

File diff suppressed because it is too large Load diff

2
src/renderer/less/pages.less
View file

@ -1332,7 +1332,7 @@
}
}
.row .col.flex-center {
.row .col.cider-flex-center {
z-index: 4;
}
}

14733
src/renderer/lib/quasar/quasar.min.css vendored Normal file
View file

File diff suppressed because it is too large Load diff

6
src/renderer/lib/quasar/quasar.umd.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

3
src/renderer/style.less
View file

@ -3,6 +3,7 @@
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100;300;400;500;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@100;300;400;500;700;900&display=swap");
@import url("lib/quasar/quasar.min.css");
@import url("less/appvars.less");
@import url("less/bootstrap-vue.min.less");
@import url("less/ameframework.less");
@ -1678,7 +1679,7 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
}
}
.flex-center {
.cider-flex-center {
display : flex;
align-items: center;
flex-wrap : wrap;

2
src/renderer/views/components/listennow-child.ejs
View file

@ -5,7 +5,7 @@
<div class="col">
<h3>{{ recom.attributes.title ? recom.attributes.title.stringForDisplay : " "}}</h3>
</div>
<div class="col-auto flex-center" v-if="recom.relationships.contents.data.length >= 10">
<div class="col-auto cider-flex-center" v-if="recom.relationships.contents.data.length >= 10">
<button class="cd-btn-seeall" @click="showCollection(recom)" >{{app.getLz('term.seeAll')}}</button>
</div>
</div>

8
src/renderer/views/components/queue.ejs
View file

@ -5,7 +5,7 @@
<h3 class="queue-header-text" v-if="page == 'queue'">{{app.getLz('term.queue')}}</h3>
<h3 class="queue-header-text" v-if="page == 'history'">{{app.getLz('term.history')}}</h3>
</div>
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<button class="autoplay" :style="{'background': app.mk.autoplayEnabled ? 'var(--keyColor)' : ''}"
@click="app.mk.autoplayEnabled = !app.mk.autoplayEnabled"
:title="app.getLz('term.autoplay')" v-b-tooltip.hover>
@ -25,7 +25,7 @@
@dblclick="playQueueItem(queueItem.item.id)" :key="position"
@contextmenu="selected = position;queueContext($event, queueItem.item, position)">
<div class="row">
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<div class="artwork">
<mediaitem-artwork :url="queueItem.item.attributes.artwork ? queueItem.item.attributes.artwork.url : ''" :size="32"></mediaitem-artwork>
</div>
@ -34,11 +34,11 @@
<div class="queue-title text-overflow-elipsis">{{ queueItem.item.attributes.name }}</div>
<div class="queue-subtitle text-overflow-elipsis">{{ queueItem.item.attributes.artistName }} — {{ queueItem.item.attributes.albumName }}</div>
</div>
<div class="queue-explicit-icon flex-center" v-if="queueItem.item.attributes.contentRating == 'explicit'">
<div class="queue-explicit-icon cider-flex-center" v-if="queueItem.item.attributes.contentRating == 'explicit'">
<div class="explicit-icon"></div>
</div>
<div class="col queue-duration-info">
<div class="queue-duration flex-center">{{convertTimeToString(queueItem.item.attributes.durationInMillis)}}</div>
<div class="queue-duration cider-flex-center">{{convertTimeToString(queueItem.item.attributes.durationInMillis)}}</div>
</div>
</div>
</div>

8
src/renderer/views/components/settings-plugins-github.ejs
View file

@ -5,7 +5,7 @@
<div class="col nopadding">
<h1 class="header-text">{{$root.getLz('settings.header.visual.plugin.github.page')}}</h1>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto nopadding cider-flex-center">
<button class="md-btn md-btn-small md-btn-block" @click="installThemeURL()">
{{$root.getLz('settings.option.visual.plugin.github.download')}}
</button>
@ -19,7 +19,7 @@
:style="{'background': (repo.id == openRepo.id) ? 'var(--keyColor)' : '', 'border-radius': '5px'}"
v-for="repo in repos">
<div class="row">
<div class="col flex-center">
<div class="col cider-flex-center">
<div>
<h4 class="repo-name">{{ (repo.description != null) ? repo.description : repo.full_name }}</h4>
<div>⭐ {{ repo.stargazers_count }}</div>
@ -33,7 +33,7 @@
<div class="github-preview" v-if="openRepo.full_name">
<div class="gh-preview-header">
<div class="row nopadding">
<div class="col nopadding flex-center">
<div class="col nopadding cider-flex-center">
<div>
<h3 class="repo-preview-name">{{ openRepo.description }}</h3>
<div>
@ -43,7 +43,7 @@
<div>⭐ {{ openRepo.stargazers_count }}</div>
</div>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto nopadding cider-flex-center">
<button class="md-btn md-btn-primary" @click="installThemeRepo(openRepo)">
<span v-if="!themesInstalled.includes(openRepo.full_name)">{{$root.getLz('action.install')}}</span>
<span v-else>{{$root.getLz('action.update')}}</span>

12
src/renderer/views/components/settings-themes-github.ejs
View file

@ -5,17 +5,17 @@
<div class="col nopadding">
<h1 class="header-text">{{$root.getLz('settings.header.visual.theme.github.page')}}</h1>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto nopadding cider-flex-center">
<button class="md-btn md-btn-small md-btn-block" @click="$root.openSettingsPage('styles')">
{{$root.getLz('settings.option.visual.theme.manageStyles')}}
</button>
</div>
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<button class="md-btn md-btn-small md-btn-block" @click="$root.checkForThemeUpdates()">
{{ $root.getLz('settings.option.visual.theme.checkForUpdates') }}
</button>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto nopadding cider-flex-center">
<button class="md-btn md-btn-small md-btn-block" @click="installThemeURL()">
{{$root.getLz('settings.option.visual.theme.github.download')}}
</button>
@ -29,7 +29,7 @@
:style="{'background': (repo.id == openRepo.id) ? 'var(--keyColor)' : ''}"
v-for="repo in repos">
<div class="row">
<div class="col flex-center">
<div class="col cider-flex-center">
<div>
<h4 class="repo-name">{{ (repo.description != null) ? repo.description :
repo.full_name }}</h4>
@ -48,7 +48,7 @@
<div class="github-preview" v-if="openRepo.full_name">
<div class="gh-preview-header">
<div class="row nopadding">
<div class="col nopadding flex-center">
<div class="col nopadding cider-flex-center">
<div>
<h3 class="repo-preview-name">{{ openRepo.description }}</h3>
<div>
@ -59,7 +59,7 @@
<div>⭐ {{ openRepo.stargazers_count }}</div>
</div>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto nopadding cider-flex-center">
<button class="md-btn md-btn-primary" @click="installThemeRepo(openRepo)">
<span v-if="!themesInstalled.includes(openRepo.full_name.toLowerCase())">{{$root.getLz('action.install')}}</span>
<span v-else>{{$root.getLz('action.update')}}</span>

6
src/renderer/views/components/settings-themes.ejs
View file

@ -7,17 +7,17 @@
{{ $root.getLz("settings.option.visual.theme.manageStyles") }}
</h1>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto nopadding cider-flex-center">
<button class="md-btn md-btn-small md-btn-block" @click="$root.openSettingsPage('github-themes')">
{{$root.getLz('settings.option.visual.theme.github.explore')}}
</button>
</div>
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<button class="md-btn md-btn-small md-btn-block" @click="$root.checkForThemeUpdates()">
{{ $root.getLz('settings.option.visual.theme.checkForUpdates') }}
</button>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto nopadding cider-flex-center">
<button class="md-btn md-btn-small md-btn-block" @click="openThemesFolder()">
{{$root.getLz('settings.option.visual.theme.github.openfolder')}}
</button>

18
src/renderer/views/components/settings-window.ejs
View file

@ -11,7 +11,7 @@
<b-tab>
<template #title>
<div>
<svg-icon url="./assets/settings.svg" classes="md" name="settings-general"/>
<svg-icon url="./assets/settings.svg" classes="svg-md" name="settings-general"/>
</div>
<div>
{{ $root.getLz('settings.header.general') }}
@ -279,7 +279,7 @@
<b-tab>
<template #title>
<div>
<svg-icon url="./assets/feather/headphones.svg" classes="md" name="settings-audio"/>
<svg-icon url="./assets/feather/headphones.svg" classes="svg-md" name="settings-audio"/>
</div>
<div>
{{ $root.getLz('settings.header.audio') }}
@ -422,7 +422,7 @@
<b-tab v-if="app.cfg.advanced.AudioContext">
<template #title>
<div>
<svg-icon url="./assets/feather/zap.svg" classes="md" name="settings-audiolabs"/>
<svg-icon url="./assets/feather/zap.svg" classes="svg-md" name="settings-audiolabs"/>
</div>
<div>
{{ $root.getLz('settings.option.audio.audioLab') }}
@ -435,7 +435,7 @@
<b-tab>
<template #title>
<div>
<svg-icon url="./assets/feather/style.svg" classes="md" name="settings-styles"/>
<svg-icon url="./assets/feather/style.svg" classes="svg-md" name="settings-styles"/>
</div>
<div>
{{ $root.getLz('settings.header.visual.styles') }}
@ -448,7 +448,7 @@
<b-tab>
<template #title>
<div>
<svg-icon url="./assets/feather/pen-tool.svg" classes="md" name="settings-visual"/>
<svg-icon url="./assets/feather/pen-tool.svg" classes="svg-md" name="settings-visual"/>
</div>
<div>
{{ $root.getLz('settings.header.visual') }}
@ -714,7 +714,7 @@
<b-tab>
<template #title>
<div>
<svg-icon url="./assets/feather/plugins.svg" classes="md" name="settings-plugins"/>
<svg-icon url="./assets/feather/plugins.svg" classes="svg-md" name="settings-plugins"/>
</div>
<div>
{{ $root.getLz('term.plugins') }}
@ -727,7 +727,7 @@
<b-tab>
<template #title>
<div>
<svg-icon url="./assets/feather/mic.svg" classes="md" name="settings-lyrics"/>
<svg-icon url="./assets/feather/mic.svg" classes="svg-md" name="settings-lyrics"/>
</div>
<div>
{{ $root.getLz('settings.header.lyrics') }}
@ -871,7 +871,7 @@
<b-tab>
<template #title>
<div>
<svg-icon url="./assets/feather/radio.svg" classes="md" name="settings-connectivity"/>
<svg-icon url="./assets/feather/radio.svg" classes="svg-md" name="settings-connectivity"/>
</div>
<div>
{{ $root.getLz('settings.header.connectivity') }}
@ -1072,7 +1072,7 @@
<b-tab>
<template #title>
<div>
<svg-icon url="./assets/feather/hard-drive.svg" classes="md" name="settings-advanced"/>
<svg-icon url="./assets/feather/hard-drive.svg" classes="svg-md" name="settings-advanced"/>
</div>
<div>
{{$root.getLz('settings.header.advanced')}}

17
src/renderer/views/main.ejs
View file

@ -19,18 +19,12 @@
<!-- <link rel="stylesheet/less" type="text/css" id="userTheme" href="themes/default.less"/>-->
<script src="./lib/less.js"></script>
<script src="<%- (env.dev ? " ./lib/vue.js" : "./lib/vue.dev.js") %>"></script>
<script src="./lib/vue-horizontal.js"></script>
<script src="./lib/smoothscroll.js"></script>
<script src="./lib/vuex.min.js"></script>
<script src="./lib/sortable.min.js"></script>
<script src="./lib/vue-observe-visibility.min.js"></script>
<script src="./lib/vuedraggable.umd.min.js"></script>
<link rel="manifest" href="./manifest.json?v=2">
<script src="https://js-cdn.music.apple.com/hls.js/2.141.0/hls.js/hls.js"></script>
<script src="hlscider.js"></script>
<script src="./lib/jquery-3.2.1.slim.min.js"></script>
<script src="./lib/popper.min.js"></script>
<script src="./lib/bootstrap-vue.min.js"></script>
<script src="./lib/bootstrap.min.js"></script>
<script src="./lib/bootbox.min.js"></script>
<script src="./lib/notyf.min.js"></script>
@ -39,7 +33,6 @@
<script src="./lib/fast-plural-rules.js"></script>
<script src="./lib/resonance-audio.min.js"></script>
<script src="./lib/stackblur.min.js"></script>
<script type="module" src="./main/app.js"></script>
<style>
#LOADER {
@ -69,6 +62,16 @@
<body class="notransparency" oncontextmenu="return false;" loading="1" os-release="<%= parseInt(env.osRelease) %>"
platform="<%= env.platform %>">
<script src="<%- (env.dev ? " ./lib/vue.js" : "./lib/vue.dev.js") %>"></script>
<script src="./lib/vue-horizontal.js"></script>
<script src="./lib/bootstrap-vue.min.js"></script>
<script src="./lib/vuex.min.js"></script>
<script src="./lib/sortable.min.js"></script>
<script src="./lib/vue-observe-visibility.min.js"></script>
<script src="./lib/vuedraggable.umd.min.js"></script>
<script src="./lib/quasar/quasar.umd.min.js"></script>
<script type="module" src="./main/app.js"></script>
<div id="LOADER">
<%- include("../assets/cider-round.svg") %>
</div>

2
src/renderer/views/pages/apple-curator.ejs
View file

@ -7,7 +7,7 @@
<div class="col" v-if="recom.attributes.name != 'Chart Set'">
<h3>{{ recom.attributes.name ?? ""}}</h3>
</div>
<div class="col-auto flex-center" v-if="index != 0 && recom.relationships && ((recom.relationships.children && recom.relationships.children.data.length > 10) || (recom.relationships.contents && recom.relationships.contents.data.length > 10))">
<div class="col-auto cider-flex-center" v-if="index != 0 && recom.relationships && ((recom.relationships.children && recom.relationships.children.data.length > 10) || (recom.relationships.contents && recom.relationships.contents.data.length > 10))">
<button class="cd-btn-seeall" @click="app.showCollection(recom.relationships.children ? recom.relationships.children : recom.relationships.contents, recom.attributes.name ?? '', 'listen_now')" >{{app.getLz('term.seeAll')}}</button>
</div>
</div>

2
src/renderer/views/pages/artist-feed.ejs
View file

@ -7,7 +7,7 @@
<div class="col nopadding">
<h3>{{app.getLz('home.followedArtists')}}</h3>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto nopadding cider-flex-center">
<button class="cd-btn-seeall" @click="syncFavorites()" v-if="!syncingFavs">{{app.getLz('home.syncFavorites')}}</button>
<div class="spinner" style="height: 26px;" v-else></div>
</div>

12
src/renderer/views/pages/artist.ejs
View file

@ -23,7 +23,7 @@
</button>
</div>
</div>
<div class="col flex-center artist-title"
<div class="col cider-flex-center artist-title"
:class="{'artist-animation-on': (data.attributes.editorialVideo && (data.attributes.editorialVideo.motionArtistWide16x9 || data.attributes.editorialVideo.motionArtistFullscreen16x9)) || hasHero() }"
:style="{ 'color': '#' +hasHeroObject()?.textColor1 ?? ''}"
>
@ -53,7 +53,7 @@
<div class="floating-header"
:style="{opacity: (headerVisible ? 0 : 1),'pointer-events': (headerVisible ? 'none' : '')}">
<div class="row">
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<button class="artist-play" style="display:block;" @click="app.mk.setStationQueue({artist:'a-'+data.id}).then(()=>{
app.mk.play()
})" :aria-label="app.getLz('term.play')"><%- include("../svg/play.svg") %></button>
@ -61,7 +61,7 @@
<div class="col">
<h3>{{ data.attributes.name }}</h3>
</div>
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<button class="more-btn-round menu" @click="artistMenu" :aria-label="app.getLz('term.more')">
<div class="svg-icon"></div>
</button>
@ -83,7 +83,7 @@
<div class="col" style="padding:0;">
<h3>{{app.getLz('term.topSongs')}}</h3>
</div>
<div class="col-auto flex-center" v-if="data.views['top-songs'].data.length >= 20"
<div class="col-auto cider-flex-center" v-if="data.views['top-songs'].data.length >= 20"
style="padding:0;">
<button class="cd-btn-seeall"
@click="app.showArtistView(data.id, data.attributes.name + ' - Top Songs', 'top-songs')">
@ -92,7 +92,7 @@
</div>
</div>
<div class="row">
<div class="col flex-center" style="padding:0;">
<div class="col cider-flex-center" style="padding:0;">
<div class="mediaitem-list-item__grid">
<listitem-horizontal :items="data.views['top-songs'].data.limit(20)">
</listitem-horizontal>
@ -112,7 +112,7 @@
data.views[view].attributes.title : "???"}}
</h3>
</div>
<div class="col-auto flex-center" v-if="data.views[view].data.length >= 10">
<div class="col-auto cider-flex-center" v-if="data.views[view].data.length >= 10">
<button class="cd-btn-seeall"
@click="app.showArtistView(data.id, data.attributes.name + ' - ' + data.views[view].attributes.title, view)">
{{app.getLz('term.seeAll')}}

2
src/renderer/views/pages/browse.ejs
View file

@ -7,7 +7,7 @@
<div class="col" v-if="recom.attributes.name != 'Chart Set'">
<h3>{{ recom.attributes.name ?? ""}}</h3>
</div>
<div class="col-auto flex-center" v-if="index != 0 && recom.relationships && ((recom.relationships.children && recom.relationships.children.data.length > 10) || (recom.relationships.contents && recom.relationships.contents.data.length > 10))">
<div class="col-auto cider-flex-center" v-if="index != 0 && recom.relationships && ((recom.relationships.children && recom.relationships.children.data.length > 10) || (recom.relationships.contents && recom.relationships.contents.data.length > 10))">
<button class="cd-btn-seeall" v-if="recom.relationships.room" @click="app.showRoom(recom.relationships.room?.data[0].href)" >{{app.getLz('term.seeAll')}}</button>
<button class="cd-btn-seeall" v-else @click="app.showCollection(recom.relationships.children ? recom.relationships.children : recom.relationships.contents, recom.attributes.name ?? '', 'listen_now')" >{{app.getLz('term.seeAll')}}</button>
</div>

12
src/renderer/views/pages/charts.ejs
View file

@ -6,7 +6,7 @@
<div class="col">
<h3>{{ songs.name ?? ""}}</h3>
</div>
<div class="col-auto flex-center" v-if="songs.data.length > 12">
<div class="col-auto cider-flex-center" v-if="songs.data.length > 12">
<button class="cd-btn-seeall" @click="app.showCollection((songs ?? []), songs.name ?? '', 'default')" >{{app.getLz('term.seeAll')}}</button>
</div>
</div>
@ -20,7 +20,7 @@
<div class="col">
<h3>{{ albums.name ?? ""}}</h3>
</div>
<div class="col-auto flex-center" v-if="songs.data.length > 12">
<div class="col-auto cider-flex-center" v-if="songs.data.length > 12">
<button class="cd-btn-seeall" @click="app.showCollection((albums ?? []), albums.name ?? '', 'default')" >{{app.getLz('term.seeAll')}}</button>
</div>
</div>
@ -32,7 +32,7 @@
<div class="col">
<h3>{{ playlists.name ?? ""}}</h3>
</div>
<div class="col-auto flex-center" v-if="playlists.data.length > 12">
<div class="col-auto cider-flex-center" v-if="playlists.data.length > 12">
<button class="cd-btn-seeall" @click="app.showCollection((playlists ?? []), playlists.name ?? '', 'default')" >{{app.getLz('term.seeAll')}}</button>
</div>
</div>
@ -44,7 +44,7 @@
<div class="col">
<h3>{{ musicvideos.name ?? ""}}</h3>
</div>
<div class="col-auto flex-center" v-if="musicvideos.data.length > 12">
<div class="col-auto cider-flex-center" v-if="musicvideos.data.length > 12">
<button class="cd-btn-seeall" @click="app.showCollection((musicvideos ?? []), musicvideos.name ?? '', 'default')" >{{app.getLz('term.seeAll')}}</button>
</div>
</div>
@ -56,7 +56,7 @@
<div class="col">
<h3>{{ globalcharts.name ?? ""}}</h3>
</div>
<div class="col-auto flex-center" v-if="globalcharts.data.length > 12">
<div class="col-auto cider-flex-center" v-if="globalcharts.data.length > 12">
<button class="cd-btn-seeall" @click="app.showCollection((globalcharts ?? []), globalcharts.name ?? '', 'default')" >{{app.getLz('term.seeAll')}}</button>
</div>
</div>
@ -68,7 +68,7 @@
<div class="col">
<h3>{{ citycharts.name ?? ""}}</h3>
</div>
<div class="col-auto flex-center" v-if="citycharts.data.length > 12">
<div class="col-auto cider-flex-center" v-if="citycharts.data.length > 12">
<button class="cd-btn-seeall" @click="app.showCollection((citycharts ?? []), citycharts.name ?? '', 'default')" >{{app.getLz('term.seeAll')}}</button>
</div>
</div>

2
src/renderer/views/pages/cider-multiroom.ejs
View file

@ -13,7 +13,7 @@
<div class="col" v-if="recom.attributes.name != 'Chart Set'">
<h3>{{ recom.attributes?.title ?? ""}}</h3>
</div>
<div class="col-auto flex-center" v-if="index != 0 && recom.relationships && ((recom.relationships.children && recom.relationships.children.data.length > 10) || (recom.relationships.contents && recom.relationships.contents.data.length > 10))">
<div class="col-auto cider-flex-center" v-if="index != 0 && recom.relationships && ((recom.relationships.children && recom.relationships.children.data.length > 10) || (recom.relationships.contents && recom.relationships.contents.data.length > 10))">
<button class="cd-btn-seeall" @click="app.showCollection(recom.relationships.children ? recom.relationships.children : recom.relationships.contents, recom.attributes.name ?? '', 'listen_now')" >{{app.getLz('term.seeAll')}}</button>
</div>
</div>

6
src/renderer/views/pages/cider-playlist.ejs
View file

@ -16,7 +16,7 @@
<div class="hero-tint" :style="{'background-color': '#' + hasHeroObject()?.bgColor ?? ''}"></div>
</div>
<div class="row">
<div class="col-auto flex-center" @mouseover="minClass(false)">
<div class="col-auto cider-flex-center" @mouseover="minClass(false)">
<div class="mediaContainer">
<mediaitem-artwork
shadow="large"
@ -139,7 +139,7 @@
<h3>{{data.attributes ? (data.attributes.name ??
(data.attributes.title ?? '') ?? '') : ''}}</h3>
</div>
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<div>
<button class="md-btn md-btn-primary md-btn-icon" style="min-width: 100px;"
@click="app.mk.shuffleMode = 0; play()"><img class="md-ico-play">
@ -163,7 +163,7 @@
</button>
</div>
</div>
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<button class="more-btn-round" style="float:right;" @click="menu" :aria-label="app.getLz('term.more')">
<div class="svg-icon"></div>
</button>

4
src/renderer/views/pages/cider-profile.ejs
View file

@ -10,7 +10,7 @@
size="220" type="artists"></mediaitem-artwork>
</div>
</div>
<div class="col flex-center">
<div class="col cider-flex-center">
<h1>{{ data.attributes.name }}</h1>
</div>
</div>
@ -21,7 +21,7 @@
<div class="col">
<h3>{{ 'Shared Playlists' ?? ""}}</h3>
</div>
<div class="col-auto flex-center" v-if="data.relationships['shared-playlists'].data.length >= 10">
<div class="col-auto cider-flex-center" v-if="data.relationships['shared-playlists'].data.length >= 10">
<button class="cd-btn-seeall" @click="app.showCollection(data.relationships['shared-playlists'],'Shared Playlists' ?? '', 'default')">{{app.getLz('term.seeAll')}}</button>
</div>
</div>

2
src/renderer/views/pages/groupings.ejs
View file

@ -9,7 +9,7 @@
<div class="col" v-if="recom.attributes.name != 'Chart Set'">
<h3>{{ recom.attributes.name ?? ""}}</h3>
</div>
<div class="col-auto flex-center" v-if="index != 0 && recom.relationships && ((recom.relationships.children && recom.relationships.children.data.length > 10) || (recom.relationships.contents && recom.relationships.contents.data.length > 10))">
<div class="col-auto cider-flex-center" v-if="index != 0 && recom.relationships && ((recom.relationships.children && recom.relationships.children.data.length > 10) || (recom.relationships.contents && recom.relationships.contents.data.length > 10))">
<button class="cd-btn-seeall" v-if="recom.relationships.room" @click="app.showRoom(recom.relationships.room?.data[0].href)" >{{app.getLz('term.seeAll')}}</button>
<button class="cd-btn-seeall" v-else @click="app.showCollection(recom.relationships.children ? recom.relationships.children : recom.relationships.contents, recom.attributes.name ?? '', 'listen_now')" >{{app.getLz('term.seeAll')}}</button>
</div>

8
src/renderer/views/pages/home.ejs
View file

@ -7,7 +7,7 @@
<div class="col nopadding">
<h3>{{app.getLz('home.recentlyPlayed')}}</h3>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto nopadding cider-flex-center">
<button class="cd-btn-seeall" @click="seeAllHistory()">{{app.getLz('term.history')}}</button>
<button class="cd-btn-seeall" @click="seeAllRecentlyPlayed()">{{app.getLz('term.seeAll')}}</button>
</div>
@ -25,7 +25,7 @@
<div class="col nopadding">
<h3>{{app.getLz('home.artistsFeed')}}</h3>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto nopadding cider-flex-center">
<button class="cd-btn-seeall" @click="syncFavorites()" v-if="!syncingFavs">{{app.getLz('home.syncFavorites')}}</button>
<div class="spinner" style="height: 26px;" v-else></div>
<button class="cd-btn-seeall" @click="app.appRoute('artist-feed')">{{app.getLz('term.seeAll')}}</button>
@ -63,7 +63,7 @@
<div class="col nopadding">
<h3>{{app.getLz('home.madeForYou')}}</h3>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto nopadding cider-flex-center">
<button class="md-btn md-btn-replay" v-if="seenReplay" @click="$root.appRoute('replay')">{{$root.getLz('term.replay')}} {{ year }}</button>
</div>
</div>
@ -80,7 +80,7 @@
<div class="col nopadding">
<h3>{{app.getLz('home.friendsListeningTo')}}</h3>
</div>
<div class="col-auto nopadding flex-center">
<div class="col-auto nopadding cider-flex-center">
<button class="cd-btn-seeall" @click="app.showSocialListeningTo()">{{app.getLz('term.seeAll')}}</button>
</div>
</div>

2
src/renderer/views/pages/library-albums.ejs
View file

@ -21,7 +21,7 @@
v-model="library.albums.search" class="search-input">
</div>
</div>
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<div class="row">
<div class="col">
<select class="md-select" v-model="prefs.sort" @change="library.albums.sorting[1] = prefs.sort; $root.searchLibraryAlbums(1)">

4
src/renderer/views/pages/library-songs.ejs
View file

@ -13,7 +13,7 @@
v-model="library.songs.search" class="search-input">
</div>
</div>
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<div class="row">
<button class="col md-btn md-btn-primary md-btn-icon" style="min-width: 100px;margin-right: 3px;"
@click="app.mk.shuffleMode = 0; play()"> <img class="md-ico-play">
@ -56,7 +56,7 @@
</div>
</div>
</div>
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<button v-if="library.songs.downloadState == 2" @click="$root.getLibrarySongsFull(true)"
class="reload-btn" :aria-label="app.getLz('menubar.options.reload')"><%- include('../svg/redo.svg') %></button>
<button v-else class="reload-btn" style="opacity: 0.8;pointer-events: none" :aria-label="app.getLz('menubar.options.reload')">

6
src/renderer/views/pages/playlist-inline.ejs
View file

@ -22,7 +22,7 @@
}">
<div class="playlistInfo">
<div class="row">
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<div style="width: 260px;height:260px;">
<mediaitem-artwork
shadow="large"
@ -120,7 +120,7 @@
<h3>{{data.attributes ? (data.attributes.name ??
(data.attributes.title ?? '') ?? '') : ''}}</h3>
</div>
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<div>
<button class="md-btn md-btn-primary md-btn-icon" style="min-width: 100px;"
@click="app.mk.shuffleMode = 0; play()"><img class="md-ico-play">
@ -144,7 +144,7 @@
</button>
</div>
</div>
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<button class="more-btn-round" style="float:right;" @click="menu" :aria-label="term.more">
<div class="svg-icon"></div>
</button>

2
src/renderer/views/pages/podcasts.ejs
View file

@ -35,7 +35,7 @@
<div class="episodes-list">
<div v-if="podcastSelected.id != -1" class="episodes-inline-info">
<div class="row">
<div class="col-auto flex-center">
<div class="col-auto cider-flex-center">
<div class="podcast-artwork">
<mediaitem-artwork shadow="large" :url="podcastSelected.attributes.artwork.url" size="300"></mediaitem-artwork>
</div>

8
src/renderer/views/pages/recordLabel.ejs
View file

@ -10,7 +10,7 @@
size="220" type="artists"></mediaitem-artwork>
</div>
</div>
<div class="col flex-center">
<div class="col cider-flex-center">
<h1>{{ data.attributes.name }}</h1>
</div>
@ -31,7 +31,7 @@
<div class="col">
<h3>{{ data.views["latest-releases"].attributes.title ?? ""}}</h3>
</div>
<div class="col-auto flex-center" v-if="data.views['latest-releases'].data.length >= 10">
<div class="col-auto cider-flex-center" v-if="data.views['latest-releases'].data.length >= 10">
<button class="cd-btn-seeall"
@click="$root.showRecordLabelView(data.id, data.attributes.name + ' - Latest Releases', 'latest-releases')">
{{ $root.getLz('term.seeAll') }}
@ -46,7 +46,7 @@
<div class="col">
<h3>{{ data.views["top-releases"].attributes.title ?? "" }}</h3>
</div>
<div class="col-auto flex-center" v-if="data.views['top-releases'].data.length >= 10">
<div class="col-auto cider-flex-center" v-if="data.views['top-releases'].data.length >= 10">
<button class="cd-btn-seeall"
@click="$root.showRecordLabelView(data.id, data.attributes.name + ' - Top Releases', 'top-releases')">
{{ $root.getLz('term.seeAll') }}
@ -62,7 +62,7 @@
<div class="col">
<h3>{{ $root.getLz('term.playlists') }}</h3>
</div>
<div class="col-auto flex-center" v-if="data.relationships.playlists.data.length >= 5">
<div class="col-auto cider-flex-center" v-if="data.relationships.playlists.data.length >= 5">
<button class="cd-btn-seeall"
@click="$root.showCollection(data.relationships.playlists, data.attributes.name + ' - Playlists', 'curator')">
{{ $root.getLz('term.seeAll') }}

8
src/renderer/views/pages/search.ejs
View file

@ -40,7 +40,7 @@
<div class="col">
<h3>{{app.getLz('term.songs')}}</h3>
</div>
<div class="col-auto flex-center"
<div class="col-auto cider-flex-center"
@click="app.showSearchView(app.search.term, 'song', app.friendlyTypes('song'))"
v-if="search.results.song.data.length >= 12">
<button class="cd-btn-seeall">{{app.getLz('term.seeAll')}}</button>
@ -60,7 +60,7 @@
<div class="col">
<h3>{{ app.friendlyTypes(section) }}</h3>
</div>
<div class="col-auto flex-center" v-if="search.results[section].data.length >= 10">
<div class="col-auto cider-flex-center" v-if="search.results[section].data.length >= 10">
<button class="cd-btn-seeall"
@click="app.showSearchView(app.search.term, section, app.friendlyTypes(section))">{{app.getLz('term.seeAll')}}
</button>
@ -81,7 +81,7 @@
<div class="col">
<h3>{{app.getLz('term.sharedPlaylists')}}</h3>
</div>
<div class="col-auto flex-center" v-if="search.resultsSocial.playlist.data.length >= 10">
<div class="col-auto cider-flex-center" v-if="search.resultsSocial.playlist.data.length >= 10">
<button class="cd-btn-seeall"
@click="app.showCollection(search.resultsSocial.playlist, 'Shared Playlists', 'default')">{{app.getLz('term.seeAll')}}
</button>
@ -95,7 +95,7 @@
<div class="col">
<h3>{{app.getLz('term.people')}}</h3>
</div>
<div class="col-auto flex-center" v-if="search.resultsSocial.profile.data.length >= 10">
<div class="col-auto cider-flex-center" v-if="search.resultsSocial.profile.data.length >= 10">
<button class="cd-btn-seeall"
@click="app.showCollection(search.resultsSocial.profile, 'People', 'default')">{{app.getLz('term.seeAll')}}
</button>