-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
88 lines (79 loc) · 3.08 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
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
<!DOCTYPE HTML>
<html>
<link rel="stylesheet" href="style.css">
<link rel="icon" href="image.ico">
<head>
<title>LearnAI.js</title>
<canvas id="canvasId" oncontextmenu="return false;"></canvas>
<script>
canvas = document.getElementById("canvasId");
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
if (canvas.getContext) ctx = canvas.getContext("2d"); else alert("Canvas element is not available");
let intervalID = setInterval(draw, 10);
ctx.font = "bold 1.5vh Courier";
let charHeight = ctx.measureText("M").width;
let a = 2;
let h = 0;
// Curve function
function graph(n) {
return 50*(Math.E**(-0.004*(n-canvas.width/3)))*Math.sin(((n-canvas.width/3)-h)/a)-canvas.height/40;
}
function strGenerate(length) {
var result = '';
for (i = 0; i < length/10; i++) result += (Math.random() + 1).toString(36).substring(2);
return result;
}
let counter = 0;
let textarr = [];
function draw() {
ctx.clearRect(0, 0, canvas.width*2,canvas.height*2);
//Generate new text
if (counter == 0) {
for (let i = 0; i < canvas.height*2; i++) {
textarr[i] = strGenerate(canvas.width/4);
}
}
ctx.fillStyle = "#7D9DDF";
for (let i = 0; i < canvas.width/6; i++) {
for (let j = 0; j < textarr[0].length; j++) {
// Increment space in jagged fashion
if (j*10 < canvas.height/2-graph(i*10) && 1.3*charHeight+j*10 > canvas.height/2-graph(i*10)) {
ctx.fillText(textarr[i].charAt(j), i*10, 10+j*10);
}
}
}
ctx.fillStyle = "rgba(125, 157, 223, 0.25)";
// Randomized background text
for (let i = 0; i < canvas.height*2; i += 16) ctx.fillText(textarr[i/16], 0, 10 + i);
ctx.fill();
h+=0.05;
counter++;
counter %= 25;
}
let title;
window.onload = function () {
title = document.getElementById("title");
}
let callback = setInterval(function () {
title.style.textShadow = parseInt(2 + Math.random() * 4) + "px " + parseInt(2 + Math.random() * 2) + "px #4ebeda";
}, 75);
</script>
</head>
<body class="background">
<div class="titleBox" oncontextmenu="return false;">
<pre class="title" id="title">
__ _ _____ _
/ / ___ __ _ _ __ _ __ /_\ \_ \(_)___
/ / / _ \/ _` | '__| '_ \ //_\\ / /\/| / __|
/ /__| __/ (_| | | | | | / _ \/\/ /__ | \__ \
\____/\___|\__,_|_| |_| |_\_/ \_/\____(_)/ |___/
|__/
</pre>
<h1 class="heading">
AI and Machine Learning in your browser.
</h1>
<a href="edit.html"><input type="submit" value="Start Creating" class="button"></a>
</div>
</body>
</html>