Revisiting Flight404 Particles

In February 2008, Robert Hodgin published a series of Particle System examples that demonstrated many of the techniques behind his amazing work (i.e.: Magnetosphere). The examples, however, use some advanced GL calls (accessing JOGL directly) and no longer work in Processing 1.0. I would say a student comes to ask me about updating these examples several times a semester and I usually respond by pretending I know what I’m talking about and pointing the student some vague openGL direction. It’s time for me to bit the bullet and figure this out myself.

Step 1 is simply to recreate the examples using Processing’s core drawing functions sans fancy GL. Now, they run a great deal slower than Robert’s original examples because they are no longer using display lists.

Check out the source or download flight404.zip.

Step 2 is to use the wonderful AndrĂ©s Colubri‘s GLGraphics library to optimize for performance. Stay tuned.

UPDATE: Step 1a is to create OPENGL textures directly like so:

particleTex = TextureIO.newTexture(new File(dataPath("particle.png")), true);

(Thanks to Jeff Gentes and Ben Hosken for chiming in)

Asteroids Spaceship

One of the “trignometry + forces” exercises from my upcoming Nature of Code book is to implement in Processing the spaceship from asteroids. Here’s a solution!

Source: _03_asteroids.zip

Nature of Code book: PVector Spring example

I’m working this week on Chapter 3 of my upcoming Nature of Code book. For the most part, if you are looking to connect particles with springs, I recommend the wonderful verlet physics of toxiclibs, and I have some examples for that here. Nevertheless, I am including an elementary implementation of a single “bob” connected to an “anchor” point via a “spring” force. The example implements Hooke’s Law (Spring Force = -k * displacement) with the PVector class, using the Euler integration model of all my other examples. Here it is below.

Source: _03spring.zip

Rotate a Vector (Processing.js!)

The question of how to rotate a PVector object (the data of the vector itself, I’m not talking about rotating while drawing) came up in my nature of code course yesterday. To do this, you’ll need to convert the vector to polar coordinates (radius + angle), adjust the angle, and the convert it back to cartesian to solve for the components (x and y). A function would look something like:

// Rotate a vector in 2D
void rotate2D(PVector v, float theta) {
  // What's the magnitude?
  float m = v.mag();
  // What's the angle?
  float a = v.heading2D();
 
  // Change the angle
  a += theta;
 
  // Polar to cartesian for the new xy components
  v.x = m * cos(a);
  v.y = m * sin(a);
}

(Update thanks to Vilhelm’s comment below: You can also use a 2D rotation matrix!)

void rotate2D(PVector v, float theta) {
  float xTemp = v.x;
  v.x = v.x*cos(theta) - v.y*sin(theta);
  v.y = xTemp*sin(theta) + v.y*cos(theta);
}

Now, this is really just a ruse. A big excuse for me to figure out how to get a Processing example in a wordpress post using processing.js! I was able to do this fairly quickly with three quick steps:

1) Download processing.js 1.0.
2) Install wordpress processing.js plug-in.
3) Update the plug-in to use processing.js 1.0 (it hasn’t been yet). Follow these instructions.

And here it is!

And now the source:

// Rotate2D function
// Daniel Shiffman
 
void setup() {
  size(200,200);
  smooth();
}
 
void draw() {
  background(100);
  PVector xaxis = new PVector(75,0);
  float theta = map(mouseX,0,width,0,TWO_PI);
  rotate2D(xaxis,theta);
  drawVector(xaxis,width/2,height/2,1.0);
}
 
// Rotate a vector in 2D
void rotate2D(PVector v, float theta) {
  // What's the magnitude?
  float m = v.mag();
  // What's the angle?
  float a = v.heading2D();
 
  // Change the angle
  a += theta;
 
  // Polar to cartesian for the new xy components
  v.x = m * cos(a);
  v.y = m * sin(a);
}
 
// Renders a vector object 'v' as an arrow at a location xy
void drawVector(PVector v, float x, float y, float scayl) {
  pushMatrix();
  float arrowsize = 4;
  // Translate to location to render vector
  translate(x,y);
  stroke(255);
  // Vector heading to get direction (pointing up is a heading of 0)
  rotate(v.heading2D());
  // Scale it to be bigger or smaller if necessary
  float len = v.mag()*scayl;
  // Draw three lines to make an arrow
  line(0,0,len,0);
  line(len,0,len-arrowsize,+arrowsize/2);
  line(len,0,len-arrowsize,-arrowsize/2);
  popMatrix();
}

The Economics of Self-Publishing via Kickstarter (so far)

Ever since I launched the Nature of Code kickstarter page I’ve been getting a ton of questions about the economics of this book project. Though I hate to take any precious moments away from the actual writing of the book, I thought I’d take some time to lay out some thoughts. This is all an experiment, and one that I hope will help future authors with evaluating the pros and cons of self-publishing. So in the interest of transparency here is where I sit at the moment. Admittedly I’m flying by the seat of my pants.

Originally I had planned to raise approximately $5,000. My thought was as follows. I want to hire an editor (done! the wonderful Shannon Hunt). I want to hire a designer. I want to hire an illustrator. I want to hire some technical reviewers. I haven’t worked out the exact costs, but I was planning on spending somewhere between one and three thousand dollars on each of the above, depending on the scope of work, etc. I had always planned to fork out some cash out of pocket, but figured kickstarter would ease the burden. Let’s just say, as a rough wild guess estimate, I’m going to spend $6,000 on any labor associated with production (editing, design, technical review, proofreading, etc.) Come to think of it, that might be a bit low, but that’s the number I’m sticking with for now.

Next, there’s the matter of printing the book itself. I haven’t sorted this out either, but I’m planning on using a print-on-demand service (such as lulu). Let’s say the book ends up around 350 pages and costs $15 to print each copy (might be less, might be more, depending on quality, etc.). As of this writing I have 283 pre-orders on kickstarter for the print book. That’s $4,245. Then I’ll probably want to send out some free copies, review copies for teachers, review copies for bloggers, press, etc. Let’s say I send out 50 free copies. There’s another $750. Oh right, and shipping and handling. Let’s say it’s $3 per book. (Once the book is out, shipping and handling will be passed onto the customer, but I’ll be handling it for all kickstarter “pre-orders”.) So another $999 for shipping.

So now (with some rounding) we have $6,000 (fees + labor) + $5,000 (first round of printing) + $1,000 (shipping). A total of $12,000.

Kickstarter money to date: $12,167.

Total profit: $167

(Note I’ve ignored some important details like Kickstarter’s 5%, but this is close enough).

Here’s the thing. That might not seem so great. But it is. It’s fantastic. It’s amazing. What it means for me is that I’ve written a book (and published it). It also means that I own (exclusively) all of the content in the book. It means that if I continue to sell the book as a PDF, I keep 100% of the price (minus any transaction fees). Let’s take my first book Learning Processing, published by MKP/Elsevier. I think for a kindle version, I barely end up with a dollar (I need to check this, maybe it’s more like 2, but in any case, it’s something quite small).

Regarding print copies, with Learning Processing (which retails at the somewhat ridiculous price of $50), I receive approximately $3 per copy sold (very rough estimate). This self-published book could theoretically reach the customer for $25 (half the price!) and I would receive ~$10 for that copy.

And if I want to put all the content online for free as tutorials, I can.

So, this is where I stand as far as today. Really though, what I care about the most is just writing the darn thing. So back to that.

How to Build OpenCV Static Libraries Mac OS X (10.5 compatible!)

ITP student Patrick Hebron and I have been working on a new Processing video library built on top of OpenCV (with the goal of no vdig on windows and better movie playback support all around.) This is all a bit obscure, but it was such a struggle to build stand-alone static libraries for OpenCV on Mac OS X (backwards compatible to 10.5) that we could link to via JNI that I thought I would document the process in case this comes up for anyone else in the future.

First of all, what is a static library and why should I care?

Some reading: http://en.wikipedia.org/wiki/Library_(computing)

Let’s say you are familiar with mac ports or homebrew or you’ve read some cryptic instructions online about how to download an open source project from a repository and built it via the command line. Most likely, you built that project and installed some files to usr/lib or opt/local/lib, etc. Most likely these files were “dynamic” or “shared” library files, meaning they can be used by various applications on your computer. This is a good thing and saves you from having multiple copies of libraries, one for each application that uses say, openCV or FFMPEG or something like that.

A static library is the opposite and cannot be shared. It is a library that is used for building a target application and essentially becomes embedded into that application. If you are an openFrameworks or Cinder user, you may have encountered static libraries. They are the .a files that are referenced by your xcode project. For example:

In the case of building a Processing library (or compiling an OF or Cinder application), we’re looking to distribute something that does not require a separate install. We don’t want to say, here is some code you can use but before you can use it, take a whole day to figure out how to build opencv from the source and install it to this strange directory on your machine.

So, if you need to build OpenCV from source to static libraries to link from an xcode project, here is how you do it.

Step 1. Get the OpenCV source

You can download it from here:

http://sourceforge.net/projects/opencvlibrary/

or use the command line to get it via SVN:

cd ~/wherever/you/want/to/put/it
svn co https://code.ros.org/svn/opencv/trunk

Step 2. Use the CMake GUI to create “make” files

You can do all this with unix commands via terminal, but I found the Cmake Gui to be quite useful. You can download it here:

http://www.cmake.org/cmake/resources/software.html

When you run CMake, you have to select two directories. “Where is the source code” — browse to the directory where you downloaded OpenCV. “Where to build the binaries” — pick a directory where you want to build the shared libraries. Here’s what it looks like on my machine:

Now press the “configure” button.

You’ll then be asked to specify a generator. If you prefer to use an IDE, select “Xcode.” If you’d like to build it via terminal, select “Unix Make files.” For the purposes of this tutorial, I’ll pick Xcode.

Once you hit ok (and wait a minute or so), all of the build options will suddenly appear in the center of the CMake window. Here’s where things get a little tricky and what you need to select can be an “it depends” on what exactly you are doing this for. Here are the settings I am using:

  • Uncheck “BUILD_NEW_PYTHON_SUPPORT” (I don’t need python)
  • Uncheck “BUILD_SHARED_LIBRARIES” (This is important, this will cause it to build the static libraries instead of shared!)
  • Uncheck “BUILD_TESTS” (Don’t need these)
  • Add “I386″ to CMAKE_OSX_ARCHITECTURES. I’m looking for these static libraries to be backwards compatible to 32-bit systems and Leopard (and Processing runs in 32-bit only) so this is the architecture I’m using, but you might choose some different.
  • Change “CMAKE_OSX_SYSROOT” to /Developer/SDKs/MacOSX10.5.sdk. Same thing as previous item.
  • Uncheck “WITH_FFMPEG”. You’ll get errors unless you have FFMPEG on your system
  • Uncheck “WITH_D1394″. Same thing, you’ll get errors unless you have D1394 on your system.
  • Check “WITH_QUICKTIME”. You may want to leave this out. For me, I need to use QUICKTIME (instead of the newer QTKit) because of a weird threading error that happens with Java. I’m hoping to eventually sort this threading error out so that we can use the QTKit framework.

After you have finished your settings, press “Configure” again. Then press “Generate”.

Step 3. Build the static libs!

If you picked “Xcode”, you’ll now have an XCode project in your directory that you can open!

If you used Unix make, you can then browse to the directory via terminal and type “make”!

Once you build the project, you’ll see you have the following static libs in these directorys:

/lib/libopencv_calib3d.a
/lib/libopencv_flann.a
/lib/libopencv_imgproc.a
/lib/libopencv_video.a
/lib/libopencv_contrib.a
/lib/libopencv_gpu.a
/lib/libopencv_legacy.a
/lib/libopencv_core.a
/lib/libopencv_haartraining_engine.a
/lib/libopencv_ml.a
/lib/libopencv_features2d.a
/lib/libopencv_highgui.a
/lib/libopencv_objdetect.a
/3rdparty/lib/liblibjasper.a
/3rdparty/lib/liblibjpeg.a
/3rdparty/lib/liblibpng.a
/3rdparty/lib/liblibtiff.a
/3rdparty/lib/libopencv_lapack.a
/3rdparty/lib/libzlib.a

Here are some good additional references I used:

For building OpenCV 1.0
http://ildan.blogspot.com/2009/11/creating-universal-static-opencv.html

Some backwards compatibility tips:
http://cocoawithlove.com/2009/09/building-for-earlier-os-versions-in.html

OF Forum discussion:
http://www.openframeworks.cc/forum/viewtopic.php?f=10&t=4943

Cinder forum discussion:
http://forum.libcinder.org/topic/opencv-status

Questions, comments, things I missed? Let me know!

Updated Kinect Library for Processing

A quick post to announce an updated Kinect library for Processing on github. This new library uses the most recent libfreenect drivers (mac os x only still) and builds off of the existing JNI Java Wrapper. Links:

Download library and example:
openkinect.zip

Source:
https://github.com/shiffman/libfreenect/tree/master/wrappers/java/processing

My tests show 30 FPS no problem for either the depth or RGB image, if you request both images, however, I’m only currently getting about 20 FPS. The update fixes a few bugs, exposes the raw depth data and includes a point cloud demo (see above video).

I have a list of “to-do” items here:

https://github.com/shiffman/libfreenect/issues
(a shortened version of the very long list in my head)