<!
DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LEADER ALOSH</title>
<style>
body {
font-family: Arial, sans-serif;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background-color: #f4f4f4;
margin: 0;
padding: 20px;
box-sizing: border-box;
}
.container {
background-color: #fff;
padding: 30px;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
width: 100%;
max-width: 400px;
text-align: center;
}
h1 {
color: #333;
margin-bottom: 25px;
font-size: 26px;
}
.input-group {
margin-bottom: 20px;
text-align: right;
}
label {
display: block;
margin-bottom: 8px;
color: #555;
font-weight: bold;
}
input[type="number"] {
width: calc(100% - 20px);
padding: 10px;
border: 1px solid #ddd;
border-radius: 5px;
font-size: 18px;
text-align: center;
}
.direction-selection {
margin-bottom: 20px;
text-align: right;
}
.direction-buttons {
display: flex;
justify-content: space-between;
gap: 10px;
}
.direction-button {
flex: 1;
padding: 10px 15px;
border: 2px solid #007bff;
border-radius: 5px;
background-color: #fff;
color: #007bff;
font-size: 16px;
cursor: pointer;
transition: all 0.3s ease;
}
.[Link] {
background-color: #007bff;
color: #fff;
}
.direction-button:hover:not(.selected) {
background-color: #e9f5ff;
}
.action-buttons {
display: flex;
justify-content: space-between;
gap: 10px;
margin-bottom: 20px;
}
.calculate-button, .clear-button {
padding: 12px 20px;
border: none;
border-radius: 5px;
font-size: 18px;
cursor: pointer;
transition: background-color 0.3s ease;
flex: 1;
}
.calculate-button {
background-color: #28a745;
color: white;
}
.calculate-button:hover {
background-color: #218838;
}
.clear-button {
background-color: #dc3545;
color: white;
}
.clear-button:hover {
background-color: #c82333;
}
.result-container {
background-color: #e9ecef;
padding: 15px;
border-radius: 8px;
text-align: center;
white-space: pre-wrap;
word-wrap: break-word;
font-size: 18px;
color: #333;
border: 1px solid #ced4da;
}
.result-title {
font-weight: bold;
margin-bottom: 10px;
font-size: 20px;
color: #000;
}
</style>
</head>
<body>
<div class="container">
<h1>LEADER ALOSH</h1>
<div class="input-group">
<label for="numberInput">أدخل الرقم:</label>
<input type="number" id="numberInput" placeholder="3211 :>"مثال
</div>
<div class="direction-selection">
<label>اختر االتجاه:</label>
<div class="direction-buttons">
<button class="direction-button selected" id="upButton">صاعد
↑</button>
<button class="direction-button" id="downButton"><↓ هابط/button>
</div>
</div>
<div class="action-buttons">
<button class="calculate-button" id="calculateButton"><احسب/button>
<button class="clear-button" id="clearButton"><مسح/button>
</div>
<div class="result-container" id="resultContainer" style="display: none;">
<div class="result-title">النتائج المستقبلية:</div>
<pre id="resultText"></pre>
</div>
</div>
<script>
const numberInput = [Link]("numberInput");
const upButton = [Link]("upButton");
const downButton = [Link]("downButton");
const calculateButton = [Link]("calculateButton");
const clearButton = [Link]("clearButton");
const resultContainer = [Link]("resultContainer");
const resultText = [Link]("resultText");
let currentDirection = "up"; // Default
const sumDigits = (numStr) => {
return [Link]("").reduce((sum, digit) => sum + parseInt(digit,
10), 0);
};
const getDigitalRoot = (num) => {
while (num >= 10) {
num = sumDigits([Link]());
}
return num;
};
const getFamily = (digitalRoot) => {
if ([1, 4, 7].includes(digitalRoot)) {
return { operation: 120 };
}
if ([2, 5, 8].includes(digitalRoot)) {
return { operation: 150 };
}
if ([3, 6, 9].includes(digitalRoot) || digitalRoot === 0) {
return { operation: 180 };
}
return { operation: 0 };
};
[Link]("click", () => {
currentDirection = "up";
[Link]("selected");
[Link]("selected");
});
[Link]("click", () => {
currentDirection = "down";
[Link]("selected");
[Link]("selected");
});
[Link]("click", () => {
const inputVal = [Link];
if (!inputVal || isNaN(parseInt(inputVal))) {
alert("الرجاء إدخال رقم صحيح.");
return;
}
const originalNumber = parseInt(inputVal, 10);
const digitSum = sumDigits(inputVal);
const digitalRoot = getDigitalRoot(digitSum);
const { operation } = getFamily(digitalRoot);
let results = [];
let currentValue = originalNumber;
for (let i = 0; i < 10; i++) {
currentValue = currentDirection === "up"
? currentValue + operation
: currentValue - operation;
[Link](currentValue);
}
[Link] = [Link](" - ");
[Link] = "block";
});
[Link]("click", () => {
[Link] = "";
[Link] = "";
[Link] = "none";
currentDirection = "up";
[Link]("selected");
[Link]("selected");
});
</script>
</body>
</html>