diff --git a/src/index.js b/src/index.js index 941b11a..ac4af53 100644 --- a/src/index.js +++ b/src/index.js @@ -14,6 +14,19 @@ function App() { const [binaryText, setBinaryText] = useState('') const [decimalText, setDecimalText] = useState('') const [errorMessage, setErrorMessage] = useState('') + + // Function to calculate numbers with decimal places + const convertWithFraction = binarytext => { + let number = binarytext.toString().split('.') + let numberFractionResult = 0 + let result + for (let i = 0; i < number[1].length ; ++i) { + let j = (i+1)*-1 + numberFractionResult += number[i] * Math.pow(2, j) + } + result = Number(parseInt(number[0]) + numberFractionResult) + return result + } // Perform the conversion on form submit const onFormSubmit = e => { @@ -26,22 +39,34 @@ function App() { } setErrorMessage('') // Reset the error message + + // Condition if the user wants to convert numbers with decimal places + if ( binaryText.split('.').length === 2 && binaryText.split('.')[1] ==! null ) { + const result = convertWithFraction( binaryText ); + setErrorMessage('Enter either 0 or 1') + // I used to prevent the user from clicking the dot and not (.) the decimal part, and also prevents several (.) + setDecimalText(result === 'NaN' ? result : '') + // Condition if the user wants to convert integer number + } else { - // Formulae: - // input = 1 => output = 1 * (2^0) = 1 - // input = 10 => output = (0 * (2^0)) + (1 * (2^1)) = 2 - // So we reverse and iterate from the back - const reversedBinaryText = binaryText - .split('') - .map(Number) // Convert to a number from string - .reverse() + // Formulae: + // input = 1 => output = 1 * (2^0) = 1 + // input = 10 => output = (0 * (2^0)) + (1 * (2^1)) = 2 + // So we reverse and iterate from the back + const reversedBinaryText = binaryText + .split('') + .map(Number) // Convert to a number from string + .reverse() - // Calculate the result by accumulating previous vaue - const result = reversedBinaryText.reduce( - (accumulator, currentValue, idx) => - accumulator + currentValue * Math.pow(2, idx) - ) - setDecimalText(result) + // Calculate the result by accumulating previous vaue + const result = reversedBinaryText.reduce( + (accumulator, currentValue, idx) => + accumulator + currentValue * Math.pow(2, idx) + ) + setErrorMessage('Enter either 0 or 1') + // I used to prevent the user from clicking the dot and not (.) the decimal part, and also prevents several (.) + setDecimalText(result === 'NaN' ? result : '') + } } return (