SHARE
TWEET

Untitled

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