-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
65 lines (61 loc) · 3.16 KB
/
index.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
61
62
63
64
65
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<!-- ****** faviconit.com favicons ****** -->
<link rel="shortcut icon" href="favicon/favicon.ico">
<link rel="icon" sizes="16x16 32x32 64x64" href="favicon/favicon.ico">
<link rel="icon" type="image/png" sizes="196x196" href="favicon/favicon-192.png">
<link rel="icon" type="image/png" sizes="160x160" href="favicon/favicon-160.png">
<link rel="icon" type="image/png" sizes="96x96" href="favicon/favicon-96.png">
<link rel="icon" type="image/png" sizes="64x64" href="favicon/favicon-64.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon/favicon-32.png">
<link rel="icon" type="image/png" sizes="16x16" href="favicon/favicon-16.png">
<link rel="apple-touch-icon" href="favicon/favicon-57.png">
<link rel="apple-touch-icon" sizes="114x114" href="favicon/favicon-114.png">
<link rel="apple-touch-icon" sizes="72x72" href="favicon/favicon-72.png">
<link rel="apple-touch-icon" sizes="144x144" href="favicon/favicon-144.png">
<link rel="apple-touch-icon" sizes="60x60" href="favicon/favicon-60.png">
<link rel="apple-touch-icon" sizes="120x120" href="favicon/favicon-120.png">
<link rel="apple-touch-icon" sizes="76x76" href="favicon/favicon-76.png">
<link rel="apple-touch-icon" sizes="152x152" href="favicon/favicon-152.png">
<link rel="apple-touch-icon" sizes="180x180" href="favicon/favicon-180.png">
<meta name="msapplication-TileColor" content="#FFFFFF">
<meta name="msapplication-TileImage" content="favicon/favicon-144.png">
<meta name="msapplication-config" content="browserconfig.xml">
<!-- ****** faviconit.com favicons ****** -->
</head>
<title>Painting Moment!!!!!</title>
<link rel="icon" type="image/x-icon" href="favicon/favicon.ico">
<body>
<div align = "center">
<img id = "turt" src="Turtle-01.gif">
<img id = "title" src="title.gif">
<img id = "turt" src="Turtle-01.gif">
</div>
<div id="follow"><img id="img" src="pencil_up.png" height = 30px></div>
<div align ="center">
<canvas id="canvas" style ="border:5px solid #100000; background-color: white;"></canvas>
</div>
<div align = "center">
<button class="clear">Clear</button>
</div>
<div align = "center">
<p style = "padding: 10px;">Click and Drag on the canvas to make the turtle draw,
the Turtle will follow your cursor within the canvas!
</p>
<p style = "padding-bottom: 10px;">KNOWN BUG: Resizing the page can throw off the turtle's initial position. Refresh the page to fix it</p>
<div align = "center">
<img id = "thought" width = 400 src = "thought.gif" onclick="togglePlay()"/>
<audio id="Saul" src="nokia_better_call_saul.mp3" preload="auto"></audio>
<img id ="big" src="pencil_down.png"/>
<p>You can also pause the turtle's thoughts by clicking on the thought bubble</p>
</div>
<p style="padding: 20px">Made with <span style="color: #e25555;">♥</span> by <a href="https://github.com/The-NinToaster"> The-NinToaster</a></p>
<a href="https://www.youtube.com/watch?v=_JwNf6aJfr0">Click here for Audio Source</a>
</div>
</body>
<script src="paint.js"></script>
</html>