Twitter’s Bootstrap continues to bring the awesome and I’m falling behind. The 2.0 version of Bootstrap (which is not backwards compatible) brings a lot of great refinements and consistencies as well as a few new features. In particular, the JavaScript features continue to grow at a lovely pace.

Alas, it’s all jQuery stuff, which is fine if you aren’t already using MooTools (really, if you just want Bootstrap and nothing else, use jQuery). But if you’re hooked on MooTools and want to use Bootstrap 2.0, I’m apparently still the only game in town.

So what’s new in MooTools Bootstrap? Mostly just support for all the breaking changes in Bootstrap 2.0. If you’ve already got a project running Bootstrap, you don’t need to upgrade unless you want some of the new features there (like the flexible layouts for mobile and whatnot.

Updating for Bootstrap 2.0

• All the “*.Twipsy” files are now “*.Tooltip” to reflect the change in Bootstrap
• Numerous conventions changed in Bootstrap 2.0. In particular things like tabs, tables, and dropdowns now prefix their component name to all their classes (table-striped instead of zebra-striped, “btn btn-primary” instead of “btn primary”)
• Added support for drop down lists in tabs

I’ve recently been working on and posting about the development application that makes it easier to get started working on and working with MooTools. For those of you who haven’t followed it, the app is a deployable Django app that lets you see docs, demos, benchmarks, and a builder for any combination of MooTools projects.

Multiple Configs

Today’s release allows you to run more than one configuration at a time:

That means it’s fairly easy to jump between MooTools 1.2, 1.3, etc. What it means here at Clientcide is that users can now browse the docs and download / view multiple past versions (at the moment, only 2.2.0 – the last stable version running on MooTools 1.2 – and the current release).

Support for “Fiddle” demos

MooTools.net recently revamped its demo system and now all the demos you see on mootools.net are in a stand alone git repo.

The demo runner in the dev app now supports these files as well.

Give it a try

As always, the system remains fairly easy to install and play with.

$ git clone git://github.com/anutron/mootools-development.git
$ cd mootools-development
$ ./go install             # or just "./go i"
$ ./go depender_check      # or just "./go d" - this checks the JS dependency tree
$ ./go run                 # runs the server on port localhost:9876

The code can be found on github, of course.

Last fall I gave a talk about MooTools at the Ajax Experience in Boston. Adobe just put it online and I thought I’d share. This talk is first an overview of MooTools and what it has to offer and then delves a little bit into my pattern programming principles that I’ve been blogging about here lately.

I’ll point out that this was at 8am on the last day of the conference and it takes me a few minutes to really get going. If you’re already familiar with MooTools there’s nothing new here for you (probably). The whole thing is about an hour and twenty minutes long…

I was helping someone today with their javascript and they asked me about how and when I manage errors in the classes and functions that I write. I wrote him back an email which I think actually could be useful to others, so here it is.

There are three types of error handling that I use:

• Graceful: if possible, just ignore the error and continue with some default state or without a meaningful value
• Debug: throw a warning to the dbug.log method but continue otherwise
• Break: Either explicitly throw an error or (more often) just let the error that is thrown at runtime be thrown

Read the rest of this entry »

Valerio posted over on the Mootools forums today a list of changes in the upcoming 1.1 version of mootools. We’ve been hard at work on a lot of this stuff and I’m excited to see it come out. After this version, we anticipate working less on the core framework and more on plugins and widgets.

————————————————————————————————————
#Additions
————————————————————————————————————

• CUSTOM EVENTS!
• $each also iterates objects
• added Element::getStyles
• added Element::hasChild
• added Array::include
• added Array::merge
• added $merge, to merge objects
• Dom.js uses XPATH in supporting browsers
• the use of +’px’ in setStyle is not required anymore.
• added XHR::cancel

————————————————————————————————————
#Changes
————————————————————————————————————

• Object.extend is now $extend, still compatible
• Object.native is now $native, still compatible
• Element has been splitted in Element.Events, Element.Form, Element.Dimensions

————————————————————————————————————
#Elements Creation
————————————————————————————————————

• elements creation is easier: new Element accepts second param
• elements creation for elements with name/type is easier, just use second argument.
• setProperty for name/type are is supported anymore.

————————————————————————————————————
#Notable Fixes
————————————————————————————————————

• dom logic is highly optimized and its blazing fast
• better sortables, no more flickering, removed Drag dependency
• Fx.Slide now accepts borders and margins. Positioning is now possible.
• Element::toQueryString in ajax now works as intended with all Form elements, including multiple selects.
• Element::setStyle supports float
• Element::setProperty and Element::getProperty now supports “for”

————————————————————————————————————
#Obvious Things
————————————————————————————————————

• code cleanup and optimization
• bugs and incompatbilities fixed
• mootools is faster, FASTER, FAAASTEEERRR

————————————————————————————————————
#TODO
————————————————————————————————————

• some bugs left
• testing
• css3 selectors (?)
• ???