SHARE
TWEET

Untitled

a guest Apr 3rd, 2015 906 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. var player;
  15. var enemyList = {};
  16. var upgradeList = {};
  17. var bulletList = {};
  18.  
  19.  
  20. Player = function(){
  21.         var self = Actor('player','myId',50,40,30,5,20,20,'green',10,1);
  22.        
  23.         self.updatePosition = function(){
  24.                 if(self.pressingRight)
  25.                         self.x += 10;
  26.                 if(self.pressingLeft)
  27.                         self.x -= 10;  
  28.                 if(self.pressingDown)
  29.                         self.y += 10;  
  30.                 if(self.pressingUp)
  31.                         self.y -= 10;  
  32.                
  33.                 //ispositionvalid
  34.                 if(self.x < self.width/2)
  35.                         self.x = self.width/2;
  36.                 if(self.x > WIDTH-self.width/2)
  37.                         self.x = WIDTH - self.width/2;
  38.                 if(self.y < self.height/2)
  39.                         self.y = self.height/2;
  40.                 if(self.y > HEIGHT - self.height/2)
  41.                         self.y = HEIGHT - self.height/2;
  42.         }
  43.        
  44.         self.pressingDown = false;
  45.         self.pressingUp = false;
  46.         self.pressingLeft = false;
  47.         self.pressingRight = false;
  48.         return self;
  49.        
  50. }
  51.  
  52. Entity = function(type,id,x,y,spdX,spdY,width,height,color){
  53.         var self = {
  54.                 type:type,
  55.                 id:id,
  56.                 x:x,
  57.                 y:y,
  58.                 spdX:spdX,
  59.                 spdY:spdY,
  60.                 width:width,
  61.                 height:height,
  62.                 color:color,
  63.         };
  64.         self.update = function(){
  65.                 self.updatePosition();
  66.                 self.draw();
  67.         }
  68.         self.draw = function(){
  69.                 ctx.save();
  70.                 ctx.fillStyle = self.color;
  71.                 ctx.fillRect(self.x-self.width/2,self.y-self.height/2,self.width,self.height);
  72.                 ctx.restore();
  73.         }
  74.         self.getDistance = function(entity2){   //return distance (number)
  75.                 var vx = self.x - entity2.x;
  76.                 var vy = self.y - entity2.y;
  77.                 return Math.sqrt(vx*vx+vy*vy);
  78.         }
  79.  
  80.         self.testCollision = function(entity2){ //return if colliding (true/false)
  81.                 var rect1 = {
  82.                         x:self.x-self.width/2,
  83.                         y:self.y-self.height/2,
  84.                         width:self.width,
  85.                         height:self.height,
  86.                 }
  87.                 var rect2 = {
  88.                         x:entity2.x-entity2.width/2,
  89.                         y:entity2.y-entity2.height/2,
  90.                         width:entity2.width,
  91.                         height:entity2.height,
  92.                 }
  93.                 return testCollisionRectRect(rect1,rect2);
  94.                
  95.         }
  96.         self.updatePosition = function(){
  97.                 self.x += self.spdX;
  98.                 self.y += self.spdY;
  99.                                
  100.                 if(self.x < 0 || self.x > WIDTH){
  101.                         self.spdX = -self.spdX;
  102.                 }
  103.                 if(self.y < 0 || self.y > HEIGHT){
  104.                         self.spdY = -self.spdY;
  105.                 }
  106.         }
  107.        
  108.         return self;
  109. }
  110.  
  111. Actor = function(type,id,x,y,spdX,spdY,width,height,color,hp,atkSpd){
  112.         var self = Entity(type,id,x,y,spdX,spdY,width,height,color);
  113.        
  114.         self.hp = hp;
  115.         self.atkSpd = atkSpd;
  116.         self.attackCounter = 0;
  117.         self.aimAngle = 0;
  118.        
  119.         var super_update = self.update;
  120.         self.update = function(){
  121.                 super_update();
  122.                 self.attackCounter += self.atkSpd;
  123.         }
  124.        
  125.         self.performAttack = function(){
  126.                 if(self.attackCounter > 25){    //every 1 sec
  127.                         self.attackCounter = 0;
  128.                         generateBullet(self);
  129.                 }
  130.         }
  131.        
  132.         self.performSpecialAttack = function(){
  133.                 if(self.attackCounter > 50){    //every 1 sec
  134.                         self.attackCounter = 0;
  135.                         /*
  136.                         for(var i = 0 ; i < 360; i++){
  137.                                 generateBullet(self,i);
  138.                         }
  139.                         */
  140.                         generateBullet(self,self.aimAngle - 5);
  141.                         generateBullet(self,self.aimAngle);
  142.                         generateBullet(self,self.aimAngle + 5);
  143.                 }
  144.         }
  145.  
  146.        
  147.         return self;
  148. }
  149.  
  150. Enemy = function(id,x,y,spdX,spdY,width,height){
  151.         var self = Actor('enemy',id,x,y,spdX,spdY,width,height,'red',10,1);
  152.         enemyList[id] = self;
  153. }
  154.  
  155. randomlyGenerateEnemy = function(){
  156.         //Math.random() returns a number between 0 and 1
  157.         var x = Math.random()*WIDTH;
  158.         var y = Math.random()*HEIGHT;
  159.         var height = 10 + Math.random()*30;     //between 10 and 40
  160.         var width = 10 + Math.random()*30;
  161.         var id = Math.random();
  162.         var spdX = 5 + Math.random() * 5;
  163.         var spdY = 5 + Math.random() * 5;
  164.         Enemy(id,x,y,spdX,spdY,width,height);
  165.        
  166. }
  167.  
  168. Upgrade = function (id,x,y,spdX,spdY,width,height,category,color){
  169.         var self = Entity('upgrade',id,x,y,spdX,spdY,width,height,color);
  170.        
  171.         self.category = category;
  172.         upgradeList[id] = self;
  173. }
  174.  
  175. randomlyGenerateUpgrade = function(){
  176.         //Math.random() returns a number between 0 and 1
  177.         var x = Math.random()*WIDTH;
  178.         var y = Math.random()*HEIGHT;
  179.         var height = 10;
  180.         var width = 10;
  181.         var id = Math.random();
  182.         var spdX = 0;
  183.         var spdY = 0;
  184.        
  185.         if(Math.random()<0.5){
  186.                 var category = 'score';
  187.                 var color = 'orange';
  188.         } else {
  189.                 var category = 'atkSpd';
  190.                 var color = 'purple';
  191.         }
  192.        
  193.         Upgrade(id,x,y,spdX,spdY,width,height,category,color);
  194. }
  195.  
  196. Bullet = function (id,x,y,spdX,spdY,width,height){
  197.         var self = Entity('bullet',id,x,y,spdX,spdY,width,height,'black');
  198.        
  199.         self.timer = 0;
  200.  
  201.         bulletList[id] = self;
  202. }
  203.  
  204. generateBullet = function(actor,aimOverwrite){
  205.         //Math.random() returns a number between 0 and 1
  206.         var x = actor.x;
  207.         var y = actor.y;
  208.         var height = 10;
  209.         var width = 10;
  210.         var id = Math.random();
  211.        
  212.         var angle;
  213.         if(aimOverwrite !== undefined)
  214.                 angle = aimOverwrite;
  215.         else angle = actor.aimAngle;
  216.        
  217.         var spdX = Math.cos(angle/180*Math.PI)*5;
  218.         var spdY = Math.sin(angle/180*Math.PI)*5;
  219.         Bullet(id,x,y,spdX,spdY,width,height);
  220. }
  221.  
  222. testCollisionRectRect = function(rect1,rect2){
  223.         return rect1.x <= rect2.x+rect2.width
  224.                 && rect2.x <= rect1.x+rect1.width
  225.                 && rect1.y <= rect2.y + rect2.height
  226.                 && rect2.y <= rect1.y + rect1.height;
  227. }
  228.  
  229. document.onclick = function(mouse){
  230.         player.performAttack();
  231. }
  232.  
  233. document.oncontextmenu = function(mouse){
  234.         player.performSpecialAttack();
  235.         mouse.preventDefault();
  236. }
  237.  
  238. document.onmousemove = function(mouse){
  239.         var mouseX = mouse.clientX - document.getElementById('ctx').getBoundingClientRect().left;
  240.         var mouseY = mouse.clientY - document.getElementById('ctx').getBoundingClientRect().top;
  241.        
  242.         mouseX -= player.x;
  243.         mouseY -= player.y;
  244.        
  245.         player.aimAngle = Math.atan2(mouseY,mouseX) / Math.PI * 180;
  246. }
  247.  
  248. document.onkeydown = function(event){
  249.         if(event.keyCode === 68)        //d
  250.                 player.pressingRight = true;
  251.         else if(event.keyCode === 83)   //s
  252.                 player.pressingDown = true;
  253.         else if(event.keyCode === 65) //a
  254.                 player.pressingLeft = true;
  255.         else if(event.keyCode === 87) // w
  256.                 player.pressingUp = true;
  257. }
  258.  
  259. document.onkeyup = function(event){
  260.         if(event.keyCode === 68)        //d
  261.                 player.pressingRight = false;
  262.         else if(event.keyCode === 83)   //s
  263.                 player.pressingDown = false;
  264.         else if(event.keyCode === 65) //a
  265.                 player.pressingLeft = false;
  266.         else if(event.keyCode === 87) // w
  267.                 player.pressingUp = false;
  268. }
  269.  
  270. update = function(){
  271.         ctx.clearRect(0,0,WIDTH,HEIGHT);
  272.         frameCount++;
  273.         score++;
  274.        
  275.         if(frameCount % 100 === 0)      //every 4 sec
  276.                 randomlyGenerateEnemy();
  277.  
  278.         if(frameCount % 75 === 0)       //every 3 sec
  279.                 randomlyGenerateUpgrade();
  280.        
  281.        
  282.        
  283.         for(var key in bulletList){
  284.                 bulletList[key].update();
  285.                
  286.                 var toRemove = false;
  287.                 bulletList[key].timer++;
  288.                 if(bulletList[key].timer > 75){
  289.                         toRemove = true;
  290.                 }
  291.                
  292.                 for(var key2 in enemyList){
  293.                         /*
  294.                         var isColliding = bulletList[key].testCollision(enemyList[key2]);
  295.                         if(isColliding){
  296.                                 toRemove = true;
  297.                                 delete enemyList[key2];
  298.                                 break;
  299.                         }      
  300.                         */
  301.                 }
  302.                 if(toRemove){
  303.                         delete bulletList[key];
  304.                 }
  305.         }
  306.        
  307.         for(var key in upgradeList){
  308.                 upgradeList[key].update();
  309.                 var isColliding = player.testCollision(upgradeList[key]);
  310.                 if(isColliding){
  311.                         if(upgradeList[key].category === 'score')
  312.                                 score += 1000;
  313.                         if(upgradeList[key].category === 'atkSpd')
  314.                                 player.atkSpd += 3;
  315.                         delete upgradeList[key];
  316.                 }
  317.         }
  318.        
  319.         for(var key in enemyList){
  320.                 enemyList[key].update();
  321.                 enemyList[key].performAttack();
  322.                
  323.                 var isColliding = player.testCollision(enemyList[key]);
  324.                 if(isColliding){
  325.                         player.hp = player.hp - 1;
  326.                 }
  327.         }
  328.         if(player.hp <= 0){
  329.                 var timeSurvived = Date.now() - timeWhenGameStarted;           
  330.                 console.log("You lost! You survived for " + timeSurvived + " ms.");            
  331.                 startNewGame();
  332.         }
  333.         player.update();
  334.        
  335.         ctx.fillText(player.hp + " Hp",0,30);
  336.         ctx.fillText('Score: ' + score,200,30);
  337. }
  338.  
  339. startNewGame = function(){
  340.         player.hp = 10;
  341.         timeWhenGameStarted = Date.now();
  342.         frameCount = 0;
  343.         score = 0;
  344.         enemyList = {};
  345.         upgradeList = {};
  346.         bulletList = {};
  347.         randomlyGenerateEnemy();
  348.         randomlyGenerateEnemy();
  349.         randomlyGenerateEnemy();
  350.        
  351. }
  352.  
  353. player = Player();
  354. startNewGame();
  355.  
  356. setInterval(update,40);
  357.  
  358.  
  359.  
  360.  
  361.  
  362.  
  363.  
  364.  
  365.  
  366.  
  367.  
  368.  
  369. </script>
RAW Paste Data
Top