// see project The PI Game here: 

// http://kll.engineering-news.org/kllfusion01/articles.php?article_id=156

// what is a processing sketch

// step 1     try to copy the starwars theme to P5.js

//            not work WEBGL / rotateX / text

// step 2     new buttons and text input field

//            butoon work, text input field only when in setup ( and not draw )

// step 3     try sticks class in p5.js

​

var ang = 0.7854; //PI/4; ?? WHY PI not work here ?

//PFont font;

var y0 = 400.0;

var y = y0;

var z = -200.0;

var x = 500; //400.0;

var linesp = 50.0;

var lines;

var step=1, play=0, hits = 0, sticks = 22;

var sumsticks = 0.0, sumhits = 0.0, now = 0.0, avg = 0.0;

var story = [];

var a=0;

var b=10;

var fontsize = 40;

//________________________________________ OPERATION

var button1,button2,inputsticks,button3;

​

​

//________________________________________ AUTO

var auto=false;

var tnow,tlast,tdelta=1000;                                                 // if auto throw every second

​

​

var match_stick_length = 50.0; 

var linesY = [0.0,0.0,0.0,0.0,0.0,0.0];

var match_sticks = [];

​

// class to p5.js function

function match_stick(x1,y1,x2,y2,rot,hit) {

        this.tx1 = x1; 

        this.ty1 = y1;

        this.tx2 = x2;

        this.ty2 = y2;

        this.trot = rot;

        this.thit = hit;

  this.display = function() {

   if ( hit ) { stroke(255,0,0); } else { stroke(100,100,100); }            // if cross line use RED

   strokeWeight(6);

   line(x1,y1,x2,y2);

   // print("x1 ",x1); print("y1 ",y1); print("x2 ",x2); print("y2 ",y2);

   }

}

​

​

​

//_________________________________________________________ 

function story_setup() {

  //chapter 1 / 0 .. 10

  //story = new StringList();

  append(story, 'let_Us_play_here_And_now:');

  append(story, "The_PI_Game");

  append(story, " ");

  append(story, "A_long_Time_Ago,");

  append(story, "In_a_Galaxy_far_far_away");

  append(story, " ");

  append(story, "Princess_CoSinus_wanted_to");

  append(story, "create_a_match_stick_Game");

  append(story, "to_honor_her_Papa,");

  append(story, "the_mighty_Emperor");

  append(story, "OverLord_PI ");

  //chapter 2 / 11 .. 14

  append(story, "SHE_used_a_white_sheet_of_paper");

  append(story, "and_draw_Parallel_lines ");

  append(story, "at_a_distance_of_2_match_sticks");

  //chapter 3 / 14 .. 26

  append(story, "so,_how_to_play?");

  append(story, " ");

  append(story, "use_N_match_sticks,");

  append(story, "hold_Them_over_the_paper");

  append(story, "and_let_Them_fall_down_on_it");

  append(story, " ");

  append(story, "now_count_how_many_of_Them");

  append(story, "do_cross_a_Line");

  append(story, " ");

  append(story, "repeat_that_...");

  append(story, "and_average_the_results");

  append(story, " ");

  append(story, "PI_is_about_sticks_/_hits");

​

  append(story, " ");

​

  //  font = loadFont("Verdana-Bold-48.vlw");

  //  textFont(font, 40);

  //  textMode(MODEL);

  textSize(fontsize);

  textFont('Georgia');

}

​

//_________________________________________________________

function draw_chapter(a, b) {

  //  rotateX(ang); //does not work in p5.js, even with WEBGL

  fill(255, 255, 0);

  stroke(0);

  strokeWeight(5);

  //  directionalLight(250, 207, 63, 0, -200, -200);

  textAlign(CENTER); 

  textSize(fontsize);

  lines =  0;

  for (var i=a; i <= b; i++) {

    //    textSize(fontsize + line);

    text(story[i], x, y+lines*linesp, z);

    lines++;

  }

  y--;

}

​

​

function buttons() {

  button1 = createButton('next');

  button1.position(730, 580);

  button1.mousePressed(b1pressed);

//if ( step == 5 ) { 

    inputsticks = createInput(sticks);

    inputsticks.position(20,580);//(690, 580);

    inputsticks.changed(b2pressed);

    button2 = createButton('submit');

    button2.position(200, 580);

    button2.mousePressed(b2pressed);

​

    button3 = createButton('auto');

    button3.position(635, 580);

    button3.mousePressed(b3pressed);

//}

}

​

function b1pressed() {

  if ( step < 5 ) { step++; y=y0;}

  if ( step == 5 ) { update_match_sticks(); }

  print("b1 step: "+step);

}

​

function b2pressed() {

  sticks = inputsticks.value();

  init_match_sticks();

  play = 0; sumsticks=0; sumhits=0; avg=0; now=0;  // RESET

  print("b2 sticks: "+sticks);

}

​

function b3pressed() {

 auto = !auto;

 print("b3 auto : "+auto);

}

​

​

​

//_________________________________________________________

function draw_plane(dofill) {

  stroke(255, 255, 255); 

  strokeWeight(1); 

  if (dofill == 1) { 

   fill(255, 255, 255);

  } else { 

    noFill();

  }

  rect(20, 20, width-40, height-40);

  stroke(50,50,0); 

  strokeWeight(2);

  for ( var i=1;i<6;i++){  line(30,linesY[i],width-30,linesY[i]); } 

}

​

//_________________________________________________________

function show_test_sticks() {

  var x1, x2, y1, y2;

  stroke(100, 100, 100);

  strokeWeight(6);

  for (var i = 1; i < 5; i = i+1) {

    x1 = 40+i*10; 

    y1 = linesY[i]; 

    x2 = 40+i*10; 

    y2 = linesY[i]+match_stick_length;

    line(x1, y1, x2, y2);  

    x1 = 45+i*10; 

    y1 = linesY[i]+match_stick_length; 

    x2 = 45+i*10; 

    y2 = linesY[i+1];

    line(x1, y1, x2, y2);

  }

}

​

//_________________________________________________________

function check_auto() {

  if (auto) { 

  tnow=millis();

  if ( tnow - tlast > tdelta ) { 

     tlast = tnow;

     update_match_sticks(); 

    }

   } 

}  

​

//_________________________________________________________ 

function init_match_sticks() {

 for (var i = 0; i < sticks; i = i+1) {   match_sticks[i] = new match_stick(0,0,0,0,0,false); } 

 for (var k = 0; k < 6; k = k+1)      {   linesY[k] = k * match_stick_length * 2.0 ;  }  

}

​

//_________________________________________________________ 

function update_match_sticks() {

play++;

  for (var i = 0; i < sticks; i = i+1) { 

    match_sticks[i].x1  = random(match_stick_length+20,width-match_stick_length-20);

    match_sticks[i].y1  = random(match_stick_length+20,height-match_stick_length-20);

    match_sticks[i].rot = random(TWO_PI);

    match_sticks[i].x2  = match_sticks[i].x1 + match_stick_length * sin(match_sticks[i].rot);

    match_sticks[i].y2  = match_sticks[i].y1 + match_stick_length * cos(match_sticks[i].rot);

    match_sticks[i].hit = false; 

    for (var k = 1; k < 6; k = k+1) {

      if ((match_sticks[i].y1 > match_sticks[i].y2) && (match_sticks[i].y2 <= linesY[k]) && (match_sticks[i].y1 >= linesY[k])) { match_sticks[i].hit = true; } 

      if ((match_sticks[i].y1 < match_sticks[i].y2) && (match_sticks[i].y1 <= linesY[k]) && (match_sticks[i].y2 >= linesY[k])) { match_sticks[i].hit = true; } 

      }

   }

   hits = 0;

   for (var j = 0; j < sticks; j = j+1) {  if (match_sticks[j].hit) { hits++; } }

   sumhits += float(hits);

   sumsticks += float(sticks);

   if (sumhits > 0 ) {   avg = sumsticks/sumhits; }

   //print("sumsticks ",sumsticks);

   //print("sumhits ",sumhits);

   if (hits > 0 )    {   now = float(sticks)/float(hits);    } else { now = 0; }

​

}

​

//_________________________________________________________ 

function show_match_sticks(){

  var ty=15;

  strokeWeight(6);

  for (var i = 0; i < sticks; i = i+1) {  

       if ( match_sticks[i].hit ) { stroke(255,0,0); } else { stroke(100,100,100); }            // if cross line use RED

       line(match_sticks[i].x1,match_sticks[i].y1,match_sticks[i].x2,match_sticks[i].y2);

​

  //  match_sticks[i].display(); 

  }

​

  stroke(0,0,80); textAlign(LEFT); textSize(14);  textFont('Times');

  text(" throw: ",20,ty); text(play,   80,ty);

  text(" hits: ",110,ty); text(hits,  150,ty);

  text(" of ",   180,ty); text(sticks,210,ty);

  text(" this ", 240,ty); text(nf(now,1,5),280,ty);

  text(" avg: " ,350,ty); text(nf(avg,1,5),400,ty);

}

​

//_________________________________________________________ 

function setup() {

  //  createCanvas(800, 600, WEBGL);

  createCanvas(800, 600);

  story_setup();

  background(0, 0, 80);

  init_match_sticks();

  tnow=millis();  tlast=millis();  // init for auto

  buttons();

}

​

//_________________________________________________________ 

function draw() {

  background(0, 0, 80);

​

  if ( step == 1 ) {  draw_chapter(0, 10);  }

  if ( step == 2 ) {  draw_chapter(11, 13); }

  if ( step == 3 ) {  draw_plane(1); show_test_sticks(); } //

  if ( step == 4 ) {  draw_plane(0); draw_chapter(14, 26); }

  if ( step == 5 ) {  draw_plane(1); 

                      if (play > 0) { show_match_sticks(); check_auto(); } }

}