pi.js

JSPerf

DIY CDN

Example

Elm & Elms select

pi('#id')
pii('.class')

Class manipulation

pi('#try').addClass('newClass'); // delClass hasClass toggleClass
pii.classAdd('.class', 'newClass');

jQuery style .ready

pi.ready(function(){
});

Html Manipulation

// append child to
pi.H.append( pi('#u'), pi('#d') );
pi.H.append( '#u', '#d' );
// remove child
pi.H.remove( pi('#u') );
pi.H.remove( '#u' );

Listener

var listener = function(e) { console.log(e); };
pi('#try').on('click',listener);
pi('#try').rm('click',listener);
pii('.class').on('click',listener);
pii('#try .sub')[0].on('mouseover',listener);

Event Listeners Manager

var a = function(){ console.log('a'); };
var b = function(){ console.log('b'); };
pi.E.on( '#one', 'click', a );
pi.E.on( '#one', 'click', b );
// when click on #one -> print a \n b
// remove a listener
pi.E.rm( '#one', 'click', b );
// remove all click listeners
pi.E.purge( '#one', 'click' ); 

Topics Pub/Sub Notifier

var callback = function(a){ console.log('LOG: '+a); };
pi.T.sub('NOTICE', callback);
pi.T.pub('NOTICE',['hello']);
pi.T.unsub({'topic':'NOTICE','callback':callback});
pi.T.pub('NOTICE',['hello']);

LocalStorage

pi.S.set('key','value');
var value = pi.S.get('key');

Cached LocalStorage

pi.S.cache('key','value', ttl);

Namespace on LocalStorage

var hello = pi.S.namespace('hello');
hello.set('key','value');	// set key
hello.get('key');			// get key

AjaxCall

var ok = function (data) { console.log(data); };
pi.A({
 type:'GET',
 url:'example.json',
 success:ok
});

Routes

var ok = function (action,arg1,arg2) { console.log(arg1); };
pi.R.add('news', ok);	-> hash ->	#!/news/arg1/arg2
pi.R.bundle( [
	{
		route:'news',
		callback:function(){ alert('news'); }
	},
	{
		route:'defaultAction',
		callback:function(){ alert('defaultAction'); }
	}
] );
pi.R.start('defaultAction');

Questions

Why

Who

What

Where

Browser support:

Thank You