|
a=0;
spd=0.001;
z_depth=0;
function ani(){
cosa=Math.cos(a);
sina=Math.sin(a);
a+=spd;
if(a<60){
for(o=1;o<64;o++){
t=(o%20)/20;
x=eval(scodeX.value);
y=eval(scodeY.value);
z=eval(rYcode.value);
eval('bn'+o).style.left=(x*cosa+y*sina+z)+401;
eval('bn'+o).style.top=(x*sina-y*cosa+z)+280;
// Give shape some 3D volume
z = Math.sin((x + y) * 0.5) * z_depth + (t - 0.5) * z_depth * 0.5;
}
}else{a=359;}
requestAnimationFrame(ani);
}ani();
a = 0;
spd = 0.001;
z_depth = 80;
function ani(){
const cosa = Math.cos(a);
const sina = Math.sin(a);
a += spd;
for(let o=0;o<64;o++){
let x = cube[o*3];
let y = cube[o*3+1];
let z = cube[o*3+2];
// rotate around Y
let rx = x*cosa - z*sina;
let rz = x*sina + z*cosa;
// extra depth ripple
rz += Math.sin((x+y)*0.03)*z_depth;
// perspective
let scale = 500/(500+rz);
let sx = rx*scale + 400;
let sy = y*scale + 300;
let p = document.getElementById("bn"+o);
if(p){
p.style.left = sx+"px";
p.style.top = sy+"px";
p.style.transform = `scale(${scale})`;
}
}
requestAnimationFrame(ani);
}
ani();
// -------------------------------------
// Funebra Sphere Engine
// Mathematical Point Cloud
// -------------------------------------
const rows = 8;
const cols = 8;
const radius = 60;
let a = 0;
const spd = 0.01;
function ani(){
a += spd;
let p = 0;
for(let i=0;i<rows;i++){
// latitude
let theta = i/(rows-1)*Math.PI;
for(let j=0;j<cols;j++){
// longitude
let phi = j/cols*Math.PI*2;
//-----------------------------------
// Generate sphere mathematically
//-----------------------------------
let x = radius*Math.sin(theta)*Math.cos(phi);
let y = radius*Math.cos(theta);
let z = radius*Math.sin(theta)*Math.sin(phi);
//-----------------------------------
// Funebra deformation
//-----------------------------------
let wave =
Math.sin(theta*8+a)
* Math.cos(phi*6+a);
let r = radius;// + wave*20;
x = r*Math.sin(theta)*Math.cos(phi);
y = r*Math.cos(theta);
z = r*Math.sin(theta)*Math.sin(phi);
//-----------------------------------
// Rotate Y
//-----------------------------------
let rx = x*Math.cos(a)-z*Math.sin(a);
let rz = x*Math.sin(a)+z*Math.cos(a);
//-----------------------------------
// Rotate X
//-----------------------------------
let ry = y*Math.cos(a*0.6)-rz*Math.sin(a*0.6);
rz = y*Math.sin(a*0.6)+rz*Math.cos(a*0.6);
//-----------------------------------
// Perspective
//-----------------------------------
let depth = 500;
let scale = depth/(depth+rz);
let sx = 400 + rx*scale;
let sy = 300 + ry*scale;
//-----------------------------------
// Draw point
//-----------------------------------
let dot = document.getElementById("ringa"+p);
if(dot){
dot.style.left = sx+"px";
dot.style.top = sy+"px";
dot.style.transform =
"translate(-50%,-50%) scale("+scale+")";
dot.style.color="rgb("+((phi+p)*a%32)/32*255+", 255, 0 )";
dot.style.opacity = scale;
}
p++;
}
}
requestAnimationFrame(ani);
}
ani();
// -------------------------------------
// Funebra Sphere Engine
// Mathematical Point Cloud
// -------------------------------------
const rows = 8;
const cols = 8;
const radius = 60;
let a = 0;
const spd = 0.01;
function ani(){
a += spd;
let p = 0;
for(let i=0;i<rows;i++){
// latitude
let theta = i/(rows-1)*Math.PI;
for(let j=0;j<cols;j++){
// longitude
let phi = j/cols*Math.PI*2;
//-----------------------------------
// Generate sphere mathematically
//-----------------------------------
let x = radius*Math.sin(theta)*Math.cos(phi);
let y = radius*Math.cos(theta);
let z = radius*Math.sin(theta)*Math.sin(phi);
//-----------------------------------
// Funebra deformation
//-----------------------------------
let wave =
Math.sin(theta*8+a)
* Math.cos(phi*6+a);
let r = radius;// + wave*20;
x = r*Math.sin(theta)*Math.cos(phi);
y = r*Math.cos(theta);
z = r*Math.sin(theta)*Math.sin(phi);
//-----------------------------------
// Rotate Y
//-----------------------------------
let rx = x*Math.cos(a)-z*Math.sin(a);
let rz = x*Math.sin(a)+z*Math.cos(a);
//-----------------------------------
// Rotate X
//-----------------------------------
let ry = y*Math.cos(a*0.6)-rz*Math.sin(a*0.6);
rz = y*Math.sin(a*0.6)+rz*Math.cos(a*0.6);
//-----------------------------------
// Perspective
//-----------------------------------
let depth = 500;
let scale = depth/(depth+rz);
let sx = 400 + rx*scale;
let sy = 300 + ry*scale;
//-----------------------------------
// Draw point
//-----------------------------------
//-----------------------------------
// Light
//-----------------------------------
// Surface normal (sphere)
let nx = rx;
let ny = ry;
let nz = rz;
let len = Math.sqrt(nx*nx + ny*ny + nz*nz);
nx /= len;
ny /= len;
nz /= len;
// Light direction
let lx = -0.4;
let ly = -0.6;
let lz = 1;
let llen = Math.sqrt(lx*lx+ly*ly+lz*lz);
lx /= llen;
ly /= llen;
lz /= llen;
// Lambert lighting
let light = nx*lx + ny*ly + nz*lz;
light = Math.max(0, light);
// Ambient light
light = 0.25 + light*0.75;
let red = (((phi+p)*a)%32)/32*255*light;
let green = 255*light;
let blue = 80*light;
let dot = document.getElementById("ringa"+p);
if(dot){
dot.style.left = sx+"px";
dot.style.top = sy+"px";
dot.style.transform =
"translate(-50%,-50%) scale("+scale+")";
dot.style.color =
`rgb(${red},${green},${blue})`;
dot.style.opacity = 0.2 + scale*0.8;
}
p++;
}
}
requestAnimationFrame(ani);
}
ani();
// -------------------------------------
// Funebra Cannabis Leaf Contour Engine
// Corrected PNG-style Outline
// -------------------------------------
const leaflets = 7;
const contourPoints = 180;
const stemPoints = 120;
let a = 0;
const spd = 0.006;
function ani(){
a += spd;
let p = 0;
const angles = [-62, -42, -22, 0, 22, 42, 62];
for(let i=0; i<leaflets; i++){
let phi = angles[i] * Math.PI / 180;
let center = 1 - Math.abs(i - 3) / 3;
let length = 100 + center * 120;
let width = 16 + center * 28;
for(let edge=-1; edge<=1; edge+=2){
for(let r=0; r<contourPoints; r++){
let t = r / (contourPoints - 1);
// better leaf blade profile
let profile =
Math.sin(t * Math.PI) *
Math.pow(t, 0.30) *
Math.pow(1 - t, 0.18);
// serrated cannabis edge
let serration =
1 + 0.28 * Math.sin(t * Math.PI * 56);
let x = edge * width * profile * serration;
let y = -t * length;
// small symmetric living motion
x += edge * Math.sin(t * 20 + a * 3 + i) * 1.2;
let rx = x * Math.cos(phi) - y * Math.sin(phi);
let ry = x * Math.sin(phi) + y * Math.cos(phi);
let dot = document.getElementById("ringa"+p);
if(dot){
dot.style.left = 400 + rx + "px";
dot.style.top = 430 + ry + "px";
dot.style.transform =
"translate(-50%,-50%) scale(1.25)";
dot.style.color = eval(clor.value);
dot.innerHTML=eval(itext.value);
dot.style.opacity = 1;
dot.style.textShadow = "none";
}
p++;
}
}
// center vein
for(let r=0; r<contourPoints; r++){
let t = r / (contourPoints - 1);
let x = 0;
let y = -t * length;
let rx = x * Math.cos(phi) - y * Math.sin(phi);
let ry = x * Math.sin(phi) + y * Math.cos(phi);
let dot = document.getElementById("ringa"+p);
if(dot){
dot.style.left = 400 + rx + "px";
dot.style.top = 430 + ry + "px";
dot.style.transform =
"translate(-50%,-50%) scale(0.65)";
dot.style.color = eval(clor.value);
dot.innerHTML=eval(itext.value);
dot.style.opacity = 0.7;
}
p++;
}
}
// stem
for(let s=0; s<stemPoints; s++){
let t = s / (stemPoints - 1);
let bend = Math.sin(t * Math.PI) * 8;
let dot = document.getElementById("ringa"+p);
if(dot){
dot.style.left = 400 + bend + "px";
dot.style.top = 430 + t * 150 + "px";
dot.style.transform =
"translate(-50%,-50%) scale(1.35)";
dot.style.color = eval(clor.value);
dot.innerHTML=eval(itext.value);
dot.style.opacity = 1;
dot.style.textShadow = "none";
}
p++;
}
requestAnimationFrame(ani);
}
ani();
// -------------------------------------
// Funebra Heart Beat Wave Engine
// Mathematical ECG Point Cloud
// -------------------------------------
const points = 220;
const width = 760;
const baseY = 300;
let a = 0;
const spd = 0.012;
function ecgPulse(t){
// t should be 0..1 inside one heartbeat cycle
function gauss(x, mu, sigma, amp){
return amp * Math.exp(-Math.pow(x - mu, 2) / (2 * sigma * sigma));
}
let y = 0;
// P wave — small pre-beat bump
y += gauss(t, 0.18, 0.035, -18);
// Q dip
y += gauss(t, 0.36, 0.012, 28);
// R spike — main heartbeat
y += gauss(t, 0.40, 0.008, -115);
// S dip
y += gauss(t, 0.43, 0.014, 45);
// T wave — recovery wave
y += gauss(t, 0.65, 0.070, -32);
return y;
}
function ani(){
a += spd;
for(let p=0; p<points; p++){
//-----------------------------------
// Horizontal time position
//-----------------------------------
let x = p / (points - 1);
let sx = 20 + x * width;
//-----------------------------------
// Moving heartbeat cycle
//-----------------------------------
let cycles = 3.2;
let t = (x * cycles - a) % 1;
if(t < 0) t += 1;
//-----------------------------------
// ECG mathematical wave
//-----------------------------------
let y = ecgPulse(t);
//-----------------------------------
// Funebra living vibration
//-----------------------------------
let micro =
Math.sin(p * 0.45 + a * 40) * 1.2
+ Math.sin(p * 0.09 + a * 12) * 0.8;
let sy = baseY + y + micro;
//-----------------------------------
// Depth / glow effect
//-----------------------------------
let beatGlow = Math.max(0, -y / 115);
let scale = 1 + beatGlow * 1.8;
//-----------------------------------
// Color
//-----------------------------------
let red = 120 + beatGlow * 135;
let green = 20 + beatGlow * 60;
let blue = 30 + beatGlow * 50;
//-----------------------------------
// Draw point
//-----------------------------------
let dot = document.getElementById("ivoSmukker"+p);
if(dot){
dot.style.left = sx + "px";
dot.style.top = sy + "px";
dot.style.transform =
"translate(-50%,-50%) scale("+scale+")";
dot.style.color =
`rgb(${red},${green},${blue})`;
dot.style.opacity =
0.35 + beatGlow * 0.65;
dot.style.textShadow =
`0 0 ${4 + beatGlow * 18}px rgb(${red},${green},${blue})`;
}
}
requestAnimationFrame(ani);
}
ani();
|