From bc4438367271477b8dec8a7b06932c842402e643 Mon Sep 17 00:00:00 2001 From: Volker Theile Date: Mon, 4 Jun 2018 13:06:30 +0200 Subject: [PATCH] mgr/dashboard: Print a blank space between value and unit. When displaying values with their unit a blank space must be shown between them, see #15 at https://physics.nist.gov/cuu/Units/checklist.html. Signed-off-by: Volker Theile --- .../shared/pipes/dimless-binary.pipe.spec.ts | 18 ++++++------ .../src/app/shared/pipes/dimless.pipe.spec.ts | 16 +++++------ .../shared/services/formatter.service.spec.ts | 28 +++++++++---------- .../app/shared/services/formatter.service.ts | 13 +++++++-- 4 files changed, 41 insertions(+), 34 deletions(-) diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/dimless-binary.pipe.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/dimless-binary.pipe.spec.ts index 268fe61588f..caf51f5788a 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/dimless-binary.pipe.spec.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/dimless-binary.pipe.spec.ts @@ -11,46 +11,46 @@ describe('DimlessBinaryPipe', () => { it('transforms 1024^0', () => { const value = Math.pow(1024, 0); - expect(pipe.transform(value)).toBe('1B'); + expect(pipe.transform(value)).toBe('1 B'); }); it('transforms 1024^1', () => { const value = Math.pow(1024, 1); - expect(pipe.transform(value)).toBe('1KiB'); + expect(pipe.transform(value)).toBe('1 KiB'); }); it('transforms 1024^2', () => { const value = Math.pow(1024, 2); - expect(pipe.transform(value)).toBe('1MiB'); + expect(pipe.transform(value)).toBe('1 MiB'); }); it('transforms 1024^3', () => { const value = Math.pow(1024, 3); - expect(pipe.transform(value)).toBe('1GiB'); + expect(pipe.transform(value)).toBe('1 GiB'); }); it('transforms 1024^4', () => { const value = Math.pow(1024, 4); - expect(pipe.transform(value)).toBe('1TiB'); + expect(pipe.transform(value)).toBe('1 TiB'); }); it('transforms 1024^5', () => { const value = Math.pow(1024, 5); - expect(pipe.transform(value)).toBe('1PiB'); + expect(pipe.transform(value)).toBe('1 PiB'); }); it('transforms 1024^6', () => { const value = Math.pow(1024, 6); - expect(pipe.transform(value)).toBe('1EiB'); + expect(pipe.transform(value)).toBe('1 EiB'); }); it('transforms 1024^7', () => { const value = Math.pow(1024, 7); - expect(pipe.transform(value)).toBe('1ZiB'); + expect(pipe.transform(value)).toBe('1 ZiB'); }); it('transforms 1024^8', () => { const value = Math.pow(1024, 8); - expect(pipe.transform(value)).toBe('1YiB'); + expect(pipe.transform(value)).toBe('1 YiB'); }); }); diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/dimless.pipe.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/dimless.pipe.spec.ts index edc7fe181ba..8d01678f75d 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/dimless.pipe.spec.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/dimless.pipe.spec.ts @@ -16,41 +16,41 @@ describe('DimlessPipe', () => { it('transforms 1000^1', () => { const value = Math.pow(1000, 1); - expect(pipe.transform(value)).toBe('1k'); + expect(pipe.transform(value)).toBe('1 k'); }); it('transforms 1000^2', () => { const value = Math.pow(1000, 2); - expect(pipe.transform(value)).toBe('1M'); + expect(pipe.transform(value)).toBe('1 M'); }); it('transforms 1000^3', () => { const value = Math.pow(1000, 3); - expect(pipe.transform(value)).toBe('1G'); + expect(pipe.transform(value)).toBe('1 G'); }); it('transforms 1000^4', () => { const value = Math.pow(1000, 4); - expect(pipe.transform(value)).toBe('1T'); + expect(pipe.transform(value)).toBe('1 T'); }); it('transforms 1000^5', () => { const value = Math.pow(1000, 5); - expect(pipe.transform(value)).toBe('1P'); + expect(pipe.transform(value)).toBe('1 P'); }); it('transforms 1000^6', () => { const value = Math.pow(1000, 6); - expect(pipe.transform(value)).toBe('1E'); + expect(pipe.transform(value)).toBe('1 E'); }); it('transforms 1000^7', () => { const value = Math.pow(1000, 7); - expect(pipe.transform(value)).toBe('1Z'); + expect(pipe.transform(value)).toBe('1 Z'); }); it('transforms 1000^8', () => { const value = Math.pow(1000, 8); - expect(pipe.transform(value)).toBe('1Y'); + expect(pipe.transform(value)).toBe('1 Y'); }); }); diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/services/formatter.service.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/services/formatter.service.spec.ts index e3180621a99..a331101ba7b 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/shared/services/formatter.service.spec.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/services/formatter.service.spec.ts @@ -36,22 +36,22 @@ describe('FormatterService', () => { }); it('should test some values', () => { - expect(service.format_number('0', 1024, formats)).toBe('0B'); - expect(service.format_number('0.1', 1024, formats)).toBe('0.1B'); - expect(service.format_number('1.2', 1024, formats)).toBe('1.2B'); - expect(service.format_number('1', 1024, formats)).toBe('1B'); - expect(service.format_number('1024', 1024, formats)).toBe('1KiB'); - expect(service.format_number(23.45678 * Math.pow(1024, 3), 1024, formats)).toBe('23.5GiB'); + expect(service.format_number('0', 1024, formats)).toBe('0 B'); + expect(service.format_number('0.1', 1024, formats)).toBe('0.1 B'); + expect(service.format_number('1.2', 1024, formats)).toBe('1.2 B'); + expect(service.format_number('1', 1024, formats)).toBe('1 B'); + expect(service.format_number('1024', 1024, formats)).toBe('1 KiB'); + expect(service.format_number(23.45678 * Math.pow(1024, 3), 1024, formats)).toBe('23.5 GiB'); expect(service.format_number(23.45678 * Math.pow(1024, 3), 1024, formats, 2)).toBe( - '23.46GiB' + '23.46 GiB' ); }); it('should test some dimless values', () => { expect(dimlessPipe.transform(0.6)).toBe('0.6'); - expect(dimlessPipe.transform(1000.608)).toBe('1k'); - expect(dimlessPipe.transform(1e10)).toBe('10G'); - expect(dimlessPipe.transform(2.37e16)).toBe('23.7P'); + expect(dimlessPipe.transform(1000.608)).toBe('1 k'); + expect(dimlessPipe.transform(1e10)).toBe('10 G'); + expect(dimlessPipe.transform(2.37e16)).toBe('23.7 P'); }); }); @@ -77,10 +77,10 @@ describe('FormatterService', () => { }); it('should convert values to human readable again', () => { - convertToBytesAndBack('1.1MiB'); - convertToBytesAndBack('1.0MiB', '1MiB'); - convertToBytesAndBack('8.9GiB'); - convertToBytesAndBack('123.5EiB'); + convertToBytesAndBack('1.1 MiB'); + convertToBytesAndBack('1.0MiB', '1 MiB'); + convertToBytesAndBack('8.9 GiB'); + convertToBytesAndBack('123.5 EiB'); }); }); }); diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/services/formatter.service.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/services/formatter.service.ts index b3384c863d2..6f1cfe4ec47 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/shared/services/formatter.service.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/services/formatter.service.ts @@ -13,9 +13,16 @@ export class FormatterService { if (!_.isNumber(n)) { return '-'; } - const unit = n < 1 ? 0 : Math.floor(Math.log(n) / Math.log(divisor)); - const truncatedFloat = _.round(n / Math.pow(divisor, unit), decimals).toString(); - return truncatedFloat === '' ? '-' : truncatedFloat + units[unit]; + let unit = n < 1 ? 0 : Math.floor(Math.log(n) / Math.log(divisor)); + unit = (unit >= units.length) ? units.length - 1 : unit; + let result = _.round(n / Math.pow(divisor, unit), decimals).toString(); + if (result === '') { + return '-'; + } + if (units[unit] !== '') { + result = `${result} ${units[unit]}`; + } + return result; } /** -- 2.39.5