Skip to content

Commit 08a4c5c

Browse files
mayswindmayswind
committed
fix wrong background color of title bar when dialog / modal shows
1 parent d96f7f8 commit 08a4c5c

9 files changed

Lines changed: 110 additions & 15 deletions

File tree

‎app/scripts/controllers/debug.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -172,8 +172,13 @@
172172
angular.element('#log-detail-modal').modal();
173173
};
174174

175+
$('#log-detail-modal').on('show.bs.modal', function (e) {
176+
ariaNgNativeElectronService.updateTitleBarBackgroundColorWithModalOverlay();
177+
});
178+
175179
$('#log-detail-modal').on('hide.bs.modal', function (e) {
176180
$scope.context.currentLog = null;
181+
ariaNgNativeElectronService.updateTitleBarBackgroundColor();
177182
});
178183

179184
$scope.executeAria2Method = function () {

‎app/scripts/controllers/new.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -595,8 +595,13 @@
595595
updateAllDirNodesSelectedStatus();
596596
};
597597

598+
$('#custom-choose-file-modal').on('show.bs.modal', function (e) {
599+
ariaNgNativeElectronService.updateTitleBarBackgroundColorWithModalOverlay();
600+
});
601+
598602
$('#custom-choose-file-modal').on('hide.bs.modal', function (e) {
599603
$scope.context.fileExtensions = null;
604+
ariaNgNativeElectronService.updateTitleBarBackgroundColor();
600605
});
601606

602607
$scope.setSelectedFile = function () {

‎app/scripts/controllers/settings-ariang.js‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -468,8 +468,13 @@
468468
angular.element('#import-settings-modal').modal();
469469
};
470470

471+
$('#import-settings-modal').on('show.bs.modal', function (e) {
472+
ariaNgNativeElectronService.updateTitleBarBackgroundColorWithModalOverlay();
473+
});
474+
471475
$('#import-settings-modal').on('hide.bs.modal', function (e) {
472476
$scope.context.importSettings = null;
477+
ariaNgNativeElectronService.updateTitleBarBackgroundColor();
473478
});
474479

475480
$scope.openAriaNgConfigFile = function () {
@@ -515,9 +520,14 @@
515520
angular.element('#export-settings-modal').modal();
516521
};
517522

523+
$('#export-settings-modal').on('show.bs.modal', function (e) {
524+
ariaNgNativeElectronService.updateTitleBarBackgroundColorWithModalOverlay();
525+
});
526+
518527
$('#export-settings-modal').on('hide.bs.modal', function (e) {
519528
$scope.context.exportSettings = null;
520529
$scope.context.exportSettingsCopied = false;
530+
ariaNgNativeElectronService.updateTitleBarBackgroundColor();
521531
});
522532

523533
$scope.copyExportSettings = function () {

‎app/scripts/controllers/task-detail.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -605,8 +605,13 @@
605605
updateAllDirNodesSelectedStatus();
606606
};
607607

608+
$('#custom-choose-file-modal').on('show.bs.modal', function (e) {
609+
ariaNgNativeElectronService.updateTitleBarBackgroundColorWithModalOverlay();
610+
});
611+
608612
$('#custom-choose-file-modal').on('hide.bs.modal', function (e) {
609613
$scope.context.fileExtensions = null;
614+
ariaNgNativeElectronService.updateTitleBarBackgroundColor();
610615
});
611616

612617
$scope.setSelectedFile = function (updateNodeSelectedStatus) {

‎app/scripts/core/root.js‎

Lines changed: 2 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -28,23 +28,16 @@
2828
return false;
2929
};
3030

31-
var setTitleBarColor = function () {
32-
var computedStyle = window.getComputedStyle(document.getElementById('window-title-bar'));
33-
var backgroundColor = computedStyle.getPropertyValue('background-color');
34-
var symbolColor = computedStyle.getPropertyValue('color');
35-
ariaNgNativeElectronService.setTitleBarColor(backgroundColor, symbolColor);
36-
};
37-
3831
var setLightTheme = function () {
3932
$rootScope.currentTheme = 'light';
4033
angular.element('body').removeClass('theme-dark');
41-
setTitleBarColor();
34+
ariaNgNativeElectronService.updateTitleBarBackgroundColor();
4235
};
4336

4437
var setDarkTheme = function () {
4538
$rootScope.currentTheme = 'dark';
4639
angular.element('body').addClass('theme-dark');
47-
setTitleBarColor();
40+
ariaNgNativeElectronService.updateTitleBarBackgroundColor();
4841
};
4942

5043
var setThemeBySystemSettings = function () {

‎app/scripts/directives/exportCommandApiDialog.js‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
(function () {
22
'use strict';
33

4-
angular.module('ariaNg').directive('ngExportCommandApiDialog', ['clipboard', 'ariaNgCommonService', function (clipboard, ariaNgCommonService) {
4+
angular.module('ariaNg').directive('ngExportCommandApiDialog', ['clipboard', 'ariaNgCommonService', 'ariaNgNativeElectronService', function (clipboard, ariaNgCommonService, ariaNgNativeElectronService) {
55
return {
66
restrict: 'E',
77
templateUrl: 'views/export-command-api-dialog.html',
@@ -98,6 +98,14 @@
9898
scope.context.isCopied = true;
9999
};
100100

101+
angular.element(element).on('show.bs.modal', function () {
102+
ariaNgNativeElectronService.updateTitleBarBackgroundColorWithModalOverlay();
103+
});
104+
105+
angular.element(element).on('hide.bs.modal', function () {
106+
ariaNgNativeElectronService.updateTitleBarBackgroundColor();
107+
});
108+
101109
angular.element(element).on('hidden.bs.modal', function () {
102110
scope.$apply(function () {
103111
scope.options = null;

‎app/scripts/directives/settingDialog.js‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
(function () {
22
'use strict';
33

4-
angular.module('ariaNg').directive('ngSettingDialog', ['ariaNgCommonService', 'aria2SettingService', function (ariaNgCommonService, aria2SettingService) {
4+
angular.module('ariaNg').directive('ngSettingDialog', ['ariaNgCommonService', 'aria2SettingService', 'ariaNgNativeElectronService', function (ariaNgCommonService, aria2SettingService, ariaNgNativeElectronService) {
55
return {
66
restrict: 'E',
77
templateUrl: 'views/setting-dialog.html',
@@ -49,6 +49,14 @@
4949
});
5050
};
5151

52+
angular.element(element).on('show.bs.modal', function () {
53+
ariaNgNativeElectronService.updateTitleBarBackgroundColorWithModalOverlay();
54+
});
55+
56+
angular.element(element).on('hide.bs.modal', function () {
57+
ariaNgNativeElectronService.updateTitleBarBackgroundColor();
58+
});
59+
5260
angular.element(element).on('hidden.bs.modal', function () {
5361
scope.$apply(function () {
5462
scope.setting = null;

‎app/scripts/services/ariaNgCommonService.js‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
(function () {
22
'use strict';
33

4-
angular.module('ariaNg').factory('ariaNgCommonService', ['$window', '$location', '$timeout', 'base64', 'moment', 'SweetAlert', 'ariaNgConstants', 'ariaNgLocalizationService', function ($window, $location, $timeout, base64, moment, SweetAlert, ariaNgConstants, ariaNgLocalizationService) {
4+
angular.module('ariaNg').factory('ariaNgCommonService', ['$window', '$location', '$timeout', 'base64', 'moment', 'SweetAlert', 'ariaNgConstants', 'ariaNgLocalizationService', 'ariaNgNativeElectronService', function ($window, $location, $timeout, base64, moment, SweetAlert, ariaNgConstants, ariaNgLocalizationService, ariaNgNativeElectronService) {
55
var getTimeOption = function (time) {
66
var name = '';
77
var value = time;
@@ -29,12 +29,16 @@
2929

3030
var showDialog = function (title, text, type, callback, options) {
3131
$timeout(function () {
32+
ariaNgNativeElectronService.updateTitleBarBackgroundColorWithSweetAlertOverlay();
33+
3234
SweetAlert.swal({
3335
title: title,
3436
text: text,
3537
type: type,
3638
confirmButtonText: options && options.confirmButtonText || null
3739
}, function () {
40+
ariaNgNativeElectronService.updateTitleBarBackgroundColor();
41+
3842
if (callback) {
3943
callback();
4044
}
@@ -58,7 +62,11 @@
5862
options.confirmButtonColor = '#F39C12';
5963
}
6064

65+
ariaNgNativeElectronService.updateTitleBarBackgroundColorWithSweetAlertOverlay();
66+
6167
SweetAlert.swal(options, function (isConfirm) {
68+
ariaNgNativeElectronService.updateTitleBarBackgroundColor();
69+
6270
if (!isConfirm) {
6371
return;
6472
}

‎app/scripts/services/ariaNgNativeElectronService.js‎

Lines changed: 56 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
(function () {
22
'use strict';
33

4-
angular.module('ariaNg').factory('ariaNgNativeElectronService', ['$q', 'ariaNgLogService', 'ariaNgLocalizationService', function ($q, ariaNgLogService, ariaNgLocalizationService) {
4+
angular.module('ariaNg').factory('ariaNgNativeElectronService', ['$window', '$q', 'ariaNgLogService', 'ariaNgLocalizationService', function ($window, $q, ariaNgLogService, ariaNgLocalizationService) {
55
var electron = angular.isFunction(window.nodeRequire) ? nodeRequire('electron') : {};
66
var ipcRenderer = electron.ipcRenderer || {};
77

@@ -73,8 +73,61 @@
7373
setNativeTheme: function (theme) {
7474
invokeMainProcessMethod('render-set-native-theme', theme);
7575
},
76-
setTitleBarColor: function (titleBarBackgroundColor, titleBarSymbolColor) {
77-
invokeMainProcessMethod('render-set-titlebar-color', titleBarBackgroundColor, titleBarSymbolColor);
76+
updateTitleBarBackgroundColor: function () {
77+
var titleBar = angular.element('#window-title-bar');
78+
79+
if (!titleBar || !titleBar[0]) {
80+
return;
81+
}
82+
83+
var computedStyle = $window.getComputedStyle(titleBar[0]);
84+
var backgroundColor = computedStyle.getPropertyValue('background-color');
85+
var symbolColor = computedStyle.getPropertyValue('color');
86+
invokeMainProcessMethod('render-set-titlebar-color', backgroundColor, symbolColor);
87+
},
88+
updateTitleBarBackgroundColorWithSweetAlertOverlay: function () {
89+
var titleBar = angular.element('#window-title-bar');
90+
91+
if (!titleBar || !titleBar[0]) {
92+
return;
93+
}
94+
95+
var computedStyle = $window.getComputedStyle(titleBar[0]);
96+
var backgroundColor = computedStyle.getPropertyValue('background-color');
97+
var symbolColor = computedStyle.getPropertyValue('color');
98+
99+
// This electron version not support transparent title bar, so we set hard code color
100+
var currentTheme = angular.element('body').hasClass('theme-dark') ? 'dark' : 'light';
101+
102+
if (currentTheme === 'light') {
103+
backgroundColor = 'rgb(148, 148, 148)';
104+
} else if (currentTheme === 'dark') {
105+
backgroundColor = 'rgb(7, 7, 7)';
106+
}
107+
108+
invokeMainProcessMethod('render-set-titlebar-color', backgroundColor, symbolColor);
109+
},
110+
updateTitleBarBackgroundColorWithModalOverlay: function () {
111+
var titleBar = angular.element('#window-title-bar');
112+
113+
if (!titleBar || !titleBar[0]) {
114+
return;
115+
}
116+
117+
var computedStyle = $window.getComputedStyle(titleBar[0]);
118+
var backgroundColor = computedStyle.getPropertyValue('background-color');
119+
var symbolColor = computedStyle.getPropertyValue('color');
120+
121+
// This electron version not support transparent title bar, so we set hard code color
122+
var currentTheme = angular.element('body').hasClass('theme-dark') ? 'dark' : 'light';
123+
124+
if (currentTheme === 'light') {
125+
backgroundColor = 'rgb(86, 86, 86)';
126+
} else if (currentTheme === 'dark') {
127+
backgroundColor = 'rgb(6, 6, 6)';
128+
}
129+
130+
invokeMainProcessMethod('render-set-titlebar-color', backgroundColor, symbolColor);
78131
},
79132
reload: function () {
80133
invokeMainProcessMethod('render-reload-native-window');

0 commit comments

Comments
 (0)