Posted By

jonas0403 on 04/29/18


Tagged


Versions (?)

:(


 / Published in: JavaScript
 

bb

  1. var brickWidth = 50;
  2. var brickHeight = 50;
  3. var brickGap = 1;
  4. var brickCols = 10;
  5. var brickRows = 10;
  6.  
  7. var arrayMap =
  8. [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
  9. 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
  10. 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
  11. 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
  12. 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
  13. 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
  14. 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
  15. 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
  16. 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
  17. 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, ]
  18.  
  19. window.onload = function() {
  20. var fps = 60;
  21. setInterval(run, 1000 / fps);
  22. canvas = document.getElementById('canvas');
  23. cx = canvas.getContext('2d');
  24. }
  25.  
  26. function run() {
  27. drawBox(0,0,canvas.width,canvas.height,'blue');
  28. drawBricks();
  29.  
  30. }
  31.  
  32. function drawBricks() {
  33. for(var eachCol=0; eachCol<brickCols; eachCol++) {
  34. for(var eachRow=0; eachRow<brickRows; eachRow++) {
  35. var brickLeftEdgeX = eachCol * brickWidth;
  36. var brickTopEdgeY = eachRow * brickHeight;
  37. drawBox(brickLeftEdgeX, brickTopEdgeY, brickWidth - brickGap, brickHeight - brickGap, 'black');
  38. }
  39. }
  40. }
  41.  
  42.  
  43. function drawBox(x,y,w,h,c) {
  44. cx.fillStyle = c;
  45. cx.fillRect(x,y,w,h);
  46. }

Report this snippet  

You need to login to post a comment.