support custom page title placeholder style, and display preview in ariang settings page

This commit is contained in:
MaysWind 2017-03-05 23:18:09 +08:00
parent b4d4757a22
commit c7ff176b9f
9 changed files with 179 additions and 40 deletions

View file

@ -334,6 +334,7 @@
<script src="scripts/services/ariaNgMonitorService.js"></script>
<script src="scripts/services/ariaNgNotificationService.js"></script>
<script src="scripts/services/ariaNgSettingService.js"></script>
<script src="scripts/services/ariaNgTitleService.js"></script>
<script src="scripts/services/ariaNgLogService.js"></script>
<script src="scripts/services/aria2HttpRpcService.js"></script>
<script src="scripts/services/aria2WebSocketRpcService.js"></script>

View file

@ -122,6 +122,9 @@ Download Error=下载出错
Language=语言
Debug Mode=调试模式
Page Title=页面标题
Preview=预览
Tips: You can use the "noprefix" tag to ignore the prefix, "nosuffix" tag ignore the suffix, and "scale\=n" tag to set the decimal precision.=小提示: 您可以使用 "noprefix" 标签忽略前缀, "nosuffix" 标签忽略后缀, 以及 "scale\=n" 标签设置小数的精度.
Example: ${downspeed:noprefix:nosuffix:scale\=1}=示例: ${downspeed:noprefix:nosuffix:scale\=1}
Page Title Refresh Interval=页面标题刷新间隔
Enable Browser Notification=启用浏览器通知
Aria2 RPC Host=Aria2 RPC 主机

View file

@ -126,6 +126,9 @@
'Language': 'Language',
'Debug Mode': 'Debug Mode',
'Page Title': 'Page Title',
'Preview': 'Preview',
'Tips: You can use the "noprefix" tag to ignore the prefix, "nosuffix" tag ignore the suffix, and "scale=n" tag to set the decimal precision.': 'Tips: You can use the "noprefix" tag to ignore the prefix, "nosuffix" tag ignore the suffix, and "scale=n" tag to set the decimal precision.',
'Example: ${downspeed:noprefix:nosuffix:scale=1}': 'Example: ${downspeed:noprefix:nosuffix:scale=1}',
'Page Title Refresh Interval': 'Page Title Refresh Interval',
'Enable Browser Notification': 'Enable Browser Notification',
'Aria2 RPC Host': 'Aria2 RPC Host',

View file

@ -1,26 +1,12 @@
(function () {
'use strict';
angular.module('ariaNg').controller('MainController', ['$rootScope', '$scope', '$route', '$location', '$document', '$interval', 'aria2RpcErrors', 'ariaNgCommonService', 'ariaNgSettingService', 'ariaNgMonitorService', 'ariaNgNotificationService', 'aria2TaskService', 'aria2SettingService', function ($rootScope, $scope, $route, $location, $document, $interval, aria2RpcErrors, ariaNgCommonService, ariaNgSettingService, ariaNgMonitorService, ariaNgNotificationService, aria2TaskService, aria2SettingService) {
angular.module('ariaNg').controller('MainController', ['$rootScope', '$scope', '$route', '$location', '$document', '$interval', 'aria2RpcErrors', 'ariaNgCommonService', 'ariaNgSettingService', 'ariaNgTitleService', 'ariaNgMonitorService', 'ariaNgNotificationService', 'aria2TaskService', 'aria2SettingService', function ($rootScope, $scope, $route, $location, $document, $interval, aria2RpcErrors, ariaNgCommonService, ariaNgSettingService, ariaNgTitleService, ariaNgMonitorService, ariaNgNotificationService, aria2TaskService, aria2SettingService) {
var pageTitleRefreshPromise = null;
var globalStatRefreshPromise = null;
var refreshPageTitle = function () {
var context = (function (globalStat) {
if (!globalStat) {
return null;
}
return {
downloadingCount: globalStat.numActive,
waitingCount: globalStat.numWaiting,
stoppedCount: globalStat.numStopped,
downloadSpeed: globalStat.downloadSpeed,
uploadSpeed: globalStat.uploadSpeed
};
})($scope.globalStat);
$document[0].title = ariaNgSettingService.getFinalTitle(context);
$document[0].title = ariaNgTitleService.getFinalTitleByGlobalStat($scope.globalStat);
};
var refreshGlobalStat = function (silent, callback) {

View file

@ -1,13 +1,18 @@
(function () {
'use strict';
angular.module('ariaNg').controller('AriaNgSettingsController', ['$rootScope', '$scope', '$routeParams', '$timeout', 'ariaNgLanguages', 'ariaNgCommonService', 'ariaNgSettingService', 'ariaNgNotificationService', function ($rootScope, $scope, $routeParams, $timeout, ariaNgLanguages, ariaNgCommonService, ariaNgSettingService, ariaNgNotificationService) {
angular.module('ariaNg').controller('AriaNgSettingsController', ['$rootScope', '$scope', '$routeParams', '$interval', '$timeout', 'ariaNgLanguages', 'ariaNgCommonService', 'ariaNgSettingService', 'ariaNgMonitorService', 'ariaNgNotificationService', 'ariaNgTitleService', function ($rootScope, $scope, $routeParams, $interval, $timeout, ariaNgLanguages, ariaNgCommonService, ariaNgSettingService, ariaNgMonitorService, ariaNgNotificationService, ariaNgTitleService) {
var tabOrders = ['global', 'rpc'];
var extendType = $routeParams.extendType;
var getFinalTitle = function () {
return ariaNgTitleService.getFinalTitleByGlobalStat(ariaNgMonitorService.getCurrentGlobalStat());
};
$scope.context = {
currentTab: 'global',
languages: ariaNgLanguages,
titlePreview: getFinalTitle(),
availableTime: ariaNgCommonService.getTimeOptions([1000, 2000, 3000, 5000, 10000, 30000, 60000], true),
trueFalseOptions: [{name: 'True', value: true}, {name: 'False', value: false}],
showRpcSecret: false,
@ -21,6 +26,10 @@
$scope.context.currentTab = tabName;
};
$scope.updateTitlePreview = function () {
$scope.context.titlePreview = getFinalTitle();
};
$rootScope.swipeActions.extentLeftSwipe = function () {
var tabIndex = tabOrders.indexOf($scope.context.currentTab);

View file

@ -2,6 +2,7 @@
'use strict';
angular.module('ariaNg').factory('ariaNgMonitorService', ['$filter', '$translate', 'moment', 'ariaNgConstants', function ($filter, $translate, moment, ariaNgConstants) {
var currentGlobalStat = {};
var storagesInMemory = {};
var globalStorageKey = 'global';
@ -149,10 +150,14 @@
return this.getStatsData(key);
},
recordGlobalStat: function (stat) {
return this.recordStat(globalStorageKey, stat);
this.recordStat(globalStorageKey, stat);
currentGlobalStat = stat;
},
getGlobalStatsData: function () {
return this.getStatsData(globalStorageKey);
},
getCurrentGlobalStat: function () {
return currentGlobalStat;
}
};
}]);

View file

@ -124,26 +124,6 @@
getTitle: function () {
return getOption('title');
},
getFinalTitle: function (context) {
var title = this.getTitle();
context = angular.extend({
downloadingCount: 0,
waitingCount: 0,
stoppedCount: 0,
downloadSpeed: 0,
uploadSpeed: 0
}, context);
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);
},

View file

@ -0,0 +1,143 @@
(function () {
'use strict';
angular.module('ariaNg').factory('ariaNgTitleService', ['$filter', '$translate', 'ariaNgConstants', 'ariaNgSettingService', function ($filter, $translate, ariaNgConstants, ariaNgSettingService) {
var parseSettings = function (placeholder) {
if (!placeholder) {
return {};
}
var innerText = placeholder.substring(2, placeholder.length - 1); // remove ${ and }
var items = innerText.split(':');
var settings = {
oldValue: placeholder
};
for (var i = 1; i < items.length; i++) {
var pairs = items[i].split('=');
if (pairs.length == 1) {
settings[pairs[0]] = true;
} else if (pairs.length == 2) {
settings[pairs[0]] = pairs[1];
}
}
return settings;
};
var replacePlaerholder = function (title, context) {
var value = context.value;
if (context.type === 'volumn') {
value = $filter('readableVolumn')(value, context.scale);
}
if (context.prefix && !context.noprefix) {
value = context.prefix + value;
}
if (context.suffix && !context.nosuffix) {
value = value + context.suffix;
}
return title.replace(context.oldValue, value);
};
var replacePlaceholders = function (title, condition, context) {
var regex = new RegExp('\\$\\{' + condition + '(:[a-zA-Z0-9]+(=[a-zA-Z0-9]+)?)*\\}', 'g');
var results = title.match(regex);
if (results && results.length > 0) {
for (var i = 0; i < results.length; i++) {
var innerContext = parseSettings(results[i]);
angular.extend(innerContext, context);
title = replacePlaerholder(title, innerContext);
}
}
return title;
};
var replaceDownloadingCount = function (title, value) {
return replacePlaceholders(title, 'downloading', {
prefix: $translate.instant('Downloading') + ': ',
value: value
});
};
var replaceWaitingCount = function (title, value) {
return replacePlaceholders(title, 'waiting', {
prefix: $translate.instant('Waiting') + ': ',
value: value
});
};
var replaceStoppedCount = function (title, value) {
return replacePlaceholders(title, 'stopped', {
prefix: $translate.instant('Downloaded / Stopped'),
value: value
});
};
var replaceDownloadSpeed = function (title, value) {
return replacePlaceholders(title, 'downspeed', {
prefix: $translate.instant('Download') + ': ',
value: value,
type: 'volumn',
suffix: '/s'
});
};
var replaceUploadSpeed = function (title, value) {
return replacePlaceholders(title, 'upspeed', {
prefix: $translate.instant('Upload') + ': ',
value: value,
type: 'volumn',
suffix: '/s'
});
};
var replaceAgiaNgTitle = function (title) {
return replacePlaceholders(title, 'title', {
value: ariaNgConstants.title
});
};
return {
getFinalTitle: function (context) {
var title = ariaNgSettingService.getTitle();
context = angular.extend({
downloadingCount: 0,
waitingCount: 0,
stoppedCount: 0,
downloadSpeed: 0,
uploadSpeed: 0
}, context);
title = replaceDownloadingCount(title, context.downloadingCount);
title = replaceWaitingCount(title, context.waitingCount);
title = replaceStoppedCount(title, context.stoppedCount);
title = replaceDownloadSpeed(title, context.downloadSpeed);
title = replaceUploadSpeed(title, context.uploadSpeed);
title = replaceAgiaNgTitle(title);
return title;
},
getFinalTitleByGlobalStat: function (globalStat) {
var context = {
downloadingCount: globalStat.numActive,
waitingCount: globalStat.numWaiting,
stoppedCount: globalStat.numStopped,
downloadSpeed: globalStat.downloadSpeed,
uploadSpeed: globalStat.uploadSpeed
};
return this.getFinalTitle(context);
}
};
}]);
}());

View file

@ -38,11 +38,20 @@
<span translate>Page Title</span>
<i class="icon-primary fa fa-question-circle" data-toggle="popover"
data-trigger="hover" data-placement="auto right" data-container="body" data-html="true"
data-content="{{('Supported Placeholder' | translate) + ':<br/>' + ('AriaNg Title' | translate) + ': ${title}<br/>' + ('Downloading Count' | translate) + ': ${downloading}<br/>' + ('Waiting Count' | translate) + ': ${waiting}<br/>' + ('Stopped Count' | translate) + ': ${stopped}<br/>' + ('Download Speed' | translate) + ': ${downspeed}<br/>' + ('Upload Speed' | translate) + ': ${upspeed}<br/>'}}"></i>
data-content="{{('Supported Placeholder' | translate) + ':<br/>' +
('AriaNg Title' | translate) + ': ${title}<br/>' +
('Downloading Count' | translate) + ': ${downloading}<br/>' +
('Waiting Count' | translate) + ': ${waiting}<br/>' +
('Stopped Count' | translate) + ': ${stopped}<br/>' +
('Download Speed' | translate) + ': ${downspeed}<br/>' +
('Upload Speed' | translate) + ': ${upspeed}<br/><br/>' +
('Tips: You can use the &quot;noprefix&quot; tag to ignore the prefix, &quot;nosuffix&quot; tag ignore the suffix, and &quot;scale=n&quot; tag to set the decimal precision.' | translate) + '<br/>' +
('Example: ${downspeed:noprefix:nosuffix:scale=1}' | translate)}}"></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)"/>
ng-change="settingService.setTitle(context.settings.title); updateTitlePreview()"/>
<em>[<span translate>Preview</span>] <span ng-bind="context.titlePreview"></span></em>
</div>
</div>
<div class="row">