Description
Sajax library is used. You can learn it here http://www.modernmethod.com/sajax

Example


+0
HTML code <input type=button value="testAjax" onclick="x_ajaxTest(out);"> <input type=button value="testAjax2" onclick="x_ajaxTest2('simple test value (русский тест)',out);"> <br><br> <script> function setC(c){ $('#c').html(c); } </script> <input type=text id="a">+<input type=text id="b"><input type=button value="=" onclick="x_calc($('#a').val(),$('#b').val(),setC);"><span id="c">0</span>
PHP code function ajaxTest(){ return $_SERVER; } function ajaxTest2($a){ return xa($a); } sajax_export("ajaxTest","ajaxTest2"); function calc($a,$b){ return $a+$b; } sajax_export("calc");

Description
Jquery is extension to standart JavaScript functionality that makes life much easier. Also there are huge amount of very powerfull plugins for jquery. You can learn it here http://www.jquery.com

Example 1 - tablesorter plugin

Filed1	Filed2	Filed3	Filed4	Filed5	Filed6	Filed7
Student01	Languages	male	80	70	75	80
Student02	Mathematics	male	90	88	100	90
Student03	Languages	female	85	95	80	85
Student04	Languages	male	60	55	100	100
Student05	Languages	female	68	80	95	80
Student06	Mathematics	male	100	99	100	90
Student07	Mathematics	male	85	68	90	90
Student08	Languages	male	100	90	90	85
Student09	Mathematics	male	80	50	65	75
Student10	Languages	male	85	100	100	90
Student11	Languages	male	86	85	100	100
Student12	Mathematics	female	100	75	70	85
Student13	Languages	female	100	80	100	90
Student14	Languages	female	50	45	55	90
Student15	Languages	male	95	35	100	90
Student16	Languages	female	100	50	30	70

Example 2 - color animations plugin

Description
templates in JS is good to use when you receive data as array or object throw ajax and need to show it in browser as table rows, images in gallery or any other list.
this is not popular solution, but works great and saves time.

Example

Name

Email

Phone

<tr class='tRow'><td>{name}</td><td>{email}</td><td>{phone}</td></tr>
HTML code <table border=1> <tbody id="contactsTable"> <tr> <td>Name</td> <td>Email</td> <td>Phone</td> </tr> </tbody> </table> <textarea style="display:none;" id="rowTpl"><tr class='tRow'><td>{name}</td><td>{email}</td><td>{phone}</td></tr></textarea> <script> $(document).ready(function() { x_getContacts(showContacts); }); function showContacts(arr){ $('.tRow').remove(); //delete old rows for(i in arr){ tpl=$("#rowTpl").val(); //load template from hidden textarea tpl=tpl.replace("{name}",arr[i]["name"]); //replace key in template tpl=tpl.replace("{email}",arr[i]["email"]); tpl=tpl.replace("{phone}",arr[i]["phone"]); $('#contactsTable').append(tpl); // append template with values into table } } </script>
PHP code function getContacts(){ return aq("select * from `contacts`"); } sajax_export("getContacts");

Description
Animation ( js/xna.js ) is just a test. I tried to divide process to 2 threads 1 - drawing 2 - updating values like in XNA and other game engines.

Example
[W] [A] [S] [D] - movement [Space] - fire

Or open in new window

Example 2
Click on it

Or open in new window

Example 3
Move your mouse

Or open in new window