Added memory management to Java tab.

app/assets/css/launcher.css

@@ -1331,6 +1331,86 @@ input:checked + .toggleSwitchSlider:before {
     width: 75px;
 }
 
+/* * *
+* Settings View (Java Tab)
+* * */
+
+#settingsMemoryContainer {
+    width: 75%;
+    display: flex;
+    flex-direction: column;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.50);
+}
+
+#settingsMemoryTitle {
+    margin-bottom: 10px;
+    padding-bottom: 5px;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
+}
+
+#settingsMemoryContent {
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+}
+#settingsMemoryContentLeft {
+    width: 69%;
+}
+#settingsMemoryContentRight {
+    display: flex;
+    align-items: center;
+    margin-right: 10%;
+}
+
+.settingsMemoryHeader {
+    font-size: 14px;
+}
+
+.settingsMemoryActionContainer {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+
+.settingsMemoryLabel {
+    font-size: 14px;
+    margin-right: 3%;
+}
+
+#settingsMemoryDesc {
+    font-size: 10px;
+    margin: 20px 0px;
+    color: lightgrey;
+    font-weight: bold;
+}
+
+#settingsMaxRAMRange,
+#settingsMinRAMRange {
+    width: 85%;
+}
+
+#settingsMemoryStatus {
+    display: flex;
+    flex-direction: column;
+}
+#settingsMemoryStatus > .settingsMemoryStatusContainer:not(:last-child){
+    margin-bottom: 50%;
+}
+.settingsMemoryStatusContainer {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+.settingsMemoryStatusTitle {
+    font-size: 12px;
+    color: grey;
+    font-weight: bold;
+}
+.settingsMemoryStatusValue {
+    color: lightgrey;
+    font-size: 16px;
+}
+
 /*******************************************************************************
  *                                                                             *
  * Landing View (Structural Styles)                                            *

app/assets/js/scripts/settings.js

@@ -1,3 +1,5 @@
+const os                      = require('os')
+
 const settingsNavDone         = document.getElementById('settingsNavDone')
 
 // Account Management Tab
@@ -11,6 +13,10 @@ const settingsGameHeight      = document.getElementById('settingsGameHeight')
 // Java Tab
 const settingsMaxRAMRange     = document.getElementById('settingsMaxRAMRange')
 const settingsMinRAMRange     = document.getElementById('settingsMinRAMRange')
+const settingsMaxRAMLabel     = document.getElementById('settingsMaxRAMLabel')
+const settingsMinRAMLabel     = document.getElementById('settingsMinRAMLabel')
+const settingsMemoryTotal     = document.getElementById('settingsMemoryTotal')
+const settingsMemoryAvail     = document.getElementById('settingsMemoryAvail')
 
 const settingsState = {
     invalid: new Set()
@@ -73,7 +79,20 @@ function initSettingsValues(){
                 }
             } else if(v.tagName === 'DIV'){
                 if(v.classList.contains('rangeSlider')){
-                    v.setAttribute('value', Number.parseFloat(gFn()))
+                    // Special Conditions
+                    const cVal = v.getAttribute('cValue')
+                    if(cVal === 'MinRAM' || cVal === 'MaxRAM'){
+                        let val = gFn()
+                        if(val.endsWith('M')){
+                            val = Number(val.substring(0, val.length-1))/1000
+                        } else {
+                            val = Number.parseFloat(val)
+                        }
+
+                        v.setAttribute('value', val)
+                    } else {
+                        v.setAttribute('value', Number.parseFloat(gFn()))
+                    }
                 }
             }
         }
@@ -100,6 +119,23 @@ function saveSettingsValues(){
                         changeAllowPrerelease(v.checked)
                     }
                 }
+            } else if(v.tagName === 'DIV'){
+                if(v.classList.contains('rangeSlider')){
+                    // Special Conditions
+                    const cVal = v.getAttribute('cValue')
+                    if(cVal === 'MinRAM' || cVal === 'MaxRAM'){
+                        let val = Number(v.getAttribute('value'))
+                        if(val%1 > 0){
+                            val = val*1000 + 'M'
+                        } else {
+                            val = val + 'G'
+                        }
+
+                        sFn(val)
+                    } else {
+                        sFn(v.getAttribute('value'))
+                    }
+                }
             }
         }
     })
@@ -343,14 +379,21 @@ settingsMinRAMRange.onchange = (e) => {
         const sliderMeta = calculateRangeSliderMeta(settingsMaxRAMRange)
         updateRangedSlider(settingsMaxRAMRange, sMinV,
         (1+(sMinV-sliderMeta.min)/sliderMeta.step)*sliderMeta.inc)
+        settingsMaxRAMLabel.innerHTML = sMinV.toFixed(1) + 'G'
     }
+    settingsMinRAMLabel.innerHTML = sMinV.toFixed(1) + 'G'
 }
+
 settingsMaxRAMRange.onchange = (e) => {
     const sMaxV = Number(settingsMaxRAMRange.getAttribute('value'))
     const sMinV = Number(settingsMinRAMRange.getAttribute('value'))
     if(sMaxV < sMinV){
-        e.preventDefault()
+        const sliderMeta = calculateRangeSliderMeta(settingsMaxRAMRange)
+        updateRangedSlider(settingsMinRAMRange, sMaxV,
+        (1+(sMaxV-sliderMeta.min)/sliderMeta.step)*sliderMeta.inc)
+        settingsMinRAMLabel.innerHTML = sMaxV.toFixed(1) + 'G'
     }
+    settingsMaxRAMLabel.innerHTML = sMaxV.toFixed(1) + 'G'
 }
 
 function calculateRangeSliderMeta(v){
@@ -387,7 +430,7 @@ 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)
                     }
@@ -417,8 +460,14 @@ function updateRangedSlider(element, value, notch){
     }
 }
 
+function bindMemoryStatus(){
+    settingsMemoryTotal.innerHTML = Number((os.totalmem()-1000000000)/1000000000).toFixed(1) + 'G'
+    settingsMemoryAvail.innerHTML = Number(os.freemem()/1000000000).toFixed(1) + 'G'
+}
+
 function prepareJavaTab(){
     bindRangeSlider()
+    bindMemoryStatus()
 }
 
 

app/settings.ejs

@@ -95,13 +95,45 @@
                 <span class="settingsTabHeaderText">Java Settings</span>
                 <span class="settingsTabHeaderDesc">Manage the Java configuration (advanced).</span>
             </div>
-            <div id="settingsMaxRAMRange" class="rangeSlider" cValue="MaxRAM" min="3" max="8" value="8" step="0.5">
-                <div class="rangeSliderBar"></div>
-                <div class="rangeSliderTrack"></div>
-            </div>
-            <div id="settingsMinRAMRange" class="rangeSlider" cValue="MinRAM" min="3" max="8" value="8" step="0.5">
-                <div class="rangeSliderBar"></div>
-                <div class="rangeSliderTrack"></div>
+            <div id="settingsMemoryContainer">
+                <div id="settingsMemoryTitle">Memory</div>
+                <div id="settingsMemoryContent">
+                    <div id="settingsMemoryContentLeft">
+                        <div class="settingsMemoryContentItem">
+                            <span class="settingsMemoryHeader">Maximum RAM</span>
+                            <div class="settingsMemoryActionContainer">
+                                <div id="settingsMaxRAMRange" class="rangeSlider" cValue="MaxRAM" min="3" max="8" value="3" step="0.5">
+                                    <div class="rangeSliderBar"></div>
+                                    <div class="rangeSliderTrack"></div>
+                                </div>
+                                <span id="settingsMaxRAMLabel" class="settingsMemoryLabel">3G</span>
+                            </div>
+                        </div>
+                        <div class="settingsMemoryContentItem">
+                            <span class="settingsMemoryHeader">Minimum RAM</span>
+                            <div class="settingsMemoryActionContainer">
+                                <div id="settingsMinRAMRange" class="rangeSlider" cValue="MinRAM" min="3" max="8" value="3" step="0.5">
+                                    <div class="rangeSliderBar"></div>
+                                    <div class="rangeSliderTrack"></div>
+                                </div>
+                                <span id="settingsMinRAMLabel" class="settingsMemoryLabel">3G</span>
+                            </div>
+                        </div>
+                        <div id="settingsMemoryDesc">The recommended minimum RAM is 3 gigabytes. Setting the minimum and maximum values to the same value may reduce lag.</div>
+                    </div>
+                    <div id="settingsMemoryContentRight">
+                        <div id="settingsMemoryStatus">
+                            <div class="settingsMemoryStatusContainer">
+                                <span class="settingsMemoryStatusTitle">Total</span>
+                                <span id="settingsMemoryTotal" class="settingsMemoryStatusValue">16G</span>
+                            </div>
+                            <div class="settingsMemoryStatusContainer">
+                                <span class="settingsMemoryStatusTitle">Available</span>
+                                <span id="settingsMemoryAvail" class="settingsMemoryStatusValue">7.3G</span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
             </div>
         </div>
         <div id="settingsTabLauncher" class="settingsTab" style="display: none;">