// [11:41 ; ]

​

// Rayon de la sphere

let r = 200;

// densite de la sphere 

let density ;

let densitySlider ;

// On va creer des slider pour jouer sur le theta

let thetaMax, phiMax ;

let thetaMaxSlider, phiMaxSlider;

// Parametre de sphere spiraleuse

let spifreq, spifreq2 ;

let spifreqSlider, spifreq2Slider;

​

​

​

function setup() {

  createCanvas(700, 700, WEBGL); //3D mode

  angleMode(DEGREES); 

  colorMode(HSB); //Hue, Saturation, Brightness

  stroke(199, 88, 88);

  strokeWeight(3);

  noFill();

  // e1 signature

  // Creer Slider pour jouer sur Theta

  thetaMax = createDiv();

  thetaMaxSlider = createSlider(0, 360, 360, 10);

  // Associer la classe CSS pour definir le style du slider

  thetaMax.class("valueDisplay");

  thetaMaxSlider.class("Slider");

  // Creer Slider pour jouer sur Phi

  phiMax = createDiv();

  phiMaxSlider = createSlider(0, 180, 180, 10);

  // Associer la classe CSS pour definir le style du slider

  phiMax.class("valueDisplay");

  phiMaxSlider.class("Slider");

  // Ici on cree un controle de type Slider, qui permettra de jouer sur la densite de la forme

  density = createDiv();

  densitySlider = createSlider(3, 62, 24, 1); // min, max, defaut, stepSize

  // Associer la classe CSS pour definir le style du slider

  density.class("valueDisplay");

  densitySlider.class("Slider");

  // Ici on cree un controle de type Slider, qui permettra de jouer sur la spifeq de la forme

  spifreq = createDiv();

  spifreqSlider = createSlider(1, 10, 1, 0.01); // min, max, defaut, stepSize

  // Associer la classe CSS pour definir le style du slider

  spifreq.class("valueDisplay");

  spifreqSlider.class("Slider");

  // Ici on cree un controle de type Slider, qui permettra de jouer sur la spifeq2 de la forme

  spifreq2 = createDiv();

  spifreq2Slider = createSlider(1, 10, 1, 0.01); // min, max, defaut, stepSize

  // Associer la classe CSS pour definir le style du slider

  spifreq2.class("valueDisplay");

  spifreq2Slider.class("Slider");

}

​

function draw() {

  background(230, 50, 15);

  //Permet de controler la forme avec la souris + parametres de sensibilite

  orbitControl(4,4);

  // De base, la forme, en ligne a les poles alignes a l'horizontal, Il faut la faire tourner pour la mettre a la verticale

  rotateY(90);

  rotateZ(65);

  // normalSphere();

  // sphericalSpiral();

  // sphericalLissajous();

  BumpySphere();

  // e1 signature

  // afficher les slider d'angle

  thetaMax.html("Theta max value " + thetaMaxSlider.value());

  phiMax.html("Phi max value " + phiMaxSlider.value());

  // Afficher le density slider

  let displayDensity = int(map(densitySlider.value(),3, 62, 1, 60));

  density.html("Densite : "+displayDensity);

  // e2 signature

  // afficher les slider de frequence

  spifreq.html("Frequence max value " + spifreqSlider.value());

  spifreq2.html("Frequence 2 max value " + spifreq2Slider.value());

}

​

//----------------------------------------------------------

//e0 : Contient le code de la sphere vu dans l'etape 0

function normalSphere(){

  //Adapte la definition a la taille de la densite voulue

  // e1 signature

  // On ne fait pas des spheres completes, on permet de jouer sur l'angle

  for(let phi = 0 ; phi < phiMaxSlider.value() ; phi += 180/densitySlider.value()){

    beginShape();

    // Etape 1 : On peut mettre POINTS dans beginshape pour avoir des pointilles

    // Etape 0 : Creer une serie de point positionnee par rapport a un referentiel radial

    // e1 signature

    // On ne fait pas des spheres completes, on permet de jouer sur l'angle

    for (let theta = 0 ; theta < thetaMaxSlider.value() ; theta += 360/densitySlider.value()){

      let x = r * cos(phi) ;

      let y = r * sin(phi) * sin(theta);

      let z = r * sin(phi) * cos(theta); 

      // Etape 0 : point(x,y,z);

      // Etape 1 on met Vertex () et on ajouter les beginShape+endshape pour definit l'objet graphique

      vertex(x, y , z);

    }

    // Etape 2 : On met CLOSE pour avoir des lignes fermees

    endShape(CLOSE);

  } 

}

​

​

//----------------------------------------------------------

//e1 : La sphere formee d'une spirale

function sphericalSpiral(){

  beginShape();

  for (let theta = 0 ; theta < thetaMaxSlider.value()/2 ; theta += 0.1)

  {

    let x = r * cos(theta) ;

    let y = r * sin(theta) * sin(theta * densitySlider.value());

    let z = r * sin(theta) * cos(theta * densitySlider.value()); 

    vertex(x, y , z);

  }

  endShape(LINES);

}

​

​

//----------------------------------------------------------

//e2 : combiner les spheres

function sphericalLissajous(){

  beginShape();

  for (let theta = 0 ; theta < 360 ; theta += 0.1)

  {

    let x = r * cos(theta*spifreqSlider.value()) ;

    let y = r * sin(theta*spifreqSlider.value()) * sin(theta*spifreq2Slider.value());

    let z = r * sin(theta*spifreqSlider.value()) * cos(theta*spifreq2Slider.value()); 

    vertex(x, y , z);

  }

  endShape(LINES);

}

​

//----------------------------------------------------------

//e3 : BumpySphere

function BumpySphere(){

  //Adapte la definition a la taille de la densite voulue

  // e1 signature

  // On ne fait pas des spheres completes, on permet de jouer sur l'angle

  for(let phi = 0 ; phi < phiMaxSlider.value() ; phi += 2){

    beginShape(POINTS);

    // Etape 1 : On peut mettre POINTS dans beginshape pour avoir des pointilles

    // Etape 0 : Creer une serie de point positionnee par rapport a un referentiel radial

    // e1 signature

    // On ne fait pas des spheres completes, on permet de jouer sur l'angle

    for (let theta = 0 ; theta < thetaMaxSlider.value() ; theta += 2){

      // = r * (1 + z * sin(theta*y) * sin(phi*x) ) * sin(phi) * sin(theta);

      // 1 c'est le rayon de la sphere

      // z : Coeficient de "bumpyness" par rapport au rayon de la sphere

      // Si on eleve (1+z), la sphere n'a pas de consistence. propre, en dehors des arcs que creent les autres coefficient

      // sin(theta*y) definit le nombre de branches, y, de l'etoile qu'on voit en regardant le forme par un pole

      // sin(phi*x) definit la frequence des bosses. Une ligne suivant le perimetre et rejoignant les deux poles comptera un nombre de bosses equivalent a x.

      // si y et x valent 1 : on a une sphere ! Aucun des axes n'a d'ondulation

      // let x = r * (1 + 0.2 * sin(theta*6) * sin(phi*1) ) * sin(phi) * sin(theta);

      // let z = r * (1 + 0.2 * sin(theta*6) * sin(phi*1) ) * cos(phi) ;

      // let y = r * (1 + 0.2 * sin(theta*6) * sin(phi*1) ) * sin(phi) * cos(theta); 

​

      // Si tu veux faire une rose des vents :

      // let x = 0 * (sin(theta*6) * sin(phi*5) ) * sin(phi) * sin(theta);

      // let z = r * (sin(theta*6) * sin(phi*5) ) * cos(phi) ;

      // let y = r * (sin(theta*6) * sin(phi*5) ) * sin(phi) * cos(theta); 

      //L'univers qui s'ouvre

      // let x = r * (1 + 0.2 * sin(theta*6) * sin(phi*5) ) * tan(phi) ;

      // let z = r * (1 + 0.2 * sin(theta*6) * sin(phi*5) ) * tan(phi)  * sin(theta);

      // let y = r * (1 + 0.2 * sin(theta*6) * sin(phi*5) ) * tan(phi) * cos(theta); 

      // Deux hadoken

      // let x = r * (1 + 0.2 * sin(theta*6) * sin(phi*5) ) * tan(phi) ;

      // let z = r * (1 + 0.2 * sin(theta*6) * sin(phi*5) ) * sin(phi)  * sin(theta);

      // let y = r * (1 + 0.2 * sin(theta*6) * sin(phi*5) ) * sin(phi) * cos(theta); 

      // 1 Hadoken a phi max 90 (phi = 0, c'est la tete)

      // Transform tes Hadoken en montagnes

      let x = r * (1 + 0.2 * sin(theta*6) * sin(phi*5) ) * tan(phi) ;

      let z = r * (1 + 0.2 * sin(theta*6) * sin(phi*5) ) * tan(phi)  * sin(theta);

      let y = r * (1 + 0.2 * sin(theta*6) * sin(phi*5) ) * sin(phi) * cos(theta); 

​

      // Etape 0 : point(x,y,z);

      // Etape 1 on met Vertex () et on ajouter les beginShape+endshape pour definit l'objet graphique

      vertex(x, y , z);

    }

    // Etape 2 : On met CLOSE pour avoir des lignes fermees

    endShape(CLOSE);

  } 

}