I’ve often needed a multiselect interface for heirarchichal data, and the way I like to get my code on, I find myself wanting to overload a select multiple (even with it’s poor default behavior). I figured I can represent each node’s heirarchy in an attribute, so if the js fails to load, you are still left with a working widget (albeit flat and probably overpopulated). Also, rather than external graphics, I’d like to use textual widgets and take advantage of modern css effects, rather than load external graphics.

XeLaTeX Section Modifications

Back in college I was working in a group project where we produced a document which was quite large, as well as deep… and we had a need for a subsubsubsection. One of the group members, Ruslan Hristov (who was also the project leader where I worked on Skipper) cobbled together an early version of this, which I have kept since, modifying it as needed. It works as you would expect.

DOM Manipulation additions

So at times I find myself needing to do some simple neighbor selection and summing in the DOM and I don’t have the tools I need so I wind up doing tedious, repetitive logic in loops, so I built a few useful utility functions:


Sometimes you’re in JS and you want to perform some task once something else returns (as is reasonable in an asynchronous world), but if you just fire off a bunch of intervals, you’ll eventually choke the browser. My solution is to add geometric timer falloff and a maximum timeout. this way the longer the task takes the less work we do as we wait, and at some point (in this example ~16 seconds) it gives up. This strategy has been working well for me.

String.entityEncode, String.entityDecode and String.regexEncode

So as I do all this nifty client side content generation I found the need for a clean entity encode/decode process. I was pretty shocked I couldn’t find anything to suit my needs so I built one. It builds it’s reverse lookup on load to minimize the total size, then generates the regex to encode/decode. To this end, it also includes String.regexEncode, which encodes special characters in strings, for the purpose of generating a selector.


I haven’t really had the time to make a post lately, as my conspicuous absence indicates. I’ve got an awesome gig at StylePage which keeps me busy and a number of side projects which steal the fleeting moments I can spare. While I’m not ready to peel back the curtains on any of my big projects, I think I’m just going to post some of the more useful utility functions I’ve built.

ImageBooth Recap: Multilayered ImageEditor in pure Javascript

As I’ve been finishing features, I’ve just been updating what the new stuff is… but now that I have a working implementation of layers (though save isn’t yet linked to layers), I figure it’s time to stop and give an overall view of the ImageBooth Demo app and what it does.

ImageBooth Updates: 07/30/10

Lots of changes: all line stroking is now done with a queue, which means if a line’s thread gets cancelled pre-draw, it will get picked up by the next thread and so on. This results in much smoother drawing and less ‘stepping’ on round edges. Also, tools may now provide controls in the ‘tool palette’ window, and the first one to do so is the new paintbucket tool which supports a threshold amount as well as an opacity setting. There is also now a Brightness/Contrast operation and the preview/options dialog was migrated from the filters system.

ImageBooth Updates: 07/26/10

So after an arduous weekend of coding, I come from high on the mount bearing tablets with the following features: You may now export the saved image (AKA download), also there’ve been numerous corrections to the convolver, as well as adding a filter settings dialog with a built-in preview. I added an eyedropper to help with colorpicking, and I made an overhaul to the Gaussian Blur filter which now allows it to generate a kernel of any size. All in all not a bad haul for a single weekend.

SplatterPlot 1.1 Adding Images into the Mix

So I was asked a few times if the splatter plot could support images, and I’d explain how you could extend the node class to do that, but my guess is people would find it useful if it did that out of the box. SVG’s Image rendering uses really poor pixel resampling algorithms, so scaled imaged don’t look as good. In fact I found SVG scaling seems to break down as the draw buffer becomes much larger than your view pane, so it’s a hugely terrible idea to just zoom/scale to infinity in a complex SVG without hand occluding elements offscreen. So now that I’ve fully chastised you for your vector sins, onto the example: