JavaScriptProjects/Reaction-Timer/script.js at 0456297c3664fbf24ec87ed1d8d8792049ca49a3 · OpenSouce-LNMIIT/JavaScriptProjects · 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
            var start = new Date().getTime();

            function getRandomColor() {

                var x = Math.floor(Math.random()* 256);
                var y = Math.floor(Math.random()* 256);
                var z = Math.floor(Math.random()* 256);

                var randomColorMaker = "rgb(" + x + "," + y + "," + z + ")";

                document.getElementById("shape").style.backgroundColor = randomColorMaker;
            }

            function makeShapeAppear() {

                var top = Math.random()* 400;

                var left =Math.random()* 1150;

                var width = (Math.random()* 400) + 100;

                if(Math.random() < 0.5) {

                    document.getElementById("shape").style.borderRadius = "50%";
                } else {

                    document.getElementById("shape").style.borderRadius = "0";
                }

                document.getElementById("shape").style.top = top + "px";
                document.getElementById("shape").style.left = left + "px";
                document.getElementById("shape").style.width = width + "px";
                document.getElementById("shape").style.height = width + "px";

                document.getElementById("shape").style.backgroundColor = getRandomColor();

                document.getElementById("shape").style.display ="block";
                start = new Date().getTime();
            }

            function Timeout() {

                setTimeout(makeShapeAppear, Math.random()* 2000);

            }
            Timeout();


            document.getElementById("shape").onclick = function() {

                document.getElementById("shape").style.display = "none";

                var end = new Date().getTime();

                var timeTaken = (end - start) / 1000 + " sec";

                document.getElementById("timeTaken").innerHTML = timeTaken;

                    var bestTime = 0;

                    if (timeTaken < bestTime) {

                        bestTime = timeTaken;
                        document.getElementById("best").innerHTML = bestTime + " sec";
                    } else {

                        document.getElementById("best").innerHTML = timeTaken + " sec";
                    }


                Timeout();
            }