Add initial rain project
This commit is contained in:
commit
2860e52aba
3 changed files with 441 additions and 0 deletions
388
.eslintrc.yml
Normal file
388
.eslintrc.yml
Normal file
|
|
@ -0,0 +1,388 @@
|
||||||
|
extends:
|
||||||
|
- airbnb
|
||||||
|
env:
|
||||||
|
node: true
|
||||||
|
browser: true
|
||||||
|
globals:
|
||||||
|
remove: true
|
||||||
|
canvas: true
|
||||||
|
width: true
|
||||||
|
height: true
|
||||||
|
drawingContext: true
|
||||||
|
frameCount: true
|
||||||
|
pmouseX: true
|
||||||
|
pmouseY: true
|
||||||
|
mouseX: true
|
||||||
|
mouseY: true
|
||||||
|
pwinMouseX: true
|
||||||
|
pwinMouseY: true
|
||||||
|
ptouchX: true
|
||||||
|
ptouchY: true
|
||||||
|
touchX: true
|
||||||
|
touchY: true
|
||||||
|
registerPreloadMethod: true
|
||||||
|
registerMethod: true
|
||||||
|
alpha: true
|
||||||
|
blue: true
|
||||||
|
brightness: true
|
||||||
|
color: true
|
||||||
|
green: true
|
||||||
|
hue: true
|
||||||
|
lerpColor: true
|
||||||
|
lightness: true
|
||||||
|
red: true
|
||||||
|
saturation: true
|
||||||
|
background: true
|
||||||
|
clear: true
|
||||||
|
colorMode: true
|
||||||
|
fill: true
|
||||||
|
noFill: true
|
||||||
|
noStroke: true
|
||||||
|
stroke: true
|
||||||
|
float: true
|
||||||
|
int: true
|
||||||
|
str: true
|
||||||
|
boolean: true
|
||||||
|
byte: true
|
||||||
|
char: true
|
||||||
|
unchar: true
|
||||||
|
hex: true
|
||||||
|
unhex: true
|
||||||
|
append: true
|
||||||
|
arrayCopy: true
|
||||||
|
concat: true
|
||||||
|
reverse: true
|
||||||
|
shorten: true
|
||||||
|
shuffle: true
|
||||||
|
sort: true
|
||||||
|
splice: true
|
||||||
|
subset: true
|
||||||
|
join: true
|
||||||
|
match: true
|
||||||
|
matchAll: true
|
||||||
|
nf: true
|
||||||
|
nfc: true
|
||||||
|
nfp: true
|
||||||
|
nfs: true
|
||||||
|
split: true
|
||||||
|
splitTokens: true
|
||||||
|
trim: true
|
||||||
|
print: true
|
||||||
|
println: true
|
||||||
|
focused: true
|
||||||
|
cursor: true
|
||||||
|
frameRate: true
|
||||||
|
getFrameRate: true
|
||||||
|
setFrameRate: true
|
||||||
|
noCursor: true
|
||||||
|
displayWidth: true
|
||||||
|
displayHeight: true
|
||||||
|
windowWidth: true
|
||||||
|
windowHeight: true
|
||||||
|
fullscreen: true
|
||||||
|
pixelDensity: true
|
||||||
|
displayDensity: true
|
||||||
|
getURL: true
|
||||||
|
getURLPath: true
|
||||||
|
getURLParams: true
|
||||||
|
createImage: true
|
||||||
|
saveCanvas: true
|
||||||
|
saveFrames: true
|
||||||
|
loadImage: true
|
||||||
|
image: true
|
||||||
|
tint: true
|
||||||
|
noTint: true
|
||||||
|
imageMode: true
|
||||||
|
pixels: true
|
||||||
|
blend: true
|
||||||
|
copy: true
|
||||||
|
filter: true
|
||||||
|
get: true
|
||||||
|
loadPixels: true
|
||||||
|
set: true
|
||||||
|
updatePixels: true
|
||||||
|
loadFont: true
|
||||||
|
createInput: true
|
||||||
|
createReader: true
|
||||||
|
loadBytes: true
|
||||||
|
loadJSON: true
|
||||||
|
loadStrings: true
|
||||||
|
loadTable: true
|
||||||
|
loadXML: true
|
||||||
|
parseXML: true
|
||||||
|
selectFolder: true
|
||||||
|
selectInput: true
|
||||||
|
httpGet: true
|
||||||
|
httpPost: true
|
||||||
|
httpDo: true
|
||||||
|
beginRaw: true
|
||||||
|
beginRecord: true
|
||||||
|
createOutput: true
|
||||||
|
createWriter: true
|
||||||
|
endRaw: true
|
||||||
|
endRecord: true
|
||||||
|
saveBytes: true
|
||||||
|
save: true
|
||||||
|
saveJSON: true
|
||||||
|
saveJSONObject: true
|
||||||
|
saveJSONArray: true
|
||||||
|
saveStream: true
|
||||||
|
saveStrings: true
|
||||||
|
saveXML: true
|
||||||
|
selectOutput: true
|
||||||
|
saveTable: true
|
||||||
|
writeFile: true
|
||||||
|
downloadFile: true
|
||||||
|
isKeyPressed: true
|
||||||
|
keyIsPressed: true
|
||||||
|
key: true
|
||||||
|
keyCode: true
|
||||||
|
keyIsDown: true
|
||||||
|
deviceOrientation: true
|
||||||
|
accelerationX: true
|
||||||
|
accelerationY: true
|
||||||
|
accelerationZ: true
|
||||||
|
pAccelerationX: true
|
||||||
|
pAccelerationY: true
|
||||||
|
pAccelerationZ: true
|
||||||
|
rotationX: true
|
||||||
|
rotationY: true
|
||||||
|
rotationZ: true
|
||||||
|
pRotationX: true
|
||||||
|
pRotationY: true
|
||||||
|
pRotationZ: true
|
||||||
|
turnAxis: true
|
||||||
|
setMoveThreshold: true
|
||||||
|
setShakeThreshold: true
|
||||||
|
winMouseX: true
|
||||||
|
winMouseY: true
|
||||||
|
mouseButton: true
|
||||||
|
mouseIsPressed: true
|
||||||
|
isMousePressed: true
|
||||||
|
day: true
|
||||||
|
hour: true
|
||||||
|
minute: true
|
||||||
|
millis: true
|
||||||
|
month: true
|
||||||
|
second: true
|
||||||
|
year: true
|
||||||
|
touches: true
|
||||||
|
touchIsDown: true
|
||||||
|
createVector: true
|
||||||
|
abs: true
|
||||||
|
ceil: true
|
||||||
|
constrain: true
|
||||||
|
dist: true
|
||||||
|
exp: true
|
||||||
|
floor: true
|
||||||
|
lerp: true
|
||||||
|
log: true
|
||||||
|
mag: true
|
||||||
|
map: true
|
||||||
|
max: true
|
||||||
|
min: true
|
||||||
|
norm: true
|
||||||
|
pow: true
|
||||||
|
round: true
|
||||||
|
sq: true
|
||||||
|
sqrt: true
|
||||||
|
randomSeed: true
|
||||||
|
random: true
|
||||||
|
randomGaussian: true
|
||||||
|
noise: true
|
||||||
|
noiseDetail: true
|
||||||
|
noiseSeed: true
|
||||||
|
acos: true
|
||||||
|
asin: true
|
||||||
|
atan: true
|
||||||
|
atan2: true
|
||||||
|
cos: true
|
||||||
|
sin: true
|
||||||
|
tan: true
|
||||||
|
degrees: true
|
||||||
|
radians: true
|
||||||
|
angleMode: true
|
||||||
|
createCanvas: true
|
||||||
|
resizeCanvas: true
|
||||||
|
noCanvas: true
|
||||||
|
createGraphics: true
|
||||||
|
blendMode: true
|
||||||
|
arc: true
|
||||||
|
ellipse: true
|
||||||
|
line: true
|
||||||
|
point: true
|
||||||
|
quad: true
|
||||||
|
rect: true
|
||||||
|
triangle: true
|
||||||
|
ellipseMode: true
|
||||||
|
noSmooth: true
|
||||||
|
rectMode: true
|
||||||
|
smooth: true
|
||||||
|
strokeCap: true
|
||||||
|
strokeJoin: true
|
||||||
|
strokeWeight: true
|
||||||
|
bezier: true
|
||||||
|
bezierDetail: true
|
||||||
|
bezierPoint: true
|
||||||
|
bezierTangent: true
|
||||||
|
curve: true
|
||||||
|
curveDetail: true
|
||||||
|
curveTightness: true
|
||||||
|
curvePoint: true
|
||||||
|
curveTangent: true
|
||||||
|
beginContour: true
|
||||||
|
beginShape: true
|
||||||
|
bezierVertex: true
|
||||||
|
curveVertex: true
|
||||||
|
endContour: true
|
||||||
|
endShape: true
|
||||||
|
quadraticVertex: true
|
||||||
|
vertex: true
|
||||||
|
exit: true
|
||||||
|
noLoop: true
|
||||||
|
loop: true
|
||||||
|
push: true
|
||||||
|
pop: true
|
||||||
|
pushStyle: true
|
||||||
|
popStyle: true
|
||||||
|
redraw: true
|
||||||
|
size: true
|
||||||
|
applyMatrix: true
|
||||||
|
popMatrix: true
|
||||||
|
printMatrix: true
|
||||||
|
pushMatrix: true
|
||||||
|
resetMatrix: true
|
||||||
|
rotate: true
|
||||||
|
rotateX: true
|
||||||
|
rotateY: true
|
||||||
|
rotateZ: true
|
||||||
|
scale: true
|
||||||
|
shearX: true
|
||||||
|
shearY: true
|
||||||
|
translate: true
|
||||||
|
textAlign: true
|
||||||
|
textLeading: true
|
||||||
|
textSize: true
|
||||||
|
textStyle: true
|
||||||
|
textWidth: true
|
||||||
|
textAscent: true
|
||||||
|
textDescent: true
|
||||||
|
text: true
|
||||||
|
textFont: true
|
||||||
|
plane: true
|
||||||
|
sphere: true
|
||||||
|
ellipsoid: true
|
||||||
|
cylinder: true
|
||||||
|
cone: true
|
||||||
|
torus: true
|
||||||
|
box: true
|
||||||
|
normalMaterial: true
|
||||||
|
texture: true
|
||||||
|
basicMaterial: true
|
||||||
|
ambientMaterial: true
|
||||||
|
specularMaterial: true
|
||||||
|
ambientLight: true
|
||||||
|
directionalLight: true
|
||||||
|
pointLight: true
|
||||||
|
camera: true
|
||||||
|
perspective: true
|
||||||
|
ortho: true
|
||||||
|
orbitControl: true
|
||||||
|
P2D: true
|
||||||
|
WEBGL: true
|
||||||
|
ARROW: true
|
||||||
|
CROSS: true
|
||||||
|
HAND: true
|
||||||
|
MOVE: true
|
||||||
|
TEXT: true
|
||||||
|
WAIT: true
|
||||||
|
HALF_PI: true
|
||||||
|
PI: true
|
||||||
|
QUARTER_PI: true
|
||||||
|
TAU: true
|
||||||
|
TWO_PI: true
|
||||||
|
DEGREES: true
|
||||||
|
RADIANS: true
|
||||||
|
CORNER: true
|
||||||
|
CORNERS: true
|
||||||
|
RADIUS: true
|
||||||
|
RIGHT: true
|
||||||
|
LEFT: true
|
||||||
|
CENTER: true
|
||||||
|
TOP: true
|
||||||
|
BOTTOM: true
|
||||||
|
BASELINE: true
|
||||||
|
POINTS: true
|
||||||
|
LINES: true
|
||||||
|
TRIANGLES: true
|
||||||
|
TRIANGLE_FAN: true
|
||||||
|
TRIANGLE_STRIP: true
|
||||||
|
QUADS: true
|
||||||
|
QUAD_STRIP: true
|
||||||
|
CLOSE: true
|
||||||
|
OPEN: true
|
||||||
|
CHORD: true
|
||||||
|
PIE: true
|
||||||
|
PROJECT: true
|
||||||
|
SQUARE: true
|
||||||
|
ROUND: true
|
||||||
|
BEVEL: true
|
||||||
|
MITER: true
|
||||||
|
RGB: true
|
||||||
|
HSB: true
|
||||||
|
HSL: true
|
||||||
|
AUTO: true
|
||||||
|
ALT: true
|
||||||
|
BACKSPACE: true
|
||||||
|
CONTROL: true
|
||||||
|
DELETE: true
|
||||||
|
DOWN_ARROW: true
|
||||||
|
ENTER: true
|
||||||
|
ESCAPE: true
|
||||||
|
LEFT_ARROW: true
|
||||||
|
OPTION: true
|
||||||
|
RETURN: true
|
||||||
|
RIGHT_ARROW: true
|
||||||
|
SHIFT: true
|
||||||
|
TAB: true
|
||||||
|
UP_ARROW: true
|
||||||
|
BLEND: true
|
||||||
|
ADD: true
|
||||||
|
DARKEST: true
|
||||||
|
LIGHTEST: true
|
||||||
|
DIFFERENCE: true
|
||||||
|
EXCLUSION: true
|
||||||
|
MULTIPLY: true
|
||||||
|
SCREEN: true
|
||||||
|
REPLACE: true
|
||||||
|
OVERLAY: true
|
||||||
|
HARD_LIGHT: true
|
||||||
|
SOFT_LIGHT: true
|
||||||
|
DODGE: true
|
||||||
|
BURN: true
|
||||||
|
THRESHOLD: true
|
||||||
|
GRAY: true
|
||||||
|
OPAQUE: true
|
||||||
|
INVERT: true
|
||||||
|
POSTERIZE: true
|
||||||
|
DILATE: true
|
||||||
|
ERODE: true
|
||||||
|
BLUR: true
|
||||||
|
NORMAL: true
|
||||||
|
ITALIC: true
|
||||||
|
BOLD: true
|
||||||
|
LINEAR: true
|
||||||
|
QUADRATIC: true
|
||||||
|
BEZIER: true
|
||||||
|
CURVE: true
|
||||||
|
ecmaFeatures:
|
||||||
|
classes: true
|
||||||
|
sourceType: "module"
|
||||||
|
rules:
|
||||||
|
global-require: 0
|
||||||
|
no-console: 0
|
||||||
|
camelcase: 0
|
||||||
|
no-unused-vars: 0
|
||||||
|
func-names:
|
||||||
|
- 0
|
||||||
|
- as-needed
|
||||||
9
rain/index.html
Normal file
9
rain/index.html
Normal file
|
|
@ -0,0 +1,9 @@
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<style> body{padding:0; margin:0;} </style>
|
||||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.7/p5.js"></script>
|
||||||
|
<script src="rain.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
44
rain/rain.js
Normal file
44
rain/rain.js
Normal file
|
|
@ -0,0 +1,44 @@
|
||||||
|
function Drop() {
|
||||||
|
this.x = random(displayWidth);
|
||||||
|
this.y = -random(displayHeight);
|
||||||
|
this.z = random(5, 15);
|
||||||
|
this.yspeed = map(this.z, 0, 20, 1, 20);
|
||||||
|
this.gravity = 1;
|
||||||
|
this.fall = function () {
|
||||||
|
this.y += this.yspeed;
|
||||||
|
};
|
||||||
|
|
||||||
|
this.show = function () {
|
||||||
|
if (this.y > displayHeight) {
|
||||||
|
this.y = -random(20);
|
||||||
|
}
|
||||||
|
strokeWeight(this.z / 4);
|
||||||
|
stroke(62, 95, 163);
|
||||||
|
line(this.x, this.y, this.x, this.y + 10);
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const drops = [];
|
||||||
|
let canvas;
|
||||||
|
function setup() {
|
||||||
|
canvas = createCanvas(window.innerWidth, window.innerHeight);
|
||||||
|
for (let i = 0; i < random(500, 1000); i += 1) {
|
||||||
|
drops[i] = new Drop();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function draw() {
|
||||||
|
background(29, 31, 35);
|
||||||
|
for (let i = 0; i < drops.length; i += 1) {
|
||||||
|
drops[i].fall();
|
||||||
|
drops[i].show();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
window.onresize = function () {
|
||||||
|
const w = window.innerWidth;
|
||||||
|
const h = window.innerHeight;
|
||||||
|
resizeCanvas(w, h);
|
||||||
|
width = w;
|
||||||
|
height = h;
|
||||||
|
};
|
||||||
Loading…
Add table
Reference in a new issue