added experimental flags and section in settings for temporary config settings, added compact ui experiment

This commit is contained in:
booploops 2022-01-12 07:36:20 -08:00
parent fab2e1ba33
commit e579ed8a99
6 changed files with 127 additions and 95 deletions

View file

@ -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>

View file

@ -477,77 +477,92 @@
</div>
</div>
<div class="md-option-header">
<span>Unfinished / Non Functional</span>
<span>Experimental</span>
</div>
<div class="md-option-line">
<div class="md-option-segment">
Theme
Compact UI
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select">
<option value="0">Cider</option>
</select>
<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 class="md-option-line">
<div class="md-option-segment">
Theme Options
<div style="opacity: 0.5; pointer-events: none">
<div class="md-option-header">
<span>Unfinished / Non Functional</span>
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="btn">Theme Options</button>
<div class="md-option-line">
<div class="md-option-segment">
Theme
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select">
<option value="0">Cider</option>
</select>
</div>
</div>
</div>
<div class="md-option-line">
<div class="md-option-segment">
Scrollbars
<div class="md-option-line">
<div class="md-option-segment">
Theme Options
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="btn">Theme Options</button>
</div>
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select">
<option value="0">Show on hover</option>
<option value="1">Always show</option>
<option value="2">Hidden</option>
</select>
<div class="md-option-line">
<div class="md-option-segment">
Scrollbars
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select">
<option value="0">Show on hover</option>
<option value="1">Always show</option>
<option value="2">Hidden</option>
</select>
</div>
</div>
</div>
<div class="md-option-line">
<div class="md-option-segment">
Refresh Rate
<div class="md-option-line">
<div class="md-option-segment">
Refresh Rate
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select">
<option value='0'>Automatic</option>
<option value='30'>30</option>
<option value='60'>60</option>
<option value='144'>144</option>
<option value='175'>175</option>
<option value='240'>240</option>
<option value='360'>30</option>
</select>
</div>
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select">
<option value='0'>Automatic</option>
<option value='30'>30</option>
<option value='60'>60</option>
<option value='144'>144</option>
<option value='175'>175</option>
<option value='240'>240</option>
<option value='360'>30</option>
</select>
<div class="md-option-line">
<div class="md-option-segment">
Close Button Behavior
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select">
<option value='0'>Minimize to system tray</option>
<option value='1'>Minimize to taskbar ? dock</option>
<option value='2'>Quit Cider</option>
</select>
</div>
</div>
</div>
<div class="md-option-line">
<div class="md-option-segment">
Close Button Behavior
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select">
<option value='0'>Minimize to system tray</option>
<option value='1'>Minimize to taskbar ? dock</option>
<option value='2'>Quit Cider</option>
</select>
</div>
</div>
<div class="md-option-line">
<div class="md-option-segment">
Open Cider on Startup
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select">
<option value='0'>Never</option>
<option value='1'>Always</option>
<option value='2'>Always, minimized</option>
<option value='2'>Always, hidden in tray</option>
</select>
<div class="md-option-line">
<div class="md-option-segment">
Open Cider on Startup
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select">
<option value='0'>Never</option>
<option value='1'>Always</option>
<option value='2'>Always, minimized</option>
<option value='2'>Always, hidden in tray</option>
</select>
</div>
</div>
</div>
</div>
@ -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();