//---- normal P5 code -------------------------------------------------------
// https://www.youtube.com/watch?v=CuD_HHrmDiA
let offset1 = 0, offset2 = 0;

function setup()       
{
    createCanvas(window.innerWidth, window.innerHeight , WEBGL);
    
    angleMode(DEGREES);
    colorMode(HSB, 360, 100,100);
    imageMode(CENTER);
    
    stroke(2, 42, 100);
    strokeWeight(4);
}


function draw()             
{
    clear();
    background(0);
    orbitControl(4,4);
    
    // offset1 = 0;
    
    for (let theta= 0; theta < 180; theta += 5) {
        // offset2 = 0;
        for (let phi = 0; phi < 360; phi += 5) {
            let noiseX = map(sin(theta)*cos(phi));
            let noiseY = map(cos(theta));
            let noiseZ = map(sin(theta)*sin(phi));
            
            let n  = noise(noiseX*2, noiseY*2, noiseZ*2);
            stroke(n*360, n*30+35, n*25+75);
            
            beginShape(POINTS);
            vertex(
                (200+n*50)*sin(theta)*cos(phi),
                (200+n*50)*cos(theta),
                (200+n*50)*sin(theta)*sin(phi)
            );
            endShape();
            // offset2 +=0.01;
        }
        // offset1 += 0.02;
    }
}