simon/AriaNg
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

add AriaNg setting page, support set language and rpc server

Browse source
This commit is contained in:
MaysWind 2016-05-16 23:41:39 +08:00
parent c42300aee2
commit 723cec3d1c
14 changed files with 188 additions and 54 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
app/index.html
View file

@ -90,11 +90,6 @@
</li>
</ul>
</li>
<li>
<a class="pointer-cursor" title="{{'Settings' | translate}}">
<i class="fa fa-cog"></i>
</a>
</li>
</ul>
</nav>
</header>
@ -112,6 +107,10 @@
<li data-href-match="/stopped">
<a href="#/stopped"><i class="fa fa-stop-circle-o"></i> <span ng-bind="('Stopped' | translate) + (globalStat && globalStat.numStopped > 0 ? ' (' + globalStat.numStopped + ')' : '')">Stopped</span></a>
</li>
<li class="header" translate>Settings</li>
<li data-href-match="/settings/ariang">
<a href="#/settings/ariang"><i class="fa fa-cog"></i> <span translate>AriaNg Settings</span></a>
</li>
</ul>
</section>
</aside>
@ -185,6 +184,7 @@
<script src="scripts/core/utils.js"></script>
<script src="scripts/controllers/list.js"></script>
<script src="scripts/controllers/main.js"></script>
<script src="scripts/controllers/settings-ariang.js"></script>
<script src="scripts/filters/dateDuration.js"></script>
<script src="scripts/filters/substring.js"></script>
<script src="scripts/filters/taskOrderBy.js"></script>

14
app/scripts/controllers/list.js
View file

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

8
app/scripts/controllers/settings-ariang.js Normal file
View file

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

4
app/scripts/core/config.js
View file

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

2
app/scripts/core/constants.js
View file

@ -5,7 +5,7 @@
title: 'Aria Ng',
appPrefix: 'AriaNg'
}).constant('ariaNgDefaultOptions', {
localeName: 'en-US',
language: 'en-US',
protocol: 'http',
globalStatRefreshInterval: 1000,
downloadTaskRefreshInterval: 1000

4
app/scripts/core/router.js
View file

@ -15,6 +15,10 @@
templateUrl: 'views/list.html',
controller: 'DownloadListController'
})
.when('/settings/ariang', {
templateUrl: 'views/settings-ariang.html',
controller: 'AriaNgSettingsController'
})
.otherwise({
redirectTo: '/downloading'
});

10
app/scripts/langs/en-US.js
View file

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

10
app/scripts/langs/zh-CN.js
View file

@ -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.': '设置将在刷新页面后生效.'
});
}])
})();

4
app/scripts/services/aria2RpcService.js
View file

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

63
app/scripts/services/aria2WebSocketRpcService.js
View file

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

33
app/scripts/services/ariaNgSettingService.js
View file

@ -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');
},

38
app/styles/aria-ng.css
View file

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

2
app/views/list.html
View file

@ -3,7 +3,7 @@
<div class="row" ng-repeat="task in downloadTasks | taskOrderBy: getOrderType()" data-gid="{{task.gid}}">
<div class="col-md-8">
<span class="task-name" ng-bind="task.taskName | substring: (titleWidth / 20)" title="{{task.taskName}}"></span>
<span class="task-volumn" ng-bind="task.totalLength | readableVolumn"></span>
<span class="task-volumn" ng-bind="task.fileSize | readableVolumn"></span>
</div>
<div class="col-md-2">
<div class="progress">

40
app/views/settings-ariang.html Normal file
View file

@ -0,0 +1,40 @@
<section class="content no-padding">
<div class="settings-table">
<div class="row">
<div class="setting-key col-md-4">
<span translate>Language</span>
</div>
<div class="setting-value col-md-8">
<select class="form-control" style="width: 100%;" ng-model="settings.language" ng-change="settingService.setLanguage(settings.language)">
<option value="en-US" translate translate-language="en-US">English</option>
<option value="zh-CN" translate translate-language="zh-CN">Simplified Chinese</option>
</select>
</div>
</div>
<div class="row">
<div class="setting-key col-md-4">
<span translate>Aria2 RPC Host</span>
<span class="asterisk">*</span>
</div>
<div class="setting-value col-md-8" translate>
<input class="form-control" ng-model="settings.aria2RpcHost" ng-change="settingService.setJsonRpcHost(settings.aria2RpcHost)" />
</div>
</div>
<div class="row">
<div class="setting-key col-md-4">
<span translate>Aria2 RPC Protocol</span>
<span class="asterisk">*</span>
</div>
<div class="setting-value col-md-8">
<select class="form-control" style="width: 100%;" ng-model="settings.protocol" ng-change="settingService.setProtocol(settings.protocol)">
<option value="http" translate>Http</option>
<option value="ws" translate>WebSocket</option>
</select>
</div>
</div>
<div class="row tip">
<span class="asterisk">*</span>
<span translate>Changes to the settings take effect after refreshing page.</span>
</div>
</div>
</section>