404 Game

game

  1. // ==UserScript==
  2. // @name 404 Game
  3. // @namespace http://oj.bashu.com.cn/
  4. // @version 1.0.0.1
  5. // @description game
  6. // @author 123asdf123
  7. // @match *://*/*
  8. // @icon https://cdn.luogu.com.cn/upload/usericon/576074.png
  9. // @license SATA
  10. // @grant none
  11. // ==/UserScript==
  12. (function() {
  13. 'use strict';
  14. while(document.body.children.length){
  15. document.body.children[0].remove();
  16. }
  17. window.document.body.appendChild(document.createElement("div"))
  18. var hp=404,t=1,tt=500;
  19. var canvas = document.createElement("canvas")
  20. var ctx = canvas.getContext("2d")
  21. window.document.body.appendChild(canvas)
  22. canvas.width = window.innerWidth
  23. canvas.height = window.innerHeight
  24. canvas.setAttribute('style', 'position:fixed;left:0;top:0;pointer-events:none;filter:blur(2px);')
  25. var clicks = []
  26. var points = [] //定义粒子数组
  27. var srolls = [] //定义粒子数组
  28. var live = 50 //存活50个周期
  29. var colors = [ //备选粒子颜色数组
  30. "236, 204, 104",
  31. "255, 71, 87",
  32. "112, 161, 255",
  33. "123, 237, 159"
  34. ]
  35. var mx=innerWidth/2,my=innerHeight/2,mox=0,moy=0;
  36. var rx=innerWidth/2,ry=innerHeight/2
  37. window.addEventListener("mousemove", function (evt) { //监听点击事件
  38. mox=evt.x;
  39. moy=evt.y;
  40. })
  41. var mv=1,cl=1,sr=1,cnt=0;
  42. function drawpoints() { //绘制粒子
  43. document.body.children[0].innerHTML="<center><h1>"+hp+" Not Found</h1></center>";
  44. if(hp<=0){
  45. return
  46. }
  47. mx+=(mox-mx)/20; //x轴及y轴的移动向量,取值范围为-0.5 ~ 0.5
  48. my+=(moy-my)/20;
  49. for (let i = 0; i < points.length; i++){
  50. let point=points[i]
  51. if(point.life2<3&&Math.pow((mx-(point.sx+point.size/2)),2)+Math.pow((my-(point.sy+point.size/2)),2)<=Math.pow(point.size+5,2)){
  52. hp--;
  53. // points.splice(i, 1);
  54. }
  55. }
  56. for (let i = 0; i < srolls.length; i++){
  57. let point=srolls[i]
  58. if(point.life2<3&&Math.pow((mx-(point.sx+point.size/2)),2)+Math.pow((my-(point.sy+point.size/2)),2)<=Math.pow(point.size+5,2)){
  59. hp--;
  60. // points.splice(i, 1);
  61. }
  62. }
  63. ctx.clearRect(0, 0, canvas.width, canvas.height) //清屏
  64. ctx.beginPath()
  65. ctx.arc(mx, my, 5, Math.PI * 2, false) //根据粒子属性画圆
  66. ctx.fillStyle = "rgba(0,0,0,1)" //根据粒子属性设置填充颜色及透明度
  67. ctx.fill() //填充颜色
  68. ctx.beginPath()
  69. ctx.arc(rx, ry, 5, Math.PI * 2, false) //根据粒子属性画圆
  70. ctx.fillStyle = "rgba(255,0,0,1)" //根据粒子属性设置填充颜色及透明度
  71. ctx.fill() //填充颜色
  72. for (let i = 0; i < points.length; i++){
  73. let point=points[i]
  74. if(point.sx<=0){
  75. point.vx=-point.vx;
  76. }
  77. if(point.sx>=innerWidth){
  78. point.vx=-point.vx;
  79. }
  80. if(point.sy<=0){
  81. point.vy=-point.vy;
  82. }
  83. if(point.sy>=innerHeight){
  84. point.vy=-point.vy;
  85. }
  86. }
  87. for (let i = 0; i < srolls.length; i++){
  88. let point=srolls[i]
  89. if(point.sx<=0){
  90. point.vx=-point.vx;
  91. }
  92. if(point.sx>=innerWidth){
  93. point.vx=-point.vx;
  94. }
  95. if(point.sy<=0){
  96. point.vy=-point.vy;
  97. }
  98. if(point.sy>=innerHeight){
  99. point.vy=-point.vy;
  100. }
  101. }
  102. for (let i = 0; i < clicks.length; i++){
  103. let point=clicks[i]
  104. if(point.sx<=0){
  105. point.vx=-point.vx;
  106. }
  107. if(point.sx>=innerWidth){
  108. point.vx=-point.vx;
  109. }
  110. if(point.sy<=0){
  111. point.vy=-point.vy;
  112. }
  113. if(point.sy>=innerHeight){
  114. point.vy=-point.vy;
  115. }
  116. }
  117. if(mv){
  118. for (let i = 0; i < points.length; i++) { //遍历粒子
  119. let point = points[i] //定义单个粒子
  120. ctx.beginPath()
  121. ctx.arc(point.sx, point.sy, point.size, Math.PI * 2, false) //根据粒子属性画圆
  122. ctx.fillStyle = "rgba(" + point.color + "," + 255 + ")" //根据粒子属性设置填充颜色及透明度
  123. ctx.fill() //填充颜色
  124. point.life-- //生命值减1
  125. if (point.life <= 0) { //生命值为0则从粒子数组中删除
  126. if(point.life2){
  127. for (let i = 0; i < 5; i++) { //添加15个粒子
  128. points.push({
  129. sx: point.sx, //鼠标当前坐标作为粒子坐标
  130. sy: point.sy,
  131. vx:(point.life2)*(0.5 - Math.random()), //x轴及y轴的移动向量,取值范围为-0.5 ~ 0.5
  132. vy: (point.life2)*(0.5 - Math.random()),
  133. life: live, //存活周期
  134. life2:point.life2-1,
  135. color: colors[parseInt(Math.random() * colors.length)], //随机选择颜色
  136. size:point.life2*2+2, //随机粒子尺寸,取值范围为0~5
  137. rt:0 //随机粒子尺寸,取值范围为0~5
  138. })
  139. }
  140. }
  141. points.splice(i, 1)
  142. }
  143. point.sx += point.vx * 3 //根据向量值改变粒子位置
  144. point.sy += point.vy * 3
  145. point.rt++;
  146. }
  147. }
  148. if(sr){
  149. for (let i = 0; i < srolls.length; i++) { //绘制点击效果
  150. if(i>1000){
  151. srolls.splice(i, 1);
  152. continue;
  153. }
  154. let sroll = srolls[i]
  155. ctx.beginPath()
  156. ctx.arc(sroll.sx, sroll.sy, sroll.size, Math.PI * 2, false) //根据粒子属性画圆
  157. ctx.fillStyle = "rgba(" + sroll.color + "," + (sroll.life+50) / live + ")" //根据粒子属性设置填充颜色及透明度
  158. ctx.fill() //填充颜色
  159. sroll.sx += sroll.vx * 10
  160. sroll.sy += sroll.vy * 10
  161. sroll.life--
  162. if (sroll.life <= 0) {
  163. if(sroll.life2==2){
  164. srolls.push({
  165. sx: sroll.sx,
  166. sy: sroll.sy,
  167. vx:-sroll.vx*5, //x轴及y轴的移动向量,取值范围为-0.5 ~ 0.5
  168. vy:-sroll.vy*5,
  169. // vx: (mx-sroll.sx)/200, //x轴及y轴的移动向量,取值范围为-0.5 ~ 0.5
  170. // vy: (my-sroll.sy)/200,
  171. life: live*2/5,
  172. life2:1,
  173. color:sroll.color,
  174. size:5,
  175. rt:0
  176. })
  177. }
  178. if(sroll.life2==1){
  179. if(Math.random()>0.5){
  180. points.push({
  181. sx: sroll.sx, //鼠标当前坐标作为粒子坐标
  182. sy: sroll.sy,
  183. vx: 5, //x轴及y轴的移动向量,取值范围为-0.5 ~ 0.5
  184. vy: 0,
  185. life: live, //存活周期
  186. life2:1,
  187. color: colors[parseInt(Math.random() * colors.length)], //随机选择颜色
  188. size: 7, //随机粒子尺寸,取值范围为0~5
  189. rt:0 //随机粒子尺寸,取值范围为0~5
  190. })
  191. points.push({
  192. sx: sroll.sx, //鼠标当前坐标作为粒子坐标
  193. sy: sroll.sy,
  194. vx: -5, //x轴及y轴的移动向量,取值范围为-0.5 ~ 0.5
  195. vy: 0,
  196. life: live, //存活周期
  197. life2:1,
  198. color: colors[parseInt(Math.random() * colors.length)], //随机选择颜色
  199. size: 7, //随机粒子尺寸,取值范围为0~5
  200. rt:0 //随机粒子尺寸,取值范围为0~5
  201. })
  202. points.push({
  203. sx: sroll.sx, //鼠标当前坐标作为粒子坐标
  204. sy: sroll.sy,
  205. vx:0, //x轴及y轴的移动向量,取值范围为-0.5 ~ 0.5
  206. vy: 5,
  207. life: live, //存活周期
  208. life2:1,
  209. color: colors[parseInt(Math.random() * colors.length)], //随机选择颜色
  210. size: 7, //随机粒子尺寸,取值范围为0~5
  211. rt:0 //随机粒子尺寸,取值范围为0~5
  212. })
  213. points.push({
  214. sx: sroll.sx, //鼠标当前坐标作为粒子坐标
  215. sy: sroll.sy,
  216. vx: 0, //x轴及y轴的移动向量,取值范围为-0.5 ~ 0.5
  217. vy:-5,
  218. life: live, //存活周期
  219. life2:1,
  220. color: colors[parseInt(Math.random() * colors.length)], //随机选择颜色
  221. size: 7, //随机粒子尺寸,取值范围为0~5
  222. rt:0 //随机粒子尺寸,取值范围为0~5
  223. })
  224. }
  225. else{
  226. points.push({
  227. sx: sroll.sx, //鼠标当前坐标作为粒子坐标
  228. sy: sroll.sy,
  229. vx: 5, //x轴及y轴的移动向量,取值范围为-0.5 ~ 0.5
  230. vy: 5,
  231. life: live, //存活周期
  232. life2:1,
  233. color: colors[parseInt(Math.random() * colors.length)], //随机选择颜色
  234. size: 7, //随机粒子尺寸,取值范围为0~5
  235. rt:0 //随机粒子尺寸,取值范围为0~5
  236. })
  237. points.push({
  238. sx: sroll.sx, //鼠标当前坐标作为粒子坐标
  239. sy: sroll.sy,
  240. vx: -5, //x轴及y轴的移动向量,取值范围为-0.5 ~ 0.5
  241. vy: 5,
  242. life: live, //存活周期
  243. life2:1,
  244. color: colors[parseInt(Math.random() * colors.length)], //随机选择颜色
  245. size: 7, //随机粒子尺寸,取值范围为0~5
  246. rt:0 //随机粒子尺寸,取值范围为0~5
  247. })
  248. points.push({
  249. sx: sroll.sx, //鼠标当前坐标作为粒子坐标
  250. sy: sroll.sy,
  251. vx:5, //x轴及y轴的移动向量,取值范围为-0.5 ~ 0.5
  252. vy: -5,
  253. life: live, //存活周期
  254. life2:1,
  255. color: colors[parseInt(Math.random() * colors.length)], //随机选择颜色
  256. size: 7, //随机粒子尺寸,取值范围为0~5
  257. rt:0 //随机粒子尺寸,取值范围为0~5
  258. })
  259. points.push({
  260. sx: sroll.sx, //鼠标当前坐标作为粒子坐标
  261. sy: sroll.sy,
  262. vx: -5, //x轴及y轴的移动向量,取值范围为-0.5 ~ 0.5
  263. vy:-5,
  264. life: live, //存活周期
  265. life2:1,
  266. color: colors[parseInt(Math.random() * colors.length)], //随机选择颜色
  267. size: 7, //随机粒子尺寸,取值范围为0~5
  268. rt:0 //随机粒子尺寸,取值范围为0~5
  269. })
  270. }
  271. }
  272. srolls.splice(i, 1)
  273. }
  274. }
  275. }
  276. cnt++;
  277. if(cnt%50<t){
  278. srolls.push({
  279. sx: rx,
  280. sy: ry,
  281. vx: (mx-rx)/200, //x轴及y轴的移动向量,取值范围为-0.5 ~ 0.5
  282. vy: (my-ry)/200,
  283. life: live*2/5,
  284. life2:1,
  285. color:colors[parseInt(Math.random() * colors.length)],
  286. size:10
  287. })
  288. }
  289. if(cnt==tt){
  290. t++;
  291. tt-=50;
  292. if(tt==0){
  293. tt=100;
  294. }
  295. cnt=0;
  296. for (var i = 0; i < 15; i++) { //添加15个粒子
  297. points.push({
  298. sx: mx, //鼠标当前坐标作为粒子坐标
  299. sy:my,
  300. vx: 1.5 - Math.random()*3, //x轴及y轴的移动向量,取值范围为-0.5 ~ 0.5
  301. vy: 1.5 - Math.random()*3,
  302. life: live, //存活周期
  303. life2:3,
  304. color: colors[parseInt(Math.random() * colors.length)], //随机选择颜色
  305. size:8, //随机粒子尺寸,取值范围为0~5
  306. rt:0
  307. })
  308. }
  309. }
  310. }
  311. setInterval(drawpoints, 20) //20毫秒绘制一次
  312. // Your code here...
  313. })();