diff --git a/Calculators/Magic-Number-Calculator/README.md b/Calculators/Magic-Number-Calculator/README.md new file mode 100644 index 000000000..53b63bd86 --- /dev/null +++ b/Calculators/Magic-Number-Calculator/README.md @@ -0,0 +1,26 @@ +#

Magic Number Calculator

+ +## Description :- + +The Magic Number Calculator is a web application that allows users to check if a number is a magic number or to find all magic numbers within a given range. A magic number is a number that eventually becomes 1 when the sum of its digits is repeatedly calculated until a single digit is obtained. + +## Tech Stacks :- + +- HTML +- CSS +- JavaScript + +## Features :- + +- Check if a single number is a magic number. +- Calculate and display all magic numbers within a given range. +- User-friendly interface with a drop-down menu for selecting options. +- Responsive design with a background image and enhanced styling. + +## Screenshots :- + +![image](https://github.com/Rakesh9100/CalcDiverse/assets/73993775/82d40074-0386-41db-a97b-b619b1226ae8) + +![image](https://github.com/Rakesh9100/CalcDiverse/assets/73993775/6db5658f-ab1b-4400-8170-316063e02ba3) + +![image](https://github.com/Rakesh9100/CalcDiverse/assets/73993775/017d8e80-ba5c-4fe8-b4ff-464617d29805) diff --git a/Calculators/Magic-Number-Calculator/assets/background.webp b/Calculators/Magic-Number-Calculator/assets/background.webp new file mode 100644 index 000000000..d29e5b17d Binary files /dev/null and b/Calculators/Magic-Number-Calculator/assets/background.webp differ diff --git a/Calculators/Magic-Number-Calculator/index.html b/Calculators/Magic-Number-Calculator/index.html new file mode 100644 index 000000000..30b802751 --- /dev/null +++ b/Calculators/Magic-Number-Calculator/index.html @@ -0,0 +1,41 @@ + + + + + + + Magic Number Calculator + + +
+

Magic Number Calculator

+
+ + +
+
+ + +
+
+ + + diff --git a/Calculators/Magic-Number-Calculator/script.js b/Calculators/Magic-Number-Calculator/script.js new file mode 100644 index 000000000..1222f66e9 --- /dev/null +++ b/Calculators/Magic-Number-Calculator/script.js @@ -0,0 +1,63 @@ +function handleOptionChange() { + const option = document.getElementById('option-select').value; + document.getElementById('single-number-section').style.display = option === "single" ? 'block' : 'none'; + document.getElementById('range-section').style.display = option === "range" ? 'block' : 'none'; +} + +function calculateDigitSum(num) { + let sum = 0; + while (num > 0) { + sum += num % 10; + num = Math.floor(num / 10); + } + return sum; +} + +function isMagicNumber(num) { + let steps = []; + while (num >= 10) { + let currentNum = num; + let digitSum = calculateDigitSum(num); + steps.push(`${currentNum} → ${currentNum.toString().split('').join(' + ')} = ${digitSum}`); + num = digitSum; + } + if(num>10) + steps.push(`${num}`); + return { isMagic: num === 1, steps: steps }; +} + +function checkMagicNumber() { + const num = document.getElementById('number').value; + const resultDiv = document.getElementById('result'); + const stepsDiv = document.getElementById('steps'); + if (num === "") { + resultDiv.textContent = "Please enter a number."; + stepsDiv.textContent = ""; + return; + } + const { isMagic, steps } = isMagicNumber(parseInt(num)); + resultDiv.textContent = isMagic ? `${num} is a Magic Number!` : `${num} is not a Magic Number.`; + stepsDiv.innerHTML = `Steps:
${steps.join('
')}
The recursive sum ${isMagic ? 'adds' : "doesn't add"} to 1.
So, the number ${isMagic ? 'is' : "is not "} a magic number`; + +} + +function findMagicNumbersInRange() { + const start = parseInt(document.getElementById('start').value); + const end = parseInt(document.getElementById('end').value); + const rangeResultDiv = document.getElementById('range-result'); + if (isNaN(start) || isNaN(end) || start > end) { + rangeResultDiv.textContent = "Please enter a valid range."; + return; + } + + let magicNumbers = []; + for (let i = start; i <= end; i++) { + if (isMagicNumber(i).isMagic) { + magicNumbers.push(i); + } + } + + rangeResultDiv.textContent = magicNumbers.length > 0 ? + `Magic Numbers in range ${start} to ${end}: ${magicNumbers.join(", ")}` : + `No Magic Numbers found in the range ${start} to ${end}.`; +} diff --git a/Calculators/Magic-Number-Calculator/style.css b/Calculators/Magic-Number-Calculator/style.css new file mode 100644 index 000000000..a708bd07f --- /dev/null +++ b/Calculators/Magic-Number-Calculator/style.css @@ -0,0 +1,105 @@ +body { + font-family: Arial, sans-serif; + display: flex; + justify-content: center; + align-items: center; + height: 100vh; + background: url('assets/background.webp') no-repeat center center fixed; + background-size: cover; + margin: 0; +} + +.container { + background-color: rgba(255, 255, 255, 0.9); + padding: 40px; + border-radius: 16px; + box-shadow: 0 0 15px rgba(0, 0, 0, 0.2); + text-align: center; + width: 100%; + max-width: 600px; + border: 2px solid #ccc; +} + +h1 { + margin-top: 0; + transition: color 0.3s ease; +} + +h1:hover { + color: #007BFF; +} + +.option-section { + margin: 20px 0; +} + +.option-section label { + font-weight: bold; +} + +.option-section select { + padding: 10px; + margin: 10px; + border: 1px solid #ccc; + border-radius: 4px; + width: 100%; + max-width: 300px; +} + +.response-section { + margin-top: 20px; + border-top: 1px solid #ccc; + padding-top: 20px; +} + +.input-section, .range-section { + display: none; + border: 1px solid #ccc; + padding: 20px; + border-radius: 4px; + background-color: #f9f9f9; + margin-top: 20px; +} + +input[type="number"] { + padding: 10px; + margin: 10px; + border: 1px solid #ccc; + border-radius: 4px; + width: 100%; + max-width: 300px; +} + +button { + padding: 10px 20px; + margin-top: 10px; + background-color: #007BFF; + color: white; + border: none; + border-radius: 4px; + cursor: pointer; +} + +button:hover { + background-color: #0056b3; +} + +#result, #range-result { + margin-top: 20px; + font-weight: bold; + word-wrap: break-word; +} + +#steps { + margin-top: 20px; + text-align: left; + font-size: 16px; + padding: 10px; + background-color: #e9ecef; + border-radius: 4px; + border: 1px solid #ccc; +} + +#steps br { + margin-bottom: 10px; +} diff --git a/index.html b/index.html index 2f191bd85..99af55c87 100644 --- a/index.html +++ b/index.html @@ -1646,6 +1646,20 @@

Calculates a percentage score of love compatibility based on names or birthd +
+
+

Magic Number Calculator

+

Calculates if a number is a magic number and finds all magic numbers within a given range.

+ +
+

Mass Calculator