fix(roman-numeral-converter): changes due to review

This commit is contained in:
Carsten Götzinger 2023-04-08 08:39:47 +02:00
parent 8529acbdc5
commit b13544900f
3 changed files with 9 additions and 27 deletions

View file

@ -13,10 +13,10 @@ describe('roman-numeral-converter', () => {
expect(arabicToRoman(0.9)).toEqual(''); expect(arabicToRoman(0.9)).toEqual('');
}); });
it('should convert numbers greater than 3999999 to empty string', () => { it('should convert numbers greater than 3999 to empty string', () => {
expect(arabicToRoman(3999999.1)).toEqual(''); expect(arabicToRoman(3999.1)).toEqual('');
expect(arabicToRoman(4000000)).toEqual(''); expect(arabicToRoman(4000)).toEqual('');
expect(arabicToRoman(10000000)).toEqual(''); expect(arabicToRoman(10000)).toEqual('');
}); });
it('should convert floating points number to the lower integer in roman version', () => { it('should convert floating points number to the lower integer in roman version', () => {
@ -70,10 +70,6 @@ describe('roman-numeral-converter', () => {
expect(arabicToRoman(999)).toEqual('CMXCIX'); expect(arabicToRoman(999)).toEqual('CMXCIX');
expect(arabicToRoman(1000)).toEqual('M'); expect(arabicToRoman(1000)).toEqual('M');
expect(arabicToRoman(2000)).toEqual('MM'); expect(arabicToRoman(2000)).toEqual('MM');
expect(arabicToRoman(4000)).toEqual('<span style="text-decoration: overline">IV</span>');
expect(arabicToRoman(5000)).toEqual('<span style="text-decoration: overline">V</span>');
expect(arabicToRoman(9000)).toEqual('<span style="text-decoration: overline">IX</span>');
expect(arabicToRoman(10000)).toEqual('<span style="text-decoration: overline">X</span>');
}); });
}); });
}); });

View file

@ -1,21 +1,9 @@
export const MIN_ARABIC_TO_ROMAN = 1; export const MIN_ARABIC_TO_ROMAN = 1;
export const MAX_ARABIC_TO_ROMAN = 3999999; export const MAX_ARABIC_TO_ROMAN = 3999;
export function arabicToRoman(num: number) { export function arabicToRoman(num: number) {
if (num < MIN_ARABIC_TO_ROMAN || num > MAX_ARABIC_TO_ROMAN) return ''; if (num < MIN_ARABIC_TO_ROMAN || num > MAX_ARABIC_TO_ROMAN) return '';
const lookup: { [key: string]: number } = { const lookup: { [key: string]: number } = {
'<span style="text-decoration: overline">M</span>': 1000000,
'<span style="text-decoration: overline">CM</span>': 900000,
'<span style="text-decoration: overline">D</span>': 500000,
'<span style="text-decoration: overline">CD</span>': 400000,
'<span style="text-decoration: overline">C</span>': 100000,
'<span style="text-decoration: overline">XC</span>': 90000,
'<span style="text-decoration: overline">L</span>': 50000,
'<span style="text-decoration: overline">XL</span>': 40000,
'<span style="text-decoration: overline">X</span>': 10000,
'<span style="text-decoration: overline">IX</span>': 9000,
'<span style="text-decoration: overline">V</span>': 5000,
'<span style="text-decoration: overline">IV</span>': 4000,
M: 1000, M: 1000,
CM: 900, CM: 900,
D: 500, D: 500,

View file

@ -6,9 +6,11 @@
<n-input-number v-model:value="inputNumeral" :min="1" style="width: 200px" :show-button="false" /> <n-input-number v-model:value="inputNumeral" :min="1" style="width: 200px" :show-button="false" />
</n-form-item> </n-form-item>
<div class="result"> <div class="result">
<span v-html="outputRoman"></span> {{ outputRoman }}
</div> </div>
<n-button secondary autofocus :disabled="isCopyRomanDisabled()" @click="copyRoman"> Copy </n-button> <n-button secondary autofocus :disabled="validationNumeral.validationStatus === 'error'" @click="copyRoman">
Copy
</n-button>
</n-space> </n-space>
</n-card> </n-card>
<br /> <br />
@ -68,10 +70,6 @@ const { attrs: validationRoman } = useValidation({
const { copy: copyRoman } = useCopy({ source: outputRoman, text: 'Roman number copied to the clipboard' }); const { copy: copyRoman } = useCopy({ source: outputRoman, text: 'Roman number copied to the clipboard' });
const { copy: copyArabic } = useCopy({ source: outputNumeral, text: 'Arabic number copied to the clipboard' }); const { copy: copyArabic } = useCopy({ source: outputNumeral, text: 'Arabic number copied to the clipboard' });
function isCopyRomanDisabled() {
return validationNumeral.validationStatus === 'error' || inputNumeral.value > 3999;
}
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>