added native title bar option, added window control position

src/main/base/browserwindow.ts

@@ -322,11 +322,19 @@ export class BrowserWindow {
                 } else {
                     this.options.transparent = true;
                 }
+                this.options.autoHideMenuBar = true
+                if(utils.getStoreValue("visual.nativeTitleBar")) {
+                    this.options.titleBarStyle = "visible";
+                    this.options.frame = true
+                }
                 break;
             case "linux":
                 this.options.backgroundColor = "#1E1E1E";
                 this.options.autoHideMenuBar = true
+                if(utils.getStoreValue("visual.nativeTitleBar")) {
+                    this.options.titleBarStyle = "visible";
                     this.options.frame = true
+                }
                 break;
             case "darwin":
                 this.options.transparent = true;

src/main/base/store.ts

@@ -118,7 +118,9 @@ export class Store {
             "miniplayer_top_toggle": true,
             "directives": {
                 "windowLayout": "default"
-            }
+            },
+            "windowControlPosition": 0, // 0 default right
+            "nativeTitleBar": false
         },
         "lyrics": {
             "enable_mxm": false,

src/renderer/less/linux.less

@@ -1,6 +1,6 @@
 // Linux
 body[platform="linux"] {
     #window-controls-container {
-        display: none;
+        //display: none;
     }
 }

src/renderer/main/vueapp.js

@@ -151,6 +151,7 @@ const app = new Vue({
         tmpVar: [],
         notification: false,
         chrome: {
+            nativeControls: false,
             contentScrollPosY: 0,
             appliedTheme: {
                 location: "",
@@ -580,6 +581,10 @@ const app = new Vue({
                 this.chrome.windowControlPosition = "left"
             }
 
+            if(this.cfg.visual.nativeTitleBar) {
+                this.chrome.nativeControls = true
+            }
+
             this.setLz(this.cfg.general.language)
             this.setLzManual()
             clearTimeout(this.hangtimer)
@@ -960,7 +965,7 @@ const app = new Vue({
             if (directives[directive]) {
                 return directives[directive].value
             } else if (this.cfg.visual.directives[directive]) {
-                return this.cfg.visual.directives.windowLayout
+                return this.cfg.visual.directives[directive]
             } else {
                 return ""
             }
@@ -982,6 +987,24 @@ const app = new Vue({
                 classes.simplebg = true
             }
 
+            if(this.platform !== "darwin") {
+                switch(parseInt(this.cfg.visual.windowControlPosition)) {
+                    default:
+                    case 0:
+                        this.chrome.windowControlPosition = "right"
+                        this.chrome.forceDirectives["macosemu"] = {
+                            value: false
+                        }
+                        break;
+                    case 1:
+                        this.chrome.windowControlPosition = "left"
+                        this.chrome.forceDirectives["macosemu"] = {
+                            value: true
+                        }
+                        break;
+                }
+            }
+
             if (this.getThemeDirective('windowLayout') == 'twopanel') {
                 classes.twopanel = true
             }

src/renderer/views/app/chrome-top.ejs

@@ -1,6 +1,6 @@
 <div class="app-chrome" :style="{'display': chrome.topChromeVisible ? '' : 'none'}">
     <div class="app-chrome--left">
-        <div class="app-chrome-item full-height" v-if="chrome.windowControlPosition == 'left'">
+        <div class="app-chrome-item full-height" v-if="chrome.windowControlPosition == 'left' && !chrome.nativeControls">
             <div class="window-controls-macos">
                 <div class="close" @click="ipcRenderer.send('close')"></div>
                 <div class="minimize" @click="ipcRenderer.send('minimize')"></div>
@@ -160,7 +160,7 @@
             </div>
         </template>
         <div class="app-chrome-item full-height" id="window-controls-container"
-             v-if="chrome.windowControlPosition == 'right'">
+             v-if="chrome.windowControlPosition == 'right' && !chrome.nativeControls">
             <div class="window-controls">
                 <div class="minimize" @click="ipcRenderer.send('minimize')"></div>
                 <div class="minmax restore" v-if="chrome.maximized"
@@ -170,7 +170,7 @@
                 <div class="close" @click="ipcRenderer.send('close')"></div>
             </div>
         </div>
-        <div class="app-chrome-item full-height" v-else-if="platform != 'darwin'">
+        <div class="app-chrome-item full-height" v-else-if="platform != 'darwin' && !chrome.nativeControls">
             <button class="app-mainmenu"
                     @blur="mainMenuVisibility(false)"
                     @click="mainMenuVisibility(true)"

src/renderer/views/pages/settings.ejs

@@ -349,6 +349,26 @@
                                 <input type="checkbox" v-model="app.cfg.general.close_button_hide" switch/>
                             </div>
                         </div>
+                        <div class="md-option-line" v-show="app.platform !== 'darwin'">
+                            <div class="md-option-segment">
+                                Use Native Title Bar<br>
+                                <small>Requires relaunch</small>
+                            </div>
+                            <div class="md-option-segment md-option-segment_auto">
+                                <input type="checkbox" v-model="app.cfg.visual.nativeTitleBar" switch/>
+                            </div>
+                        </div>
+                        <div class="md-option-line" v-show="app.platform !== 'darwin'">
+                            <div class="md-option-segment">
+                                Window Control Style
+                            </div>
+                            <div class="md-option-segment md-option-segment_auto">
+                                <select class="md-select" v-model="app.cfg.visual.windowControlPosition">
+                                    <option value="0">Right</option>
+                                    <option value="1">Left</option>
+                                </select>
+                            </div>
+                        </div>
                     </div>
                 </div>
             </b-tab>