site-bkgs

commit 6367428203c65d252fd152862171808e5dd1875b
parent 420884df95f1319c2d5b312df56827da4e1a5f85
Author: Ryan Jeffrey <ryan@ryanmj.xyz>
Date:   Mon, 19 Apr 2021 00:30:36 -0700

Canvas is created.

Diffstat:
M
conway.js
 | 
58
+++++++++++-----------------------------------------------
A
test.html
 | 
1
+

2 files changed, 12 insertions(+), 47 deletions(-)
diff --git a/conway.js b/conway.js
@@ -1,47 +1,3 @@
-// let secondsPassed;
-// let oldTimeStamp;
-// let fps;
-
-
-// function init(){
-//   canvas = document.getElementById('canvas');
-//   context = canvas.getContext('2d');
-
-//   // Start the first frame request
-//   window.requestAnimationFrame(gameLoop);
-// }
-
-
-// function gameLoop(timeStamp) {
-
-//   // Calculate the number of seconds passed since the last frame
-//   secondsPassed = (timeStamp - oldTimeStamp) / 1000;
-//   oldTimeStamp = timeStamp;
-
-//   // Calculate fps
-//   fps = Math.round(1 / secondsPassed);
-
-//   // Draw number to the screen
-//   context.fillStyle = 'white';
-//   context.fillRect(0, 0, 200, 100);
-//   context.font = '25px Arial';
-//   context.fillStyle = 'black';
-//   context.fillText("FPS: " + fps, 10, 30);
-
-//   // Perform the drawing operation
-//   draw();
-
-//   // The loop function has reached it's end. Keep requesting new frames
-//   window.requestAnimationFrame(gameLoop);
-// }
-
-// function draw(){
-//   let randomColor = Math.random() > 0.5? '#ff8080' : '#0099b0';
-//   context.fillStyle = randomColor;
-//   context.fillRect(100, 50, 200, 175);
-// }
-
-// init();
 "use strict";
 
 let stop = false;
@@ -52,7 +8,15 @@ let canvas;
 let context;
 
 function init() {
-  canvas = document.getElementById('canvas');
+  let newCanvas = document.createElement('canvas');
+  newCanvas.setAttribute("id", 'bkg-canvas');
+  newCanvas.style['position'] = 'absolute';
+  newCanvas.style['left'] = 0;
+  newCanvas.style['right'] = 0;
+  newCanvas.style['z-index'] = -1;
+  document.body.appendChild(newCanvas);
+  
+  canvas = document.getElementById('bkg-canvas');
   context = canvas.getContext('2d');
 }
 
@@ -62,7 +26,7 @@ function startAnimating(fps) {
   fpsInterval = 1000 / fps;
   then = Date.now();
   startTime = then;
-  console.log(startTime);
+  console.log("Starting on Unix timestamp: " + startTime);
   animate();
 }
 
@@ -112,4 +76,4 @@ function draw(){
 }
 
 init();
-startAnimating(5);
+startAnimating(10);
diff --git a/test.html b/test.html
@@ -0,0 +1 @@
+<script defer src="./conway.js"></script>