How to embed processing sketch to squarespace website?

edited February 2018 in JavaScript Mode

Hi, I'm trying to add a processing sketch to my squarespace website but I can't manage to do it. I have also tried to convert it to p5 but also could not do it.

Here is the sketch:

int Nmax = 1000 ; float M = 50 ; float H = 0.99 ; float HH = 0.01 ;

float X[] = new float[Nmax+1] ; float Y[] = new float[Nmax+1] ; float Z[] = new float[Nmax+1] ; float V[] = new float[Nmax+1] ; float dV[] = new float[Nmax+1] ; float L ; float R = 2sqrt((4PI(200200)/Nmax)/(2*sqrt(3))) ; float Lmin ; int N ; int NN ; float KX ; float KY ; float KZ ; float KV ; float KdV ; int K ;

void setup(){ PFont font; font = createFont("Kenzo Regular.otf",120); textFont(font); size(600,600) ; background(0) ; noSmooth() ; stroke(255,255,255) ; fill(50,50,50) ;

for ( N = 0 ; N <= Nmax ; N++ ){ X[N] = random(-300,+300) ; Y[N] = random(-300,+300) ; Z[N] = random(-300,+300) ; } }

void draw(){

background(0) ; for ( N = 0 ; N <= Nmax ; N++ ){ for ( NN = N+1 ; NN <= Nmax ; NN++ ){ L = sqrt(((X[N]-X[NN])(X[N]-X[NN]))+((Y[N]-Y[NN])(Y[N]-Y[NN]))) ; L = sqrt(((Z[N]-Z[NN])(Z[N]-Z[NN]))+(LL)) ; if ( L < R ){ X[N] = X[N] - ((X[NN]-X[N])((R-L)/(2L))) ; Y[N] = Y[N] - ((Y[NN]-Y[N])((R-L)/(2L))) ; Z[N] = Z[N] - ((Z[NN]-Z[N])((R-L)/(2L))) ; X[NN] = X[NN] + ((X[NN]-X[N])((R-L)/(2L))) ; Y[NN] = Y[NN] + ((Y[NN]-Y[N])((R-L)/(2L))) ; Z[NN] = Z[NN] + ((Z[NN]-Z[N])((R-L)/(2L))) ; dV[N] = dV[N] + ((V[NN]-V[N])/M) ; dV[NN] = dV[NN] - ((V[NN]-V[N])/M) ; stroke(125+(Z[N]/2),125+(Z[N]/2),125+(Z[N]/2)) ; line(X[N]1.2(200+V[N])/200+300,Y[N]1.2(200+V[N])/200+300,X[NN]1.2(200+V[NN])/200+300,Y[NN]1.2(200+V[NN])/200+300) ; } if ( Z[N] > Z[NN] ){ KX = X[N] ; KY = Y[N] ; KZ = Z[N] ; KV = V[N] ; KdV = dV[N] ; X[N] = X[NN] ; Y[N] = Y[NN] ; Z[N] = Z[NN] ; V[N] = V[NN] ; dV[N] = dV[NN] ;
X[NN] = KX ; Y[NN] = KY ; Z[NN] = KZ ; V[NN] = KV ; dV[NN] = KdV ; } } L = sqrt((X[N]X[N])+(Y[N]Y[N])) ; L = sqrt((Z[N]Z[N])+(LL)) ; X[N] = X[N] + (X[N](200-L)/(2L)) ; Y[N] = Y[N] + (Y[N](200-L)/(2L)) ; Z[N] = Z[N] + (Z[N](200-L)/(2L)) ; KZ = Z[N] ; KX = X[N] ; Z[N] = (KZcos(float(300-mouseX)/10000))-(KXsin(float(300-mouseX)/10000)) ; X[N] = (KZsin(float(300-mouseX)/10000))+(KXcos(float(300-mouseX)/10000)) ; KZ = Z[N] ; KY = Y[N] ; Z[N] = (KZcos(float(300-mouseY)/10000))-(KYsin(float(300-mouseY)/10000)) ; Y[N] = (KZsin(float(300-mouseY)/10000))+(KYcos(float(300-mouseY)/10000)) ; dV[N] = dV[N] - (V[N]*HH) ; V[N] = V[N] + dV[N] ; dV[N] = dV[N] * H ; } textSize(140); text("N I I N", 160, 330); fill(190);
}

void mousePressed(){

Lmin = 600 ; NN = 0 ; for ( N = 0 ; N <= Nmax ; N++ ){ L = sqrt(((mouseX-(300+X[N]))(mouseX-(300+X[N])))+((mouseY-(300+Y[N]))(mouseY-(300+Y[N])))) ; if ( Z[N] > 0 && L < Lmin ){ NN = N ; Lmin = L ; } } if ( K == 0 ){ dV[NN] = -200 ; K = 1 ; } else{ dV[NN] = +200 ; K = 0 ; }

}

and my p5 version:

var Nmax = 1000 ; var M = 50 ; var H = 0.99 ; var HH = 0.01 ;

var X = new Array(Nmax+1) ; var Y = new Array(Nmax+1) ; var Z = new Array(Nmax+1); var V = new Array(Nmax+1) ; var dV = new Array(Nmax+1) ; var L ; var R = 6.9547094149393337071705489656828 ; var Lmin = 0 ; var N = 0 ; var NN = 0; var KX = 0; var KY = 0 ; var KZ = 0 ; var KV = 0 ; var KdV = 0 ; var K = 0;

function setup(){ //PFont font; //font = createFont("Kenzo Regular.otf",120); //textFont(font); createCanvas(600,600) ; background(0) ; noSmooth() ; stroke(255,255,255) ; fill(50,50,50) ;

for ( N = 0 ; N <= Nmax ; N++ ){ X[N] = random(-300,+300) ; Y[N] = random(-300,+300) ; Z[N] = random(-300,+300) ; } }

function draw(){

background(0) ; // // 2-) BURAYA YAPIŞTIR // for ( N = 0 ; N <= Nmax ; N++ ){ for ( NN = N+1 ; NN <= Nmax ; NN++ ){ L = sqrt(((X[N]-X[NN])(X[N]-X[NN]))+((Y[N]-Y[NN])(Y[N]-Y[NN]))) ; L = sqrt(((Z[N]-Z[NN])(Z[N]-Z[NN]))+(LL)) ; if ( L < R ){ X[N] = X[N] - ((X[NN]-X[N])((R-L)/(2L))) ; Y[N] = Y[N] - ((Y[NN]-Y[N])((R-L)/(2L))) ; Z[N] = Z[N] - ((Z[NN]-Z[N])((R-L)/(2L))) ; X[NN] = X[NN] + ((X[NN]-X[N])((R-L)/(2L))) ; Y[NN] = Y[NN] + ((Y[NN]-Y[N])((R-L)/(2L))) ; Z[NN] = Z[NN] + ((Z[NN]-Z[N])((R-L)/(2L))) ; dV[N] = dV[N] + ((V[NN]-V[N])/M) ; dV[NN] = dV[NN] - ((V[NN]-V[N])/M) ; stroke(125+(Z[N]/2),125+(Z[N]/2),125+(Z[N]/2)) ; line(X[N]1.2(200+V[N])/200+300,Y[N]1.2(200+V[N])/200+300,X[NN]1.2(200+V[NN])/200+300,Y[NN]1.2(200+V[NN])/200+300) ; } if ( Z[N] > Z[NN] ){ KX = X[N] ; KY = Y[N] ; KZ = Z[N] ; KV = V[N] ; KdV = dV[N] ; X[N] = X[NN] ; Y[N] = Y[NN] ; Z[N] = Z[NN] ; V[N] = V[NN] ; dV[N] = dV[NN] ;
X[NN] = KX ; Y[NN] = KY ; Z[NN] = KZ ; V[NN] = KV ; dV[NN] = KdV ; } } L = sqrt((X[N]X[N])+(Y[N]Y[N])) ; L = sqrt((Z[N]Z[N])+(LL)) ; X[N] = X[N] + (X[N](200-L)/(2L)) ; Y[N] = Y[N] + (Y[N](200-L)/(2L)) ; Z[N] = Z[N] + (Z[N](200-L)/(2L)) ; KZ = Z[N] ; KX = X[N] ; Z[N] = (KZcos(float(300-mouseX)/10000))-(KXsin(float(300-mouseX)/10000)) ; X[N] = (KZsin(float(300-mouseX)/10000))+(KXcos(float(300-mouseX)/10000)) ; KZ = Z[N] ; KY = Y[N] ; Z[N] = (KZcos(float(300-mouseY)/10000))-(KYsin(float(300-mouseY)/10000)) ; Y[N] = (KZsin(float(300-mouseY)/10000))+(KYcos(float(300-mouseY)/10000)) ; dV[N] = dV[N] - (V[N]*HH) ; V[N] = V[N] + dV[N] ; dV[N] = dV[N] * H ; } //textSize(140); // //text("N I I N", 160, 330); // 1-) BU 3 SATIRI YUKARDA İŞARETLİ OLAN YERE KES-YAPIŞTIR EĞER YAZININ SPHERE İÇİNE GİRMESİNİ İSTİYOSAN //fill(190); // }

function touchStarted(){

Lmin = 600 ; NN = 0 ; for ( N = 0 ; N <= Nmax ; N++ ){ L = sqrt(((mouseX-(300+X[N]))(mouseX-(300+X[N])))+((mouseY-(300+Y[N]))(mouseY-(300+Y[N])))) ; if ( Z[N] > 0 && L < Lmin ){ NN = N ; Lmin = L ; } } if ( K == 0 ){ dV[NN] = -200 ; K = 1 ; } else{ dV[NN] = +200 ; K = 0 ; }

}

Answers

Sign In or Register to comment.