API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Nov 14th, 2018
80
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 7.93 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE HTML>
  2. <canvas id="canvas">
  3. </cavas>
  4. <script>
  5. canvas.width = 1000;
  6. canvas.height = 800;
  7. window.onload=function(){
  8. c = document.getElementById("canvas");
  9. ctx = c.getContext("2d");
  10. //load images
  11. path = new Image();
  12. path.src = "rockypath.png";
  13. sidebar = new Image();
  14. sidebar.src = "sideBar.png";
  15. red = new Image()
  16. red.src="red.png"
  17. blue = new Image()
  18. blue.src="blue.png"
  19. green = new Image()
  20. green.src="green.png"
  21. yellow = new Image()
  22. yellow.src="yellow.png"
  23. pink = new Image()
  24. pink.src="pink.png"
  25. black = new Image()
  26. black.src="black.png"
  27. //listeners
  28. canvas.addEventListener('mouseup', mousepressU)
  29. canvas.addEventListener('mousedown', mousepressD)
  30. canvas.addEventListener('mousemove', mousepos)
  31. document.addEventListener('keyup', keydown)
  32. startRound();
  33. }
  34. objects=[]
  35. towers=[]
  36. gs=40
  37. drawcircle=false
  38. function startRound(){
  39. enemies=[{picture:blue,x:startX,y:startY,level:"blue",speed:0.3,direction:"right",number:10,spacing:0},{picture:green,x:(startX-100),y:startY,level:"green",speed:0.4,direction:"right",number:5,spacing:200}]
  40. summon()
  41. setInterval(startMove,1)
  42. }
  43. startY=400+gs/2
  44. startX=-50
  45. health=100
  46. money=300
  47. pickup=0
  48. upgrademenu=false
  49. function summon(){
  50. for(i=0;i<enemies.length;i++){
  51. for(j=0;j<(enemies[i].number);j++){
  52. //packing enemies for start
  53. objects.push({picture:enemies[i].picture,x:((enemies[i].x)-(enemies[i].spacing*j)),y:startY,level:enemies[i].level,speed:enemies[i].speed,
  54. direction:enemies[i].direction,score:0+(enemies[i].x)-(enemies[i].spacing*j)})
  55. }
  56. }
  57. /*objects.push({picture:red,x:startX,y:startY,level:"red",speed:0.2,direction:"right",number:10,spacing:100})
  58. objects.push({picture:blue,x:startX,y:startY,level:"blue",speed:0.3,direction:"right",number:1,spacing:1})
  59. objects.push({picture:green,x:startX,y:startY,level:"green",speed:0.4,direction:"right",number:1,spacing:1})
  60. objects.push({picture:yellow,x:startX,y:startY,level:"yellow",speed:0.5,direction:"right",number:1,spacing:1})
  61. objects.push({picture:pink,x:startX,y:startY,level:"pink",speed:0.6,direction:"right",number:1,spacing:1})
  62. objects.push({picture:black,x:startX,y:startY,level:"black",speed:0.7,direction:"right",number:1,spacing:1})*/
  63. }
  64. function startMove(){
  65. try{
  66. ctx.drawImage(sidebar,800,0);
  67. ctx.drawImage(path,0,0,800,800);
  68. for(i=0;i<objects.length;i++){
  69. //add score
  70. objects[i].score+=(objects[i].speed)
  71. //if right
  72. if(objects[i].direction=="right"){
  73. objects[i].x+=objects[i].speed
  74. colour=objects[i].level
  75. ctx.drawImage(objects[i].picture, objects[i].x,objects[i].y,gs,gs)
  76. //first turn
  77. if(objects[i].x>=100&&objects[i].x<=101&&objects[i].y==420){
  78. objects[i].x=100
  79. objects[i].direction="down"
  80. }
  81. //third turn
  82. if(objects[i].x>=260&&objects[i].x<=261&&objects[i].y==500){
  83. objects[i].x=260
  84. objects[i].direction="up"
  85. }
  86. //seventh turn
  87. if(objects[i].x>=660&&objects[i].x<=661&&objects[i].y==100){
  88. objects[i].x=660
  89. objects[i].direction="down"
  90. }
  91. //eleventh turn
  92. if(objects[i].x>=580&&objects[i].x<=581&&objects[i].y==420){
  93. objects[i].x=580
  94. objects[i].direction="down"
  95. }
  96. }
  97. //if down
  98. if(objects[i].direction=="down"){
  99. objects[i].y+=objects[i].speed
  100. ctx.fillStyle=objects[i].level
  101. ctx.drawImage(objects[i].picture, objects[i].x,objects[i].y,gs,gs)
  102. //second turn
  103. if(objects[i].y>=500&&objects[i].y<=501&&objects[i].x==100){
  104. objects[i].y=500
  105. objects[i].direction="right"
  106. }
  107. //eight turn
  108. if(objects[i].y>=260&&objects[i].y<=261&&objects[i].x==660){
  109. objects[i].y=260
  110. objects[i].direction="left"
  111. }
  112. //tenth turn
  113. if(objects[i].y>=420&&objects[i].y<=421&&objects[i].x==420){
  114. objects[i].y=420
  115. objects[i].direction="right"
  116. }
  117. //twelfth turn
  118. if(objects[i].y>=660&&objects[i].y<=661&&objects[i].x==580){
  119. objects[i].y=660
  120. objects[i].direction="left"
  121. }
  122. //popping object
  123. if(objects[i].y>=800){
  124. health-=(objects[i].speed*10)-1
  125. objects.splice(i,1)
  126. }
  127. }
  128. //if up
  129. if(objects[i].direction=="up"){
  130. objects[i].y-=objects[i].speed
  131. ctx.fillStyle=objects[i].level
  132. ctx.drawImage(objects[i].picture, objects[i].x,objects[i].y,gs,gs)
  133. //fourth turn
  134. if(objects[i].y<=260&&objects[i].y>=259&&objects[i].x==260){
  135. objects[i].y=260
  136. objects[i].direction="left"
  137. }
  138. //sixth turn
  139. if(objects[i].y<=100&&objects[i].y>=99&&objects[i].x==100){
  140. objects[i].y=100
  141. objects[i].direction="right"
  142. }
  143. }
  144. //if left
  145. if(objects[i].direction=="left"){
  146. objects[i].x-=objects[i].speed
  147. ctx.fillStyle=objects[i].level
  148. ctx.drawImage(objects[i].picture, objects[i].x,objects[i].y,gs,gs)
  149. //fifth turn
  150. if(objects[i].x<=100&&objects[i].x>=99&&objects[i].y==260){
  151. objects[i].x=100
  152. objects[i].direction="up"
  153. }
  154. //ninth turn
  155. if(objects[i].x<=420&&objects[i].x>=419&&objects[i].y==260){
  156. objects[i].x=420
  157. objects[i].direction="down"
  158. }
  159. //thirteenth turn
  160. if(objects[i].x<=260&&objects[i].x>=259&&objects[i].y==660){
  161. objects[i].x=260
  162. objects[i].direction="down"
  163. }
  164. }
  165. }
  166. }
  167. catch(err){
  168. }
  169. //render towers
  170. for(i=0;i<towers.length;i++){
  171. ctx.fillStyle="purple"
  172. ctx.fillRect(towers[i].x,towers[i].y,gs,gs)
  173. }
  174. ctx.font="48px serif"
  175. ctx.fillStyle="black"
  176. ctx.fillText(health,880,115)
  177. ctx.font="48px serif"
  178. ctx.fillStyle="black"
  179. ctx.fillText(money,880,63)
  180. //towers
  181. ctx.fillStyle="purple"
  182. ctx.fillRect(830,158,gs,gs)
  183. firstX=830
  184. firstY=158
  185. firstW=gs
  186. firstH=gs
  187. firstR=100
  188. if(pickup!=1){
  189. ctx.fillStyle="purple"
  190. ctx.fillRect(firstX,firstY,firstW,firstH)
  191. }
  192. if(pickup==1){
  193. ctx.fillStyle="purple"
  194. ctx.fillRect(mouseX-20,mouseY-20,firstW,firstH)
  195. }
  196. if(drawcircle){
  197. ctx.beginPath();
  198. ctx.arc(mouseX,mouseY,firstR,0,2*Math.PI);
  199. ctx.stroke();
  200. }
  201. }
  202. function mousepressD(e){
  203. mouseCX = e.clientX;
  204. mouseCY = e.clientY;
  205. if(mouseCX>=838&&mouseCX<=877&&mouseCY>=166&&mouseCY<=205&&pickup==0){
  206. pickup=1
  207. drawcircle=true
  208. }
  209. }
  210. function mousepressU(e){
  211. mouseCX = e.clientX;
  212. mouseCY = e.clientY;
  213. ontop=false
  214. if(pickup==1){
  215. //check placement path
  216. if((mouseCX>20&&mouseCX<70&&mouseCY<390&&mouseCY>20)||(mouseCX>20&&mouseCX<790&&mouseCY>20&&mouseCY<70)||(mouseCY>20&&mouseCY<790&&mouseCX>740&&mouseCX<790)||
  217. (mouseCY>340&&mouseCY<790&&mouseCX>660&&mouseCX<790)||(mouseCX>20&&mouseCX<230&&mouseCY>580&&mouseCY<790)||(mouseCX>340&&mouseCX<790&&mouseCY>740&&mouseCY<790)||
  218. (mouseCX>180&&mouseCX<630&&mouseCY>180&&mouseCY<230)||(mouseCX>340&&mouseCX<390&&mouseCY>180&&mouseCY<630)||(mouseCX>340&&mouseCX<550&&mouseCY>500&&mouseCY<630)||
  219. (mouseCX>20&&mouseCX<230&&mouseCY>340&&mouseCY<390)||(mouseCX>180&&mouseCX<230&&mouseCY>340&&mouseCY<470)||(mouseCX>500&&mouseCX<790&&mouseCY>340&&mouseCY<390)||
  220. (mouseCX>20&&mouseCX<70&&mouseCY>500&&mouseCY<790)||(mouseCX>260&&mouseCX<310&&mouseCY>580&&mouseCY<630)){
  221. for(j=0;j<towers.length;j++){
  222. if(mouseCX>(towers[j].x)-10&&mouseCY>(towers[j].y)-10&&mouseCX<(towers[j].x)+70&&mouseCY<(towers[j].y)+70){
  223. ontop=true
  224. }
  225. }
  226. if(!ontop){
  227. pickup=0
  228. towers.push({x:mouseCX-28,y:mouseCY-28})
  229. drawcircle=false
  230. }
  231. }
  232. }
  233. }
  234. function mousepos(evt){
  235. rect=canvas.getBoundingClientRect();
  236. mouseX=evt.clientX - rect.left;
  237. mouseY=evt.clientY - rect.top
  238. }
  239. function keydown(e){
  240. if(e.keyCode==27){
  241. pickup=0
  242. drawcircle=false
  243. }
  244. }
  245. </script>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!