Skirda/SkirdaElectronLauncher
4
0
Fork 0
Code Issues Pull Requests Projects Releases 2 Wiki Activity

Tweaking memory range sliders.

Browse Source 
Fixed minor issue where an extra tick was added.
The bar fill color now changes to yellow and red depending on how much memory is being allocated.
This commit is contained in:
Daniel Scalzi 2018-06-12 03:48:36 -04:00
parent 6ac48a63b5
commit b61a9a2c55
No known key found for this signature in database
GPG Key ID: 5CA2F145B63535F9
2 changed files with 25 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/assets/css/launcher.css
View File

@ -1143,6 +1143,7 @@ input:checked + .toggleSwitchSlider:before {
width: 50%;
height: 5px;
border-radius: 3px 0px 0px 3px;
transition: background 0.25s ease;
}
.rangeSliderTrack {
position: absolute;

30
app/assets/js/scripts/settings.js
View File

@ -375,10 +375,19 @@ settingsMinRAMRange.setAttribute('min', ConfigManager.getAbsoluteMinRAM())
settingsMinRAMRange.onchange = (e) => {
const sMaxV = Number(settingsMaxRAMRange.getAttribute('value'))
const sMinV = Number(settingsMinRAMRange.getAttribute('value'))
const bar = e.target.getElementsByClassName('rangeSliderBar')[0]
const max = (os.totalmem()-1000000000)/1000000000
if(sMinV >= max/2){
bar.style.background = '#e86060'
} else if(sMinV >= max/4) {
bar.style.background = '#e8e18b'
} else {
bar.style.background = null
}
if(sMaxV < sMinV){
const sliderMeta = calculateRangeSliderMeta(settingsMaxRAMRange)
updateRangedSlider(settingsMaxRAMRange, sMinV,
(1+(sMinV-sliderMeta.min)/sliderMeta.step)*sliderMeta.inc)
((sMinV-sliderMeta.min)/sliderMeta.step)*sliderMeta.inc)
settingsMaxRAMLabel.innerHTML = sMinV.toFixed(1) + 'G'
}
settingsMinRAMLabel.innerHTML = sMinV.toFixed(1) + 'G'
@ -387,10 +396,19 @@ settingsMinRAMRange.onchange = (e) => {
settingsMaxRAMRange.onchange = (e) => {
const sMaxV = Number(settingsMaxRAMRange.getAttribute('value'))
const sMinV = Number(settingsMinRAMRange.getAttribute('value'))
const bar = e.target.getElementsByClassName('rangeSliderBar')[0]
const max = (os.totalmem()-1000000000)/1000000000
if(sMaxV >= max/2){
bar.style.background = '#e86060'
} else if(sMaxV >= max/4) {
bar.style.background = '#e8e18b'
} else {
bar.style.background = null
}
if(sMaxV < sMinV){
const sliderMeta = calculateRangeSliderMeta(settingsMaxRAMRange)
updateRangedSlider(settingsMinRAMRange, sMaxV,
(1+(sMaxV-sliderMeta.min)/sliderMeta.step)*sliderMeta.inc)
((sMaxV-sliderMeta.min)/sliderMeta.step)*sliderMeta.inc)
settingsMinRAMLabel.innerHTML = sMaxV.toFixed(1) + 'G'
}
settingsMaxRAMLabel.innerHTML = sMaxV.toFixed(1) + 'G'
@ -402,7 +420,7 @@ function calculateRangeSliderMeta(v){
min: Number(v.getAttribute('min')),
step: Number(v.getAttribute('step')),
}
val.ticks = 1+(val.max-val.min)/val.step
val.ticks = (val.max-val.min)/val.step
val.inc = 100/val.ticks
return val
}
@ -414,7 +432,7 @@ function bindRangeSlider(){
const value = v.getAttribute('value')
const sliderMeta = calculateRangeSliderMeta(v)
updateRangedSlider(v, value,
(1+(value-sliderMeta.min)/sliderMeta.step)*sliderMeta.inc)
((value-sliderMeta.min)/sliderMeta.step)*sliderMeta.inc)
track.onmousedown = (e) => {
@ -430,9 +448,9 @@ function bindRangeSlider(){
const perc = (diff/v.offsetWidth)*100
const notch = Number(perc/sliderMeta.inc).toFixed(0)*sliderMeta.inc
console.log(notch, perc)
if(Math.abs(perc-notch) < sliderMeta.inc/2){
updateRangedSlider(v, sliderMeta.min+(sliderMeta.step*((notch/sliderMeta.inc)-1)), notch)
updateRangedSlider(v, sliderMeta.min+(sliderMeta.step*(notch/sliderMeta.inc)), notch)
}
}
}