pompomatic 3000.pde

/*
  Pompomatic 3000 version 1.0
  Natalie Freed, September 10, 2014: initial version including outer slider, percent slider, export button, and on-screen pompom maker preview.
  _____________, __________________: ________________________________________________________________________________.
  
  To add yourself as a contributor, please add your name, the date, and a description of your changes/additions.
  
  Inspired by and created for Becca Rose Glowacki's "Pompomology" project, a series of 
  custom lasercut pompom-makers in different sizes and inner/outer ratios created for 
  purposes of data collection on various aspects of the pompom production process.  
  
  Feature requests:

    * additional parameters with sliders requested by the Pompomology project: yarn thickness, time to make (minutes), 
      diameter of resulting pompom, weight of pompom, volume of pompom, density of pompom, number of yarn rotations around
      pompom maker, length of yarn needed.
    * labels displaying parameters to be engraved on pompom maker (eg. size).
    * display sizes in inches or mm.
    * toggle between inches and mm.
    * more visually appealing user interface design / layout
    * pompom preview: show a rendering of the expected pompom for a particular set of parameters.
      Possible inspiration: http://www.openprocessing.org/sketch/12399
*/

import controlP5.*;
import processing.pdf.*;

ControlP5 cp5;

int canvasWidth = 1000;
int canvasHeight = 600;

float outer_diameter = 200.0; //starting value for pompom maker diameter
float innerPercentOfOuter = 0.5; //starting value for the inner diameter's percentage of the outer diameter

void setup()
{
  size(canvasWidth, canvasHeight);
  
  //create a ControlP5 object to draw sliders and buttons
  cp5 = new ControlP5(this);
  
  //call the function that adds the buttons and sliders (at the bottom)
  addButtonsAndSliders();
}

void draw()
{
  background(200);
  drawPompom();
}

void drawPompom()
{
  ellipse(width/2-100, height/2, outer_diameter, outer_diameter);
  ellipse(width/2-100, height/2, outer_diameter*innerPercentOfOuter, outer_diameter*innerPercentOfOuter);
}

//this function is automatically called whenever the slider with the same name ("diameterSlider") is moved
void diameterSlider(int val)
{
  outer_diameter = val;
}

//this function is automatically called whenever the slider with the same name ("percentSlider") is moved
void percentSlider(float val)
{
  innerPercentOfOuter = val;
}

//this function is automatically called whenever the button with the same name ("exportButton") is pressed
void exportButton()
{
  beginRecord(PDF, "pompom with outer diameter " + outer_diameter + " px and inner " + innerPercentOfOuter * 100 + " percent of outer.pdf"); 
  drawPompom();
  endRecord();
}

//add buttons and sliders to the ControlP5 object, which takes care of automatically calling their corresponding functions.
void addButtonsAndSliders()
{
  //position and size for export button
  //since they are declared inside a function, these variables are not global, 
  //but exist only where they are needed, inside the 
  int buttonWidth = 150; 
  int buttonHeight = 50;
  int buttonX = canvasWidth - buttonWidth - 20;
  int buttonY = canvasHeight - buttonHeight - 20;
  
  //add the export button (note that the name in quotes is the same as the name of the exportButton function, linking the two together).
  cp5.addButton("exportButton")
    .setBroadcast(false)
    .setPosition(buttonX, buttonY)
    .setSize(buttonWidth, buttonHeight)
    .setLabel("Export PDF (cut file)")
    .setBroadcast(true)
    .getCaptionLabel().setFont(createFont("Arial", 14)).toUpperCase(false).align(CENTER, CENTER)
    ;
  
  //add the outer diameter slider
  cp5.addSlider("diameterSlider")
     .setBroadcast(false)
     .setPosition(width-250, 20)
     .setSize(15, 400)
     .setRange(0, 550)
     .setValue(outer_diameter)
     .setLabel("Outer diameter in pixels")
     .setSliderMode(Slider.FLEXIBLE)
     .setBroadcast(true)
     .getCaptionLabel().align(ControlP5.LEFT, ControlP5.BOTTOM_OUTSIDE).setPaddingX(0).setFont(createFont("Arial", 12)).toUpperCase(false).setColor(0)
     ;   
     
   //add the percent slider
   cp5.addSlider("percentSlider")
     .setBroadcast(false)
     .setPosition(width-150, 20)
     .setSize(15, 400)
     .setRange(0.0, 1.0)
     .setValue(innerPercentOfOuter)
     .setLabel("Inner as percent of outer")
     .setSliderMode(Slider.FLEXIBLE)
     .setBroadcast(true)
     .getCaptionLabel().align(ControlP5.LEFT, ControlP5.BOTTOM_OUTSIDE).setPaddingY(20).setFont(createFont("Arial", 12)).toUpperCase(false).setColor(0)
     ;   
}