SHARE
TWEET

Untitled

a guest Feb 1st, 2015 842 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <canvas id="ctx" width="500" height="500" style="border:1px solid #000000;"></canvas>
  2.  
  3. <script>
  4. var ctx = document.getElementById("ctx").getContext("2d");
  5. ctx.font = '30px Arial';
  6.  
  7. var HEIGHT = 500;
  8. var WIDTH = 500;
  9. var timeWhenGameStarted = Date.now();   //return time in ms
  10.  
  11. var frameCount = 0;
  12.  
  13. var score = 0;
  14.  
  15. var player = {
  16.         x:50,
  17.         spdX:30,
  18.         y:40,
  19.         spdY:5,
  20.         name:'P',
  21.         hp:10,
  22.         width:20,
  23.         height:20,
  24.         color:'green',
  25. };
  26.  
  27. var enemyList = {};
  28. var upgradeList = {};
  29. var bulletList = {};
  30.  
  31. getDistanceBetweenEntity = function (entity1,entity2){  //return distance (number)
  32.         var vx = entity1.x - entity2.x;
  33.         var vy = entity1.y - entity2.y;
  34.         return Math.sqrt(vx*vx+vy*vy);
  35. }
  36.  
  37. testCollisionEntity = function (entity1,entity2){       //return if colliding (true/false)
  38.         var rect1 = {
  39.                 x:entity1.x-entity1.width/2,
  40.                 y:entity1.y-entity1.height/2,
  41.                 width:entity1.width,
  42.                 height:entity1.height,
  43.         }
  44.         var rect2 = {
  45.                 x:entity2.x-entity2.width/2,
  46.                 y:entity2.y-entity2.height/2,
  47.                 width:entity2.width,
  48.                 height:entity2.height,
  49.         }
  50.         return testCollisionRectRect(rect1,rect2);
  51.        
  52. }
  53.  
  54. Enemy = function (id,x,y,spdX,spdY,width,height){
  55.         var enemy3 = {
  56.                 x:x,
  57.                 spdX:spdX,
  58.                 y:y,
  59.                 spdY:spdY,
  60.                 name:'E',
  61.                 id:id,
  62.                 width:width,
  63.                 height:height,
  64.                 color:'red',
  65.         };
  66.         enemyList[id] = enemy3;
  67.        
  68. }
  69.  
  70. randomlyGenerateEnemy = function(){
  71.         //Math.random() returns a number between 0 and 1
  72.         var x = Math.random()*WIDTH;
  73.         var y = Math.random()*HEIGHT;
  74.         var height = 10 + Math.random()*30;     //between 10 and 40
  75.         var width = 10 + Math.random()*30;
  76.         var id = Math.random();
  77.         var spdX = 5 + Math.random() * 5;
  78.         var spdY = 5 + Math.random() * 5;
  79.         Enemy(id,x,y,spdX,spdY,width,height);
  80.        
  81. }
  82.  
  83.  
  84. Upgrade = function (id,x,y,spdX,spdY,width,height){
  85.         var asd = {
  86.                 x:x,
  87.                 spdX:spdX,
  88.                 y:y,
  89.                 spdY:spdY,
  90.                 name:'E',
  91.                 id:id,
  92.                 width:width,
  93.                 height:height,
  94.                 color:'orange',
  95.         };
  96.         upgradeList[id] = asd;
  97. }
  98.  
  99. randomlyGenerateUpgrade = function(){
  100.         //Math.random() returns a number between 0 and 1
  101.         var x = Math.random()*WIDTH;
  102.         var y = Math.random()*HEIGHT;
  103.         var height = 10;
  104.         var width = 10;
  105.         var id = Math.random();
  106.         var spdX = 0;
  107.         var spdY = 0;
  108.         Upgrade(id,x,y,spdX,spdY,width,height);
  109. }
  110.  
  111. Bullet = function (id,x,y,spdX,spdY,width,height){
  112.         var asd = {
  113.                 x:x,
  114.                 spdX:spdX,
  115.                 y:y,
  116.                 spdY:spdY,
  117.                 name:'E',
  118.                 id:id,
  119.                 width:width,
  120.                 height:height,
  121.                 color:'black',
  122.         };
  123.         bulletList[id] = asd;
  124. }
  125.  
  126. randomlyGenerateBullet = function(){
  127.         //Math.random() returns a number between 0 and 1
  128.         var x = player.x;
  129.         var y = player.y;
  130.         var height = 10;
  131.         var width = 10;
  132.         var id = Math.random();
  133.        
  134.         var angle = Math.random()*360;
  135.         var spdX = Math.cos(angle/180*Math.PI)*5;
  136.         var spdY = Math.sin(angle/180*Math.PI)*5;
  137.         Bullet(id,x,y,spdX,spdY,width,height);
  138. }
  139.  
  140.  
  141. document.onmousemove = function(mouse){
  142.         var mouseX = mouse.clientX - document.getElementById('ctx').getBoundingClientRect().left;
  143.         var mouseY = mouse.clientY - document.getElementById('ctx').getBoundingClientRect().top;
  144.        
  145.         if(mouseX < player.width/2)
  146.                 mouseX = player.width/2;
  147.         if(mouseX > WIDTH-player.width/2)
  148.                 mouseX = WIDTH - player.width/2;
  149.         if(mouseY < player.height/2)
  150.                 mouseY = player.height/2;
  151.         if(mouseY > HEIGHT - player.height/2)
  152.                 mouseY = HEIGHT - player.height/2;
  153.        
  154.         player.x = mouseX;
  155.         player.y = mouseY;
  156. }
  157.  
  158.  
  159.  
  160.  
  161.  
  162. updateEntity = function (something){
  163.         updateEntityPosition(something);
  164.         drawEntity(something);
  165. }
  166. updateEntityPosition = function(something){
  167.         something.x += something.spdX;
  168.         something.y += something.spdY;
  169.                        
  170.         if(something.x < 0 || something.x > WIDTH){
  171.                 something.spdX = -something.spdX;
  172.         }
  173.         if(something.y < 0 || something.y > HEIGHT){
  174.                 something.spdY = -something.spdY;
  175.         }
  176. }
  177.  
  178. testCollisionRectRect = function(rect1,rect2){
  179.         return rect1.x <= rect2.x+rect2.width
  180.                 && rect2.x <= rect1.x+rect1.width
  181.                 && rect1.y <= rect2.y + rect2.height
  182.                 && rect2.y <= rect1.y + rect1.height;
  183. }
  184.  
  185.  
  186. drawEntity = function(something){
  187.         ctx.save();
  188.         ctx.fillStyle = something.color;
  189.         ctx.fillRect(something.x-something.width/2,something.y-something.height/2,something.width,something.height);
  190.         ctx.restore();
  191. }
  192.  
  193.  
  194.  
  195. update = function(){
  196.         ctx.clearRect(0,0,WIDTH,HEIGHT);
  197.         frameCount++;
  198.         score++;
  199.        
  200.         if(frameCount % 100 === 0)      //every 4 sec
  201.                 randomlyGenerateEnemy();
  202.  
  203.         if(frameCount % 75 === 0)       //every 3 sec
  204.                 randomlyGenerateUpgrade();
  205.  
  206.         if(frameCount % 25 === 0)       //every 1 sec
  207.                 randomlyGenerateBullet();
  208.  
  209.        
  210.         for(var key in bulletList){
  211.                 updateEntity(bulletList[key]);
  212.         }
  213.        
  214.         for(var key in upgradeList){
  215.                 updateEntity(upgradeList[key]);
  216.                 var isColliding = testCollisionEntity(player,upgradeList[key]);
  217.                 if(isColliding){
  218.                         score += 1000;
  219.                         delete upgradeList[key];
  220.                 }
  221.         }
  222.        
  223.         for(var key in enemyList){
  224.                 updateEntity(enemyList[key]);
  225.                
  226.                 var isColliding = testCollisionEntity(player,enemyList[key]);
  227.                 if(isColliding){
  228.                         player.hp = player.hp - 1;
  229.                 }
  230.         }
  231.         if(player.hp <= 0){
  232.                 var timeSurvived = Date.now() - timeWhenGameStarted;           
  233.                 console.log("You lost! You survived for " + timeSurvived + " ms.");            
  234.                 startNewGame();
  235.         }
  236.                        
  237.         drawEntity(player);
  238.         ctx.fillText(player.hp + " Hp",0,30);
  239.         ctx.fillText('Score: ' + score,200,30);
  240. }
  241. startNewGame = function(){
  242.         player.hp = 10;
  243.         timeWhenGameStarted = Date.now();
  244.         frameCount = 0;
  245.         score = 0;
  246.         enemyList = {};
  247.         upgradeList = {};
  248.         randomlyGenerateEnemy();
  249.         randomlyGenerateEnemy();
  250.         randomlyGenerateEnemy();
  251.        
  252. }
  253.  
  254.  
  255.  
  256.  
  257. startNewGame();
  258.  
  259. setInterval(update,40);
  260.  
  261.  
  262.  
  263.  
  264.  
  265.  
  266.  
  267.  
  268.  
  269.  
  270.  
  271.  
  272. </script>
RAW Paste Data
Top