support change display order by clicking title, support order by download speed

This commit is contained in:
MaysWind 2016-05-22 11:13:05 +08:00
parent f4678ad234
commit 7f232292d5
10 changed files with 85 additions and 38 deletions

View file

@ -62,35 +62,41 @@
</a>
<ul class="dropdown-menu" role="menu">
<li>
<a class="pointer-cursor" ng-click="changeDisplayOrder('default')">
<a class="pointer-cursor" ng-click="changeDisplayOrder('default:false')">
<span translate>Default</span>
<i class="fa" ng-class="{'fa-check': isSetDisplayOrder('default')}"></i>
</a>
</li>
<li>
<a class="pointer-cursor" ng-click="changeDisplayOrder('name')">
<a class="pointer-cursor" ng-click="changeDisplayOrder('name:false')">
<span translate>By File Name</span>
<i class="fa" ng-class="{'fa-check': isSetDisplayOrder('name')}"></i>
</a>
</li>
<li>
<a class="pointer-cursor" ng-click="changeDisplayOrder('size')">
<a class="pointer-cursor" ng-click="changeDisplayOrder('size:false')">
<span translate>By File Size</span>
<i class="fa" ng-class="{'fa-check': isSetDisplayOrder('size')}"></i>
</a>
</li>
<li>
<a class="pointer-cursor" ng-click="changeDisplayOrder('percent')">
<a class="pointer-cursor" ng-click="changeDisplayOrder('percent:true')">
<span translate>By Completed Percent</span>
<i class="fa" ng-class="{'fa-check': isSetDisplayOrder('percent')}"></i>
</a>
</li>
<li>
<a class="pointer-cursor" ng-click="changeDisplayOrder('remain')">
<a class="pointer-cursor" ng-click="changeDisplayOrder('remain:false')">
<span translate>By Remain Time</span>
<i class="fa" ng-class="{'fa-check': isSetDisplayOrder('remain')}"></i>
</a>
</li>
<li>
<a class="pointer-cursor" ng-click="changeDisplayOrder('dspeed:false')">
<span translate>By Download Speed</span>
<i class="fa" ng-class="{'fa-check': isSetDisplayOrder('dspeed')}"></i>
</a>
</li>
</ul>
</li>
</ul>

View file

@ -30,9 +30,15 @@
};
var processDownloadTask = function (task) {
var totalLength = parseInt(task.totalLength);
var completedLength = parseInt(task.completedLength);
var remainLength = totalLength - completedLength;
task.totalLength = parseInt(task.totalLength);
task.completedLength = parseInt(task.completedLength);
task.uploadSpeed = parseInt(task.uploadSpeed);
task.downloadSpeed = parseInt(task.downloadSpeed);
task.completePercent = task.completedLength / task.totalLength * 100;
task.idle = task.downloadSpeed == 0;
var remainLength = task.totalLength - task.completedLength;
task.remainTime = calculateDownloadRemainTime(remainLength, task.downloadSpeed);
if (task.bittorrent && task.bittorrent.info) {
task.taskName = task.bittorrent.info.name;
@ -41,11 +47,6 @@
} else {
task.taskName = translateFilter('Unknown');
}
task.fileSize = totalLength;
task.completePercent = completedLength / totalLength * 100;
task.idle = task.downloadSpeed == 0;
task.remainTime = calculateDownloadRemainTime(remainLength, task.downloadSpeed);
};
var refreshDownloadTask = function () {

View file

@ -1,7 +1,7 @@
(function () {
'use strict';
angular.module('ariaNg').controller('MainController', ['$scope', '$interval', 'aria2RpcService', 'ariaNgSettingService', function ($scope, $interval, aria2RpcService, ariaNgSettingService) {
angular.module('ariaNg').controller('MainController', ['$scope', '$interval', 'aria2RpcService', 'ariaNgSettingService', 'utils', function ($scope, $interval, aria2RpcService, ariaNgSettingService, utils) {
var globalStatRefreshPromise = null;
var processStatResult = function (stat) {
@ -26,12 +26,25 @@
refreshGlobalStat();
$scope.changeDisplayOrder = function (type) {
ariaNgSettingService.setDisplayOrder(type);
$scope.changeDisplayOrder = function (type, autoSetReverse) {
var oldType = utils.parseOrderType(ariaNgSettingService.getDisplayOrder());
var newType = utils.parseOrderType(type);
if (autoSetReverse && newType.type == oldType.type) {
newType.reverse = !oldType.reverse;
}
ariaNgSettingService.setDisplayOrder(newType.getValue());
};
$scope.isSetDisplayOrder = function (type) {
return ariaNgSettingService.getDisplayOrder() === type;
$scope.isSetDisplayOrder = function (type, reverse) {
var orderType = utils.parseOrderType(ariaNgSettingService.getDisplayOrder());
if (angular.isUndefined(reverse)) {
return orderType.type === type;
} else {
return orderType.type === type && orderType.reverse === reverse;
}
};
if (ariaNgSettingService.getGlobalStatRefreshInterval() > 0) {

View file

@ -36,6 +36,17 @@
}
return path.substring(index + 1);
},
parseOrderType: function (value) {
var values = value.split(':');
return {
type: values[0],
reverse: values[1] === 'true',
getValue: function () {
return this.type + ":" + this.reverse.toString();
}
}
}
};
}]);

View file

@ -1,20 +1,28 @@
(function () {
'use strict';
angular.module("ariaNg").filter('taskOrderBy', ['orderByFilter', function (orderByFilter) {
angular.module("ariaNg").filter('taskOrderBy', ['orderByFilter', 'utils', function (orderByFilter, utils) {
return function (array, type) {
if (!angular.isArray(array)) {
return array;
}
var orderType = utils.parseOrderType(type);
if (orderType == null) {
return array;
}
if (type == 'name') {
return orderByFilter(array, ['taskName'], false);
} else if (type == 'size') {
return orderByFilter(array, ['fileSize'], false);
} else if (type == 'percent') {
return orderByFilter(array, ['completePercent'], true);
} else if (type == 'remain') {
return orderByFilter(array, ['idle', 'remainTime'], false);
if (orderType.type == 'name') {
return orderByFilter(array, ['taskName'], orderType.reverse);
} else if (orderType.type == 'size') {
return orderByFilter(array, ['totalLength'], orderType.reverse);
} else if (orderType.type == 'percent') {
return orderByFilter(array, ['completePercent'], orderType.reverse);
} else if (orderType.type == 'remain') {
return orderByFilter(array, ['idle', 'remainTime'], orderType.reverse);
} else if (orderType.type == 'dspeed') {
return orderByFilter(array, ['downloadSpeed'], orderType.reverse);
} else {
return array;
}

View file

@ -14,6 +14,7 @@
'By File Size': 'By File Size',
'By Completed Percent': 'By Completed Percent',
'By Remain Time': 'By Remain Time',
'By Download Speed': 'By Download Speed',
'Download': 'Download',
'Downloading': 'Downloading',
'Waiting': 'Waiting',

View file

@ -14,6 +14,7 @@
'By File Size': '按文件大小',
'By Completed Percent': '按进度',
'By Remain Time': '按剩余时间',
'By Download Speed': '按下载速度',
'Download': '下载',
'Downloading': '正在下载',
'Waiting': '正在等待',

View file

@ -99,7 +99,7 @@
var value = getOption('displayOrder');
if (!value) {
value = 'default';
value = 'default:false';
}
return value;

View file

@ -257,6 +257,11 @@ td {
font-size: 12px;
}
.task-table .task-table-title a {
color: #000;
cursor: pointer;
}
.task-table > .task-table-body > div.row {
padding: 8px;
border-top: 1px solid #ddd;

View file

@ -5,30 +5,31 @@
<div class="col-sm-8">
<div class="row">
<div class="col-sm-8">
<span translate>File Name</span>
<i class="fa" ng-class="{'fa-sort-asc': isSetDisplayOrder('name')}"></i>
<a ng-click="changeDisplayOrder('name:false', true)" translate>File Name</a>
<i class="fa" ng-class="{'fa-sort-asc': isSetDisplayOrder('name', false), 'fa-sort-desc': isSetDisplayOrder('name', true)}"></i>
</div>
<div class="col-sm-4">
<span translate>File Size</span>
<i class="fa" ng-class="{'fa-sort-asc': isSetDisplayOrder('size')}"></i>
<a ng-click="changeDisplayOrder('size:false', true)" translate>File Size</a>
<i class="fa" ng-class="{'fa-sort-asc': isSetDisplayOrder('size', false), 'fa-sort-desc': isSetDisplayOrder('size', true)}"></i>
</div>
</div>
</div>
<div class="col-sm-2">
<div class="row">
<div class="col-sm-6">
<span translate>Completed Percent</span>
<i class="fa" ng-class="{'fa-sort-desc': isSetDisplayOrder('percent')}"></i>
<a ng-click="changeDisplayOrder('percent:true', true)" translate>Completed Percent</a>
<i class="fa" ng-class="{'fa-sort-asc': isSetDisplayOrder('percent', false), 'fa-sort-desc': isSetDisplayOrder('percent', true)}"></i>
</div>
<div class="col-sm-6">
<span translate>Remain Time</span>
<i class="fa" ng-class="{'fa-sort-asc': isSetDisplayOrder('remain')}"></i>
<a ng-click="changeDisplayOrder('remain:false', true)" translate>Remain Time</a>
<i class="fa" ng-class="{'fa-sort-asc': isSetDisplayOrder('remain', false), 'fa-sort-desc': isSetDisplayOrder('remain', true)}"></i>
</div>
</div>
</div>
<div class="col-sm-2">
<div class="row">
<span translate>Download Speed</span>
<a ng-click="changeDisplayOrder('dspeed:false', true)" translate>Download Speed</a>
<i class="fa" ng-class="{'fa-sort-asc': isSetDisplayOrder('dspeed', false), 'fa-sort-desc': isSetDisplayOrder('dspeed', true)}"></i>
</div>
</div>
</div>
@ -38,7 +39,7 @@
<div class="col-sm-8">
<span class="task-name" ng-bind="task.taskName | substring: (titleWidth / 20)" title="{{task.taskName}}"></span>
<div class="task-files">
<span ng-bind="task.fileSize | readableVolumn"></span>
<span ng-bind="task.totalLength | readableVolumn"></span>
<a ng-href="#/task/detail/{{task.gid}}">
<span ng-bind="'(' + task.files.length + ' ' + ('Files' | translate) + ')'"></span>
</a>