From 723cec3d1c34e2828cf4daa586d81028aa7c1e17 Mon Sep 17 00:00:00 2001 From: MaysWind Date: Mon, 16 May 2016 23:41:39 +0800 Subject: [PATCH] add AriaNg setting page, support set language and rpc server --- app/index.html | 10 +-- app/scripts/controllers/list.js | 14 +++-- app/scripts/controllers/settings-ariang.js | 8 +++ app/scripts/core/config.js | 4 +- app/scripts/core/constants.js | 2 +- app/scripts/core/router.js | 4 ++ app/scripts/langs/en-US.js | 10 ++- app/scripts/langs/zh-CN.js | 10 ++- app/scripts/services/aria2RpcService.js | 4 +- .../services/aria2WebSocketRpcService.js | 63 +++++++++++-------- app/scripts/services/ariaNgSettingService.js | 33 ++++++++-- app/styles/aria-ng.css | 38 ++++++++++- app/views/list.html | 2 +- app/views/settings-ariang.html | 40 ++++++++++++ 14 files changed, 188 insertions(+), 54 deletions(-) create mode 100644 app/scripts/controllers/settings-ariang.js create mode 100644 app/views/settings-ariang.html diff --git a/app/index.html b/app/index.html index 643ee1b..87d7fe9 100644 --- a/app/index.html +++ b/app/index.html @@ -90,11 +90,6 @@ -
  • - - - -
    • @@ -112,6 +107,10 @@
  • Stopped
    • +
  • Settings
    • +
  • + AriaNg Settings +
    • @@ -185,6 +184,7 @@ + diff --git a/app/scripts/controllers/list.js b/app/scripts/controllers/list.js index 289b015..99898bc 100644 --- a/app/scripts/controllers/list.js +++ b/app/scripts/controllers/list.js @@ -1,7 +1,7 @@ (function () { 'use strict'; - angular.module('ariaNg').controller('DownloadListController', ['$rootScope', '$scope', '$window', '$location', '$interval', 'translateFilter', 'aria2RpcService', 'ariaNgSettingService', 'utils', function ($rootScope, $scope, $window, $location, $interval, translateFilter, aria2RpcService, ariaNgSettingService, utils) { + angular.module('ariaNg').controller('DownloadListController', ['$scope', '$window', '$location', '$interval', 'translateFilter', 'aria2RpcService', 'ariaNgSettingService', 'utils', function ($scope, $window, $location, $interval, translateFilter, aria2RpcService, ariaNgSettingService, utils) { var location = $location.path().substring(1); var getTitleWidth = function () { @@ -57,11 +57,7 @@ return ariaNgSettingService.getDisplayOrder(); }; - if ($rootScope.downloadTaskRefreshTimer) { - $interval.cancel($rootScope.downloadTaskRefreshTimer); - } - - $rootScope.downloadTaskRefreshTimer = $interval(function () { + var downloadTaskRefreshPromise = $interval(function () { var invokeMethod = null; var params = []; @@ -92,5 +88,11 @@ }); } }, ariaNgSettingService.getDownloadTaskRefreshInterval()); + + $scope.$on('$destroy', function () { + if (downloadTaskRefreshPromise) { + $interval.cancel(downloadTaskRefreshPromise); + } + }); }]); })(); diff --git a/app/scripts/controllers/settings-ariang.js b/app/scripts/controllers/settings-ariang.js new file mode 100644 index 0000000..a755dc0 --- /dev/null +++ b/app/scripts/controllers/settings-ariang.js @@ -0,0 +1,8 @@ +(function () { + 'use strict'; + + angular.module('ariaNg').controller('AriaNgSettingsController', ['$scope', 'SweetAlert', 'ariaNgSettingService', function ($scope, SweetAlert, ariaNgSettingService) { + $scope.settings = ariaNgSettingService.getAllOptions(); + $scope.settingService = ariaNgSettingService; + }]); +})(); diff --git a/app/scripts/core/config.js b/app/scripts/core/config.js index ac0dcb0..b1de577 100644 --- a/app/scripts/core/config.js +++ b/app/scripts/core/config.js @@ -10,13 +10,13 @@ $translateProvider.preferredLanguage('en-US'); $translateProvider.useSanitizeValueStrategy('escape'); }]).run(['$translate', 'amMoment', 'moment', 'ariaNgConstants', 'ariaNgSettingService', function ($translate, amMoment, moment, ariaNgConstants, ariaNgSettingService) { - $translate.use(ariaNgSettingService.getLocaleName()); + $translate.use(ariaNgSettingService.getLanguage()); moment.updateLocale('zh-cn', { week: null }); - amMoment.changeLocale(ariaNgSettingService.getLocaleName()); + amMoment.changeLocale(ariaNgSettingService.getLanguage()); }]).run(['$rootScope', '$location', '$document', 'SweetAlert', 'ariaNgConstants', function ($rootScope, $location, $document, SweetAlert, ariaNgConstants) { var setNavbarSelected = function (location) { angular.element('section.sidebar > ul li').removeClass('active'); diff --git a/app/scripts/core/constants.js b/app/scripts/core/constants.js index e3ee106..852f7a6 100644 --- a/app/scripts/core/constants.js +++ b/app/scripts/core/constants.js @@ -5,7 +5,7 @@ title: 'Aria Ng', appPrefix: 'AriaNg' }).constant('ariaNgDefaultOptions', { - localeName: 'en-US', + language: 'en-US', protocol: 'http', globalStatRefreshInterval: 1000, downloadTaskRefreshInterval: 1000 diff --git a/app/scripts/core/router.js b/app/scripts/core/router.js index 448b96f..958a42e 100644 --- a/app/scripts/core/router.js +++ b/app/scripts/core/router.js @@ -15,6 +15,10 @@ templateUrl: 'views/list.html', controller: 'DownloadListController' }) + .when('/settings/ariang', { + templateUrl: 'views/settings-ariang.html', + controller: 'AriaNgSettingsController' + }) .otherwise({ redirectTo: '/downloading' }); diff --git a/app/scripts/langs/en-US.js b/app/scripts/langs/en-US.js index 407e51d..092e6a2 100644 --- a/app/scripts/langs/en-US.js +++ b/app/scripts/langs/en-US.js @@ -3,6 +3,7 @@ angular.module('ariaNg').config(['$translateProvider', function ($translateProvider) { $translateProvider.translations('en-US', { + 'English': 'English', 'New': 'New', 'Start': 'Start', 'Pause': 'Pause', @@ -13,15 +14,20 @@ 'By File Size': 'By File Size', 'By Completed Percent': 'By Completed Percent', 'By Remain Time': 'By Remain Time', - 'Settings': 'Settings', 'Download': 'Download', 'Downloading': 'Downloading', 'Waiting': 'Waiting', 'Stopped': 'Stopped', + 'Settings': 'Settings', + 'AriaNg Settings': 'AriaNg Settings', + 'Language': 'Language', + 'Aria2 RPC Host': 'Aria2 RPC Host', + 'Aria2 RPC Protocol': 'Aria2 RPC Protocol', 'Toggle Navigation': 'Toggle Navigation', 'Loading': 'Loading...', 'More Than One Day': 'More than 1 day', - 'Unknown': 'Unknown' + 'Unknown': 'Unknown', + 'Changes to the settings take effect after refreshing page.': 'Changes to the settings take effect after refreshing page.' }); }]) })(); diff --git a/app/scripts/langs/zh-CN.js b/app/scripts/langs/zh-CN.js index d4290cc..e25a07f 100644 --- a/app/scripts/langs/zh-CN.js +++ b/app/scripts/langs/zh-CN.js @@ -3,6 +3,7 @@ angular.module('ariaNg').config(['$translateProvider', function ($translateProvider) { $translateProvider.translations('zh-CN', { + 'Simplified Chinese': '简体中文', 'New': '新建', 'Start': '开始下载任务', 'Pause': '暂停下载任务', @@ -13,15 +14,20 @@ 'By File Size': '按文件大小', 'By Completed Percent': '按完成度', 'By Remain Time': '按剩余时间', - 'Settings': '系统设置', 'Download': '下载', 'Downloading': '正在下载', 'Waiting': '正在等待', 'Stopped': '已停止', + 'Settings': '系统设置', + 'AriaNg Settings': 'AriaNg 设置', + 'Language': '语言', + 'Aria2 RPC Host': 'Aria2 RPC 主机', + 'Aria2 RPC Protocol': 'Aria2 RPC 协议', 'Toggle Navigation': '切换导航', 'Loading': '正在加载...', 'More Than One Day': '超过1天', - 'Unknown': '未知' + 'Unknown': '未知', + 'Changes to the settings take effect after refreshing page.': '设置将在刷新页面后生效.' }); }]) })(); diff --git a/app/scripts/services/aria2RpcService.js b/app/scripts/services/aria2RpcService.js index aaca4f7..36e2d86 100644 --- a/app/scripts/services/aria2RpcService.js +++ b/app/scripts/services/aria2RpcService.js @@ -2,6 +2,8 @@ 'use strict'; angular.module('ariaNg').factory('aria2RpcService', ['aria2RpcConstants', 'ariaNgSettingService', 'aria2HttpRpcService', 'aria2WebSocketRpcService', 'utils', function (aria2RpcConstants, ariaNgSettingService, aria2HttpRpcService, aria2WebSocketRpcService, utils) { + var protocol = ariaNgSettingService.getProtocol(); + var invoke = function (method, context) { context.uniqueId = utils.generateUniqueId(); context.requestBody = { @@ -11,7 +13,7 @@ params: context.params }; - if (ariaNgSettingService.getProtocol() == 'ws') { + if (protocol == 'ws') { return aria2WebSocketRpcService.request(context); } else { return aria2HttpRpcService.request(context); diff --git a/app/scripts/services/aria2WebSocketRpcService.js b/app/scripts/services/aria2WebSocketRpcService.js index 2c45fea..7235849 100644 --- a/app/scripts/services/aria2WebSocketRpcService.js +++ b/app/scripts/services/aria2WebSocketRpcService.js @@ -3,36 +3,44 @@ angular.module('ariaNg').factory('aria2WebSocketRpcService', ['$websocket', 'ariaNgSettingService', function ($websocket, ariaNgSettingService) { var rpcUrl = ariaNgSettingService.getJsonRpcUrl('ws'); - var socketClient = $websocket(rpcUrl); + var socketClient = null; var sendIdMapping = {}; - socketClient.onMessage(function (message) { - if (!message || !message.data) { - return; + var getSocketClient = function () { + if (socketClient == null) { + socketClient = $websocket(rpcUrl); + + socketClient.onMessage(function (message) { + if (!message || !message.data) { + return; + } + + var content = angular.fromJson(message.data); + + if (!content || !content.id) { + return; + } + + var uniqueId = content.id; + var result = content.result; + + if (!sendIdMapping[uniqueId]) { + return; + } + + var context = sendIdMapping[uniqueId]; + var callbackMethod = context.callback; + + if (callbackMethod) { + callbackMethod(result); + } + + delete sendIdMapping[uniqueId]; + }); } - var content = angular.fromJson(message.data); - - if (!content || !content.id) { - return; - } - - var uniqueId = content.id; - var result = content.result; - - if (!sendIdMapping[uniqueId]) { - return; - } - - var context = sendIdMapping[uniqueId]; - var callbackMethod = context.callback; - - if (callbackMethod) { - callbackMethod(result); - } - - delete sendIdMapping[uniqueId]; - }); + return socketClient; + }; return { request: function (context) { @@ -40,12 +48,13 @@ return; } + var client = getSocketClient(); var uniqueId = context.uniqueId; var requestBody = angular.toJson(context.requestBody); sendIdMapping[uniqueId] = context; - return socketClient.send(requestBody); + return client.send(requestBody); } }; }]); diff --git a/app/scripts/services/ariaNgSettingService.js b/app/scripts/services/ariaNgSettingService.js index 8a045a8..4e066c5 100644 --- a/app/scripts/services/ariaNgSettingService.js +++ b/app/scripts/services/ariaNgSettingService.js @@ -1,7 +1,12 @@ (function () { 'use strict'; - angular.module('ariaNg').factory('ariaNgSettingService', ['$location', '$translate', 'localStorageService', 'ariaNgDefaultOptions', function ($location, $translate, localStorageService, ariaNgDefaultOptions) { + angular.module('ariaNg').factory('ariaNgSettingService', ['$location', '$translate', 'amMoment', 'localStorageService', 'ariaNgDefaultOptions', function ($location, $translate, amMoment, localStorageService, ariaNgDefaultOptions) { + var getDefaultJsonRpcHost = function () { + var rpcHost = $location.$$host + ':6800'; + return rpcHost; + }; + var setOptions = function (options) { return localStorageService.set('Options', options); }; @@ -36,22 +41,38 @@ }; return { - getLocaleName: function () { - return getOption('localeName'); + getAllOptions: function () { + var options = angular.extend({}, ariaNgDefaultOptions, getOptions()); + + if (!options.aria2RpcHost) { + options.aria2RpcHost = getDefaultJsonRpcHost(); + } + + return options; }, - setLocaleName: function (value) { - setOption('localeName', value); + setAllOptions: function (options) { + setOptions(options); + }, + getLanguage: function () { + return getOption('language'); + }, + setLanguage: function (value) { + setOption('language', value); $translate.use(value); + amMoment.changeLocale(value); }, getJsonRpcUrl: function (protocol) { var rpcHost = getOption('aria2RpcHost'); if (!rpcHost) { - rpcHost = $location.$$host + ':6800'; + rpcHost = getDefaultJsonRpcHost(); } return protocol + '://' + rpcHost + '/jsonrpc'; }, + setJsonRpcHost: function (value) { + setOption('aria2RpcHost', value); + }, getProtocol: function () { return getOption('protocol'); }, diff --git a/app/styles/aria-ng.css b/app/styles/aria-ng.css index 8105fe9..10e818d 100644 --- a/app/styles/aria-ng.css +++ b/app/styles/aria-ng.css @@ -257,7 +257,7 @@ td { } .task-table > div.row:hover { - background-color: #f5f5f5 !important; + background-color: #f5f5f5; } .task-table .task-name { @@ -283,6 +283,42 @@ td { font-size: 12px; } +/* settings-table */ +.settings-table { + margin-left: 15px; + margin-right: 15px; +} + +.settings-table > div.row { + padding: 8px; + border-top: 1px solid #ddd; +} + +.settings-table > div.row:nth-of-type(odd) { + background-color: #f9f9f9; +} + +.settings-table > div.row:hover { + background-color: #f5f5f5; +} + +.settings-table .setting-key { + padding-top: 6px; +} + +.settings-table .asterisk { + color: red; +} + +.settings-table .tip { + background-color: #fff; + font-size: 12px; + padding: 4px; +} +.settings-table .tip:hover { + background-color: #fff !important; +} + /* miscellaneous */ span.realtime-upload, span.realtime-download { padding: 0 15px 0 15px; diff --git a/app/views/list.html b/app/views/list.html index 1b103ac..31ee58f 100644 --- a/app/views/list.html +++ b/app/views/list.html @@ -3,7 +3,7 @@
    - +
    diff --git a/app/views/settings-ariang.html b/app/views/settings-ariang.html new file mode 100644 index 0000000..f8442d0 --- /dev/null +++ b/app/views/settings-ariang.html @@ -0,0 +1,40 @@ +
    +
    +
    +
    + Language +
    +
    + +
    +
    +
    +
    + Aria2 RPC Host + * +
    +
    + +
    +
    +
    +
    + Aria2 RPC Protocol + * +
    +
    + +
    +
    +
    + * + Changes to the settings take effect after refreshing page. +
    +
    +