add quick setting in footer toolbar
This commit is contained in:
parent
c92873bf68
commit
68a598b19e
|
@ -244,7 +244,20 @@
|
|||
<footer class="main-footer">
|
||||
<a class="sidebar-toggle" data-toggle="offcanvas" role="button" title="{{'Toggle Navigation' | translate}}"></a>
|
||||
|
||||
<span> </span>
|
||||
<div class="toolbar dropup">
|
||||
<a class="dropdown-toggle" data-toggle="dropdown" role="button" title="{{'Quick Setting' | translate}}">
|
||||
<i class="fa fa-wrench"></i>
|
||||
<span translate>Quick Setting</span>
|
||||
<i class="fa fa-caret-right fa-right-bottom fa-rotate-45 fa-half" aria-hidden="true"></i>
|
||||
</a>
|
||||
<ul class="dropdown-menu" role="menu">
|
||||
<li>
|
||||
<a class="pointer-cursor" ng-click="showQuickSettingDialog('globalSpeedLimit', 'Global Speed Limit')">
|
||||
<span translate>Global Speed Limit</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="pull-right ng-cloak" ng-if="globalStatusContext.isEnabled">
|
||||
<a class="global-status" title="{{('Click to pin' | translate)}}" ng-pop-chart ng-data="globalStatusContext.data"
|
||||
|
@ -260,6 +273,8 @@
|
|||
</a>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<ng-setting-dialog setting="quickSettingContext"></ng-setting-dialog>
|
||||
</div>
|
||||
|
||||
<!-- build:js js/jquery-2.2.4.min.js -->
|
||||
|
@ -333,6 +348,7 @@
|
|||
<script src="scripts/directives/chart.js"></script>
|
||||
<script src="scripts/directives/placeholder.js"></script>
|
||||
<script src="scripts/directives/setting.js"></script>
|
||||
<script src="scripts/directives/settingDialog.js"></script>
|
||||
<script src="scripts/directives/tooltip.js"></script>
|
||||
<script src="scripts/filters/dateDuration.js"></script>
|
||||
<script src="scripts/filters/fileOrderBy.js"></script>
|
||||
|
|
|
@ -164,6 +164,8 @@ Are you sure you want to shutdown aria2?=您是否要关闭 aria2?
|
|||
Session has been saved successfully.=会话已经成功保存.
|
||||
Aria2 has been shutdown successfully.=Aria2 已经成功关闭.
|
||||
Toggle Navigation=切换导航
|
||||
Quick Setting=快捷设置
|
||||
Global Speed Limit=全局速度限制
|
||||
Loading=正在加载...
|
||||
More Than One Day=超过1天
|
||||
Unknown=未知
|
||||
|
|
|
@ -861,6 +861,10 @@
|
|||
'no-file-allocation-limit', 'parameterized-uri', 'quiet', 'realtime-chunk-checksum', 'remove-control-file',
|
||||
'save-session', 'save-session-interval', 'socket-recv-buffer-size', 'stop', 'truncate-console-readout'
|
||||
]
|
||||
}).constant('aria2QuickSettingsAvailableOptions', {
|
||||
globalSpeedLimitOptions: [
|
||||
'max-download-limit', 'max-upload-limit'
|
||||
]
|
||||
}).constant('aria2TaskAvailableOptions', {
|
||||
// Aria2 Task Option Defination EXAMPLE:
|
||||
// {
|
||||
|
|
|
@ -168,6 +168,8 @@
|
|||
'Session has been saved successfully.': 'Session has been saved successfully.',
|
||||
'Aria2 has been shutdown successfully.': 'Aria2 has been shutdown successfully.',
|
||||
'Toggle Navigation': 'Toggle Navigation',
|
||||
'Quick Setting': 'Quick Setting',
|
||||
'Global Speed Limit': 'Global Speed Limit',
|
||||
'Loading': 'Loading...',
|
||||
'More Than One Day': 'More than 1 day',
|
||||
'Unknown': 'Unknown',
|
||||
|
|
|
@ -36,6 +36,8 @@
|
|||
data: ariaNgMonitorService.getGlobalStatsData()
|
||||
};
|
||||
|
||||
$scope.quickSettingContext = null;
|
||||
|
||||
$scope.rpcSettings = ariaNgSettingService.getAllRpcSettings();
|
||||
|
||||
$scope.isTaskSelected = function () {
|
||||
|
@ -213,6 +215,13 @@
|
|||
return orderType.equals(targetType);
|
||||
};
|
||||
|
||||
$scope.showQuickSettingDialog = function (type, title) {
|
||||
$scope.quickSettingContext = {
|
||||
type: type,
|
||||
title: title
|
||||
};
|
||||
};
|
||||
|
||||
$scope.switchRpcSetting = function (setting) {
|
||||
if (setting.isDefault) {
|
||||
return;
|
||||
|
|
69
src/scripts/directives/settingDialog.js
Normal file
69
src/scripts/directives/settingDialog.js
Normal file
|
@ -0,0 +1,69 @@
|
|||
(function () {
|
||||
'use strict';
|
||||
|
||||
angular.module('ariaNg').directive('ngSettingDialog', ['ariaNgCommonService', 'aria2SettingService', function (ariaNgCommonService, aria2SettingService) {
|
||||
return {
|
||||
restrict: 'E',
|
||||
templateUrl: 'views/setting-dialog.html',
|
||||
replace: true,
|
||||
scope: {
|
||||
setting: '='
|
||||
},
|
||||
link: function (scope, element, attrs) {
|
||||
scope.context = {
|
||||
isLoading: false,
|
||||
availableOptions: [],
|
||||
globalOptions: []
|
||||
};
|
||||
|
||||
scope.setGlobalOption = function (key, value, optionStatus) {
|
||||
return aria2SettingService.setGlobalOption(key, value, function (response) {
|
||||
if (response.success && response.data === 'OK') {
|
||||
optionStatus.setSuccess();
|
||||
} else {
|
||||
optionStatus.setFailed(response.data.message);
|
||||
}
|
||||
}, true);
|
||||
};
|
||||
|
||||
var loadOptions = function (type) {
|
||||
var keys = aria2SettingService.getaria2QuickSettingsAvailableOptions(type);
|
||||
|
||||
if (!keys) {
|
||||
ariaNgCommonService.showError('Type is illegal!');
|
||||
return;
|
||||
}
|
||||
|
||||
scope.context.availableOptions = aria2SettingService.getSpecifiedOptions(keys);
|
||||
};
|
||||
|
||||
var loadAria2OptionsValue = function () {
|
||||
scope.context.isLoading = true;
|
||||
|
||||
return aria2SettingService.getGlobalOption(function (response) {
|
||||
scope.context.isLoading = false;
|
||||
|
||||
if (response.success) {
|
||||
scope.context.globalOptions = response.data;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
$('#quickSettingModal').on('hidden.bs.modal', function () {
|
||||
scope.setting = null;
|
||||
scope.context.availableOptions = [];
|
||||
scope.context.globalOptions = [];
|
||||
});
|
||||
|
||||
scope.$watch('setting', function (setting) {
|
||||
if (setting) {
|
||||
loadOptions(setting.type);
|
||||
loadAria2OptionsValue();
|
||||
|
||||
$('#quickSettingModal').modal('show');
|
||||
}
|
||||
}, true);
|
||||
}
|
||||
};
|
||||
}]);
|
||||
}());
|
|
@ -1,7 +1,7 @@
|
|||
(function () {
|
||||
'use strict';
|
||||
|
||||
angular.module('ariaNg').factory('aria2SettingService', ['aria2AllOptions', 'aria2GlobalAvailableOptions', 'aria2TaskAvailableOptions', 'aria2RpcService', 'ariaNgLogService', function (aria2AllOptions, aria2GlobalAvailableOptions, aria2TaskAvailableOptions, aria2RpcService, ariaNgLogService) {
|
||||
angular.module('ariaNg').factory('aria2SettingService', ['aria2AllOptions', 'aria2GlobalAvailableOptions', 'aria2QuickSettingsAvailableOptions', 'aria2TaskAvailableOptions', 'aria2RpcService', 'ariaNgLogService', function (aria2AllOptions, aria2GlobalAvailableOptions, aria2QuickSettingsAvailableOptions, aria2TaskAvailableOptions, aria2RpcService, ariaNgLogService) {
|
||||
var processStatResult = function (stat) {
|
||||
if (!stat) {
|
||||
return stat;
|
||||
|
@ -38,6 +38,13 @@
|
|||
return false;
|
||||
}
|
||||
},
|
||||
getaria2QuickSettingsAvailableOptions: function (type) {
|
||||
if (type === 'globalSpeedLimit') {
|
||||
return aria2QuickSettingsAvailableOptions.globalSpeedLimitOptions;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
getAvailableTaskOptionKeys: function (status, isBittorrent) {
|
||||
var allOptions = aria2TaskAvailableOptions.taskOptions;
|
||||
var availableOptions = [];
|
||||
|
|
|
@ -69,6 +69,10 @@ td {
|
|||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.main-footer .toolbar {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.dropdown-menu.right-align {
|
||||
left: inherit;
|
||||
right: 0;
|
||||
|
|
|
@ -40,11 +40,11 @@
|
|||
top: 15px;
|
||||
}
|
||||
|
||||
.skin-aria-ng .main-header .navbar .sidebar-toggle, .skin-aria-ng .main-footer .sidebar-toggle {
|
||||
.skin-aria-ng .main-header .navbar .sidebar-toggle, .skin-aria-ng .main-footer .sidebar-toggle, .skin-aria-ng .main-footer .toolbar > a {
|
||||
color: #707070;
|
||||
}
|
||||
|
||||
.skin-aria-ng .main-header .navbar .sidebar-toggle:hover, .skin-aria-ng .main-footer .sidebar-toggle:hover {
|
||||
.skin-aria-ng .main-header .navbar .sidebar-toggle:hover, .skin-aria-ng .main-footer .sidebar-toggle:hover, .skin-aria-ng .main-footer .toolbar > a:hover, .skin-aria-ng .main-footer .toolbar.open > a {
|
||||
color: #0080ff;
|
||||
}
|
||||
|
||||
|
|
23
src/views/setting-dialog.html
Normal file
23
src/views/setting-dialog.html
Normal file
|
@ -0,0 +1,23 @@
|
|||
<div id="quickSettingModal" class="modal fade" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title" ng-bind="(setting ? (setting.title) : 'Quick Settings') | translate">Quick Setting</h4>
|
||||
</div>
|
||||
<div class="modal-body overlay-wrapper no-padding">
|
||||
<div class="settings-table striped hoverable">
|
||||
<ng-setting ng-repeat="option in context.availableOptions" option="option"
|
||||
ng-model="context.globalOptions[option.key]" default-value="option.defaultValue"
|
||||
on-change-value="setGlobalOption(key, value, optionStatus)"></ng-setting>
|
||||
</div>
|
||||
<div class="overlay" ng-if="context.isLoading">
|
||||
<i class="fa fa-refresh fa-spin"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal" translate>Cancel</button>
|
||||
</div>
|
||||
</div><!-- /.modal-content -->
|
||||
</div><!-- /.modal-dialog -->
|
||||
</div><!-- /.modal -->
|
Reference in a new issue