diff --git a/src/IPC.js b/src/IPC.js
index 05eb424b..1010601b 100644
--- a/src/IPC.js
+++ b/src/IPC.js
@@ -483,7 +483,8 @@ window.addEventListener('message', async (event) => {
// hide all other menubars
$('.window-menubar-global').hide();
}
- $menubar.show();
+
+ $menubar.css('display', 'flex');
// disable system context menu
$menubar.on('contextmenu', (e) => {
diff --git a/src/UI/Settings/UITabPersonalization.js b/src/UI/Settings/UITabPersonalization.js
index 225d4d6a..4c997a67 100644
--- a/src/UI/Settings/UITabPersonalization.js
+++ b/src/UI/Settings/UITabPersonalization.js
@@ -41,20 +41,29 @@ export default {
${i18n('menubar_style')}
-
+
+
+
- ${i18n('menubar_style_desktop')}
+ ${i18n('menubar_style_desktop')}
+ Show app menubar on in the desktop toolbar
+
+
- ${i18n('menubar_style_window')}
+ ${i18n('menubar_style_window')}
+ Show app menubar on top of the app window
+
@@ -81,24 +90,50 @@ export default {
});
});
- if(window.menubar_style === 'system' || !window.menubar_style){
- $el_window.find('#menubar_style_system').prop('checked', true);
- }else if(window.menubar_style === 'desktop'){
- $el_window.find('#menubar_style_desktop').prop('checked', true);
- }
- else if(window.menubar_style === 'window'){
- $el_window.find('#menubar_style_window').prop('checked', true);
- }
+ puter.kv.get('menubar_style').then(async (val) => {
+ if(val === 'system' || !val){
+ $el_window.find('#menubar_style_system').prop('checked', true);
+ }else if(val === 'desktop'){
+ $el_window.find('#menubar_style_desktop').prop('checked', true);
+ }
+ else if(val === 'window'){
+ $el_window.find('#menubar_style_window').prop('checked', true);
+ }
+ })
$el_window.find('.menubar_style').on('change', function (e) {
- const value = $(this).val();
+ let value = $(this).val();
if(value === 'system' || value === 'desktop' || value === 'window'){
- // apply the new style
- if(value === 'desktop')
- $('body').addClass('menubar-style-desktop');
- else
- $('body').removeClass('menubar-style-desktop');
+ // save the new style to cloud kv
puter.kv.set('menubar_style', value);
+
+ if(value === 'system'){
+ if(detectHostOS() === 'macos')
+ value = 'desktop';
+ else
+ value = 'window';
+ }
+ // apply the new style
+ if(value === 'desktop'){
+ $('body').addClass('menubar-style-desktop');
+ $('.window-menubar').each((_, el) => {
+ $(el).insertAfter('.toolbar-puter-logo');
+ // add window-menubar-global
+ $(el).addClass('window-menubar-global');
+ // hide
+ $(el).hide();
+ })
+ }else{
+ $('body').removeClass('menubar-style-desktop');
+ $('.window-menubar-global').each((_, el) => {
+ let win_id = $(el).attr('data-window-id');
+ $(el).insertAfter('.window[data-id="'+win_id+'"] .window-head');
+ // remove window-menubar-global
+ $(el).removeClass('window-menubar-global');
+ // show
+ $(el).css('display', 'flex');
+ })
+ }
window.menubar_style = value;
}else{
console.error('Invalid menubar style value');
diff --git a/src/UI/UIDesktop.js b/src/UI/UIDesktop.js
index a205474f..ce68a838 100644
--- a/src/UI/UIDesktop.js
+++ b/src/UI/UIDesktop.js
@@ -571,6 +571,13 @@ async function UIDesktop(options){
window.menubar_style = 'system';
}
+ if(menubar_style === 'system'){
+ if(window.detectHostOS() === 'macos')
+ menubar_style = 'desktop';
+ else
+ menubar_style = 'window';
+ }
+
// set menubar style class to body
if(window.menubar_style === 'desktop'){
$('body').addClass('menubar-style-desktop');
diff --git a/src/UI/UIWindow.js b/src/UI/UIWindow.js
index b242d92d..eda9925b 100644
--- a/src/UI/UIWindow.js
+++ b/src/UI/UIWindow.js
@@ -276,10 +276,8 @@ async function UIWindow(options) {
// Menubar
if(window.menubar_style === 'window'){
- h += ``;
+ h += ``;
}else if(window.menubar_style === 'desktop'){
- console.log('global menubar');
$('.toolbar-puter-logo').after(``);
}
diff --git a/src/css/style.css b/src/css/style.css
index 08de3c3d..fd1e3eee 100644
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -802,6 +802,9 @@ span.header-sort-icon img {
text-shadow: none;
}
+.window-menubar:not(.window-menubar-global):empty {
+ display: none !important;
+}
.window-menubar {
display: flex;
box-sizing: border-box;
diff --git a/src/helpers.js b/src/helpers.js
index 8e16cd14..394bcc65 100644
--- a/src/helpers.js
+++ b/src/helpers.js
@@ -2396,4 +2396,20 @@ window.countSubstr = (str, substring)=>{
}
return count;
-}
\ No newline at end of file
+}
+
+window.detectHostOS = function(){
+ var userAgent = window.navigator.userAgent;
+ var platform = window.navigator.platform;
+ var macosPlatforms = ['Macintosh', 'MacIntel', 'MacPPC', 'Mac68K'];
+ var windowsPlatforms = ['Win32', 'Win64', 'Windows', 'WinCE'];
+
+ if (macosPlatforms.indexOf(platform) !== -1) {
+ return 'macos';
+ } else if (windowsPlatforms.indexOf(platform) !== -1) {
+ return 'windows';
+ } else {
+ return 'other';
+ }
+}
+
diff --git a/src/i18n/translations/en.js b/src/i18n/translations/en.js
index 350dd863..6f8db6c7 100644
--- a/src/i18n/translations/en.js
+++ b/src/i18n/translations/en.js
@@ -147,6 +147,9 @@ const en = {
log_out: 'Log Out',
looks_good: "Looks good!",
manage_sessions: "Manage Sessions",
+ menubar_style_desktop: "Desktop",
+ menubar_style_system: "System",
+ menubar_style_window: "Window",
move: 'Move',
moving_file: "Moving %%",
my_websites: "My Websites",