5 changed files with 111321 additions and 2 deletions
@ -0,0 +1,143 @@ |
|||||||
|
let sketch = function(p) { |
||||||
|
let bgCol = hexToRgb('#222233'); |
||||||
|
let starCol = [hexToRgb('#ffcdff'), hexToRgb('#804442'), hexToRgb('#ffff7d')] |
||||||
|
|
||||||
|
let starDensity = 0.0005; //0.0005 is safe. Above 0.01 is absurd
|
||||||
|
|
||||||
|
let currentWidth; |
||||||
|
let currentHeight; |
||||||
|
|
||||||
|
let nbStars; |
||||||
|
let stars; |
||||||
|
let bg; |
||||||
|
|
||||||
|
let time = 0; |
||||||
|
|
||||||
|
|
||||||
|
p.setup = function(){ |
||||||
|
p.frameRate(24); |
||||||
|
currentWidth = p.windowWidth; |
||||||
|
currentHeight = p.windowHeight; |
||||||
|
p.createCanvas(currentWidth, currentHeight); |
||||||
|
|
||||||
|
bgInit(); |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// p.noLoop();
|
||||||
|
} |
||||||
|
|
||||||
|
p.draw = function(){ |
||||||
|
p.background(bgCol); |
||||||
|
p.image(bg, 0, 0); |
||||||
|
|
||||||
|
// p.circle(30, time*1.5, 10);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// for (let i=0; i<nbStars; i++) {
|
||||||
|
// let x = p.random(p.windowWidth);
|
||||||
|
// let y = p.random(p.windowHeight);
|
||||||
|
// let d = 1 + p.random(2);
|
||||||
|
// let c = p.random(starCol);
|
||||||
|
// let a = p.random(230);
|
||||||
|
// c.setAlpha(a);
|
||||||
|
// // console.log(c);
|
||||||
|
//
|
||||||
|
// p.stroke(c);
|
||||||
|
// // p.point(x, y);
|
||||||
|
// p.circle(x, y, d);
|
||||||
|
// }
|
||||||
|
time += 1; |
||||||
|
} //End of draw()
|
||||||
|
|
||||||
|
class Stars { |
||||||
|
//Inspired by https://www.youtube.com/watch?v=NJjEGoqTn1Y
|
||||||
|
constructor(nb) { |
||||||
|
this.nb = nb; |
||||||
|
this.x = []; |
||||||
|
this.y = []; |
||||||
|
this.color = []; |
||||||
|
this.size = []; |
||||||
|
} |
||||||
|
|
||||||
|
make() { |
||||||
|
for (let i = 0; i < this.nb; i++) { |
||||||
|
this.x[i] = p.random(0,p.width); |
||||||
|
this.y[i] = p.random(0,p.height); |
||||||
|
this.color[i] = p.random(starCol); |
||||||
|
this.color[i].setAlpha(p.random(100,230)); |
||||||
|
this.size[i] = 1 + p.random(2); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
draw() { |
||||||
|
for (let i = 0; i < this.nb; i++) { |
||||||
|
bg.strokeWeight(this.size[i]); |
||||||
|
bg.stroke(this.color[i]); |
||||||
|
bg.point(this.x[i], this.y[i]); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
p.windowResized = function() { |
||||||
|
//Redraw only if new size if bigger than previously
|
||||||
|
let newWidth = p.windowWidth; |
||||||
|
let newHeight = p.windowHeight; |
||||||
|
if (newWidth > currentWidth || newHeight > currentHeight) { |
||||||
|
currentWidth = newWidth; |
||||||
|
currentHeight = newHeight; |
||||||
|
|
||||||
|
p.resizeCanvas(currentWidth, currentHeight); |
||||||
|
bgInit(); |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
function bgInit() { |
||||||
|
nbStars = calcNumberOfStars(); |
||||||
|
bg = p.createGraphics(p.width, p.height); |
||||||
|
bg.background(bgCol); |
||||||
|
setGradient(0, 0, p.width, p.height, bgCol, starCol[1]); |
||||||
|
|
||||||
|
stars = new Stars(nbStars); |
||||||
|
stars.make(); |
||||||
|
stars.draw(); |
||||||
|
} |
||||||
|
|
||||||
|
function calcNumberOfStars() { |
||||||
|
//Helps to get a consistent number of starts regardless the window size
|
||||||
|
if (starDensity > 0.01) { |
||||||
|
console.log('starDensity is too high! going back to the maximum (0.01) in order to prevent too much CPU load when starting the patch'); |
||||||
|
starDensity = 0.01; |
||||||
|
} |
||||||
|
let nb = p.round(starDensity * currentWidth * currentHeight) |
||||||
|
console.log('nbStars: ' + nb); |
||||||
|
return nb; |
||||||
|
} |
||||||
|
|
||||||
|
function hexToRgb(hex) { |
||||||
|
hex = hex.replace('#', ''); |
||||||
|
|
||||||
|
var bigint = parseInt(hex, 16); |
||||||
|
|
||||||
|
var r = (bigint >> 16) & 255; |
||||||
|
var g = (bigint >> 8) & 255; |
||||||
|
var b = bigint & 255; |
||||||
|
|
||||||
|
return p.color(r, g, b); |
||||||
|
} |
||||||
|
function setGradient(x, y, w, h, c1, c2) { |
||||||
|
bg.noFill(); |
||||||
|
// Top to bottom gradient
|
||||||
|
for (let i = y; i <= y + h; i++) { |
||||||
|
let inter = p.pow(p.map(i, y, y + h, 0, 1),6); |
||||||
|
let c = bg.lerpColor(c1, c2, inter); |
||||||
|
bg.stroke(c); |
||||||
|
bg.line(x, i, x + w, i); |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
}; |
||||||
|
|
||||||
|
new p5(sketch, 'bg'); |
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
Reference in new issue