//sphere radius
const sr = 5;
//thorus radius
let tr = 0;
let font;
let leaf;
function preload() {
font = loadFont('/SourceSansPro-Regular.otf');
//leaf = loadImage('/wp-content/uploads/2023/04/foglia_66-1.png');
leaf = loadImage('/wp-content/uploads/2024/05/1800_Black.webp');
}
function setup() {
const canvas = createCanvas(650, 650, WEBGL);
canvas.parent("p5container");
textFont(font);
textSize(16);
textAlign(CENTER, CENTER);
rectMode(CENTER);
fill(0,0,0);
windowResized();
}
function windowResized() {
const w = jQuery('#p5container').width();
ortho(-w/2, w/2, -w/2, 2/w, 0.1, 10000);
resizeCanvas(w, w);
}
function vtransform(v, rx, ry, rz){
let x = v.x;
let y = v.y;
let z = v.z;
//rotation x
let x1 = x;
let y1 = cos(rx)*y - sin(rx)*z;
let z1 = sin(rx)*y + cos(rx)*z;
//rotation y
let x2 = cos(ry)*x1 + sin(ry)*z1;
let y2 = y1;
let z2 = -sin(ry)*x1 + cos(ry)*z1;
//rotation z
let x3 = cos(rz)*x2 - sin(rz)*y2;
let y3 = sin(rz)*x2 + cos(rz)*y2;
let z3 = z2;
v.set(x3,y3,z3);
return v;
}
function label(s, rx, ry, rz, tx, ty){
let v1 = createVector(tx, ty, 0);
v1 = vtransform(v1, rx, ry, rz);
fill(255);
rect(v1.x, v1.y-25, textWidth(s)+8, 22);
translate(0, 0, 1);
fill(0);
text(s, v1.x, v1.y-28);
translate(0, 0, -1);
}
function orbit(s1, s2, rx, ry, rz, zindex){
rotateZ(rz);
rotateY(ry);
rotateX(rx);
torus(tr, 0.5, 48);
translate(tr*cos(PI/4), -tr*sin(PI/4));
sphere(sr);
translate(-2*tr*cos(PI/4), 2*tr*sin(PI/4));
if(s2){
sphere(sr);
}
translate(tr*cos(PI/4), -tr*sin(PI/4));
rotateX(-rx);
rotateY(-ry);
rotateZ(-rz);
translate(0, 0, tr+sr+3*zindex);
label(s1, rx, ry, rz, tr*cos(PI/4), -tr*sin(PI/4));
translate(0, 0, 2);
if(s2){
label(s2, rx, ry, rz, -tr*cos(PI/4), tr*sin(PI/4));
}
translate(0, 0, -tr-sr-3*zindex-2);
}
function draw() {
tr = width/3;
let s = frameCount*0.003;
background(255,255,255);
ortho(-width / 2, width / 2, -height / 2, height / 2, 0, 1000);
torus(tr, 0.5, 48);
let zindex=0;
orbit("LIGHT-HEARTED", "NATURE CONNECTED", 11+s, 11+s, 14+s, zindex++);
//orbit("SUSTAINABLE", "BEAU MONDE", 20+s, 43+s, 23+s, zindex++);
orbit("QUALITY", "BREEZY", -69+s, 69+s, 18+s, zindex++);
orbit("CUSTOMIZABLE", "CHAMELEONIC", 53+s, 19+s, 74-s, zindex++);
orbit("ELEGANT", "", -23-s, -69-s, 24-s, zindex++);
//orbit("", "", -40-s, -11-s, 35-s, zindex++);
image(leaf, -(leaf.width/4), -(leaf.height/4), leaf.width/2, leaf.height/2);
}