begin frame drawing

This commit is contained in:
Kenneth Jao 2017-09-30 18:46:31 -04:00
parent ef92415ab1
commit 408e7e0196
2 changed files with 31 additions and 29 deletions

View File

@ -1,9 +1,8 @@
<html> <html>
<<<<<<< HEAD
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1"> <meta http-equiv="X-UA-Compatible" content="chrome=1">
<title>Foxnet</title> <title>Gyrio</title>
<link rel="icon" href="../assets/favicon.ico"> <link rel="icon" href="../assets/favicon.ico">
<link rel="stylesheet" href="./index.css"> <link rel="stylesheet" href="./index.css">
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css"> <link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
@ -13,23 +12,4 @@
<canvas id="canvas"></canvas> <canvas id="canvas"></canvas>
</body> </body>
<script src="./index.js"></script> <script src="./index.js"></script>
</html> </html>
=======
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<title>Foxnet</title>
<link rel="icon" href="../assets/favicon.ico">
<link rel="stylesheet" href="./index.css">
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
</head>
<body>
<canvas id="glCanvas"></canvas>
</body>
<script src="./index.js"></script>
</html>
>>>>>>> 3bcdb922df05952a164b59bdb8ad9d2aa2785b4d

View File

@ -1,14 +1,16 @@
var canvas = document.getElementById("canvas"); var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d"); var ctx = canvas.getContext("2d");
canvas.width = screen.width; canvas.width = window.innerWidth;
canvas.height = screen.height; canvas.height = window.innerHeight;
var frames = [
"0"
];
function randInt(min,max) { function randInt(min,max) {
return Math.floor(Math.random() * (max - min + 1)) + min; return Math.floor(Math.random() * (max - min + 1)) + min;
} }
function generateString() { function generateString() {
var final = ""; var final = "";
var length = randInt(50,100); var length = randInt(50,100);
@ -18,10 +20,25 @@ function generateString() {
return final; return final;
} }
console.log(generateString()); function generateFrames(string, speed) {
// Speed is in bits per second
ctx.fillStyle = "#000"; }
ctx.fillRect(0,0, canvas.width, canvas.height);
function drawFrame(frame) {
ctx.beginPath();
var frame = frames[frame];
for(var i = 0; i < frame.length; i++) {
if(frame[i] === "0") {
console.log("asdf");
ctx.beginPath();
ctx.moveTo(0,canvas.height/2);
ctx.lineTo(canvas.width,canvas.height/2);
ctx.strokeStyle="#4CAF50";
ctx.stroke();
}
}
}
function getWebsite(geturl) { function getWebsite(geturl) {
xmlhttp=new XMLHttpRequest(); xmlhttp=new XMLHttpRequest();
@ -29,3 +46,8 @@ function getWebsite(geturl) {
xmlhttp.send(); xmlhttp.send();
var data = xmlhttp.responseText; var data = xmlhttp.responseText;
} }
ctx.fillStyle = "#000";
ctx.fillRect(0,0, canvas.width, canvas.height);
generateFrames(generateString());
drawFrame(0);