add quick setting in footer toolbar

src/index.html

@@ -244,7 +244,20 @@
     <footer class="main-footer">
         <a class="sidebar-toggle" data-toggle="offcanvas" role="button" title="{{'Toggle Navigation' | translate}}"></a>
 
-        <span>&nbsp;</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>

src/langs/zh_CN.txt

@@ -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=未知

src/scripts/config/aria2Options.js

@@ -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:
         // {

src/scripts/config/defaultLanguage.js

@@ -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',

src/scripts/controllers/main.js

@@ -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;

src/scripts/directives/settingDialog.js

@@ -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);
+            }
+        };
+    }]);
+}());

src/scripts/services/aria2SettingService.js

@@ -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 = [];

src/styles/core/core.css

@@ -69,6 +69,10 @@ td {
     overflow-y: scroll;
 }
 
+.main-footer .toolbar {
+    display: inline-block;
+}
+
 .dropdown-menu.right-align {
     left: inherit;
     right: 0;

src/styles/theme/default.css

@@ -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;
 }
 

src/views/setting-dialog.html

@@ -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">&times;</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 -->