support customize page title

This commit is contained in:
MaysWind 2016-06-26 21:31:58 +08:00
parent 853504ae4c
commit 6406e6816b
8 changed files with 76 additions and 3 deletions

View file

@ -295,6 +295,7 @@
<script src="scripts/directives/chart.js"></script> <script src="scripts/directives/chart.js"></script>
<script src="scripts/directives/placeholder.js"></script> <script src="scripts/directives/placeholder.js"></script>
<script src="scripts/directives/setting.js"></script> <script src="scripts/directives/setting.js"></script>
<script src="scripts/directives/tooltip.js"></script>
<script src="scripts/filters/dateDuration.js"></script> <script src="scripts/filters/dateDuration.js"></script>
<script src="scripts/filters/fileOrderBy.js"></script> <script src="scripts/filters/fileOrderBy.js"></script>
<script src="scripts/filters/longDate.js"></script> <script src="scripts/filters/longDate.js"></script>

View file

@ -100,12 +100,14 @@
"Failed to load file!": "加载文件失败!", "Failed to load file!": "加载文件失败!",
"More Options": "更多选项", "More Options": "更多选项",
"Language": "语言", "Language": "语言",
"Page Title": "页面标题",
"Aria2 RPC Host": "Aria2 RPC 主机", "Aria2 RPC Host": "Aria2 RPC 主机",
"Aria2 RPC Port": "Aria2 RPC 端口", "Aria2 RPC Port": "Aria2 RPC 端口",
"Aria2 RPC Protocol": "Aria2 RPC 协议", "Aria2 RPC Protocol": "Aria2 RPC 协议",
"Aria2 RPC Secret Token": "Aria2 RPC 密钥", "Aria2 RPC Secret Token": "Aria2 RPC 密钥",
"Global Stat Refresh Interval": "全局状态刷新间隔", "Global Stat Refresh Interval": "全局状态刷新间隔",
"Download Task Refresh Interval": "下载任务刷新间隔", "Download Task Refresh Interval": "下载任务刷新间隔",
"Supported Placeholder: AriaNg Title ${title}, Downloading Count ${downloading}, Waiting Count ${waiting}, Stopped Count ${stopped}, Download Speed ${downspeed}, Upload Speed ${upspeed}.": "支持的占位符: AriaNg 标题 ${title}, 正在下载数量 ${downloading}, 正在等待数量 ${waiting}, 已停止数量 ${stopped}, 下载速度 ${downspeed}, 上传速度: ${upspeed}.",
"Aria2 Version": "Aria2 版本", "Aria2 Version": "Aria2 版本",
"Enabled Features": "已启用的功能", "Enabled Features": "已启用的功能",
"Functions": "方法", "Functions": "方法",

View file

@ -2,7 +2,7 @@
'use strict'; 'use strict';
angular.module('ariaNg').constant('ariaNgConstants', { angular.module('ariaNg').constant('ariaNgConstants', {
title: 'Aria Ng', title: 'AriaNg',
appPrefix: 'AriaNg', appPrefix: 'AriaNg',
optionStorageKey: 'Options', optionStorageKey: 'Options',
globalStatStorageCapacity: 120, globalStatStorageCapacity: 120,
@ -108,6 +108,7 @@
] ]
}).constant('ariaNgDefaultOptions', { }).constant('ariaNgDefaultOptions', {
language: 'en', language: 'en',
title: '${downspeed}, ${upspeed} - ${title}',
rpcHost: '', rpcHost: '',
rpcPort: '6800', rpcPort: '6800',
protocol: 'http', protocol: 'http',

View file

@ -104,12 +104,14 @@
'Failed to load file!': 'Failed to load file!', 'Failed to load file!': 'Failed to load file!',
'More Options': 'More Options', 'More Options': 'More Options',
'Language': 'Language', 'Language': 'Language',
'Page Title': 'Page Title',
'Aria2 RPC Host': 'Aria2 RPC Host', 'Aria2 RPC Host': 'Aria2 RPC Host',
'Aria2 RPC Port': 'Aria2 RPC Port', 'Aria2 RPC Port': 'Aria2 RPC Port',
'Aria2 RPC Protocol': 'Aria2 RPC Protocol', 'Aria2 RPC Protocol': 'Aria2 RPC Protocol',
'Aria2 RPC Secret Token': 'Aria2 RPC Secret Token', 'Aria2 RPC Secret Token': 'Aria2 RPC Secret Token',
'Global Stat Refresh Interval': 'Global Stat Refresh Interval', 'Global Stat Refresh Interval': 'Global Stat Refresh Interval',
'Download Task Refresh Interval': 'Download Task Refresh Interval', 'Download Task Refresh Interval': 'Download Task Refresh Interval',
'Supported Placeholder: AriaNg Title ${title}, Downloading Count ${downloading}, Waiting Count ${waiting}, Stopped Count ${stopped}, Download Speed ${downspeed}, Upload Speed ${upspeed}.': 'Supported Placeholder: AriaNg Title ${title}, Downloading Count ${downloading}, Waiting Count ${waiting}, Stopped Count ${stopped}, Download Speed ${downspeed}, Upload Speed ${upspeed}.',
'Aria2 Version': 'Aria2 Version', 'Aria2 Version': 'Aria2 Version',
'Enabled Features': 'Enabled Features', 'Enabled Features': 'Enabled Features',
'Functions': 'Functions', 'Functions': 'Functions',

View file

@ -1,7 +1,7 @@
(function () { (function () {
'use strict'; 'use strict';
angular.module('ariaNg').controller('MainController', ['$rootScope', '$scope', '$route', '$location', '$interval', 'aria2RpcErrors', 'ariaNgCommonService', 'ariaNgSettingService', 'ariaNgMonitorService', 'aria2TaskService', 'aria2SettingService', function ($rootScope, $scope, $route, $location, $interval, aria2RpcErrors, ariaNgCommonService, ariaNgSettingService, ariaNgMonitorService, aria2TaskService, aria2SettingService) { angular.module('ariaNg').controller('MainController', ['$rootScope', '$scope', '$route', '$location', '$document', '$interval', 'aria2RpcErrors', 'ariaNgCommonService', 'ariaNgSettingService', 'ariaNgMonitorService', 'aria2TaskService', 'aria2SettingService', function ($rootScope, $scope, $route, $location, $document, $interval, aria2RpcErrors, ariaNgCommonService, ariaNgSettingService, ariaNgMonitorService, aria2TaskService, aria2SettingService) {
var globalStatRefreshPromise = null; var globalStatRefreshPromise = null;
var refreshGlobalStat = function (silent) { var refreshGlobalStat = function (silent) {
@ -13,6 +13,13 @@
if (response.success) { if (response.success) {
$scope.globalStat = response.data; $scope.globalStat = response.data;
$document[0].title = ariaNgSettingService.getFinalTitle({
downloadingCount: $scope.globalStat.numActive,
waitingCount: $scope.globalStat.numWaiting,
stoppedCount: $scope.globalStat.numStopped,
downloadSpeed: $scope.globalStat.downloadSpeed,
uploadSpeed: $scope.globalStat.uploadSpeed
});
ariaNgMonitorService.recordGlobalStat(response.data); ariaNgMonitorService.recordGlobalStat(response.data);
} }
}, silent); }, silent);

View file

@ -0,0 +1,32 @@
(function () {
'use strict';
angular.module('ariaNg').directive('ngTooltip', function () {
return {
restrict: 'A',
scope: {
title: '@ngTooltip'
},
link: function (scope, element, attrs) {
var options = {
ngTooltipPlacement: 'top',
ngTooltipContainer: null,
ngTooltipTrigger: 'hover'
};
angular.extend(options, attrs);
$(element).tooltip({
title: scope.title,
placement: options.ngTooltipPlacement,
container: options.ngTooltipContainer,
trigger: options.ngTooltipTrigger
});
scope.$watch('title', function () {
$(element).attr('title', scope.title).tooltip('fixTitle');
});
}
};
});
})();

View file

@ -1,7 +1,7 @@
(function () { (function () {
'use strict'; 'use strict';
angular.module('ariaNg').factory('ariaNgSettingService', ['$location', '$translate', 'base64', 'amMoment', 'localStorageService', 'ariaNgConstants', 'ariaNgDefaultOptions', 'ariaNgLanguages', function ($location, $translate, base64, amMoment, localStorageService, ariaNgConstants, ariaNgDefaultOptions, ariaNgLanguages) { angular.module('ariaNg').factory('ariaNgSettingService', ['$location', '$filter', '$translate', 'base64', 'amMoment', 'localStorageService', 'ariaNgConstants', 'ariaNgDefaultOptions', 'ariaNgLanguages', function ($location, $filter, $translate, base64, amMoment, localStorageService, ariaNgConstants, ariaNgDefaultOptions, ariaNgLanguages) {
var getDefaultRpcHost = function () { var getDefaultRpcHost = function () {
return $location.$$host; return $location.$$host;
}; };
@ -71,6 +71,24 @@
setOption('language', value); setOption('language', value);
} }
}, },
getTitle: function () {
return getOption('title');
},
getFinalTitle: function (context) {
var title = this.getTitle();
title = title.replace(/\$\{downloading\}/g, $translate.instant('Downloading') + ': ' + context.downloadingCount);
title = title.replace(/\$\{waiting\}/g, $translate.instant('Waiting') + ': ' + context.waitingCount);
title = title.replace(/\$\{stopped\}/g, $translate.instant('Downloaded / Stopped') + ': ' + context.stoppedCount);
title = title.replace(/\$\{downspeed\}/g, $translate.instant('Download') + ': ' + $filter('readableVolumn')(context.downloadSpeed) + '/s');
title = title.replace(/\$\{upspeed\}/g, $translate.instant('Upload') + ': ' + $filter('readableVolumn')(context.uploadSpeed) + '/s');
title = title.replace(/\$\{title\}/g, ariaNgConstants.title);
return title;
},
setTitle: function (value) {
setOption('title', value);
},
getJsonRpcUrl: function () { getJsonRpcUrl: function () {
var protocol = getOption('protocol'); var protocol = getOption('protocol');
var rpcHost = getOption('rpcHost'); var rpcHost = getOption('rpcHost');

View file

@ -11,6 +11,16 @@
</select> </select>
</div> </div>
</div> </div>
<div class="row">
<div class="setting-key setting-key-without-desc col-sm-4">
<span translate>Page Title</span>
<i class="icon-primary fa fa-question-circle" ng-tooltip="{{'Supported Placeholder: AriaNg Title ${title}, Downloading Count ${downloading}, Waiting Count ${waiting}, Stopped Count ${stopped}, Download Speed ${downspeed}, Upload Speed ${upspeed}.'| translate}}"
ng-tooltip-placement="right"></i>
</div>
<div class="setting-value col-sm-8">
<input class="form-control" type="text" ng-model="context.settings.title" ng-change="settingService.setTitle(context.settings.title)"/>
</div>
</div>
<div class="row"> <div class="row">
<div class="setting-key setting-key-without-desc col-sm-4"> <div class="setting-key setting-key-without-desc col-sm-4">
<span translate>Aria2 RPC Host</span> <span translate>Aria2 RPC Host</span>