TacoWolf/gallery
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add rain glimmering and gravity

Browse source
This commit is contained in:
Daniel Gallegos 2017-03-29 09:50:10 -05:00
parent 2860e52aba
commit 4b9aec6611
No known key found for this signature in database
GPG key ID: EF3596FE522DD7FC
3 changed files with 38 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
rain/index.html
View file

@ -1,6 +1,16 @@
<html>
<head>
<style> body{padding:0; margin:0;} </style>
<title>rain | gallery@TacoWolf</title>
<meta name="title" content="rain | gallery@TacoWolf">
<meta name="description" content="a digital art gallery, brought to you by tacowolf">
<meta name=viewport content="width=device-width, initial-scale=1">
<meta property="og:url" content="https://tacowolf.net/gallery/rain"/>
<meta property="og:title" content="rain"/>
<meta property="og:site_name" content="gallery@TacoWolf"/>
<meta property="og:description" content="a digital art gallery, brought to you by tacowolf"/>
<meta property="og:image" content="https://i.imgur.com/aqh0JKq.png"/>
<link rel="shortcut icon" type="image/x-icon" href="https://tacowolf.net/favicon.ico">
<link rel="stylesheet" href="main.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.7/p5.js"></script>
<script src="rain.js"></script>
</head>

4
rain/main.css Normal file
View file

@ -0,0 +1,4 @@
body {
padding: 0;
margin: 0;
}

31
rain/rain.js
View file

@ -2,33 +2,46 @@ function Drop() {
this.x = random(displayWidth);
this.y = -random(displayHeight);
this.z = random(5, 15);
this.length = random(4, 15);
this.yspeed = map(this.z, 0, 20, 1, 20);
this.gravity = 1;
this.fall = function () {
this.y += this.yspeed;
this.y = this.y + this.yspeed;
const grav = map(this.z, 0, 20, 0, 0.4);
this.yspeed = this.yspeed + grav;
if (this.y > displayHeight) {
this.y = -random(displayHeight);
this.yspeed = 0;
}
};
this.show = function () {
if (this.y > displayHeight) {
this.y = -random(20);
}
strokeWeight(this.z / 4);
switch (round(random(50))) {
case 48:
stroke(177, 191, 218);
break;
case 49:
stroke(235, 239, 245);
break;
default:
stroke(62, 95, 163);
line(this.x, this.y, this.x, this.y + 10);
}
line(this.x, this.y, this.x, this.y + this.length);
};
}
const drops = [];
let canvas;
function setup() {
canvas = createCanvas(window.innerWidth, window.innerHeight);
for (let i = 0; i < random(500, 1000); i += 1) {
for (let i = 0; i < random(1000, 1500); i += 1) {
drops[i] = new Drop();
}
}
function draw() {
background(29, 31, 35);
background(12, 12, 12);
for (let i = 0; i < drops.length; i += 1) {
drops[i].fall();
drops[i].show();