Commits

catseye  committed 83c8be4

These have employment now, on catseye.tc.

  • Participants
  • Parent commits 834063c

Comments (0)

Files changed (5)

File javascript/Elevator_1_(PSF).png

Removed
Old image

File javascript/canvas1.html

-<!DOCTYPE html>
-<head>
-  <meta charset="utf-8">
-  <title>HTML5 Canvas experiment #1</title>
-  <script src="canvas1.js"></script>
-  <style>
-#canvas { border: 1px solid blue; }
-  </style>
-</head>
-<body>
-
-<h1>HTML5 Canvas experiment #1</h1>
-
-<p id="counter"></p>
-<canvas id="canvas" width="800" height="200">
-Your browser doesn't support displaying an HTML5 canvas.
-</canvas>
-
-</body>
-<script>
-  CanvasExperiment1(document.getElementById('canvas')).start();
-</script>

File javascript/canvas1.js

-function CanvasExperiment1(canvas) {
-    var self = {};
-    var counter;
-    var interval_id;
-
-    self.draw = function() {
-      var ctx = canvas.getContext('2d');
-
-      document.getElementById('counter').innerHTML = counter;
-
-      ctx.clearRect(0, 0, canvas.width, canvas.height);
-
-      ctx.beginPath();
-      ctx.lineWidth = "1";
-      ctx.strokeStyle = "black";
-      ctx.moveTo(0,0);
-      var y = 200;
-      var w = (canvas.width / counter);
-      for (var i = 1; i <= counter; i++) {
-          ctx.lineTo(w * i, y);
-          y = (y == 200 ? 0 : 200);
-      }
-      ctx.lineTo(canvas.width,0);
-      ctx.stroke();
-      
-      counter += 1;
-    };
-
-    self.start = function() {
-      counter = 1;
-      self.draw();
-      interval_id = setInterval(self.draw, 50);
-    };
-
-    return self;
-}

File javascript/canvas5.html

-<!DOCTYPE html>
-<head>
-  <meta charset="utf-8">
-  <title>HTML5 Canvas experiment #5</title>
-  <script src="canvas5.js"></script>
-  <style>
-#canvas { border: 1px solid blue; }
-  </style>
-</head>
-<body>
-
-<h1>HTML5 Canvas experiment #5</h1>
-
-<canvas id="canvas" width="640" height="390">
-Your browser doesn't support displaying an HTML5 canvas.
-</canvas>
-
-</body>
-<script>
-  new Canvas5Controller().start(document.getElementById('canvas'));
-</script>

File javascript/canvas5.js

-Canvas5Controller = function() {
-    var canvas;
-    var interval_id;
-
-    var img = new Image();
-    var shapes = new Array();
-    var NUM_SHAPES = 100;
-
-    var new_shape = function(i) {
-        var size = Math.floor(Math.random() * 80) + 20;
-        shapes[i].w = size;
-        shapes[i].x = 0 - size;
-        shapes[i].y = Math.floor(Math.random() * (canvas.height - size));
-        shapes[i].v = Math.random() * 8 + 1;
-        shapes[i].alpha = Math.random() * 0.66;
-    }
-
-    this.draw = function() {
-        var ctx = canvas.getContext('2d');
-
-        ctx.clearRect(0, 0, canvas.width, canvas.height);
-
-        ctx.drawImage(img, 0, 0);
-
-        for (var i = 0; i < NUM_SHAPES; i++) {
-            ctx.beginPath();
-            ctx.fillStyle="rgba(255, 255, 0, " + shapes[i].alpha + ")";
-            ctx.moveTo(shapes[i].x, shapes[i].y);
-            ctx.lineTo(shapes[i].x + shapes[i].w, shapes[i].y + shapes[i].w / 2);
-            ctx.lineTo(shapes[i].x, shapes[i].y + shapes[i].w);
-            ctx.closePath();
-            ctx.fill();
-            shapes[i].x += shapes[i].v;
-            if (shapes[i].x > canvas.width) {
-                new_shape(i);
-            }
-        }
-    }
-
-    this.start = function(c) {
-        canvas = c;
-        for (var i = 0; i < NUM_SHAPES; i++) {
-            shapes[i] = {};
-            new_shape(i);
-        }
-        var self = this;
-        img.onload = function() {
-            self.draw();
-            interval_id = setInterval(self.draw, 20);
-        }
-        // http://upload.wikimedia.org/wikipedia/commons/thumb/5/52/Elevator_1_%28PSF%29.png/640px-Elevator_1_%28PSF%29.png
-        img.src = 'Elevator_1_(PSF).png';
-    }
-
-    this.stop = function() {
-        if (interval_id === undefined)
-            return;
-        clearInterval(interval_id);
-        interval_id = undefined;
-    }
-}