-
Notifications
You must be signed in to change notification settings - Fork 0
/
mobileStart.html
60 lines (55 loc) · 1.98 KB
/
mobileStart.html
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
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Eh vabbuò</title>
<!-- CSS -->
<link rel="stylesheet" href="formatting.css">
<!-- JavaScript -->
<script src='OSC.js'></script>
<script src='utilities.js'></script>
<script src="sentence.js"></script>
<script src="sentenceManager.js"></script>
<script src="staticSentence.js"></script>
<script src="staticSentenceManager.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body style="background-color: hsl(120, 55%, 30%);">
<!-- Canvas for sentences -->
<canvas id="c"></canvas>
<!-- SVG button -->
<svg width="100" height="100" id="svgButton">
<a xlink:href="/main.php">
<circle cx="50" cy="50" r="40" fill="yellow" id="outer"></circle>
<circle cx="50" cy="50" r="30" fill="green" id="inner"></circle>
</a>
</svg>
<script>
// Global vars
color = Math.floor(Math.random() * 360);
colorInner = Math.floor(Math.random() * 360);
colorOuter = Math.floor(Math.random() * 360);
lastColorUpdate = 400;
canvas = $("#c");
// Fast color apply
rainbow();
svgButton();
// Strech canvas to the whole page
updateCanvasDimensions(canvas);
var canvasHeight = this.canvas.height();
// Reload on page resized
$(window).resize(function () {
location.reload();
});
// Instanciating all objects
position = [canvasHeight * 0.25, canvasHeight * 0.75];
SM = new staticSentenceManager(canvas, position);
// Update button dimensions
buttonDimensions(canvasHeight);
// Begin animation
setTimeout(function () { // Used to wait a little for the AJAX responses
requestAnimationFrame(animate);
}, 2000);
</script>
</body>
</html>