Happy-Numbers/StepAnalyzer.html at main · AEjonanonymous/Happy-Numbers · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Happy Number Step Analyzer</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <style>
        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');
        body {
            font-family: 'Inter', sans-serif;
            background-color: #f3f4f6;
        }
        .card {
            background-color: white;
            padding: 2rem;
            border-radius: 1rem;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        }
        .btn {
            @apply px-6 py-3 rounded-lg text-white font-semibold transition-transform duration-200 transform hover:scale-105;
        }
    </style>
</head>
<body class="flex items-center justify-center min-h-screen p-4">

    <div class="card w-full max-w-2xl text-center">
        <h1 class="text-3xl font-bold text-gray-800 mb-4">Happy Number Step Analyzer</h1>
        <p class="text-gray-600 mb-6">Calculates the ratio of average sequence lengths for unhappy to happy numbers in a given range.</p>

        <div class="flex flex-col sm:flex-row justify-center items-center gap-4 mb-6">
            <div class="flex flex-col items-start w-full sm:w-1/2">
                <label for="start" class="text-gray-700 font-medium mb-1">Start Number:</label>
                <input type="number" id="start" value="1" min="1" class="w-full p-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
            </div>
            <div class="flex flex-col items-start w-full sm:w-1/2">
                <label for="end" class="text-gray-700 font-medium mb-1">End Number:</label>
                <input type="number" id="end" value="10000" min="1" class="w-full p-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
            </div>
        </div>

        <button id="analyzeBtn" class="btn bg-blue-600 hover:bg-blue-700 w-full mb-6">
            Analyze
        </button>

        <div id="loading" class="hidden text-center text-gray-600 mb-4">
            <p>Analyzing numbers...</p>
        </div>

        <div id="output" class="text-left bg-gray-100 p-4 rounded-lg">
            <p>Results will appear here.</p>
        </div>
    </div>

    <script>
        document.getElementById('analyzeBtn').addEventListener('click', () => {
            const startInput = document.getElementById('start');
            const endInput = document.getElementById('end');
            const start = parseInt(startInput.value);
            const end = parseInt(endInput.value);
            const outputDiv = document.getElementById('output');
            const loadingDiv = document.getElementById('loading');

            if (isNaN(start) || isNaN(end) || start < 1 || end < start) {
                outputDiv.innerHTML = `<p class="text-red-500">Please enter a valid number range.</p>`;
                return;
            }

            loadingDiv.classList.remove('hidden');
            outputDiv.innerHTML = '';

            setTimeout(() => {
                const happyLengths = [];
                const unhappyLengths = [];

                for (let i = start; i <= end; i++) {
                    const { isHappy, sequenceLength } = analyzeNumberForLength(i);
                    if (isHappy) {
                        happyLengths.push(sequenceLength);
                    } else {
                        unhappyLengths.push(sequenceLength);
                    }
                }

                const happyCount = happyLengths.length;
                const unhappyCount = unhappyLengths.length;
                const averageHappyLength = happyCount > 0 ? happyLengths.reduce((a, b) => a + b, 0) / happyCount : 0;
                const averageUnhappyLength = unhappyCount > 0 ? unhappyLengths.reduce((a, b) => a + b, 0) / unhappyCount : 0;

                const ratio = averageUnhappyLength / averageHappyLength || 0;

                loadingDiv.classList.add('hidden');
                outputDiv.innerHTML = `
                    <h2 class="text-2xl font-semibold mb-2">Analysis Complete</h2>
                    <p class="mb-1"><span class="font-medium">Total Happy Numbers:</span> ${happyCount}</p>
                    <p class="mb-1"><span class="font-medium">Total Unhappy Numbers:</span> ${unhappyCount}</p>
                    <p class="mb-1"><span class="font-medium">Average Happy Length:</span> ${averageHappyLength.toFixed(3)}</p>
                    <p class="mb-1"><span class="font-medium">Average Unhappy Length:</span> ${averageUnhappyLength.toFixed(3)}</p>
                    <p class="mt-4 text-lg"><span class="font-bold">Ratio of average unhappy length to average happy length:</span> ${ratio.toFixed(3)}</p>
                `;
            }, 100);
        });

        function sumDigitsSquared(n) {
            let totalSum = 0;
            while (n > 0) {
                totalSum += (n % 10) ** 2;
                n = Math.floor(n / 10);
            }
            return totalSum;
        }

        function analyzeNumberForLength(n) {
            const path = new Set();
            let currentNum = n;
            let sequenceLength = 0;
            const unhappyCycle = new Set([4, 16, 37, 58, 89, 145, 42, 20]);

            while (currentNum !== 1 && !unhappyCycle.has(currentNum)) {
                currentNum = sumDigitsSquared(currentNum);
                sequenceLength++;
                if (path.has(currentNum)) {
                    return { isHappy: false, sequenceLength };
                }
                path.add(currentNum);
            }

            const isHappy = currentNum === 1;
            return { isHappy, sequenceLength };
        }
    </script>
</body>
</html>