Hacking at 0300

I've updated my widgets tutorials to use jQuery UI 1.6, pulling the rc5 release off the svn site and turning them into pages rather than posts, since they seem to be so popular. See the widget tutorial and the extending widgets page.

Now all I need is for the UI team to officially release 1.6 so I can load it from googleapis rather than the jquery svn!

I keep telling myself I'll learn Haskell but my brain usually fries halfway through the tutorial. I've always thought that javascript is LISP in C's clothing, and jQuery helps undress it a bit. Now it turns out that really jQuery is really forcing it to cross-dress in Haskell. I guess I understood Haskell all along!

Updated 2011-02-28; minor bug fix. Thanks, brian!

Every time I create or use a jQuery plugin, I realize that the assigning of behaviors to elements on the page is a design decision, not a programming one, and one that should be made by the guy in charge of the CSS, not the guy in charge of the javascript. Even when I'm the same guy, I want to wear each hat separately. But these presentational enhancements are written in javascript and applied in javascript. So my "presentational" code is in two different files:

style.css

.gallery a { border: 1px solid green }

style.js

$('.gallery a').lightbox({overlayBgColor: '#ddd'});

I could put the presentational javascript in the HTML with $.metadata but while that's fine for quick-and-dirty pages, it's evil in production since it completely violates the separation of data/structure/presentation/behavior.

As I and others have noted before, the application of these plugins belongs in the stylesheet, and I finally got it to work:

style.css

.gallery a {
  border: 1px solid green;
  -jquery-lightbox: {overlayBgColor: '#ddd'};
}

and a single call to start it off: $(document).parsecss($.parsecss.jquery) .

Download the code.

See the demo.

Continue reading ‘jQuery CSS parser’ »

I was playing with Brandon Aaron's gradient plugin (based on Steven Slayer's gradient) and started adding options and playing with it, so now you can use named colors, percent sizes, and animation.

Download the code.

See the demo page.

Continue reading ‘gradient on steroids’ »

Last modified 2011-10-28; added box option

The Hebrew pop-up keyboard on the YI site search box was always hard-coded and kind of obtrusive, so I wanted to make a jQuery plugin to add a keyboard to any input type="text" or textarea. To make it more flexible, I factored it into a general-purpose popup widget and the keyboard itself.

Download the code.

Continue reading ‘New UI widgets: textpopup and hebrewKeyboard’ »