Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- https://jsfiddle.net/SpectatorPrivate/4g3trn89/show
- HTML:
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Number Info</title>
- <link rel="stylesheet" type="text/css" href="styles.css">
- </head>
- <body>
- <div>
- <h1>Number Info</h1>
- <label for="numberInput">Enter a number:</label>
- <input type="text" id="numberInput">
- <button id="getInfoButton">Get Info</button>
- <div id="result"></div>
- </div>
- <script src="script.js"></script>
- </body>
- </html>
- JavaScript:
- document.addEventListener('DOMContentLoaded', function() {
- const getInfoButton = document.getElementById('getInfoButton');
- const resultDiv = document.getElementById('result');
- getInfoButton.addEventListener('click', function() {
- const number = parseInt(document.getElementById('numberInput').value);
- const data = calculateInfo(number);
- displayInfo(data, number);
- });
- function calculateInfo(number) {
- const englishRepresentation = convertToEnglish(number);
- const todayDate = new Date().toString();
- const millisecondsToSeconds = (number / 1000).toFixed(2) + " seconds";
- const secondsToMinutes = (number / 60).toFixed(2) + " minutes";
- const minutesToHour = (number / 60).toFixed(2) + " hour";
- const hourToDays = (number / 24).toFixed(2) + " days";
- const daysToYear = (number / 365.25).toFixed(5) + " year"; // considerando um ano bissexto
- const daysToLeapYear = (number / 366).toFixed(5) + " year"; // considerando um ano bissexto
- const yearToCentury = (number / 100).toFixed(2) + " century";
- const involution = Math.pow(number, 2);
- const bytesToKilobytes = (number / 1024).toFixed(7) + " Kilobytes";
- const bytesToMegabytes = (number / (1024 * 1024)).toFixed(15) + " Megabytes";
- const bytesToGigabytes = (number / (1024 * 1024 * 1024)).toFixed(18) + " Gigabytes";
- const bytesToTerabytes = (number / (1024 * 1024 * 1024 * 1024)).toFixed(21) + " Terabytes";
- const bytesToPetabytes = (number / (1024 * 1024 * 1024 * 1024 * 1024)).toFixed(24) + " Petabytes";
- const bytesToBits = number * 8 + " Bits";
- const bytesToKilobits = (number * 8 / 1024).toFixed(5) + " Kilobits";
- const bytesToMegabits = (number * 8 / (1024 * 1024)).toFixed(11) + " Megabits";
- const bytesToGigabits = (number * 8 / (1024 * 1024 * 1024)).toFixed(14) + " Gigabits";
- const decimalToBinary = number.toString(2);
- const decimalToOctal = number.toString(8);
- const decimalToHexadecimal = number.toString(16);
- const asciiToBinary = number.toString().split('').map(char => char.charCodeAt(0).toString(2)).join(' ');
- const asciiToText = String.fromCharCode(number);
- const metersToCentimeter = (number * 100).toFixed(2) + " centimeter";
- const metersToMillimeter = (number * 1000).toFixed(2) + " millimeter";
- const metersToKilometer = (number / 1000).toFixed(2) + " kilometer";
- const metersToFeets = (number * 3.28084).toFixed(2) + " feets";
- const metersToMiles = (number * 0.000621371).toFixed(11) + " miles";
- const metersToInch = (number * 39.3701).toFixed(2) + " inch";
- const metersToLeague = (number * 0.000207123).toFixed(13) + " league";
- const metersToNauticalLeague = (number * 0.000179986).toFixed(12) + " league [nautical]";
- const metersToMicroinch = (number * 39370078.7402).toFixed(2) + " microinch";
- const metersToYard = (number * 1.09361).toFixed(2) + " yard";
- return {
- englishRepresentation,
- todayDate,
- millisecondsToSeconds,
- secondsToMinutes,
- minutesToHour,
- hourToDays,
- daysToYear,
- daysToLeapYear,
- yearToCentury,
- involution,
- bytesToKilobytes,
- bytesToMegabytes,
- bytesToGigabytes,
- bytesToTerabytes,
- bytesToPetabytes,
- bytesToBits,
- bytesToKilobits,
- bytesToMegabits,
- bytesToGigabits,
- decimalToBinary,
- decimalToOctal,
- decimalToHexadecimal,
- asciiToBinary,
- asciiToText,
- metersToCentimeter,
- metersToMillimeter,
- metersToKilometer,
- metersToFeets,
- metersToMiles,
- metersToInch,
- metersToLeague,
- metersToNauticalLeague,
- metersToMicroinch,
- metersToYard,
- number
- };
- }
- function convertToEnglish(number) {
- const singleDigits = ['', 'One', 'Two', 'Three', 'Four', 'Five', 'Six', 'Seven', 'Eight', 'Nine'];
- const teenDigits = ['Ten', 'Eleven', 'Twelve', 'Thirteen', 'Fourteen', 'Fifteen', 'Sixteen', 'Seventeen', 'Eighteen', 'Nineteen'];
- const tensDigits = ['', '', 'Twenty', 'Thirty', 'Forty', 'Fifty', 'Sixty', 'Seventy', 'Eighty', 'Ninety'];
- const scales = ['', 'Thousand', 'Million', 'Billion', 'Trillion', 'Quadrillion', 'Quintillion', 'Sextillion', 'Septillion', 'Octillion', 'Nonillion', 'Decillion'];
- if (number === 0) return 'Zero';
- if (number < 0) return 'Negative ' + convertToEnglish(-number);
- let groupCount = 0;
- let result = '';
- while (number > 0) {
- if (number % 1000 !== 0) {
- let tempResult = convertToEnglishLessThanThousand(number % 1000);
- if (groupCount > 0) {
- tempResult += ' ' + scales[groupCount];
- }
- result = tempResult + ' ' + result;
- }
- number = Math.floor(number / 1000);
- groupCount++;
- }
- return result.trim();
- }
- function convertToEnglishLessThanThousand(number) {
- const singleDigits = ['', 'One', 'Two', 'Three', 'Four', 'Five', 'Six', 'Seven', 'Eight', 'Nine'];
- const teenDigits = ['Ten', 'Eleven', 'Twelve', 'Thirteen', 'Fourteen', 'Fifteen', 'Sixteen', 'Seventeen', 'Eighteen', 'Nineteen'];
- const tensDigits = ['', '', 'Twenty', 'Thirty', 'Forty', 'Fifty', 'Sixty', 'Seventy', 'Eighty', 'Ninety'];
- let result = '';
- if (number >= 100) {
- result += singleDigits[Math.floor(number / 100)] + ' Hundred ';
- number %= 100;
- }
- if (number >= 20) {
- result += tensDigits[Math.floor(number / 10)] + ' ';
- number %= 10;
- } else if (number >= 10) {
- result += teenDigits[number - 10] + ' ';
- number = 0;
- }
- if (number > 0) {
- result += singleDigits[number] + ' ';
- }
- return result.trim();
- }
- function displayInfo(data, number) {
- resultDiv.innerHTML = `
- <div style="text-align: center;">
- <p style="font-size: 64px;"><strong>${number}</strong></p>
- <p style="font-size: 36px; font-weight: bold;">${data.englishRepresentation}</p>
- </div>
- <div>
- <p>Time data:</p>
- <ul>
- <li>Today's date: ${data.todayDate}</li>
- <li>Milliseconds to seconds: ${data.millisecondsToSeconds}</li>
- <li>Seconds to minutes: ${data.secondsToMinutes}</li>
- <li>Minutes to hour: ${data.minutesToHour}</li>
- <li>Hour to days: ${data.hourToDays}</li>
- <li>Days to year: ${data.daysToYear}</li>
- <li>Days to a leap year: ${data.daysToLeapYear}</li>
- <li>Year to century: ${data.yearToCentury}</li>
- </ul>
- <p>IT data:</p>
- <ul>
- <li>Involution of ${number} is ${data.involution}</li>
- <li>${number} bytes is ${data.bytesToKilobytes}</li>
- <li>${number} bytes is ${data.bytesToMegabytes}</li>
- <li>${number} bytes is ${data.bytesToGigabytes}</li>
- <li>${number} bytes is ${data.bytesToTerabytes}</li>
- <li>${number} bytes is ${data.bytesToPetabytes}</li>
- <li>${number} bytes is ${data.bytesToBits}</li>
- <li>${number} bytes is ${data.bytesToKilobits}</li>
- <li>${number} bytes is ${data.bytesToMegabits}</li>
- <li>${number} bytes is ${data.bytesToGigabits}</li>
- <li>Decimal to binary is ${data.decimalToBinary}</li>
- <li>Decimal to octal is ${data.decimalToOctal}</li>
- <li>Decimal to hexadecimal is ${data.decimalToHexadecimal}</li>
- <li>${number} ASCII to Binary is ${data.asciiToBinary}</li>
- <li>${number} ASCII to Text is ${data.asciiToText}</li>
- </ul>
- <p>Distance data:</p>
- <ul>
- <li>${number} meters is ${data.metersToCentimeter}</li>
- <li>${number} meters is ${data.metersToMillimeter}</li>
- <li>${number} meters is ${data.metersToKilometer}</li>
- <li>${number} meters is ${data.metersToFeets}</li>
- <li>${number} meters is ${data.metersToMiles}</li>
- <li>${number} meters is ${data.metersToInch}</li>
- <li>${number} meters is ${data.metersToLeague}</li>
- <li>${number} meters is ${data.metersToNauticalLeague}</li>
- <li>${number} meters is ${data.metersToMicroinch}</li>
- <li>${number} meters is ${data.metersToYard}</li>
- </ul>
- </div>
- `;
- }
- });
- CSS:
- .container {
- max-width: 600px;
- margin: 0 auto;
- text-align: center;
- }
- input[type="text"] {
- width: 100px;
- margin: 10px;
- }
- button {
- padding: 10px 20px;
- background-color: #007bff;
- color: #fff;
- border: none;
- cursor: pointer;
- }
- button:hover {
- background-color: #0056b3;
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement