Projects

jQuery

jQuery is a fast, concise, JavaScript library that simplifies how you traverse HTML documents, handle events, perform animations, and add Ajax interactions to your Web pages. It is not a huge, bloated framework promising the best in AJAX, nor is it just a set of needlessly complex enhancements. ... [More] jQuery is designed to change the way that you write JavaScript. "You start with 10 lines of jQuery that would have been 20 lines of tedious DOM JavaScript. By the time you are done it's down to two or three lines and it couldn't get any shorter unless it read your mind." - Dave Methvin [Less]

Prototype Javascript Framework

Prototype is a JavaScript framework that aims to ease development of dynamic web applications. Featuring a unique, easy-to-use toolkit for class-driven development and the nicest Ajax library around, Prototype is quickly becoming the codebase of choice for web application developers everywhere.

script.aculo.us

script.aculo.us provides you with easy-to-use, cross-browser user interface JavaScript libraries to make your web sites and web applications fly. What's inside? animation framework, drag and drop, Ajax controls DOM utilities, and unit testing. It's an add-on to the fantastic Prototype framework.

Ample SDK - JavaScript UI Framework

Ample SDK is a standard-based cross-browser JavaScript UI Framework for building Rich Internet Applications. It employs XML technologies (such as XUL, SVG or HTML5) for UI layout, CSS for UI style and JavaScript for application logic. It equalizes browsers and brings technologies support to those missing any.

phantomjs

PhantomJS is a headless WebKit with JavaScript API. It has fast and native support for various web standards: DOM handling, CSS selector, JSON, Canvas, and SVG. PhantomJS is an optimal solution for fast headless testing, site scraping, pages capture, SVG renderer, network monitoring and many ... [More] other use cases. PhantomJS is created by Ariya Hidayat [Less]

phpQuery

phpQuery is a server-side, chainable, CSS3 selector driven Document Object Model (DOM) API based on jQuery JavaScript Library. Two interfaces are provided - Object Oriented PHP and Command Line Interface (CLI).

phery

It's a straightforward and powerful AJAX library with direct integration and mapping of all jQuery functions in PHP, the mapping is extended to custom functions set by $.fn, can create elements just like $('') does, as phery creates a seamless integration with jQuery functions, through AJAX to PHP functions

google-jstemplate

Template processing is the staple pattern for separation of data and presentation in web applications. But it usually works on one page at a time, which is inadequate for incremental, asynchronous page updates typical of Ajax applications. This system provides templates that allow for ... [More] incremental processing — every processing operation produces valid output, and differential processing — output text is again a template. It also fixes other undesirable properties of standard template processing: Wellformed output is guaranteed. Escaped by default. Templates are intelligible: input template is valid output. And, of course: Pure javascript, HTML, browser side processing. [Less]

rapids.js

The JavaScript Rapid App Prototype Toolkit

hsjn

AboutHSJN is a lightweight jQuery DOM Builder plugin designed around a parser for a highly portable JSON-based HTML Snippet notation. The plugin itself is merely the logic engine which takes a Javascript object of properties and creates real DOM nodes. Using HSJNHSJN has a couple key features ... [More] which make it ideal: Usually shorter than the HTML it generates Simple jQuery selector style tag, class, and ID declaration Easily add simple text or append children (or both!) to any node within an HSJN tree. Create complex jQuery chains right inside an HSJN object. Easily define attributes and custom CSS styles easily. Highly portable, can be parsed by the jQuery JSON parser, which means HTML DomBuilder snippets can be sent through AJAX! ExamplesLets say you have the following, straightforward html snippet. " and "$", respectively. See below.) An "Array" is treated as a nest for children HSJN elements. If the array is one level deep (['ul']) it is treated as appending a single child. If the array is two levels deep ([ ['li'], ['li'] ]), each element within the array will be appended as a child of the current element, and as siblings of each other. Declaring Attributes and StylesWith any HSJN object, you have the opportunity to pass in attribute values, and custom CSS styling. HSJN treats a core level Object ( {} ) as an attribute group. CSS styling must be contained within the core level object, indexed by the character "". An example of adding attribute values to the div: ['div#ui-tabs-container.ui-tabs', { ref: '#someCSSSelectorForOtherUse', _: { // CSS Styles backgroundColor: '#565656', position: relative } }, ['ul', ['li', ['a', {href: 'site/page1.html', title: 'Click to Load!'}, ['span', 'Load Page 1'] ] ] ] ]Create jQuery ChainsLets say that we wanted to bind some jQuery methods to the snippet. We can easily add any jQuery methods (ones accessible to $('...').methodName()) to the snippet: ['div#ui-tabs-container.ui-tabs', { ref: '#someCSSSelectorForOtherUse', _: { // CSS Styles backgroundColor: '#565656', position: relative }, $: { appendTo: ['#someElem'], tabs: [{ cache: true }], bind: ['my-custom-event', 'myCallback'], trigger: ['my-custom-event'] } }, ['ul', ['li', ['a', {href: 'site/page1.html', title: 'Click to Load!'}, ['span', 'Load Page 1'] ] ] ] ]Now, when the snippet is done building the HTML and children nodes, it will append itself to the specified element, make itself a tabs() widget, bind a custom event using a globally accessible function named "myCallback", then trigger it. When declaring jQuery chains, there are a few important things to note. You have the ability to declare "dot namespaces" to designate multiple calls to a single function within the hash. (ex. $:{'tabs.new': [], 'tabs.add': ['add', ...], 'tabs.add2': ['add', ...]) If you pass in a string, HSJN will assume you're referencing a function, and will attempt to find it. HSJN will begin looking for your function as a child of "window". (ex. $:{click: 'myClickHandler'}) If you need to use a function internal to an object, you can scope it in. (ex. $:{click: 'myClickHandler::myObject'} will look for window.myObject.myClickHandler) If you pass in an array, jQuery will assume each node of the array is a parameter for the function. (ex. $:{bind: ['click', 'myFunction']) Within an array, the HSJN parser will attempt to resolve any string it finds to a function. If it cannot, it will assume its a flat string, and not a function reference. If you pass in null, undefined, or false as the value of any object, it will simply call the function. (ex $:{show: null} is equivalent to $('...').show();) If you pass in an actual function, it will use the actual function as the parameter. Direct Integration with jQueryIn addition to the HSJN core parser, ( which can be accessed by calling $.hsjn() ), the plugin also features an element modifier, for direct appending. $('#someElement').hsjn( myHSJNObject ) will parse myHSJNObject, and append it as a child of #someElement. [Less]