DED|Chain JavaScript Library

Less cruft, more fun: The Web Developers JavaScript kit

Why?

  • Built on Yahoo! UI
  • Easy Chainability
  • Developer Friendly
  • Customizable API
  • Cross browser
  • Fun
Cruft [kruft]
The results of shoddy construction
Superfluous junk
Cruft is to hackers as gaggle is to geese
Anything unpleasant that accumulates over time

What's this?

DED|Chain is free open source software (BSD License) that will allow you to build first class, high-quality websites without the cruft. You get the reliability of Yahoo! UI, and the developer friendliess of jQuery. You also receive the benefits of an easily customizable A.P.I. which puts you in control of how you will work with the library.

Show Me

One of the greatest aspects of JavaScript is the ability to chain objects. The DED|Chain library is based on this very principle. Every new instance of a chain simply returns itself, and thus a chain is created.

Putting together a DED|Chain is simple. Go ahead and run the following code.

Wooooooooooooo Run Code

_$('#demo').on('click', function() {
    _$('#blamo').fadeIn({
        duration: 2,
        callback: function() {
            this.setContent("Wasn't that fun?");
            this.animate({
                    fontSize: {
                        to: 24,
                        unit: 'px'
                    }
                },
                1,
                YAHOO.util.Easing.elasticOut,
                {
                    after: function() {
                        this.setStyle('color', '#ff0');
                    }
                }
            );
        }
    });
});

Customizability

As the developer, you get to choose how you'll interact and read from the A.P.I.. Of course, there is a default standard put in place for you, but if you wish to change it to fit your own comfort level, it's as easy as pie to do. For instance, to change the default namespace of DED|Chain and a few of its methods, simply do the following:

DED.register({
    namespace: 'RAD',
    setStyle: 'css',
    fetch: 'request'
});

What this does is changes the default '_$' namespace to 'RAD' and renames the setStyle and fetch methods to css and request appropriately.

More Stuff

There is of course always that tendancy of wanting to see more. Feel free to browse some of the examples using DED|Chain.

Twitter Timeline Ticker
Twitter Image
The twitter timeline ticker takes advantage of the throttle and fetch methods in a way that is practical for web developers and takes no time at all to set up advanced polling systems.
Form Hijacking
Ajax Contact Form
Easily Hijack any form with the super-intuitive hijackForm method which enables you to preset any form to be "'POST' ready" and sent via remote request (xmlHTTPRequest). Useful for contact forms, comment forms, or any kind of form really. The callback objects will provide you all the convenience you need.

Credits

Obviously much credit goes to Yahoo!'s most excellent Yahoo! User Interface library which is the backbone of DED|Chain as well as Jack Slocum for putting together a lean, lightning speed DOM CSS Querying utility which is the base of all chains for DED|Chain. Lastly, much appreciation goes to John Resig's jQuery for the inspiration of DED|Chain's design.

The goals for DED|Chain in all honesty comes down to these three things. They may or may not change, but these were most definitely the original ideas.

  • Get jQuery users to explore the depth of Y!UI. Perhaps DED|Chain will serve as a good bridge that will bring familiarity to the seasoned jQuery developer.
  • Get Y!UI Developers to try something new; like jQuery. It is a different (and fun) style of JavaScript development. Hopefully DED|Chain can bridge that same gap and shed new light to the seasoned Y!UI developer.
  • Targeted at Web Developers. If you build websites on a daily basis, I want this to be the JavaScript library of choice. New and upcoming additions to the library should keep that very thing in mind.