Commit 3069a2c9 authored by Jose Ivan Vargas's avatar Jose Ivan Vargas

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

Also improved code formatting
parent d745876e
/* 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;
}
...@@ -188,29 +188,5 @@ require('vendor/latinise'); ...@@ -188,29 +188,5 @@ require('vendor/latinise');
gl.text.slugify = function(str) { gl.text.slugify = function(str) {
return str.trim().toLowerCase().latinise(); 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); })(window);
}).call(window); }).call(window);
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
import d3 from 'd3'; import d3 from 'd3';
import statusCodes from '~/lib/utils/http_status'; import statusCodes from '~/lib/utils/http_status';
import '../lib/utils/common_utils'; import { formatRelevantDigits } from '~/lib/utils/number_utils';
import '../flash'; import '../flash';
const prometheusGraphsContainer = '.prometheus-graph'; const prometheusGraphsContainer = '.prometheus-graph';
...@@ -157,6 +157,7 @@ class PrometheusGraph { ...@@ -157,6 +157,7 @@ class PrometheusGraph {
x2: 10, x2: 10,
y2: this.originalHeight - this.margin.top, y2: this.originalHeight - this.margin.top,
}); });
axisLabelContainer.append('rect') axisLabelContainer.append('rect')
.attr('class', 'rect-axis-text') .attr('class', 'rect-axis-text')
.attr('x', 0) .attr('x', 0)
...@@ -270,12 +271,13 @@ class PrometheusGraph { ...@@ -270,12 +271,13 @@ class PrometheusGraph {
.attr('y', maxMetricValue + 15) .attr('y', maxMetricValue + 15)
.text(dayFormat(currentData.time)); .text(dayFormat(currentData.time));
let currentMetricValue = gl.text.formatRelevantDigits(currentData.value); let currentMetricValue = formatRelevantDigits(currentData.value);
if (key === 'cpu_values') { if (key === 'cpu_values') {
currentMetricValue = `${currentMetricValue}%`; currentMetricValue = `${currentMetricValue}%`;
} else { } else {
currentMetricValue = `${currentMetricValue} MB`; currentMetricValue = `${currentMetricValue} MB`;
} }
d3.select(`${currentPrometheusGraphContainer} .text-metric-usage`) d3.select(`${currentPrometheusGraphContainer} .text-metric-usage`)
.text(currentMetricValue); .text(currentMetricValue);
}); });
......
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);
});
});
});
...@@ -105,32 +105,6 @@ require('~/lib/utils/text_utility'); ...@@ -105,32 +105,6 @@ require('~/lib/utils/text_utility');
expect(textArea.value).toEqual(`${initialValue}* `); 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);
});
});
}); });
}); });
})(); })();
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment