API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Jul 30th, 2016
63
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.87 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. 　<head>
  3. <title>Tree</title>
  4. <script type="text/javascript">
  5.  
  6. var ctx;
  7. var time;
  8.  
  9. const INTERVAL = 10;
  10. const SPAN_AVE = 15;
  11. const HEIGHT = 1200;
  12. const WIDTH = 1000;
  13. const MIN = 1;
  14. const G = 1;
  15.  
  16. var poke_map;
  17. var poke_mama;
  18. var spot_list = new Array();
  19. var end = 1;
  20. var time_cnt = 0;
  21.  
  22. var createMap = function(){
  23.  
  24. var map = new Array();
  25.  
  26. map.getElements = function(){
  27.  
  28. return this;
  29.  
  30. }
  31.  
  32. map.getElementsInSpot = function(spot){
  33. var elements = new Array();
  34. for(var idx_ver = 0;idx_ver < this.length; idx_ver++){
  35.  
  36. if(getDistance(this[idx_ver],spot) < spot.size){
  37. elements.push(this[idx_ver]);
  38. }
  39. }
  40. return elements;
  41. }
  42.  
  43. return map;
  44. }
  45.  
  46. var PokeManager = function(map,type){
  47.  
  48. this.map = map;
  49. this.type = type;
  50. this.createElement = function(){
  51. var inst = new type(arguments);
  52. map.push(inst);
  53. return inst;
  54. }
  55.  
  56. this.type.prototype.replace = function(down,right){
  57.  
  58. var boo = true;
  59.  
  60. if(this.left + right > -1 && this.top + down < HEIGHT/MIN && this.left + right < WIDTH/MIN){
  61. this.top = this.top + down;
  62. this.left = this.left + right;
  63. } else {
  64. boo = false;
  65. }
  66.  
  67. return boo;
  68. }
  69.  
  70. this.type.prototype.leave = function(){
  71. var idx = map.indexOf(this);
  72. map.splice(idx,1);
  73. }
  74. this.type.prototype.clear = function(){
  75. this.leave();
  76. for (var ppty in this){
  77. delete this[ppty];
  78. ppty = undefined;
  79. }
  80. }
  81. }
  82.  
  83. var getDistance = function(a,b){
  84.  
  85. var v = a.top - b.top;
  86. var h = a.left - b.left;
  87.  
  88. return Math.floor(Math.sqrt(Math.pow(v,2) + Math.pow(h,2)));
  89. }
  90.  
  91. var getColorDifference = function(a,b){
  92.  
  93. var red = Math.abs(a.R - b.R);
  94. var green = Math.abs(a.G - b.G);
  95. var blue = Math.abs(a.B - b.B);
  96.  
  97. return red + blue + green;
  98.  
  99. }
  100.  
  101. var Poke = function(args){
  102.  
  103. this.top = args[0];
  104. this.left = args[1];
  105.  
  106. this.R = args[2];
  107. this.G = args[3];
  108. this.B = args[4];
  109. this.spd_v = args[5];
  110. this.spd_h = args[6];
  111. this.size = args[7];
  112.  
  113. this.opacity = 0;
  114. }
  115.  
  116. Poke.prototype.print = function(){
  117.  
  118. ctx.fillStyle = "rgba(" + this.R +"," + this.G + "," + this.B + "," + this.opacity + ")";
  119. ctx.beginPath();
  120. ctx.arc(this.left*MIN,this.top*MIN,this.size*MIN,0,Math.PI*2.0,true);
  121. ctx.fill();
  122.  
  123. }
  124.  
  125. Poke.prototype.move = function(){
  126. if(!this.replace(this.spd_v,this.spd_h)){
  127. this.clear();
  128. }
  129. }
  130.  
  131.  
  132.  
  133. Poke.prototype.fall = function(){
  134. this.spd_v += G;
  135. this.opacity -= 0.05;
  136. if(this.opacity < 0){
  137. this.opacity = 0;
  138. }
  139. }
  140. Poke.prototype.stop = function(stopper){
  141.  
  142. if(stopper){
  143. this.spd_v = parseInt(this.spd_v * stopper);
  144. this.spd_h = 0;
  145. } else {
  146. this.spd_v = parseInt(this.spd_v * 0.93);
  147. this.spd_h = parseInt(this.spd_h * 0.90);
  148. }
  149.  
  150. this.opacity += 0.07;
  151. }
  152.  
  153. var Spot = function(top,left,size,R,G,B,per,stopper){
  154.  
  155. this.top = top;
  156. this.left = left;
  157. this.size = size;
  158. this.R = R;
  159. this.G = G;
  160. this.B = B;
  161. this.per = per;
  162. this.stopper = stopper;
  163.  
  164. }
  165.  
  166. Spot.prototype.catchPoke = function(){
  167.  
  168. var list = poke_map.getElementsInSpot(this);
  169. for(var idx = 0;idx < list.length;idx++){
  170.  
  171. var poke = list[idx];
  172.  
  173. if(getColorDifference(poke,this) < 80){
  174. if(Math.random() * this.size * 22000 / list.length * this.per * end > getDistance(poke,this)){
  175. poke.stop(this.stopper);
  176. }
  177. }
  178. }
  179. }
  180.  
  181. Spot.prototype.print = function(){
  182.  
  183. ctx.fillStyle = "rgba(" + this.R +"," + this.G + "," + this.B + "," + 0.1 + ")";
  184. ctx.beginPath();
  185. ctx.arc(this.left*MIN,this.top*MIN,this.size*MIN,0,Math.PI*2.0,true);
  186. ctx.fill();
  187.  
  188. }
  189.  
  190.  
  191. function start(){
  192.  
  193. var canvas = document.getElementById('canvas');
  194. if (canvas.getContext){
  195. ctx = canvas.getContext('2d');
  196. ctx.globalCompositeOperation = "source-over";
  197. }
  198.  
  199.  
  200. poke_map = createMap();
  201. poke_mama = new PokeManager(poke_map,Poke);
  202.  
  203. var ha = new Array(50,256,50);
  204. var ki = new Array(170,100,0);
  205. var mi = new Array(250,50,50);
  206. var yuki = new Array(230,230,230);
  207.  
  208. spot_list.push(new Spot(850,300,50,ha[0],ha[1],ha[2],5));
  209. spot_list.push(new Spot(850,700,50,ha[0],ha[1],ha[2],5));
  210.  
  211. spot_list.push(new Spot(750,200,100,ha[0],ha[1],ha[2],4.5));
  212. spot_list.push(new Spot(750,400,100,ha[0],ha[1],ha[2],4.5));
  213. spot_list.push(new Spot(750,600,100,ha[0],ha[1],ha[2],4.5))
  214. spot_list.push(new Spot(750,800,100,ha[0],ha[1],ha[2],4.5));
  215.  
  216. spot_list.push(new Spot(600,300,100,ha[0],ha[1],ha[2],5));
  217. spot_list.push(new Spot(600,500,100,ha[0],ha[1],ha[2],6));
  218. spot_list.push(new Spot(600,700,100,ha[0],ha[1],ha[2],5));
  219.  
  220. spot_list.push(new Spot(450,400,100,ha[0],ha[1],ha[2],6));
  221. spot_list.push(new Spot(450,600,100,ha[0],ha[1],ha[2],6));
  222. spot_list.push(new Spot(300,500,100,ha[0],ha[1],ha[2],20));
  223.  
  224. spot_list.push(new Spot(650,500,70,ha[0],ha[1],ha[2],0.001));
  225.  
  226. for(var idx = 0;idx < 50;idx++){
  227.  
  228. var t = Math.random() * 451;
  229. var l = Math.random() * 901 - 450;
  230. if(Math.abs(l) + t < 400 + Math.random() * 120){
  231.  
  232. spot_list.push(new Spot(850 - t,500 + l,5,mi[0],mi[1],mi[2],5,0.001));
  233.  
  234. }
  235.  
  236. }
  237.  
  238.  
  239.  
  240. spot_list.push(new Spot(700,500,100,ki[0],ki[1],ki[2],0.008));
  241. spot_list.push(new Spot(800,500,100,ki[0],ki[1],ki[2],0.007));
  242. spot_list.push(new Spot(900,500,100,ki[0],ki[1],ki[2],0.006));
  243. spot_list.push(new Spot(1000,500,100,ki[0],ki[1],ki[2],0.005));
  244. spot_list.push(new Spot(1100,500,100,ki[0],ki[1],ki[2],0.004));
  245.  
  246.  
  247. spot_list.push(new Spot(450,500,700,yuki[0],yuki[1],yuki[2],1,0));
  248.  
  249. time = setInterval(exec, INTERVAL);
  250.  
  251. }
  252.  
  253. function exec(){
  254.  
  255. time_cnt++;
  256.  
  257. ctx.fillStyle = "rgb(255,255,255)";
  258. ctx.fillRect(0, 0, WIDTH, HEIGHT);
  259.  
  260.  
  261. if(Math.random() * 200 < 200){
  262.  
  263. poke_mama.createElement(
  264. 600,
  265. WIDTH/MIN/2,
  266. Math.floor(Math.random() * 256),
  267. Math.floor(Math.random() * 256),
  268. Math.floor(Math.random() * 256),
  269. Math.floor(Math.random() * -50) - 10,
  270. Math.floor(Math.random() * 100) - 50,
  271. Math.floor(Math.random() * 10) + 20
  272. );
  273.  
  274. poke_mama.createElement(
  275. HEIGHT/MIN -10,
  276. 10,
  277. Math.floor(Math.random() * 100 + 30),
  278. Math.floor(Math.random() * 100 + 120),
  279. Math.floor(Math.random() * 100 + 30),
  280. Math.floor(Math.random() * -50) - 10,
  281. Math.floor(Math.random() * 30),
  282. Math.floor(Math.random() * 10) + 20
  283. );
  284.  
  285. poke_mama.createElement(
  286. HEIGHT/MIN -10,
  287. WIDTH/MIN - 10,
  288. Math.floor(Math.random() * 100 + 30),
  289. Math.floor(Math.random() * 100 + 120),
  290. Math.floor(Math.random() * 100 + 30),
  291. Math.floor(Math.random() * -50) - 10,
  292. Math.floor(Math.random() * -30),
  293. Math.floor(Math.random() * 10) + 20
  294. );
  295.  
  296. poke_mama.createElement(
  297. HEIGHT/MIN -400,
  298. 10,
  299. Math.floor(Math.random() * 100 + 50),
  300. Math.floor(Math.random() * 100 + 120),
  301. Math.floor(Math.random() * 100 + 30),
  302. Math.floor(Math.random() * -50) - 10,
  303. Math.floor(Math.random() * 30),
  304. Math.floor(Math.random() * 10) + 20
  305. );
  306.  
  307.  
  308. poke_mama.createElement(
  309. HEIGHT/MIN -400,
  310. WIDTH/MIN - 10,
  311. Math.floor(Math.random() * 100 + 50),
  312. Math.floor(Math.random() * 100 + 120),
  313. Math.floor(Math.random() * 100 + 50),
  314. Math.floor(Math.random() * -50) - 10,
  315. Math.floor(Math.random() * -30),
  316. Math.floor(Math.random() * 10) + 20
  317. );
  318.  
  319. poke_mama.createElement(
  320. HEIGHT/MIN -600,
  321. 10,
  322. Math.floor(Math.random() * 256),
  323. Math.floor(Math.random() * 256),
  324. Math.floor(Math.random() * 256),
  325. Math.floor(Math.random() * -50) - 10,
  326. Math.floor(Math.random() * 30),
  327. Math.floor(Math.random() * 10) + 20
  328. );
  329.  
  330.  
  331. poke_mama.createElement(
  332. HEIGHT/MIN -600,
  333. WIDTH/MIN - 10,
  334. Math.floor(Math.random() * 256),
  335. Math.floor(Math.random() * 256),
  336. Math.floor(Math.random() * 256),
  337. Math.floor(Math.random() * -50) - 10,
  338. Math.floor(Math.random() * -30),
  339. Math.floor(Math.random() * 10) + 20
  340. );
  341.  
  342. poke_mama.createElement(
  343. HEIGHT/MIN -600,
  344. WIDTH/MIN - 10,
  345. Math.floor(Math.random() * 150 + 100),
  346. Math.floor(Math.random() * 50 + 100),
  347. Math.floor(Math.random() * 30),
  348. Math.floor(Math.random() * -50) - 10,
  349. Math.floor(Math.random() * 31) - 15,
  350. Math.floor(Math.random() * 10) + 20
  351. );
  352.  
  353. poke_mama.createElement(
  354. 0,
  355. WIDTH/MIN/2,
  356. Math.floor(Math.random() * 150 + 100),
  357. Math.floor(Math.random() * 100 + 150),
  358. Math.floor(Math.random() * 150 + 100),
  359. Math.floor(Math.random() * -50) - 10,
  360. Math.floor(Math.random() * 301) - 150,
  361. Math.floor(Math.random() * 10) + 20
  362. );
  363.  
  364.  
  365.  
  366. }
  367.  
  368.  
  369.  
  370. for(var idx = 0;idx < poke_map.length;idx++){
  371.  
  372. poke_map[idx].move();
  373. poke_map[idx].print();
  374. poke_map[idx].fall();
  375. }
  376.  
  377. for(var idx = 0;idx < spot_list.length;idx++){
  378. spot_list[idx].catchPoke();
  379. //spot_list[idx].print();
  380. }
  381.  
  382. }
  383.  
  384. </script>
  385. <style type="text/css">
  386. canvas { background-color:#fff; border: 10px solid #000; }
  387. </style>
  388. </head>
  389. <body onload="start();">
  390. <canvas id="canvas" width="1000" height="1200"></canvas>
  391. 　</body>
  392. </html>
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!