Skip to content

Commit a0c86b1

Browse files
Sulagna-Dutta-RoySulagna-Dutta-Roy
authored
Merge pull request #2550 from Sravyasaka/Dudeney-Number-Checker
Added Dudeney Number Calculator
2 parents 40ec6ef + d714bf7 commit a0c86b1

File tree

5 files changed

+217
-0
lines changed

5 files changed

+217
-0
lines changed

‎Dudeney Number Calculator/bgi5.jpg‎

63.8 KB
Loading

‎Dudeney Number Calculator/index.html‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<!DOCTYPE html>
2+
3+
<html lang="en" dir="ltr">
4+
<head>
5+
<meta charset="utf-8">
6+
<title>Dudeney Checker in JavaScript </title>
7+
<link rel="stylesheet" href="style.css">
8+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
9+
</head>
10+
<body>
11+
<div class="wrapper">
12+
<header>
13+
<h1>Dudeney Checker</h1>
14+
<p>A Dudeney number is a positive integer that is a perfect cube, and the sum of its digits is equal to the cube root of the number</p>
15+
</header>
16+
<div class="inputs">
17+
<input type="text" spellcheck="false" placeholder="Enter text or number">
18+
<button>Check Dudeney</button>
19+
</div>
20+
<p class="info-txt"></p>
21+
</div>
22+
<script src="script.js"></script>
23+
</body>
24+
</html>

‎Dudeney Number Calculator/readme.md‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
# <p align="center">Dudeney Calculator</p>
2+
3+
## Description :-
4+
5+
This is a simple website that checks whether a entered number or string is a Dudeney number or not.
6+
7+
## Tech Stacks :-
8+
9+
- HTML
10+
- CSS
11+
- JavaScript
12+
13+
## Features :-
14+
15+
Displays a clear message indicating if the input is a Dudeney number or not.<br>
16+
Handles queries for large numbers too
17+
18+
## Screenshots :-
19+
20+
![image](https://github.com/Rakesh9100/CalcDiverse/assets/73993775/a3c1bb69-ebf0-4167-b44d-dcc2a2d76570)

‎Dudeney Number Calculator/script.js‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
const txtInput = document.querySelector(".inputs input"),
2+
checkBtn = document.querySelector(".inputs button"),
3+
infoTxt = document.querySelector(".info-txt");
4+
let filterInput;
5+
6+
function isDudeneyNumber(num) {
7+
// Find the cube root of the number
8+
const cubeRoot = Math.cbrt(num);
9+
10+
// Check if the cube root is an integer
11+
if (!Number.isInteger(cubeRoot)) {
12+
return false;
13+
}
14+
15+
// Sum the digits of the number
16+
const sumOfDigits = num
17+
.toString()
18+
.split('')
19+
.map(Number)
20+
.reduce((acc, digit) => acc + digit, 0);
21+
22+
// Check if the sum of digits equals the cube root
23+
return sumOfDigits === cubeRoot;
24+
}
25+
26+
checkBtn.addEventListener("click", () => {
27+
let reverseInput = filterInput.split("").reverse().join("");
28+
infoTxt.style.display = "block";
29+
if(!isDudeneyNumber(filterInput)) {
30+
return infoTxt.innerHTML = `No, <span>'${txtInput.value}'</span> isn't a Dudeney Number!`;
31+
}
32+
infoTxt.innerHTML = `Yes, <span>'${txtInput.value}'</span> is a Dudeney Number!`;
33+
});
34+
35+
txtInput.addEventListener("keyup", () => {
36+
filterInput = txtInput.value.toLowerCase().replace(/[^A-Z0-9]/ig, "");
37+
if(filterInput) {
38+
return checkBtn.classList.add("active");
39+
}
40+
infoTxt.style.display = "none";
41+
checkBtn.classList.remove("active");
42+
});

‎Dudeney Number Calculator/style.css‎

Lines changed: 131 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,131 @@
1+
/* Import Google Font - Poppins */
2+
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');
3+
*{
4+
margin: 0;
5+
padding: 0;
6+
box-sizing: border-box;
7+
font-family: 'Poppins', sans-serif;
8+
}
9+
body{
10+
display: flex;
11+
padding: 0 10px;
12+
background-image: url("bgi5.jpg");
13+
align-items: center;
14+
justify-content: center;
15+
min-height: 100vh;
16+
/* background: #AA57CC; */
17+
margin-top: 200px;
18+
background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
19+
background-size: 400% 400%;
20+
animation: gradient 15s ease infinite;
21+
}
22+
::selection{
23+
color: #fff;
24+
background: rgb(170,87,204,0.8);
25+
}
26+
.wrapper{
27+
max-width: 500px;
28+
background: #fff;
29+
border-radius: 7px;
30+
padding: 20px 25px 15px;
31+
box-shadow: 0 15px 40px rgba(0,0,0,0.12);
32+
}
33+
header h1{
34+
font-size: 27px;
35+
font-weight: 500;
36+
}
37+
header p{
38+
margin-top: 5px;
39+
font-size: 18px;
40+
color: #474747;
41+
}
42+
.inputs{
43+
margin: 20px 0 27px;
44+
}
45+
.inputs input{
46+
width: 100%;
47+
height: 60px;
48+
outline: none;
49+
padding: 0 17px;
50+
font-size: 19px;
51+
border-radius: 5px;
52+
border: 1px solid #999;
53+
transition: 0.1s ease;
54+
}
55+
.inputs input::placeholder{
56+
color: #999999;
57+
}
58+
.inputs input:focus{
59+
box-shadow: 0 3px 6px rgba(0,0,0,0.13);
60+
}
61+
.inputs input:focus::placeholder{
62+
color: #bebebe;
63+
}
64+
.inputs button{
65+
width: 100%;
66+
height: 56px;
67+
border: none;
68+
opacity: 0.7;
69+
outline: none;
70+
color: #fff;
71+
cursor: pointer;
72+
font-size: 17px;
73+
margin-top: 20px;
74+
border-radius: 5px;
75+
pointer-events: none;
76+
background: #AA57CC;
77+
transition: opacity 0.15s ease;
78+
background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
79+
background-size: 400% 400%;
80+
animation: gradient 15s ease infinite;
81+
}
82+
.inputs button.active{
83+
opacity: 1;
84+
pointer-events: auto;
85+
}
86+
.info-txt{
87+
display: none;
88+
font-size: 19px;
89+
text-align: center;
90+
margin-bottom: 18px;
91+
}
92+
.info-txt span{
93+
color: #AA57CC;
94+
}
95+
96+
@media (max-width: 520px) {
97+
.wrapper{
98+
padding: 17px 20px 10px;
99+
}
100+
header h1{
101+
font-size: 25px;
102+
}
103+
header p{
104+
font-size: 16px;
105+
}
106+
.inputs input{
107+
height: 54px;
108+
font-size: 17px;
109+
}
110+
.inputs button{
111+
height: 50px;
112+
font-size: 16px;
113+
margin-top: 17px;
114+
}
115+
.info-txt{
116+
font-size: 18px;
117+
}
118+
}
119+
@keyframes gradient {
120+
0% {
121+
background-position: 0% 50%;
122+
}
123+
124+
50% {
125+
background-position: 100% 50%;
126+
}
127+
128+
100% {
129+
background-position: 0% 50%;
130+
}
131+
}

0 commit comments

Comments
 (0)