perso/syncthing-arm
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

gui: Restrict shown decimals and restrict size of header columns (#4973)

Browse Source
This commit is contained in:
Simon Frei
2018-06-06 23:33:31 +02:00
committed by GitHub
parent 02da7414ab
commit 53a029a796
7 changed files with 83 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
gui/default/syncthing/app.js
View File

@@ -195,3 +195,52 @@ function buildTree(children) {
return root.children;
}
// unitPrefixed converts the input such that it returns a string representation
// <1000 (<1024) with the metric unit prefix suffixed. I.e. when calling this with
// binary == true, you need to suffix an additon 'i'. The "biggest" prefix used
// is 'T', numbers > 1000T are just returned as such big numbers. If ever deemed
// useful 'P' can be added easily.
function unitPrefixed(input, binary) {
if (input === undefined || isNaN(input)) {
return '0 ';
}
factor = 1000;
i = '';
if (binary) {
factor = 1024;
i = 'i'
}
if (input > factor * factor * factor * factor * 1000) {
// Don't show any decimals for more than 4 digits
input /= factor * factor * factor * factor;
return input.toLocaleString(undefined, {maximumFractionDigits: 0}) + ' T' + i;
}
// Show 3 significant digits (e.g. 123T or 2.54T)
if (input > factor * factor * factor * factor) {
input /= factor * factor * factor * factor;
return input.toLocaleString(undefined, {maximumSignificantDigits: 3}) + ' T' + i;
}
if (input > factor * factor * factor) {
input /= factor * factor * factor;
if (binary && input >= 1000) {
return input.toLocaleString(undefined, {maximumFractionDigits: 0}) + ' G' + i;
}
return input.toLocaleString(undefined, {maximumSignificantDigits: 3}) + ' G' + i;
}
if (input > factor * factor) {
input /= factor * factor;
if (binary && input >= 1000) {
return input.toLocaleString(undefined, {maximumFractionDigits: 0}) + ' M' + i;
}
return input.toLocaleString(undefined, {maximumSignificantDigits: 3}) + ' M' + i;
}
if (input > factor) {
input /= factor;
if (binary && input >= 1000) {
return input.toLocaleString(undefined, {maximumFractionDigits: 0}) + ' k' + i;
}
return input.toLocaleString(undefined, {maximumSignificantDigits: 3}) + ' k' + i;
}
return Math.round(input).toLocaleString() + ' ';
};

17
gui/default/syncthing/core/binaryFilter.js
View File

@@ -1,21 +1,6 @@
angular.module('syncthing.core')
.filter('binary', function () {
return function (input) {
if (input === undefined || isNaN(input)) {
return '0 ';
}
if (input > 1024 * 1024 * 1024) {
input /= 1024 * 1024 * 1024;
return input.toLocaleString(undefined, {maximumFractionDigits: 2}) + ' Gi';
}
if (input > 1024 * 1024) {
input /= 1024 * 1024;
return input.toLocaleString(undefined, {maximumFractionDigits: 2}) + ' Mi';
}
if (input > 1024) {
input /= 1024;
return input.toLocaleString(undefined, {maximumFractionDigits: 2}) + ' Ki';
}
return Math.round(input).toLocaleString(undefined, {maximumFractionDigits: 2}) + ' ';
return unitPrefixed(input, true);
};
});

7
gui/default/syncthing/core/localeNumberFilter.js
View File

@@ -1,9 +1,6 @@
angular.module('syncthing.core')
.filter('localeNumber', function () {
return function (input, decimals) {
if (typeof(decimals) !== 'undefined') {
return input.toLocaleString(undefined, {maximumFractionDigits: decimals});
}
return function (input) {
return input.toLocaleString();
};
});
});

17
gui/default/syncthing/core/metricFilter.js
View File

@@ -1,21 +1,6 @@
angular.module('syncthing.core')
.filter('metric', function () {
return function (input) {
if (input === undefined || isNaN(input)) {
return '0 ';
}
if (input > 1000 * 1000 * 1000) {
input /= 1000 * 1000 * 1000;
return input.toLocaleString(undefined, {maximumFractionDigits: 2}) + ' G';
}
if (input > 1000 * 1000) {
input /= 1000 * 1000;
return input.toLocaleString(undefined, {maximumFractionDigits: 2}) + ' M';
}
if (input > 1000) {
input /= 1000;
return input.toLocaleString(undefined, {maximumFractionDigits: 2}) + ' k';
}
return Math.round(input).toLocaleString(undefined, {maximumFractionDigits: 2}) + ' ';
return unitPrefixed(input, false);
};
});

15
gui/default/syncthing/core/percentFilter.js Normal file
View File

@@ -0,0 +1,15 @@
angular.module('syncthing.core')
.filter('percent', function () {
return function (input) {
// Prevent 0.00%
if (input === undefined || input < 0.01) {
return 0 + '%';
}
// Hard limit at two decimals
if (input < 0.1) {
return input.toLocaleString(undefined, {maximumFractionDigits: 2}) + '%';
}
// "Soft" limit at two significant digits (e.g. 1.2%, not 1.27%)
return input.toLocaleString(undefined, {maximumSignificantDigits: 2}) + '%';
};
});

10
gui/default/syncthing/transfer/neededFilesModalView.html
View File

@@ -38,11 +38,11 @@
<td class="col-xs-4">
<div ng-if="f.type == 'progress' && f.action == 'sync' && progress[neededFolder] && progress[neededFolder][f.name]">
<div class="progress">
<div class="progress-bar progress-bar-success" style="width: {{progress[neededFolder][f.name].reused}}%"></div>
<div class="progress-bar" style="width: {{progress[neededFolder][f.name].copiedFromOrigin}}%"></div>
<div class="progress-bar progress-bar-info" style="width: {{progress[neededFolder][f.name].copiedFromElsewhere}}%"></div>
<div class="progress-bar progress-bar-warning" style="width: {{progress[neededFolder][f.name].pulled}}%"></div>
<div class="progress-bar progress-bar-danger progress-bar-striped active" style="width: {{progress[neededFolder][f.name].pulling}}%"></div>
<div class="progress-bar progress-bar-success" style="width: {{progress[neededFolder][f.name].reused | percent}}"></div>
<div class="progress-bar" style="width: {{progress[neededFolder][f.name].copiedFromOrigin | percent}}"></div>
<div class="progress-bar progress-bar-info" style="width: {{progress[neededFolder][f.name].copiedFromElsewhere | percent}}"></div>
<div class="progress-bar progress-bar-warning" style="width: {{progress[neededFolder][f.name].pulled | percent}}"></div>
<div class="progress-bar progress-bar-danger progress-bar-striped active" style="width: {{progress[neededFolder][f.name].pulling | percent}}"></div>
<span class="show frontal">
{{progress[neededFolder][f.name].bytesDone | binary}}B / {{progress[neededFolder][f.name].bytesTotal | binary}}B
</span>