<!-- Note: Feel free to use this for testing, but you should host this file yourself -->
<script type="text/javascript" src="http://nwtjs.github.com/nwt/nwt.min.js"></script>

var el = n.one('#someid .someclass');
el.setHtml('Hello Nodo');

// Alerts 'Hello Nodo'
alert(el.getHtml());

// Accesses the parent node
el.parent();

// Access an ancestor node by selector
el.ancestor('.someclass');

// Gets the previous node
el.previous();

// Gets the next node
el.next();

// Next and previous may take an optional selector or filtering function
el.next('.selector');
el.previous(function(el) { return el.hasClass('bbq') });

// Returns a single element that is a child of this node based on selector
el.one('#selector');

// Returns a collection of elements based on selector
el.all('.selector');

// Checks if the el has a class
el.hasClass('someclass');

// Adds a class
el.addClass('someclass');

// Removes a class
el.removeClass('someclass');

// Swaps a class
el.swapClass('oldclass', 'newclass');

// Sets a style
el.setStyle('top', 0);

// Removes a style
el.removeStyle('top')

// Sets several styles
el.setStyles({top:0, left:0});

// Removes several styles
el.removeStyles(['top', 'left']);

// Gets the value of a style
el.getStyle('top')

// The region() function returns sizing information
// The return object has the following properties: top, right, bottom, left, width, height
el.region()

// Tests that a node intersects with node
el.intersects(otherEl);

// Gets a data attribute. The following would receive the "data-bbq" attribute
el.data('bbq');

// Sets a data attribute
el.setData('id', 12345);

// Gets the nodes value. Passthru to node.get('value')
el.val();

var el = n.node.create('<div class="boringexample">Some HTML</div>');
alert(el.hasClass('boringexample')); // Alerts true

// Appending nodes as a child
n.one('body').append(el);
n.one('body').prepend(el);

// It's possible to create a node and append it to a selector, or node instance
// We can continue to chain methods after appending on the child node.
n.node.create('<div>Content</div>').appendTo(myNode);
n.node.create('<div>Content</div>').appendTo('#someSelector');

// Can also use insert (before or after)
n.one('.container').insert(el, 'before');
n.one('.container').insert(el, 'after');

// Alternatively you can use insertTo
n.node.create('<div>Content</div>').inserTo(newSibling, 'after');

// Creating a new collection
var els = n.all('#mymenu li');

// Iterate over each item in the collection
// Receives each element as an argument
els.each(function(el){
  console.log(el);
});


// Chaining from a single node is useful if you already have a node object
var mynode = n.one('#mymenu');
mynode.all('li').removeClass('active'); // Removes the 'active' class from all nodes in this collection

// Other iterated functions include: addClass, removeStyle(s), setStyle(s)

// Get an io object with n.io
var req = n.io('/backend');

// Setup any handlers
req.success(fn);

// Send the request
req.post();


// Or chain everything together:
var req = n.io('/backend').success(fn).post();

// Abort if you want
req.abort();

// It's possible to make RESTFUL requests
n.io('/backend?key=val').get();
n.io('/backend').put();
n.io('/backend').post();
n.io('/backend').delete();

// The put, delete, and post methods can take data to send to the backend
// This data can come in the form of a string or node to serialize
n.io('/backend').post('mypet=cat&name=snickers');
n.io('/backend').post(n.one('form#theform'));

// The server here responds with the following JSON: {"foo": "bar"}
n.io('/test').success(function(o) {

	// Alerts the string: {"foo": "bar"}
	alert(o); 

	// Alerts the string: bar
	alert(o.obj.foo);
}).post();


// The server here responds with: <span>Hello NWT</span>
n.io('/test').success(function(o) {

	// Sets the content of an element to the response text
	n.one('#myid').setHtml(o);

	// In this case o.obj is undefined because we are not able to parse the JSON
}).post();

// Animate #cat for 2 seconds
n.one('#cat').anim({top:100, left:100}, 2);


// The following easing functions are available:
// linear|ease|ease-in|ease-out|ease-in-out|cubic-bezier(n,n,n,n);
n.one('#cat').anim({top:100, left:100}, 2, 'ease-in');

// Animates the color to red
n.one('#mydiv').anim({color:'#FF0000'});

// Hides an element by removing opacity
n.one('#mydiv').anim({opacity:0});

// Animates the background color and opacity
n.one('#mydiv').anim({background:'#00FF00', opacity:1});

// Set the class and content of the node
n.one('#cat').addClass('lolcat').setHtml('cheezburger');

// Update the content after animation
n.one('#cat').anim({left:100}).wait(2).setHtml('cheezburger');

// Update the content after animation, then remove it
n.one('#cat').anim({left:100}).wait(2).setHtml('cheezburger').wait(4).remove();

// Node.on fires an event every time that event happens
n.one('#myid').on('click', function (e) {
    // Assert: this == n.one('#myid')
});

n.one('#myid').once('click', function (e) {
    // Will only be called once
    // Detaches the event listener after firing once
});

// Use off to remove events
n.one('#myid').on('click', fn);
n.one('#myid').off('click', fn); // Listener removed

// You can also use purge to remove multiple events at once
el.purge('click', callback, true); // True to recursively remove events from children
el.purge(); // Removes all events on the node (does not recurse)

n.one('#myid').on('click', function (e) {

    // Prevents the event from bubbling up the dom
    e.noBubble();

    // Prevents the event from performing the default action
    e.noDefault();

    // Calls both e.noBubble and e.noDefault
    e.stop();
});

<!--[if lte IE 9]>
	<script type="text/javascript" src="/nwtfallback.min.js"></script>
<![endif]-->