jQueryUI: draggable + selectable

Posted in to do on July 14th, 2013 by ericsoco – 1 Comment

Across the tubes, there are many hints toward getting jQueryUI’s draggable and selectable widgets to play nice with each other.

However, they all come back to a technique laid out in a post by Ryan Coughlin back in 2008. The basic strategy comes down to this:

  • use selectable() to enable marquee (lasso) selection and click-container-to-deselect;
  • use a click handler to manually set jQueryUI selectable classes (‘.ui-selectable’, etc)
  • hook into draggable() to copy the offset to all selected elements.

I modified a jsfiddle from a Stack Overflow post on the topic with clearer comments and updated jQuery (v1.9.1) and jQueryUI (v1.10.3) libs. Here it is:

Press for the new Exploratorium

Posted in to see on April 28th, 2013 by ericsoco – Be the first to comment

Wow, been a while since I posted. I guess I’ve been busy, opening a new museum!
Proof lies in these articles (just a few among many in the press onslaught accompanying our reopening), which highlight much of the work I’ve done in the past couple of years:

New York Times: In New Home, Exploratorium Widens Its Interactive Appeal
San Francisco Magazine: The Wonder Piers
Fast Company: The $300 Million Dollar Science Museum of the Future
Nature: A science giant moves house
Dvice.com: 10 must-see at San Francisco’s new Exploratorium

The majority of my recent work has been for the Exploratorium’s Bay Area Observatory, a space in a two-story glass box at the end of Piers 15/17 with a stunning view of both the city and the Bay. We’re encouraging visitors to be more careful, conscientious observers of the built and natural landscape around us, with a series of exhibits that take advantage of and augment the beautiful views.

My work as exhibit designer/developer (formally, as Senior New Media Exhibit Developer) brought forth five new exhibits:

Visualizing the Bay: a topographical model of the Bay Area onto which is projected a number of different visualizations representing physical and social phenomena in the Bay Area, including fog, earthquakes, census data, and salinity;
Tidal Ribbon: a laser-cut sculpture depicting a year of tidal data from the NOAA station at Crissy Field;
Ship Tracker: a screen-based interactive showing tracks of ships as they move through the Bay, based on publicly-available AIS data;
Picturing Place: a screen-based interactive allowing semantic (tag-based) search of photos taken in the area, collected from Flickr and Instagram;
Drawing the Bay: a drawing exercise that challenges visitors to draw the Bay from memory, highlighting various biases and idiosyncrasies in their perceptions of the area.

I also led the interaction design for Plankton Populations in the East Gallery, a large table on which is displayed a map of the world’s oceans, and wood+glass lenses through which visitors can examine the different kinds of microscopic life living within.

Documentation of all these works is forthcoming. Stay tuned!

Process.

Posted in to do, to see on October 21st, 2012 by ericsoco – Be the first to comment

Recently, I’ve had a couple of opportunities to share with the public the exhibit development process at the Exploratorium, with a focus on iteration and evaluation (aka user testing).

The first: an article I wrote called ‘Iterating for Visitors’ on UXMag.com.

The second: I’m speaking on the same topic, with a slightly different perspective, to an IxDA SF gathering this Wednesday, October 24.

In case you ever wondered how our exhibits come to be…

Strobe player for Shadowbox.js

Posted in to do on May 21st, 2012 by ericsoco – Be the first to comment

Shadowbox is lovely — easy to use, well-written and fairly well-documented, and has a nice player architecture for supporting media types other than those packaged with the library.

There isn’t great support out-of-the-box for FLV content, just the JW FLV Player, and for various reasons, I’m not really a fan.  I wanted something simpler and cleaner, and I found out about the Adobe Strobe media player. (Download it from sourceforge here.)

To be honest, I wrote this a while back and have been quite busy since, and I don’t remember exactly why I found Strobe to be such a better option.  But for those who agree with that sentiment, feel free to drop in the Strobe player for Shadowbox I whipped up, just for you.  It plays FLVs, Quicktime .mov files, and all other media formats supported by Flash.  And, it falls back to the HTML5 video player when Flash is not available.

To use it, add strobe.js to your Shadowbox source/players folder, edit the players array in build.yml to include ‘strobe’ (no quotes), and rake it back together as shown here.

Flex Library Project won’t build? Check for build errors.

Posted in to do on May 11th, 2012 by ericsoco – Be the first to comment

I ran into a particularly sticky problem today with Flex Library Projects in Flash Builder. I wrote up my issue as a Stack Overflow question, and subsequently managed to figure it out.

In short, as soon as I cut/pasted certain classes into my Flex Library Project, it would no longer rebuild the .swc file in the /bin folder. No matter what I did after pasting in that file, I couldn’t get the .swc to update.

The first symptom was that other projects referencing this Library Project could not find the classes in the Library Project even after I had pasted them into the Library Project. More sluething led to the frozen .swc in the Library Project.

After a while, I noticed that the class I pasted in had dependencies on other, absent classes. This caused build errors (apparent in the Problems pane, but unnoticed by me until then), and those errors caused Flash Builder to stop updating the .swc file.

Simple enough once I noticed the errors — of course Flash Builder cannot recompile the .swc when there are build errors. But there was no obvious indication of these errors, nor that building was failing. Once I cleared up the build errors, the .swc automagically reappeared.

The original source of the build errors turned out to be one unchecked box: when I initially created the Library Project, I neglected to check ‘Include Adobe AIR Libraries’. My library classes referenced some (absent) AIR classes, I got build errors, the .swc would not compile, I could not reference any of the library classes from other projects.

MongoDB ObjectID for AS3

Posted in to do on April 2nd, 2012 by ericsoco – 4 Comments

I’ve been working with MongoDB as of late, and finding the offerings for an ActionScript 3.0 driver to be rather lacking.

I started with ActionMongo, and quickly found out that it has no support for much of anything except the find() command.  I then found my way to MongoAS3, which is a HUGE improvement over the barely-started functionality within ActionMongo.  (Credit where credit’s due, Omar Gonzales built MongoAS3 off of Claudio Alberto Andreoni’s first steps with ActionMongo.)

However, I found a missing piece in MongoAS3 that was holding me back: it doesn’t provide any way to generate a new ObjectID.  This is a problem if, for example, you want to insert a new document.  Since Mongo doesn’t provide a response on a successful insert, this means that a followup query is required to get the ObjectID assigned by the server to the newly-inserted document.  Not ideal.

So, I added functionality to ObjectId.as (which Omar included from Claudio’s original, as part of ActionBSON) to generate a new ObjectID per the ObjectID spec.  The one deviation from the spec comes from the difficulty in getting the process ID from within a flash runtime (requires launching a NativeProcess, which can only be done from an AIR application with the extendedDesktop profile); for this, we’re just using a random.

I also added the ability to extract the timestamp from the ObjectID, which could prove useful.

Hope it’s useful to some of you…I’ve submitted it to Claudio and Omar for inclusion into their distros.  Code after the break, or on Github. (I need a better Gist plugin…)

read more »

Nest 0.2 – Scenegraph and Event Model for Processing/Java

Posted in to do on June 8th, 2011 by ericsoco – Be the first to comment

I’ve been working on some more complex processing/java projects at work lately, and found myself missing some of the niceties of AS3, like add/removeChild(), setting .x or .scaleY or .rotationZ, adding event handlers, etc.

So, I started to write a framework to provide some of those things. Now, it’s all documented and pretty and waiting for you:
http://transmote.com/nest/

read more »

‘flip’ on the Great Wall

Posted in to see on February 8th, 2011 by ericsoco – 1 Comment

the Great Wall of Oakland has graciously offered to display another of my works next month. here’s a sneak preview:

as usual, we’ll kick off some time after dark (7ish), and cycle through a number of pieces. we’ll be on til around 10.

hope to see you there!

FLARManager v1.1 – Augmented Reality in Flash

Posted in to do on January 30th, 2011 by ericsoco – 10 Comments

Hello again. For your augmenting pleasure, here’s the first major-ish update since v1.0.

As Papervision is pretty much a dead project, I’ve been asked increasingly often to update the parts of FLARManager that use other frameworks. That’s the major focus of this release, but there are some other changes too.

FLARManager v1.1 can now stabilize tracking based on the user scenario you’re targeting. FLARManager.markerMode and FLARManager.patternMode allow more control over the amount of markers and patterns your application will track, and FLARCameraSource.activityThreshold is better integrated into FLARManager’s core to allow performance gains for stationary markers.

Of course, all of this is reflected in updated ASDoc-style documentation, and is documented here as well. And if you don’t want to take the time to understand what I’m talking about, just roll with the defaults and everything will be peachy.

As usual, you can get it via svn/download. Instructions here.

If you like what you see here, please consider flipping a penny or two my way:
donate to FLARManager

Also, in case you missed the news — ARToolworks is now hosting a FLARManager forum here. Please post support questions there for better tracking and archival. And in other communication news, I’m now on the twitters…look out for quickies about FLARManager, Flash, and all good things tech and design.

More on v1.1 after the jump…
read more »

pecha kucha, 2011.01.11

Posted in to see on January 4th, 2011 by ericsoco – Be the first to comment

hello, dear readers.

i’ll be pontificatin’ on the wonders of ‘casual creation’ at this month’s Pecha Kucha.

what’s pecha kucha? it’s this thing where people talk at you, but it’s not as boring as most, because a) each speaker has only 20 slides, with only 20 seconds per slide. 6:40. that’s it. and b) it’s at a club with a full bar!

the theme for the month: “ONE”. expect a special surprise, in the form of a glimpse into my personal politics as a developer/creator, to address said theme.

333 ritch
doors @ 7pm
presentations start @ 8:20
$5 requested donation

more info here.