API tools faq
paste
LapisSea

Untitled

LapisSea
Jan 26th, 2017
256
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 21.64 KB | None | 0 0
raw download clone embed print report
  1.  
  2. <!doctype html>
  3. <html lang="en">
  4. <head>
  5. <meta charset="utf-8"/>
  6. <title>LapisSea</title>
  7. <link rel="shortcut icon" href="favicon.ico">
  8. <link href='https://fonts.googleapis.com/css?family=Comfortaa' rel='stylesheet' type='text/css'>
  9. <style type="text/css">
  10. body{
  11. font-family: Comfortaa;
  12. background-color: #555;
  13. }
  14. msg{
  15. display: block;
  16. font-size: 50px;
  17. position: fixed;
  18. top: 30px;
  19. left: 30px;
  20. }
  21. .canv{
  22. background-color: transparent;
  23. position: fixed;
  24. top: 0;
  25. left: 0;
  26. }
  27. body,html,.canv{
  28. width: 100%;
  29. height: 100%;
  30. padding: 0;
  31. margin: 0;
  32. }
  33. .invi{
  34. display: none;
  35. }
  36. *{
  37. user-select: none;
  38. -moz-user-select: none;
  39. -khtml-user-select: none;
  40. -webkit-user-select: none;
  41. -o-user-select: none;
  42. }
  43. </style>
  44. </head>
  45.  
  46.  
  47. <body onload="lod()" onresize="res()" onclick="clck(window.event)">
  48.  
  49. <canvas class="canv" id="bkg"></canvas>
  50. <canvas class="canv" id="tre"></canvas>
  51. <msg></msg>
  52.  
  53. <!-- <img class="invi" id="gitImg" src="images/git.svg"> -->
  54. <img class="invi" id="glintImg" src="images/Glint.png">
  55. <img class="invi" id="ambientParticle" src="images/explosion_stages.png">
  56.  
  57. <script type="text/javascript" id="util">
  58. devMode=false;
  59. "use strict";
  60. function time(){return new Date().getTime();}
  61. function syso(){
  62. if(arguments.length==1)console.log(arguments[0]);
  63. else if(arguments.length==2)console.log(arguments[0],arguments[1]);
  64. else console.log(arguments);
  65. }
  66. function fillQuad(ctx,p1x,p1y,p2x,p2y,p3x,p3y,p4x,p4y){
  67. ctx.beginPath();
  68. ctx.moveTo(p1x,p1y);
  69. ctx.lineTo(p2x,p2y);
  70. ctx.lineTo(p3x,p3y);
  71. ctx.lineTo(p4x,p4y);
  72. ctx.fill();
  73. }
  74. </script>
  75.  
  76. <script src="https://cdn.rawgit.com/mourner/suncalc/b08d1f6f/suncalc.js"></script>
  77. <script src="common/CommonUtil.js?v=1"></script>
  78. <script src="common/GetURLContent.js?v=1"></script>
  79. <script src="common/CookieGetterSetter.js?v=1"></script>
  80. <script src="common/ClearAreaMaker.js?v=1"></script>
  81. <script src="common/PerlinNoise.js?v=1"></script>
  82. <script src="common/CubicBezier.js?v=1"></script>
  83. <script type="text/javascript" id="sunScript">
  84.  
  85. geoData={latitude:0,longitude:0,ip:0,isNull:true};
  86.  
  87. function initGeo(json){
  88. geoData={
  89. latitude:json.latitude,
  90. longitude:json.longitude,
  91. ip:json.ip
  92. };
  93. }
  94. sunBrightness=NaN;
  95. function updateSun(){
  96. var prev=sunBrightness;
  97. calcSunBrightness();
  98. bkgCol=Math.round(sunBrightness*200+29);
  99. terrainCol=Math.round(sunBrightness*70+10);
  100. trunkCol=Math.round((1-sunBrightness*sunBrightness)*50+80);
  101.  
  102. document.body.style.color=bkgCol<126?"white":"black";
  103. document.body.style.backgroundColor="rgb("+bkgCol+","+bkgCol+","+bkgCol+")";
  104.  
  105. if(sunBrightness==prev)return;
  106. if(typeof res!="undefined"){
  107. res();
  108. if(!local)ambientParticle.src=filterImage(function(pixels) {
  109. var d = pixels.data;
  110. for (var i=0; i<d.length; i+=4){
  111. d[i]=d[i+1]=d[i+2]=trunkCol;
  112. }
  113. return pixels;
  114. },ambientParticle);
  115. }
  116. }
  117. function calcSunBrightness(){
  118. var date=new Date();
  119. var tim=date.getTime();
  120. sun=SunCalc.getTimes(date, geoData.latitude, geoData.longitude);
  121. genSun();
  122.  
  123.  
  124. var start=sun.nightEnd.getTime();
  125. var end=sun.dawn.getTime();
  126.  
  127.  
  128. if(start>tim){
  129. sunBrightness=0;
  130. return;
  131. }
  132.  
  133. if(start<tim&&tim<end){
  134. var diff=end-start;
  135. sunBrightness=(tim-start)/diff;
  136. return;
  137. }
  138. start=sun.dusk.getTime();
  139. end=sun.night.getTime();
  140.  
  141. if(start<tim&&tim<end){
  142. var diff=end-start;
  143. sunBrightness=1-(tim-start)/diff;
  144. return;
  145. }
  146. if(end<tim)sunBrightness=0;
  147. else sunBrightness=1;
  148.  
  149.  
  150. }
  151. fetchingGeo=false;
  152. function genSun(){
  153. var geo=getCookie("geo");
  154. if(typeof geo=="undefined"||geo==""){
  155. if(typeof fetchingGeoScript=="undefined")fetchGeo();
  156. }else if(geoData.isNull){
  157. initGeo(geo);
  158. }
  159.  
  160. }
  161. function fetchGeoReceve(json){
  162. json={
  163. latitude:json.geoplugin_latitude,
  164. longitude:json.geoplugin_longitude,
  165. ip:json.geoplugin_request
  166. };
  167. initGeo(json);
  168. setCookie("geo",json,1);
  169. genSun();
  170. syso("Geo data fetched!");
  171. fetchingGeoScript.parentNode.removeChild(fetchingGeoScript);
  172. delete fetchingGeoScript;
  173. updateSun();
  174. }
  175. function fetchGeo(){
  176. syso("Fetching geo data...");
  177.  
  178. fetchingGeoScript=document.createElement("script");
  179. fetchingGeoScript.src="http://www.geoplugin.net/json.gp?jsoncallback=fetchGeoReceve";
  180.  
  181. document.body.appendChild(fetchingGeoScript);
  182. }
  183. </script>
  184. <!-- <script type="text/javascript" src="http://www.geoplugin.net/json.gp?jsoncallback=initGeo"></script> -->
  185. <script type="text/javascript" id="openTyping">
  186. helloText=["Hello, ","Welcome..."];
  187. wops="abcdefghijklmnopqrstuvwxyz";
  188. mistake=false;
  189. typed="";
  190. function w(){
  191. return helloText[0];
  192. }
  193. function type(){
  194. if(devMode){
  195. msg.innerHTML=helloText.join("<br>");
  196. startTim=1;
  197. return;
  198. }
  199. setTimeout(function(){
  200. if(w().length==0){
  201. helloText.shift();
  202. if(helloText.length>0){
  203. typed+="<br>";
  204. msg.innerHTML=typed;
  205. type();
  206. }else{
  207. msg.innerHTML=typed;
  208. type=helloText=wops=typed=undefined;
  209. startTim=time();
  210. }
  211. return;
  212. }
  213. if(mistake){
  214. mistake=false;
  215. typed=typed.substring(0,typed.length-1);
  216. }
  217. else if(Math.random()>0.7){
  218. mistake=true;
  219. var correctId=wops.indexOf(w().charAt(0).toLowerCase());
  220. if(correctId==-1)mistake=false;
  221. else{
  222. var misId;
  223. do{misId=Math.round(Math.random()*wops.length);}while(correctId==misId);
  224. typed+=wops.charAt(misId);
  225. }
  226. }
  227. if(!mistake){
  228. typed+=w().charAt(0);
  229. helloText[0]=w().substring(1);
  230. }
  231. msg.innerHTML=typed;
  232. type();
  233. },Math.round(20+(mistake?0:Math.random()*50)));
  234. }
  235. </script>
  236. <script type="text/javascript" id="tree">
  237. maxPar=0;
  238. function Vec2(x=0,y=0){
  239. this.x=x;
  240. this.y=y;
  241. };
  242.  
  243. sqrtOf2=Math.sqrt(2);
  244.  
  245. function Segment(parent,pos,length,width){
  246. this.parent=parent;
  247. this.pos=pos;
  248. this.length=length;
  249. this.width=width;
  250. this.topWidth=width;
  251. this.child=[];
  252. this.sp=0;
  253. this.shock=0;
  254. this.parentCount=this.parent.parentCount+1;
  255. this.anglePref=0;
  256.  
  257. this.org=function(){
  258. var mul=(1/(this.width*this.width))*50;
  259. if(mul>1.5)mul=Math.sqrt(mul);
  260. this.origigi=(1-Math.random()*2)*mul+this.anglePref;
  261. this.origigi=(this.origigi+this.parent.origigi*2)/3;
  262. this.shock=1.5;
  263. }
  264. this.org();
  265. this.angle=Math.PI+this.origigi;
  266. this.rand=Math.random();
  267. this.topL=new Vec2();
  268. this.topR=new Vec2();
  269.  
  270.  
  271. if(this.width>2){
  272. this.childPos=[];
  273. for(var i=0,j=1+Math.round(Math.random()*2);i<j;i++){
  274. var sg=new Segment(this,new Vec2(0,0),this.length*(0.67+Math.random()*0.2),width*(0.4+Math.random()*0.5));
  275. maxPar=Math.max(maxPar,sg.parentCount);
  276. this.child.push(sg);
  277. }
  278. if(this.width>4){
  279. while(Math.random()>0.6){
  280. var sg=new Segment(this,new Vec2(0,0),this.length*(0.2+Math.random()*0.2),1+Math.random()+0.9);
  281. maxPar=Math.max(maxPar,sg.parentCount);
  282. this.child.push(sg);
  283. }
  284. }
  285. var chl=this.child.length;
  286.  
  287. var total=0;
  288. for(var i=0;i<chl;i++)total+=this.child[i].width;
  289. this.topWidth=Math.min(this.topWidth,total);
  290.  
  291. var xD=0;
  292. for(var i=0;i<chl;i++){
  293. var ch=this.child[i];
  294. ch.anglePref=chl<2?0:((i-(chl-1)/2)/(chl-1))/ch.width*2;
  295. ch.org();
  296. ch.angle=Math.PI+ch.origigi;
  297.  
  298. xD+=ch.width;
  299.  
  300. var start=ch.width/2,end=this.topWidth-ch.width/2;
  301.  
  302. if(i==0)this.childPos[i]=start;
  303. else if(i==chl-1)this.childPos[i]=end;
  304. else{
  305. var percent=(xD-ch.width/2)/total;
  306.  
  307. this.childPos[i]=Math.max(start, Math.min(this.topWidth*percent, end));
  308. }
  309. this.childPos[i]-=this.topWidth/2;
  310. }
  311.  
  312. }
  313.  
  314. this.update=function(){
  315. if(sec%10==0&&Math.random()>0.99){
  316. this.org();
  317. if(Math.random()>0.98)this.drop();
  318. }
  319.  
  320. var lower=100+this.width*10;
  321. lower+=(1-sunBrightness)*100;
  322.  
  323. this.angle+=nois.noise(this.rand,tim/20000)/lower;
  324. this.angle=(this.angle*99+Math.PI+this.origigi)/100;
  325.  
  326. //this.angle=Math.PI+this.origigi*10;
  327.  
  328. this.s90=Math.sin(this.angle+Math.PI/2);
  329. this.cs90=Math.cos(this.angle+Math.PI/2);
  330. var s=Math.sin(this.angle),cs=Math.cos(this.angle);
  331.  
  332. this.endX=this.pos.x+s*this.actualLeng;
  333. this.endY=this.pos.y+cs*this.actualLeng;
  334.  
  335. this.actualLeng=Math.min(1,(grow-1)/this.parentCount);
  336. if(this.actualLeng<1)this.actualLeng=UnitBezier.calcCubicBezier(.73,.01,.5,.99,this.actualLeng);
  337.  
  338. if(this.width<2)this.shock*=0.99;
  339.  
  340. if(this.child.length>0){
  341. for(var i=0;i<this.child.length;i++){
  342. var ch=this.child[i];
  343.  
  344. // ch.pos.x=this.endX;
  345. // ch.pos.y=this.endY;
  346. ch.pos.x=this.endX+this. s90*this.childPos[i];
  347. ch.pos.y=this.endY+this.cs90*this.childPos[i];
  348.  
  349. // var difAng=Math.abs(this.angle-ch.angle);
  350.  
  351. // ch.pos.x-=ch.width*cs*Math.sin(difAng)/2;
  352. // ch.pos.y-=ch.width*s*Math.cos(difAng)/2;
  353. ch.update();
  354.  
  355. }
  356. }
  357. }
  358. this.draw=function(ctx){
  359. if(this.actualLeng<=0)return;
  360.  
  361. var cubeS=0;
  362. if(this.width<2){
  363. cubeS=Math.max(this.actualLeng-0.8,0)*5;
  364.  
  365. }
  366.  
  367. this.actualLeng*=this.length;
  368.  
  369. ctx.addRad(this.endX,this.endY,20);
  370.  
  371.  
  372.  
  373. // o1 o4
  374. // o2 o3
  375.  
  376. ctx.fillStyle="rgb("+trunkCol+","+trunkCol+","+trunkCol+")";
  377.  
  378. this.topL.x=this.endX+this. s90*this.topWidth/2;
  379. this.topL.y=this.endY+this.cs90*this.topWidth/2;
  380. this.topR.x=this.endX-this. s90*this.topWidth/2;
  381. this.topR.y=this.endY-this.cs90*this.topWidth/2;
  382.  
  383. var
  384. blx=this.pos.x+this.s90*this.width/2,bly=this.pos.y+this.cs90*this.width/2,
  385. brx=this.pos.x-this.s90*this.width/2,bry=this.pos.y-this.cs90*this.width/2;
  386.  
  387. fillQuad(ctx,
  388. this.topL.x,this.topL.y,
  389. blx,bly,
  390. brx,bry,
  391. this.topR.x,this.topR.y
  392. );
  393. if(this.parentCount>1){
  394. //ctx.fillStyle="rgba("+trunkCol+","+trunkCol+","+trunkCol+",0.2)";
  395. fillQuad(ctx,
  396. blx,bly-1,
  397. this.parent.topL.x,this.parent.topL.y+1,
  398. this.parent.topR.x,this.parent.topR.y+1,
  399. brx,bry-1
  400. );
  401. }
  402.  
  403. // ctx.beginPath();
  404. // ctx.moveTo(this.pos.x,this.pos.y);
  405. // ctx.lineTo(endX,endY);
  406. // ctx.stroke();
  407.  
  408. if(cubeS>0&&this.shock>-1){
  409. var lol=nois.noise(this.rand,tim/2000);
  410.  
  411. cubeS*=(0.5+(lol/2+1)*0.5)*Math.max(0,1+this.shock);
  412.  
  413. cubeS*=12;
  414. var r=lol<0?-lol:0,b=Math.max(0,lol);
  415.  
  416.  
  417. ctx.fillStyle="rgba("+Math.round(r*120+50)+",50,"+Math.round(b*120+50)+",0.4)";
  418. ctx.save();
  419. ctx.translate(this.endX,this.endY);
  420.  
  421. ctx.rotate(lol/3+Math.sin(this.shock*5)/2);
  422.  
  423. ctx.fillRect(-cubeS/2,-cubeS/2, cubeS,cubeS);
  424. var glow=((this.shock-0.2)/0.8)/2;
  425. glow*=1-sunBrightness;
  426. if(glow>0){
  427. glow-=(nois.noise(this.rand,tim/100)/2+0.5)*0.03;
  428. }
  429. if(glow>0){
  430. glintData.push(this.endX);
  431. glintData.push(this.endY);
  432. glintData.push(glow);
  433. glintData.push(r);
  434. }else ctx.addRad(this.endX,this.endY,cubeS*sqrtOf2);
  435. ctx.restore();
  436. }
  437.  
  438.  
  439. if(this.child.length>0){
  440. for(var i=0;i<this.child.length;i++){
  441. this.child[i].draw(ctx);
  442. }
  443. }
  444. }
  445.  
  446. this.getClicks=function(arr){
  447. if(this.width<2)arr.push(this);
  448.  
  449. for(var i=0;i<this.child.length;i++)this.child[i].getClicks(arr);
  450. return arr;
  451. }
  452. this.drop=function(){
  453. if(this.shock>=-0.05){
  454.  
  455. var lol=nois.noise(this.rand,tim/2000);
  456.  
  457. spawnParticle(LeafParticle,this.endX,this.endY,lol<0?-lol:0,Math.max(0,lol));
  458. }
  459. this.org();
  460. this.shock=-4;
  461. }
  462. };
  463. rootSeg=new Segment({parentCount:0,origigi:0},new Vec2(300,500),100,20,1);
  464. startTim=0;
  465.  
  466. clickabals=rootSeg.getClicks([]);
  467. function updateGrow(){
  468. grow=Math.min(1,(tim-startTim)/6000);
  469. if(grow==1){
  470. grow=maxPar;
  471. updateGrow=function(){};
  472. }
  473. grow*=grow;
  474. grow*=maxPar;
  475. }
  476. function drawTree(ctx){
  477. ctx.clear();
  478. if(startTim==0)return;
  479. updateGrow();
  480.  
  481. sec=Math.round(tim/1000);
  482. if(grow>1){
  483. ctx.fillStyle="rgb("+trunkCol+","+trunkCol+","+trunkCol+")";
  484. rootSeg.update();
  485. rootSeg.draw(ctx);
  486.  
  487. if(trunkCol!=terrainCol){
  488. ctx.fillStyle="rgb("+terrainCol+","+terrainCol+","+terrainCol+")";
  489.  
  490. var mul=20/groundPartWidth;
  491. var p1=heightMap[heightMap.length-3];
  492. var p2=heightMap[heightMap.length-2];
  493. var p3=heightMap[heightMap.length-1];
  494.  
  495. var h1=(p2-p3)*tre.height*mul;
  496. var h2=(p2-p1)*tre.height*mul;
  497.  
  498. fillQuad(ctx,
  499. rootSeg.pos.x ,rootSeg.pos.y-10,
  500. rootSeg.pos.x ,rootSeg.pos.y+10,
  501. rootSeg.pos.x+20,rootSeg.pos.y+10,
  502. rootSeg.pos.x+20,rootSeg.pos.y-10-h1
  503. );
  504. fillQuad(ctx,
  505. rootSeg.pos.x+1 ,rootSeg.pos.y-10,
  506. rootSeg.pos.x+1 ,rootSeg.pos.y+10,
  507. rootSeg.pos.x-20,rootSeg.pos.y+10,
  508. rootSeg.pos.x-20,rootSeg.pos.y-10-h2
  509. );
  510. }
  511.  
  512. ctx.addRad(rootSeg.pos.x,rootSeg.pos.y,20);
  513.  
  514. }else{
  515. ctx.font="50px Comfortaa";
  516. ctx.fillStyle=document.body.style.color;
  517. var msgBound=msg.getBoundingClientRect();
  518.  
  519. var x1=msgBound.right;
  520. var y1=msgBound.bottom;
  521.  
  522. var x2=rootSeg.pos.x;
  523. var y2=rootSeg.pos.y;
  524.  
  525. var grow0=grow*1.2;
  526. if(grow0>1)return;
  527. var x=x1+(x2-x1)*grow0,y=y1+(y2-y1)*grow0*grow0-12;
  528.  
  529. ctx.addRad(x,y,10);
  530.  
  531. ctx.fillText(".",x,y);
  532. }
  533.  
  534. }
  535. function clck(e){
  536. updateGrow();
  537. if(grow<3)return;
  538.  
  539. var clX=e.clientX,clY=e.clientY;
  540.  
  541. var closest=69,minDistance=0xFFFFFFFF,posX=-1,posY=-1;
  542.  
  543. for(var i=0;i<clickabals.length;i++){
  544. var cl=clickabals[i];
  545. if(cl.width>=2)continue;
  546.  
  547. var difX=cl.endX-clX;
  548. var difY=cl.endY-clY;
  549.  
  550. var dist=Math.sqrt(difX*difX+difY*difY);
  551. if(minDistance>dist){
  552. minDistance=dist;
  553. closest=cl;
  554. posX=cl.endX;
  555. posY=cl.endY;
  556. }
  557. }
  558.  
  559. if(closest!=69&&minDistance<20){
  560. closest.drop();
  561. }
  562.  
  563.  
  564. }
  565. </script>
  566.  
  567. <script type="text/javascript" id="particles">
  568.  
  569. glintData=[];
  570. particles=[];
  571. particlePool={
  572. pool:{},
  573. get:function(type, args){
  574. var arr=this.pool[type.getId()];
  575.  
  576. if(typeof arr=="undefined"||arr.length==0){
  577. var t=new type();
  578. t.init(args);
  579. return t;
  580. }
  581. var t=arr.shift();
  582. t.init(args);
  583. return t;
  584. },
  585. put:function(dead){
  586. dead=dead[0];
  587. var type=dead.constructor;
  588. var arr=this.pool[type.getId()];
  589.  
  590. if(typeof this.pool[type.getId()]=="undefined")this.pool[type.getId()]=[];
  591. this.pool[type.getId()].push(dead);
  592. }
  593. };
  594.  
  595. function LeafParticle(){
  596. this.pos=new Vec2();
  597. this.init=function(args){
  598. this.pos.x=args[0];
  599. this.pos.y=args[1];
  600. this.r=args[2];
  601. this.b=args[3];
  602. this.rand=Math.random()*Math.PI;
  603. this.cubeS=12;
  604. this.alpha=1;
  605. }
  606. this.update=function(){
  607. var xWobl=nois.noise(this.rand,tim/2000);
  608. this.pos.y+=Math.random()*0.7-xWobl*xWobl/1.5;
  609. this.pos.x+=wind*(1.05-Math.random()*0.05)+xWobl*xWobl;
  610.  
  611. if(this.pos.x<=0||this.pos.x>tre.width)return true;
  612.  
  613. var h=getTerH(this.pos.x);
  614. var w=this.cubeS*sqrtOf2;
  615. h+=w/2;
  616. h-=this.pos.y;
  617. this.alpha=Math.min(1,(h/w)/2);
  618. return h<0;
  619. };
  620. this.draw=function(ctx){
  621. if(this.pos.x==0)return;
  622. ctx.fillStyle="rgba("+Math.round(this.r*120+50)+",50,"+Math.round(this.b*120+50)+",0.4)";
  623. ctx.globalAlpha=this.alpha;
  624. ctx.save();
  625. ctx.translate(this.pos.x,this.pos.y);
  626. ctx.rotate((tim/1000+this.rand)%Math.PI*2);
  627. ctx.fillRect(-this.cubeS/2,-this.cubeS/2, this.cubeS,this.cubeS);
  628. ctx.restore();
  629.  
  630. glintData.push(this.pos.x);
  631. glintData.push(this.pos.y);
  632. glintData.push(this.alpha*(0.2+Math.random()*0.1));
  633. glintData.push(this.r/2);
  634. };
  635. }
  636.  
  637. function AmbientParticle(){
  638. this.pos=new Vec2();
  639. this.init=function(args){
  640. this.pos.x=args[0];
  641. this.pos.y=args[1];
  642. this.start=time();
  643. this.frame=0;
  644. this.rand=Math.random()*Math.PI*2;
  645. }
  646. this.update=function(){
  647. this.frame=Math.floor((time()-this.start)*20/1000);
  648. return this.frame>15;
  649. };
  650. this.draw=function(ctx){
  651. if(this.pos.x==0)return;
  652.  
  653. var x=Math.floor(this.frame/4),y=Math.floor(this.frame%4);
  654. ctx.save();
  655. ctx.translate(this.pos.x,this.pos.y);
  656. ctx.rotate(this.rand);
  657. ctx.translate(-32,-32)
  658. ctx.drawImage(ambientParticle,x*64,y*64,64,64,0,0,64,64);
  659. ctx.restore();
  660. ctx.addRad(this.pos.x,this.pos.y,32*sqrtOf2);
  661. };
  662. }
  663. LeafParticle.getId=function(){return 0;};
  664. AmbientParticle.getId=function(){return 1;};
  665.  
  666. function spawnParticle(type, ...args){
  667. particles.push(particlePool.get(type,args));
  668. }
  669.  
  670. function drawPs(ctx){
  671. for(var i=0;i<particles.length;i++){
  672. var p=particles[i];
  673. if(p.update()){
  674. particlePool.put(particles.splice(i, 1))
  675. i--;
  676. }
  677. else p.draw(ctx);
  678. }
  679. if(glintData.length>1/256){
  680. while(glintData.length>0){
  681. ctx.globalAlpha=glintData[2];
  682. ctx.globalCompositeOperation="screen";
  683.  
  684. var glintImg=glintImgs.get(glintData[3]);
  685.  
  686.  
  687. var x=glintData[0];
  688. var y=glintData[1];
  689. var imgH=glintImg.naturalHeight/2,imgW=glintImg.naturalWidth/2;
  690. ctx.addRect(x-imgW,y-imgH,x+imgW,y+imgH);
  691.  
  692. ctx.drawImage(glintImg,x-imgW,y-imgH,imgW*2,imgH*2);
  693.  
  694. glintData.splice(0,4);
  695. }
  696. ctx.globalAlpha=1;
  697. ctx.globalCompositeOperation="source-over";
  698. }
  699. }
  700.  
  701. </script>
  702.  
  703.  
  704. <script type="text/javascript" id="main">
  705.  
  706.  
  707. nois=new SimplexNoise(Math);
  708. heightMap=[];
  709. heightMap.length=8;
  710. for(var i=0;i<heightMap.length;i++){
  711. heightMap[i]=1-(Math.random()*0.08+0.25-((heightMap.length-i)/heightMap.length)*0.1);
  712. }
  713.  
  714. function filterImage(filter, image){
  715. if(typeof imgDraw=="undefined"){
  716. imgDraw = document.createElement('canvas');
  717. imgDraw.ctx=imgDraw.getContext("2d");
  718. }
  719.  
  720. imgDraw.width = image.width;
  721. imgDraw.height = image.height;
  722.  
  723. imgDraw.ctx.drawImage(image,0,0);
  724.  
  725. imgDraw.ctx.putImageData(filter(imgDraw.ctx.getImageData(0,0,imgDraw.width,imgDraw.height)), 0, 0);
  726. return imgDraw.toDataURL('image/png');
  727. };
  728.  
  729. function lod(){
  730. devMode=window.location.href.endsWith("?dev");
  731. local=window.location.href.startsWith("file:///");
  732.  
  733. msg=document.querySelector("msg");
  734. bkg=document.querySelector("#bkg");
  735. tre=document.querySelector("#tre");
  736. gitImg=document.querySelector("#gitImg");
  737.  
  738. bkg.ctx=bkg.getContext("2d");
  739. tre.ctx=tre.getContext("2d");
  740. injectClearAreaMaker(tre.ctx);
  741.  
  742. processGlint();
  743. updateSun();
  744. setTimeout(function(){
  745. res();
  746. updateSun();
  747. setInterval(updateSun, 30*1000);
  748. },50)
  749.  
  750.  
  751. requestAnimationFrame(type);
  752. requestAnimationFrame(rend);
  753. rend();
  754. res();
  755. }
  756.  
  757.  
  758. function processGlint(){
  759. imgDraw=document.createElement("canvas");
  760. imgDraw.ctx=imgDraw.getContext("2d");
  761.  
  762. glintImg=document.querySelector("#glintImg");
  763. glintImg.parentNode.removeChild(glintImg);
  764.  
  765. glintImg.id="";
  766. glintImg.className="";
  767.  
  768. ambientParticle=document.querySelector("#ambientParticle");
  769. ambientParticle.parentNode.removeChild(ambientParticle);
  770.  
  771. glintImgs={
  772. arr:[],
  773. get:function(r){
  774. return this.arr[Math.round(r*(glintImgs.arr.length-1))];
  775. }
  776. };
  777.  
  778. glintImgs.arr[0]=glintImg;
  779.  
  780. if(!local){
  781. var fine=32;
  782. for(var i=0;i<fine;i++){
  783. abc=i;
  784. glintImgs.arr[i]=document.createElement("img");
  785. glintImgs.arr[i].src=filterImage(function(pixels) {
  786. var d = pixels.data;
  787. var trans=(abc/fine);
  788. for (var i=0; i<d.length; i+=4){
  789. d[i]=50+trans*120;
  790. d[i+2]=50+(1-trans)*120;
  791. }
  792. return pixels;
  793. },glintImg);
  794. }
  795. }
  796.  
  797.  
  798. delete glintImg;
  799. }
  800.  
  801. function res(){
  802. tre.width=tre.clientWidth;
  803. tre.height=tre.clientHeight;
  804.  
  805. bkg.width=bkg.clientWidth;
  806. bkg.height=bkg.clientHeight;
  807.  
  808. groundPartWidth=bkg.width-bkg.width/(heightMap.length-1)*(heightMap.length-2);
  809.  
  810. rootSeg.pos.x=bkg.width-groundPartWidth;
  811. rootSeg.pos.y=bkg.height*heightMap[heightMap.length-2]+10;
  812.  
  813. bkg.width=bkg.clientWidth;
  814. bkg.height=bkg.clientHeight;
  815.  
  816. var ctx=bkg.ctx;
  817. ctx.fillStyle="rgb("+terrainCol+","+terrainCol+","+terrainCol+")";
  818.  
  819. var w=bkg.width/(heightMap.length-1);
  820. for(var i=0;i<heightMap.length-1;i++){
  821. ctx.beginPath();
  822. ctx.moveTo( i *w-1,bkg.height*heightMap[i]);
  823. ctx.lineTo( i *w-1,bkg.height);
  824. ctx.lineTo((i+1)*w ,bkg.height);
  825. ctx.lineTo((i+1)*w ,bkg.height*heightMap[i+1]);
  826. ctx.fill();
  827. }
  828.  
  829. }
  830. function getTerH(x){
  831. var index=x/groundPartWidth;
  832. var partId=Math.floor(index);
  833.  
  834. index-=partId;
  835. var p1=heightMap[partId],p2=heightMap[partId+1];
  836. return (p1+(p2-p1)*index)*tre.height;
  837. }
  838. function rend(){
  839. tim=time();
  840.  
  841. if(Math.random()>0.99){
  842. var x=Math.random()*tre.width;
  843. spawnParticle(AmbientParticle,x,Math.random()*getTerH(x));
  844. }
  845.  
  846. drawTree(tre.ctx);
  847. wind=Math.sin(rootSeg.angle);
  848. drawPs(tre.ctx);
  849.  
  850.  
  851. //ctx.drawImage(gitImg,100,100,200,200);
  852.  
  853. requestAnimationFrame(rend);
  854. }
  855. </script>
  856. </body>
  857. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
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!