Javascript-Programs/Prime Marker.html at main · khanhbang03/Javascript-Programs · 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
<!--
The Sieve of Eratosthenes is an algorithm for finding all prime numbers up to a specified limit.
It works by creating a list of all numbers from 2 to the limit, and then iteratively marking off all multiples of each prime number, starting with 2.
The algorithm is called the "Sieve" because it works by repeatedly "sifting out" composite numbers from the list until only prime numbers remain.
By using this algorithm, it's possible to find all prime numbers up to a very large limit efficiently, with a time complexity of O(n * log(log n)).
This makes it a useful tool in many mathematical applications.
-->

<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    </head>
    <body>
        <script>
            function Reset() {
                document.body.innerHTML = "";
                document.write("<title>Table of numbers</title>");

                document.write("<style>");
                document.write("input, td {text-align: center;}");
                document.write("</style>");
            }

            function handleInput() {
                input = document.getElementById('sz');
                if (input.value < 0) {
                    input.value = 0;
                }
                if (input.value > 100) {
                    input.value = 100;
                }
            }

            /* Form to adjust dimension*/
            function Dimension() {
                document.write('<br> <form id="dim">');
                document.write(
                    '<label for="dim">Please fill in the cell with a table size:</label>'
                );
                document.write(
                    '<input type="number" oninput="handleInput()" value="10" id="sz" style="margin: 0 15px">'
                );
                document.write(
                    "<button onclick=\"size=document.getElementById('sz').value; Normal()\">Change dimension</button>"
                );
                document.write("</form>");

                document.write("<p>Dimension: " + size + " x " + size + "</p>");
            }

            function MarkPrime() {
                /* Sieve of Eratosthenes */
                n = size * size;
                td = document.getElementsByTagName("td");
                prime = Array.from({ length: n + 1 }, () => true);
                prime[0] = prime[1] = false;
                for (let i = 2; i <= n; i++) {
                    if (prime[i]) {
                        for (let j = 2 * i; j <= n; j += i) {
                            prime[j] = false;
                        }
                    }
                }
                for (let i = 0; i < n; i++) {
                    if (prime[td[i].innerHTML]) {
                        td[i].style.backgroundColor = "black";
                        td[i].style.color = "red";
                    }
                }
            }

            function Control() {
                document.write(
                    '<br> <button onclick="MarkPrime()">Mark primes</button>' +
                    '<button onclick="Randomize()" style="margin: 0 15px">Randomize</button> <br>'
                );
                Dimension();
            }

            function Randomize() {
                Reset();
                document.write('<table border="3">');
                for (let i = 0; i < size; i++) {
                    document.write("<tr>");
                    for (let j = 0; j < size; j++) {
                        document.write(
                            "<td>" +
                                Math.floor(Math.random() * size * size) +
                                "</td>"
                        );
                    }
                    document.write("</tr>");
                }
                document.write("</table>");
                Control();
            }

            function Normal() {
                Reset();
                document.write('<table border="3">');
                for (let i = 0; i < size; i++) {
                    document.write("<tr>");
                    for (let j = 1; j <= size; j++) {
                        document.write("<td>" + (i * size + j) + "</td>");
                    }
                    document.write("</tr>");
                }
                document.write("</table>");
                Control();
            }

            size = 10;
            Normal();
        </script>
    </body>
</html>