finished ch 9

2024-10-23 11:14:14 -05:00
parent 1e756f4f72
commit e48567fa30
11 changed files with 163 additions and 0 deletions
--- a/9/canvas.html
+++ b/9/canvas.html
@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>Canvas</title>
+ </head>
+ <body>
+ <canvas id="canvas" width="300" height="300"></canvas>
+ <script src="cs.js"></script>
+ </body
--- a/9/cs.js
+++ b/9/cs.js
@ -0,0 +1,42 @@
+let canvas = document.querySelector("#canvas");
+let ctx = canvas.getContext("2d");
+let width = canvas.width;
+let height = canvas.height;
+let x = 0;
+let y = 0;
+let forwards = true;
+
+function drawCircle(x, y) {
+  ctx.fillStyle = "rgb(0, 128, 255)";
+  ctx.beginPath();
+  ctx.arc(x, y, 10, 0, Math.PI * 2, false);
+  ctx.fill();
+}
+function update() {
+ if (forwards === true) {
+  x += 1;
+  y = 10
+}
+ else{
+  x -= 1;
+  y = 10
+ }
+ if (x >= 300){
+  forwards = false;
+ }
+ if (x <= 0){
+  forwards = true
+ }
+// y += 1; 
+// x %= width;
+// y %= height;
+}
+   
+function draw() {
+     ctx.clearRect(0, 0, width, height);
+     drawCircle(x, y);
+}
+setInterval(() => {
+update();
+draw();
+}, 1);