vor 10 Jahren · 01f5389d52
--- a/.DS_Store
+++ b/.DS_Store
--- a/img/anti-muon/antimyon-spritesheet.png
+++ b/img/anti-muon/antimyon-spritesheet.png
--- a/img/electron/electron-spritesheet.png
+++ b/img/electron/electron-spritesheet.png
--- a/img/higgs/higgs-01.png
+++ b/img/higgs/higgs-01.png
--- a/img/higgs/higgs-02.png
+++ b/img/higgs/higgs-02.png
--- a/img/higgs/higgs-03.png
+++ b/img/higgs/higgs-03.png
--- a/img/higgs/higgs-04.png
+++ b/img/higgs/higgs-04.png
--- a/img/higgs/higgs-05.png
+++ b/img/higgs/higgs-05.png
--- a/img/higgs/higgs-06.png
+++ b/img/higgs/higgs-06.png
--- a/img/higgs/higgs-07.png
+++ b/img/higgs/higgs-07.png
--- a/img/higgs/higgs-08.png
+++ b/img/higgs/higgs-08.png
--- a/img/higgs/higgs-09.png
+++ b/img/higgs/higgs-09.png
--- a/img/higgs/higgs-spritesheet.png
+++ b/img/higgs/higgs-spritesheet.png
--- a/img/muon/myon-spritesheet.png
+++ b/img/muon/myon-spritesheet.png
--- a/img/physicist/physicist-spritesheet.png
+++ b/img/physicist/physicist-spritesheet.png
--- a/img/positron/.DS_Store
+++ b/img/positron/.DS_Store
--- a/img/positron/positron-spritesheet.png
+++ b/img/positron/positron-spritesheet.png
--- a/index.html
+++ b/index.html
@@ -0,0 +1,90 @@
 
				+<!DOCTYPE html>
			
 
				+<html>
			
 
				+<head>
			
 
				+	<title>EaselJS demo: Time based animation</title>
			
 
				+	<script src="http://code.createjs.com/easeljs-0.7.0.min.js"></script>
			
 
				+	<script>
			
 
				+    var cellSize = 50;
			
 
				+    var grid = [[]];
			
 
				+    for(var i=0; i<100; i++){
			
 
				+      grid[i] = [];
			
 
				+      for(var j=0; j<100; j++){
			
 
				+        grid[i][j] = {
			
 
				+          x: cellSize / 2 + i * cellSize,
			
 
				+          y: cellSize / 2 + j * cellSize
			
 
				+        };
			
 
				+      }
			
 
				+    }
			
 
				+		
			
 
				+		var stage, circle, snake;
			
 
				+		function init() {
			
 
				+			stage = new createjs.Stage("demoCanvas");
			
 
				+
			
 
				+      snake = {};
			
 
				+      snake.body = [];
			
 
				+      for(var i=0; i<8; i++){
			
 
				+			  circle = new createjs.Shape();
			
 
				+			  circle.graphics.beginFill("red").drawCircle(0, 0, 20);
			
 
				+        circle.direction = {x: 0, y: 0};
			
 
				+			  stage.addChild(circle);
			
 
				+        snake.body.push(circle);
			
 
				+      }
			
 
				+      snake.update = function(){
			
 
				+        for(var i=this.body.length - 1; i>0; i--){
			
 
				+          this.body[i].x = this.body[i-1].x;
			
 
				+          this.body[i].y = this.body[i-1].y;
			
 
				+          this.body[i].direction.x = this.body[i-1].direction.x;
			
 
				+          this.body[i].direction.y = this.body[i-1].direction.y;
			
 
				+        }
			
 
				+      };
			
 
				+			
			
 
				+			createjs.Ticker.on("tick", tick);
			
 
				+			createjs.Ticker.setFPS(20);
			
 
				+
			
 
				+      stage.on("stagemousedown", function(evt){
			
 
				+        Math.abs(evt.stageX - snake.body[0].x) > Math.abs(evt.stageY - snake.body[0].y) ? 
			
 
				+          function(){
			
 
				+            snake.body[0].direction.x = evt.stageX > snake.body[0].x ? 1 : -1;
			
 
				+            snake.body[0].direction.y = 0;
			
 
				+          }() : function(){
			
 
				+            snake.body[0].direction.y = evt.stageY > snake.body[0].y ? 1 : -1;
			
 
				+            snake.body[0].direction.x = 0;
			
 
				+          }();
			
 
				+      });
			
 
				+		}
			
 
				+
			
 
				+    var time = 0;
			
 
				+		
			
 
				+		function tick(event) {
			
 
				+      time = event.time - time > 400 ? event.time : time;
			
 
				+
			
 
				+			// time based
			
 
				+      if(event.time == time){
			
 
				+        var head = snake.body[0];
			
 
				+        snake.update();
			
 
				+        head.x = (head.x <= stage.canvas.width && head.x >= 0) ?
			
 
				+          head.x + head.direction.x * cellSize :
			
 
				+            head.x < 0 ? stage.canvas.width : 0;
			
 
				+        head.y = (head.y <= stage.canvas.height && head.y >= 0) ?
			
 
				+          head.y + head.direction.y * cellSize :
			
 
				+            head.y < 0 ? stage.canvas.height : 0;
			
 
				+        
			
 
				+        stage.update(event);
			
 
				+      }
			
 
				+		}
			
 
				+	</script>
			
 
				+</head>
			
 
				+<body onload="init();">
			
 
				+	<select onchange="createjs.Ticker.setFPS(Number(this.value));">
			
 
				+		<option value="10">10 fps</option>
			
 
				+		<option value="20" selected>20 fps</option>
			
 
				+		<option value="30">30 fps</option>
			
 
				+		<option value="40">40 fps</option>
			
 
				+		<option value="50">50 fps</option>
			
 
				+		<option value="60">60 fps</option>
			
 
				+	</select><br>
			
 
				+	<canvas id="demoCanvas" width="800" height="700">
			
 
				+		alternate content
			
 
				+	</canvas>
			
 
				+</body>
			
 
				+</html>