Removed formatRelevantDigits from text_utils.js and added it to a new file number_utils.js

Also improved code formatting
This commit is contained in:
Jose Ivan Vargas 2017-04-03 10:37:08 -05:00
parent d745876e23
commit 3069a2c959
5 changed files with 172 additions and 145 deletions

View file

@ -0,0 +1,34 @@
/* eslint-disable import/prefer-default-export */
/**
* Function that allows a number with an X amount of decimals
* to be formatted in the following fashion:
* * For 1 digit to the left of the decimal point and X digits to the right of it
* * * Show 3 digits to the right
* * For 2 digits to the left of the decimal point and X digits to the right of it
* * * Show 2 digits to the right
*/
export function formatRelevantDigits(number) {
let digitsLeft = '';
let relevantDigits = 0;
let formattedNumber = '';
if (!isNaN(Number(number))) {
digitsLeft = number.split('.')[0];
switch (digitsLeft.length) {
case 1:
relevantDigits = 3;
break;
case 2:
relevantDigits = 2;
break;
case 3:
relevantDigits = 1;
break;
default:
relevantDigits = 4;
break;
}
formattedNumber = Number(number).toFixed(relevantDigits);
}
return formattedNumber;
}

View file

@ -188,29 +188,5 @@ require('vendor/latinise');
gl.text.slugify = function(str) {
return str.trim().toLowerCase().latinise();
};
gl.text.formatRelevantDigits = function(number) {
var digitsLeft = '';
var relevantDigits = 0;
if (isNaN(Number(number))) {
return 0;
} else {
digitsLeft = number.split('.')[0];
switch (digitsLeft.length) {
case 1:
relevantDigits = 3;
break;
case 2:
relevantDigits = 2;
break;
case 3:
relevantDigits = 1;
break;
default:
relevantDigits = 4;
break;
}
return Number(number).toFixed(relevantDigits);
}
};
})(window);
}).call(window);

View file

@ -3,7 +3,7 @@
import d3 from 'd3';
import statusCodes from '~/lib/utils/http_status';
import '../lib/utils/common_utils';
import { formatRelevantDigits } from '~/lib/utils/number_utils';
import '../flash';
const prometheusGraphsContainer = '.prometheus-graph';
@ -157,6 +157,7 @@ class PrometheusGraph {
x2: 10,
y2: this.originalHeight - this.margin.top,
});
axisLabelContainer.append('rect')
.attr('class', 'rect-axis-text')
.attr('x', 0)
@ -270,12 +271,13 @@ class PrometheusGraph {
.attr('y', maxMetricValue + 15)
.text(dayFormat(currentData.time));
let currentMetricValue = gl.text.formatRelevantDigits(currentData.value);
let currentMetricValue = formatRelevantDigits(currentData.value);
if (key === 'cpu_values') {
currentMetricValue = `${currentMetricValue}%`;
} else {
currentMetricValue = `${currentMetricValue} MB`;
}
d3.select(`${currentPrometheusGraphContainer} .text-metric-usage`)
.text(currentMetricValue);
});

View file

@ -0,0 +1,41 @@
import { formatRelevantDigits } from '~/lib/utils/number_utils';
describe('Number Utils', () => {
describe('formatRelevantDigits', () => {
it('returns an empty string when the number is NaN', () => {
expect(formatRelevantDigits('fail')).toBe('');
});
it('returns 4 decimals when there is 4 plus digits to the left', () => {
const formattedNumber = formatRelevantDigits('1000.1234567');
const rightFromDecimal = formattedNumber.split('.')[1];
const leftFromDecimal = formattedNumber.split('.')[0];
expect(rightFromDecimal.length).toBe(4);
expect(leftFromDecimal.length).toBe(4);
});
it('returns 3 decimals when there is 1 digit to the left', () => {
const formattedNumber = formatRelevantDigits('0.1234567');
const rightFromDecimal = formattedNumber.split('.')[1];
const leftFromDecimal = formattedNumber.split('.')[0];
expect(rightFromDecimal.length).toBe(3);
expect(leftFromDecimal.length).toBe(1);
});
it('returns 2 decimals when there is 2 digits to the left', () => {
const formattedNumber = formatRelevantDigits('10.1234567');
const rightFromDecimal = formattedNumber.split('.')[1];
const leftFromDecimal = formattedNumber.split('.')[0];
expect(rightFromDecimal.length).toBe(2);
expect(leftFromDecimal.length).toBe(2);
});
it('returns 1 decimal when there is 3 digits to the left', () => {
const formattedNumber = formatRelevantDigits('100.1234567');
const rightFromDecimal = formattedNumber.split('.')[1];
const leftFromDecimal = formattedNumber.split('.')[0];
expect(rightFromDecimal.length).toBe(1);
expect(leftFromDecimal.length).toBe(3);
});
});
});

View file

@ -105,32 +105,6 @@ require('~/lib/utils/text_utility');
expect(textArea.value).toEqual(`${initialValue}* `);
});
});
describe('gl.text.formatRelevantDigits', () => {
it('returns 0 when the number is NaN', () => {
expect(gl.text.formatRelevantDigits('fail')).toBe(0);
});
it('returns 4 decimals when there is 4 plus digits to the left', () => {
const formattedNumber = gl.text.formatRelevantDigits('1000.1234567').split('.')[1];
expect(formattedNumber.length).toBe(4);
});
it('returns 3 decimals when there is 1 digit to the left', () => {
const formattedNumber = gl.text.formatRelevantDigits('0.1234567').split('.')[1];
expect(formattedNumber.length).toBe(3);
});
it('returns 2 decimals when there is 2 digits to the left', () => {
const formattedNumber = gl.text.formatRelevantDigits('10.1234567').split('.')[1];
expect(formattedNumber.length).toBe(2);
});
it('returns 1 decimal when there is 3 digits to the left', () => {
const formattedNumber = gl.text.formatRelevantDigits('100.1234567').split('.')[1];
expect(formattedNumber.length).toBe(1);
});
});
});
});
})();