2011-06-14 12:48:24 -04:00
|
|
|
# Keep It Simple JS Library #
|
|
|
|
|
|
|
|
A Minimal, Modular Javascript library for Modern browsers.
|
|
|
|
|
2011-07-21 14:18:10 -04:00
|
|
|
Aims to be fast, small, and easily split into individual modules.
|
|
|
|
|
|
|
|
You can create your own library by adding and removing modules from the
|
|
|
|
src directory, and running the "combine.php" script. This will output a
|
|
|
|
"kis-custom.js" file. (Be careful, as the script will overwrite any "kis-custom.js"
|
|
|
|
file that already exists).
|
2011-06-14 12:48:24 -04:00
|
|
|
|
2011-07-01 18:18:38 -04:00
|
|
|
Browser support: IE8+, Latest versions of Firefox, Chrome, Safari, Opera
|
2011-06-14 12:48:24 -04:00
|
|
|
|
|
|
|
## Basic Use: ##
|
|
|
|
|
2011-07-26 14:18:41 -04:00
|
|
|
* Function: `$_(selector).module.function(params);`
|
2011-06-14 12:48:24 -04:00
|
|
|
|
2011-07-21 14:18:10 -04:00
|
|
|
## Official Modules: ##
|
2011-07-26 15:38:15 -04:00
|
|
|
### Global: Core functions ###
|
2011-07-07 17:08:38 -04:00
|
|
|
|
2011-07-26 15:26:17 -04:00
|
|
|
**properties:**
|
2011-07-26 15:29:30 -04:00
|
|
|
|
2011-07-26 15:26:17 -04:00
|
|
|
* el: The html object returned by the selector function.
|
2011-07-26 15:29:30 -04:00
|
|
|
|
2011-07-26 15:26:17 -04:00
|
|
|
**functions:**
|
2011-07-20 15:14:32 -04:00
|
|
|
|
2011-07-26 15:26:17 -04:00
|
|
|
* each: For applying changes to every item matched by a selector
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:26:17 -04:00
|
|
|
$_(selector).dom.each(callback);
|
2011-07-26 15:29:30 -04:00
|
|
|
|
2011-10-18 11:08:51 -04:00
|
|
|
Example :
|
|
|
|
|
|
|
|
$_(".foo").dom.each(function(e){
|
2011-07-26 15:26:17 -04:00
|
|
|
$_(e).dom.text(value);
|
|
|
|
}):
|
2011-07-26 15:29:30 -04:00
|
|
|
|
2011-07-26 15:26:17 -04:00
|
|
|
* ext: For extending the library, adds this.el to the object or function supplied
|
2011-10-18 11:08:51 -04:00
|
|
|
|
|
|
|
|
|
|
|
$_.ext("name", functionOrObject);
|
2011-07-26 15:29:30 -04:00
|
|
|
|
2011-10-18 11:08:51 -04:00
|
|
|
|
|
|
|
Example:
|
|
|
|
|
|
|
|
$_.ext("zip", function(){ //function });
|
2011-07-26 15:26:17 -04:00
|
|
|
Adds 'zip' function to $_.
|
2011-07-07 17:08:38 -04:00
|
|
|
|
2011-08-10 16:30:36 -04:00
|
|
|
* type: For getting the type of a variable
|
2011-10-18 11:08:51 -04:00
|
|
|
|
|
|
|
$_.type(var);
|
2011-08-10 16:30:36 -04:00
|
|
|
|
2011-06-14 12:48:24 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
### Ajax: simple, jQuery-like ajax functions ###
|
2011-06-14 12:48:24 -04:00
|
|
|
|
2011-07-26 15:29:30 -04:00
|
|
|
functions:
|
|
|
|
|
|
|
|
* Get:
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:29:30 -04:00
|
|
|
$_.get(url, data_object, callback);
|
|
|
|
|
|
|
|
* Post:
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:29:30 -04:00
|
|
|
$_.post(url, data_object, callback);
|
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
### QS: querystring parsing and serialization for hashbang strings, and pushState urls ###
|
2011-07-26 15:29:30 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
**functions:**
|
2011-06-16 12:19:47 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
* Parse:
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
$_.qs.parse(hb);
|
|
|
|
|
|
|
|
* Set: This function will set the hash url if browser doesn't have history.pushState
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
$_.qs.set(key, value);
|
|
|
|
|
|
|
|
* Get: Retrieves the value of the key in the url string
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
$_.qs.get(key);
|
2011-06-14 12:59:38 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
### Store: localstorage wrapper with automatic data serialization ###
|
2011-06-14 12:59:38 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
**functions:**
|
2011-07-26 15:29:30 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
* Get:
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
$_.store.get(key);
|
|
|
|
|
|
|
|
* Set
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
$_.store.set(key, value);
|
2011-10-18 11:08:51 -04:00
|
|
|
|
|
|
|
* Remove
|
|
|
|
|
|
|
|
$_.store.remove(key);
|
2011-07-26 15:38:15 -04:00
|
|
|
|
|
|
|
* getALL: Retreives all localstorage data in raw form
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
$_.store.getAll();
|
2011-07-26 15:29:30 -04:00
|
|
|
|
2011-06-15 08:33:16 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
### Event: wrapper for applying events to DOM objects ###
|
2011-06-15 08:33:16 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
**functions:**
|
2011-07-26 15:29:30 -04:00
|
|
|
|
2011-07-27 12:06:56 -04:00
|
|
|
* Add:
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
$_(selector).event.add(event, callback);
|
|
|
|
|
2011-07-27 12:06:56 -04:00
|
|
|
* Remove
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
$_(selector).event.remove(event, callback);
|
2011-06-21 10:43:31 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
### DOM: Dom manipulation module ###
|
2011-06-21 10:43:31 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
**functions:**
|
2011-07-26 15:29:30 -04:00
|
|
|
|
2011-07-26 15:26:17 -04:00
|
|
|
* addClass:
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
$_(selector).dom.addClass(className);
|
|
|
|
|
2011-07-26 15:26:17 -04:00
|
|
|
* RemoveClass:
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
$_(selector).dom.removeClass(className);
|
|
|
|
|
2011-07-26 15:26:17 -04:00
|
|
|
* show: For setting dom elements as visible. Type defaults as "block", can be set with optional second parameter.
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
$_(selector).dom.show([type]);
|
|
|
|
|
2011-07-26 15:26:17 -04:00
|
|
|
* hide: Hides the elements matching the selector
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
$_(selector).dom.hide();
|
|
|
|
|
2011-07-26 15:26:17 -04:00
|
|
|
* attr: Gets, sets, or removes an attribute from a selector.
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
Set: $_(selector).dom.attr(attributeName, attributeValue);
|
|
|
|
Get: $_(selector).dom.attr(attributeName);
|
|
|
|
Remove: $_(selector).dom.attr(attributeName, null);
|
|
|
|
|
2011-07-26 15:26:17 -04:00
|
|
|
* text: Gets or sets the text in between an element's tags
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
Set: $_(selector).dom.text(text);
|
|
|
|
Get: $_(selector).dom.text();
|
|
|
|
|
2011-07-26 15:26:17 -04:00
|
|
|
* css: Sets css styles on the selected element(s)
|
2011-10-18 11:08:51 -04:00
|
|
|
|
2011-07-26 15:38:15 -04:00
|
|
|
Set: $_(selector).dom.css(property, value);
|
|
|
|
Get: $_(selector).dom.css(property);
|
2011-07-08 13:03:38 -04:00
|
|
|
|
2011-06-29 15:52:33 -04:00
|
|
|
|
2011-06-14 12:48:24 -04:00
|
|
|
|
|
|
|
|
|
|
|
|