added experimental flags and section in settings for temporary config settings, added compact ui experiment
This commit is contained in:
parent
fab2e1ba33
commit
e579ed8a99
6 changed files with 127 additions and 95 deletions
1
index.js
1
index.js
|
@ -80,6 +80,7 @@ const configDefaults = {
|
|||
},
|
||||
"advanced": {
|
||||
"AudioContext": false,
|
||||
"experiments": []
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -635,6 +635,11 @@ const app = new Vue({
|
|||
this.$forceUpdate()
|
||||
}, 500)
|
||||
},
|
||||
getAppClasses() {
|
||||
if(this.cfg.advanced.experiments.includes('compactui')) {
|
||||
return {compact: true}
|
||||
}
|
||||
},
|
||||
invokeDrawer(panel) {
|
||||
if (this.drawer.panel == panel && this.drawer.open) {
|
||||
if (panel == "lyrics") {
|
||||
|
|
|
@ -1,8 +1,10 @@
|
|||
.app-sidebar-content.compact {
|
||||
#app.compact {
|
||||
.content-inner {
|
||||
zoom: 0.95;
|
||||
}
|
||||
.app-sidebar-content {
|
||||
padding:0px;
|
||||
|
||||
|
||||
|
||||
.app-sidebar-header-text {
|
||||
padding: 6px 10px;
|
||||
margin: 0px;
|
||||
|
@ -40,6 +42,8 @@
|
|||
border-radius: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// if page width is less than 951px
|
||||
|
|
|
@ -1883,6 +1883,7 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
|
|||
font-size: 1em;
|
||||
font-family: inherit;
|
||||
padding: 8px 16px;
|
||||
background: #404040;
|
||||
}
|
||||
|
||||
optgroup {
|
||||
|
|
|
@ -30,7 +30,7 @@
|
|||
</head>
|
||||
|
||||
<body oncontextmenu="return false;" loading="1" platform="<%= env.platform %>">
|
||||
<div id="app">
|
||||
<div id="app" :class="getAppClasses()">
|
||||
<transition name="fsModeSwitch">
|
||||
<div id="app-main" v-show="appMode == 'player'">
|
||||
<div class="mv-chrome" v-if="chrome.topChromeVisible == false"></div>
|
||||
|
|
|
@ -476,6 +476,20 @@
|
|||
<input type="checkbox" v-model="app.cfg.lastfm.enabledRemoveFeaturingArtists" switch/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-header">
|
||||
<span>Experimental</span>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
Compact UI
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto" >
|
||||
<button class="md-btn" :class="{'md-btn-primary': app.cfg.advanced.experiments.includes('compactui')}" @click="app.cfg.advanced.experiments.includes('compactui') ? removeExperiment('compactui') : addExperiment('compactui')">
|
||||
{{app.cfg.advanced.experiments.includes('compactui') ? 'Enabled' : 'Disabled'}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div style="opacity: 0.5; pointer-events: none">
|
||||
<div class="md-option-header">
|
||||
<span>Unfinished / Non Functional</span>
|
||||
</div>
|
||||
|
@ -552,6 +566,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script>
|
||||
|
@ -573,6 +588,12 @@
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
addExperiment(flag) {
|
||||
app.cfg.advanced.experiments.push(flag);
|
||||
},
|
||||
removeExperiment(flag) {
|
||||
app.cfg.advanced.experiments.splice(app.cfg.advanced.experiments.indexOf(flag), 1);
|
||||
},
|
||||
toggleAudioContext: function(){
|
||||
if (app.cfg.advanced.AudioContext){
|
||||
CiderAudio.init();
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue