Clientcide 3.0.10

January 6th, 2012 by Aaron N.

Another maintenance release for the most part. What’s new?

Clientcide:
* StickyWin.Ajax now can cache requests (useful for tips and whatnot); thanks @zipz
* New class: StickyWin.PointyTip.Ajax – provides for ajax tips. Again, thanks @zipz
* Fixed errant reference to old Browser property. This was breaking when used with MooTools 1.4* w/o compat.
* Tabswapper now allows you to specify if it should call preventDefault on tab clicks (useful if you’re being good with your HTML and using hrefs for the tabs).

Behavior:
* Delegator no longer throws an error if it encounters a trigger for a different event type. This means that if you have a click delegator and, say, a focus delegator, you won’t get errors in your console when the click event encounters the delegator for the focus event and vice versa. This isn’t a functional change, it just means you aren’t notified in the console.

As always, you can get all this at dev.clientcide.com.

j (or z) and gr (git root) For Command Line Awesomeness

October 25th, 2011 by Aaron N.

Here’s a little command line utility I use the hell out of:

https://github.com/rupa/z

Basically, this script tracks the directories you cd into on the command line and builds a rank order of their locations. Here’s a chunk of mine (with some fake directory names to protect the innocent):

8.93693 /Users/aaron/Development/mootools-development
17.5369 /Users/aaron/Development/foo
36.132 /Users/aaron/Development/bar
36.6632 /Users/aaron/Development/i/like/cookies
52 /Users/aaron/Development/what/do/we/have/here
97.5176 /Users/aaron/Development
270.192 /Users/aaron/Development/clientcide/Source/Interface
483.024 /Users/aaron/Development/clientcide/Source

If I type “z Source” I’ll automatically jump to that last line because it’s the highest ranked entry that matches that string. “z interface” will take me to the line above it. “z Devel” will take me to the line above that. It’s remarkably smart; it’s very rare that I end up somewhere other than what I want to be, even when I only use one or two characters from the location I’m after (“z clientcide” takes me to clientcide/Source, which may not be what I wanted).

Note: Originally it was called “j” (https://github.com/rupa/j) and I got so used to using that alias that I have “j” aliased to this script. z is the more recent implementation.


Oh, and here’s another one:

alias gr='[ ! -z `git rev-parse --show-cdup` ] && cd `git rev-parse --show-cdup || pwd`'

That command (gr) will take me to the root of any git repo I’m in.

-a

Clientcide 3.0.9: The IE Edition

October 17th, 2011 by Aaron N.

In my previous release of bootstrap I complained about my inability to test in IE. A few of you were kind enough to hit my specs and let me know that my low expectations of IE were not unfounded. Well, I finally got bootcamp and VMWare installed and went through the super-happy-fun-time that is IE debugging and this release has all my latest stuff working in IE8 at least.

In today’s release:

Clientcide

  • Various IE fixes to Autocompleter, Behavior filters for Autocompleter and StickyWin
  • Updated specs expectations which were ignored because I can’t remember the names of my own options signatures.
  • StickyWin.Fx is nerfed for IE. IE users don’t get fading! Deal with it!

Behavior

  • Various fixes for IE
  • Updating docs for inline JSON options – they previously stated that you didn’t have to quote the names in the JSON object; this was never true.

More Behaviors

  • Updated for MooTools More 1.4.0.1
  • Various fixes for IE support

Bootstrap

  • Dropdowns no longer hide when inputs or labels in the menu are clicked.
  • More support for browsers w/o CSS animations (they don’t get any animation at all, but they don’t break either). Old versions of Firefox and IE for example.
  • Various IE fixes.

There you has it. Nothing really sexy, but hey, you get what you pay for.

Clientcide Libs for MooTools 1.4.1

October 7th, 2011 by Aaron N.

A few weeks ago MooTools released version 1.4. I held off on pushing it to my repos here because I knew there were one or two (very minor) issues and that 1.4.1 was forthcoming and I I didn’t want to go through the work of releasing for it twice.

Now that 1.4.1 is out I’ve pulled it in and updated the few things that required it and it’s now available. The Clientcide release didn’t iterate because nothing changed. There were a few minor changes in some of the other repos (More Behaviors, Bootstrap) that had to do with things like dependencies moving around. Nothing major. If you were running 3.0.8 of Clientcide already, you don’t need to do anything.

If you’ve been playing with Bootstrap or Behavior in general, there have been a few changes over the past week or two. Since my last post:

Behavior

  • Delegator now passes the ammendDom and destroyDom events to its behavior instance.

Bootstrap

  • Popup now uses CSS animations for sliding in, mimicking precisely the same behavior that is found in Bootstrap’s js for jQuery/Ender.
  • Twipsy and Popover now have options to only display when the text is cropped. This works great with text-overflow: ellipsis in your css.
  • You can now add a .dismiss class to anything in a Popup that will close it. This was true of adding a .close class already, but Bootstrap adds styles to .close elements in the popup that you may not want.

dev.clientcide.com

I’ve made a few updates here and fixed a few issues. For starters, there was a misconfiguration in one of the Bootstrap files that broke the builder, so that’s fixed. Also, I’ve fixed the benchmarks; those weren’t working because my server was having issues with github’s SSL certificate and wouldn’t update the submodule for benchmark.js.

Clientcide 3.0.8

October 3rd, 2011 by Aaron N.

New goodies for those of you using Clientcide, Behavior, or Twitter’s Bootstrap. If you missed it, be sure to read up on MooTools for Boostrap which I released earlier.

New in Clientcide 3.0.8

  • Tabswapper and Collapsible now fires the “layout:changed” event in their behavior filters so that other behavior filters can do positioning and measurement work when they are displayed.
  • Tabswapper can now take an index for its startup tab.
  • Tabswapper can now be given a hash key for and it will store the state in the url hash as a query string value, allowing users to refresh the page and have the same tab displayed to them (using a cookie is still an option).
  • Added new event to Autocompleter to distinguish between the selection of a possible choice and the confirmation of it (hitting enter or clicking it).

New in Behavior

  • Non-alpha-numeric (except for dashes) characters in filter names are ignored in the prefix of their corresponding data properties (for example, if you named a filter “Foo!” you would address it with data-foo-options=”…”).
  • Filter names that have dots are now turned into dashes to allow for namespacing (so if you name a filter “MySite.Foo” you would address it as data-mysite-foo-options=”…”).
  • Added a method to allow you to set the defaults for a given behavior. (This might have been in the last release).
  • Added method in Delegator’s api instance passed to filters that allows you to retrive the bound Behavior instance (api.getBehavior()).
  • You can now specify multiple delayUntil values in a comma delimited list (i.e. tell your filter not to be invoked until mouseover OR focus).

MooTools and Twitter’s Bootstrap

October 3rd, 2011 by Aaron N.

Bootstrap, from Twitter is a heaping serving of awesomeness. In addition to it’s easy to use grid system, layouts, good looking typography, and the fact that the whole thing is written in Less, it includes a handful of JavaScript plugins for jQuery and Ender to bring a lot of the CSS components to life. We’re talking tips, popups, drop down menus and more.

Enter MooTools

For those of us who prefer MooTools, the JS included in Bootstrap isn’t so useful. I whipped a little something together for the MooTooler’s out there. No doubt you are itching to see a demo, to here ’tis:

http://anutron.github.com/mootools-bootstrap/

Getting the Library

Included in the repo are numerous MooTools plugins that depend on MooTools Core, MooTools More, Clientcide, MooTools Behavior, and Behaviors for MooTools More. Building all these takes some configuration on your part (check out the MooTools Packager – here’s a nice blog post on it by Ryan Florence), or you can just go to dev.clientcide.com and build it with the online tools there, which is what I recommend. Just click in the select box at the very top and choose “Bootstrap”. Be sure to check out the demos there as well as the docs.

This Is Beta Territory

I haven’t had a chance to test all this stuff in IE as I don’t have access to it right now (new Macbook, no Windows installed yet). Anyone who can help me test and debug any issues in IE would have my gratitude. As a quick start, specs can be run here.

Quick Cliencide Update

September 14th, 2011 by Aaron N.

A few new additions/fixes to the Clientcide libs for your enjoyment:

  • Clientcide:
    • New behavior filter: StickyWin.Modal – make modal layers on the fly. Works really well with AJAX-ing in the HTML.
    • Updated Tabs filter to use new filter features (defaults and the like).
  • Behavior:
    • adding ability to set defaults for behaviors
  • More-Behaviors:
    • New Delegator for Fx.Reveal. Works a bit better than the Collapser Behavior in Clientcide’s repo because there’s no startup cost.

Not a lot of meat on the bone, I know, but I wanted to release it as I go. Expect more in the coming weeks.

As a side note, if any of you are using Behavior and writing filters, I’d love to hear about it. Leave a comment or drop me a line.

Dev-app update: Multiple configurations, Fiddles

August 9th, 2011 by Aaron N.

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.

Developing MooTools with my Dev App

June 25th, 2011 by Aaron N.

My last few posts have covered the development sandbox I’ve been working on for the last few months. I thought I’d take the time to crank out a screencast of what it does and how you use it.

This video walks through the MooTools Development application. More about it here:

If you’d like to see the text a bit clearer, I suggest you download the source movie at Vimeo.

MooTools Dev App now ships with a builder

June 18th, 2011 by Aaron N.

Did a little hacking today and added a JS builder (similar to what you see at http://clientcide.com/js) to the MooTools Dev App which I wrote about earlier this week. You can see this in action at:

dev.clientcide.com – just click on “builder”

Simple installation:

$ 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

Still todo: enable compression via YUI’s compressor.

See also: packager-web, which is the stand-alone PHP implementation of this feature.

Note that Packager-web is a little more full-featured. The builder here is packager-web’s UI hitting depender inside the dev app so it’s got all the features of depender but not the exact same feature set as packager-web.

One bonus for depender though is that it caches in memory all the file data, so it doesn’t take long to load that UI once you load it once, while packager-web has to read all your file headers to display the UI and then read them again to build the library. Not a big deal either way though. The real benefit is that it’s included in the sandbox with all the other stuff (docs, demos, benchmarks, specs… and now a builder).