Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
JA va S cript  T oolkit Easy-to-use, Adaptable, Accessible http://jastegg.it http://jastegg.it – Creative Commons 3.0 – by...
What is? A lightweight JavaScript Framework With 16kb you have a working framework A simple way to get your web-applicatio...
How it works? <ul><li>Download the core (http://jastegg.it/eggs/core/ ) </li></ul><ul><li>Upload in your web-site’s script...
How to extend its functionality? <ul><li>Create new file </li></ul><ul><li>Use the JASTEggIt.extend( <egg>, <method> ) met...
JAST an example: “hello world!” Answer #1: How an Egg could run on the page contents ready? JA va S cript  T oolkit JASTEg...
JAST do it better! <ul><li>Answer #3: When the page content are ready? </li></ul><ul><li>A temporal interval between the u...
JAST do it! <ul><li>XML </li></ul><ul><li>Menu </li></ul><ul><li>AJAX </li></ul><ul><li>Tabbed forms </li></ul><ul><li>Eas...
Who talks about JAST? <ul><li>Italian Web Design ( http://www.italianwebdesign.it ) </li></ul><ul><li>Internet Magazine nr...
Upcoming SlideShare
Loading in …5
×

JAva Script Toolkit

2,054 views

Published on

What is JAST?

Published in: Technology
  • Be the first to comment

JAva Script Toolkit

  1. 1. JA va S cript T oolkit Easy-to-use, Adaptable, Accessible http://jastegg.it http://jastegg.it – Creative Commons 3.0 – by – nc – Diego La Monica
  2. 2. What is? A lightweight JavaScript Framework With 16kb you have a working framework A simple way to get your web-applications more “Web 2.0” JAST means: AJAX, fx, Easy DOM management The solution to make “Web 2.0” accessible JAST respects the end-user, adopt the graceful enhanchement filosofy and soon will support WAI-ARIA roles, states and properties. JA va S cript T oolkit http://jastegg.it – Creative Commons 3.0 – by – nc – Diego La Monica
  3. 3. How it works? <ul><li>Download the core (http://jastegg.it/eggs/core/ ) </li></ul><ul><li>Upload in your web-site’s script folder </li></ul><ul><li>Include the script call in the pages of your website </li></ul><ul><li>Use the functions or include other eggs without any initializations </li></ul>JA va S cript T oolkit <?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?> <!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;> <html xmlns=&quot;http://www.w3.org/1999/xhtml&quot; xml:lang=&quot;it&quot; lang=&quot;it&quot;> <head> < title>lorem ipsum</title> <script type=&quot;text/javascript&quot; src=&quot;path-to-script/JAST.js&quot;></script> <script type=&quot;text/javascript&quot;> _._works() </script> </head> <body> </body> </html> http://jastegg.it – Creative Commons 3.0 – by – nc – Diego La Monica
  4. 4. How to extend its functionality? <ul><li>Create new file </li></ul><ul><li>Use the JASTEggIt.extend( <egg>, <method> ) method </li></ul><ul><li>Save the file as JavaScript file (eg. foo-egg.js ) </li></ul><ul><li>Include the script call in the pages of your website </li></ul><ul><li>Open your page! </li></ul>JA va S cript T oolkit <?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?> <!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Strict//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&quot;> <html xmlns=&quot;http://www.w3.org/1999/xhtml&quot; xml:lang=&quot;it&quot; lang=&quot;it&quot;> <head> < title>lorem ipsum</title> <script type=&quot;text/javascript&quot; src=&quot;path-to-script/JAST.js&quot;></script> <script type=&quot;text/javascript&quot; src=&quot;path-to-script/foo-egg.js&quot;></script> </head> <body> </body> </html> http://jastegg.it – Creative Commons 3.0 – by – nc – Diego La Monica
  5. 5. JAST an example: “hello world!” Answer #1: How an Egg could run on the page contents ready? JA va S cript T oolkit JASTEggIt.extend('fooEgg‘, { startup: function(){ alert('hello world!'); } } ); Answer #2: How an Egg could run on user demand? fooEgg.js JASTEggIt.extend('fooEgg‘, { foo: function(){ alert('hello world!'); } } ); Mypage.html <script type=&quot;text/javascript“ src=“JAST.js&quot;></script> <script type=&quot;text/javascript“ src=&quot;fooEgg.js&quot;></script> <script type=&quot;text/javascript&quot;> … _.fooEgg.foo(); … </script> Step #1 Step #2 http://jastegg.it – Creative Commons 3.0 – by – nc – Diego La Monica
  6. 6. JAST do it better! <ul><li>Answer #3: When the page content are ready? </li></ul><ul><li>A temporal interval between the user request and the Load Event of the page. </li></ul><ul><li>the document “onLoad” event happens after the browser loads all contents of the pages and they are ready and ALL loaded. </li></ul><ul><li>JAST, instead, do it better: it fires the event when all page content is ready. </li></ul>JA va S cript T oolkit http://jastegg.it – Creative Commons 3.0 – by – nc – Diego La Monica
  7. 7. JAST do it! <ul><li>XML </li></ul><ul><li>Menu </li></ul><ul><li>AJAX </li></ul><ul><li>Tabbed forms </li></ul><ul><li>Easy URL Management </li></ul><ul><li>Easy DOM management </li></ul><ul><li>Custom forms representaion </li></ul><ul><li>Easy/Simple extensibile mechanism </li></ul><ul><li>Allowed Cross Site Scripting (AXSS) </li></ul><ul><li>Special Effects ( Fade / Moving / Stretching / FX Queues ) </li></ul><ul><li>Popup Box </li></ul><ul><li>Step Wizard </li></ul><ul><li>Accessible Rich Text Box </li></ul><ul><li>Step Wizard </li></ul><ul><li>Full cross browser compliant ( tested with Firefox 2.0+, Internet Explorer 6.0+, Opera, Safari 3+ ) </li></ul><ul><li>Many other things! </li></ul>JA va S cript T oolkit http://jastegg.it – Creative Commons 3.0 – by – nc – Diego La Monica
  8. 8. Who talks about JAST? <ul><li>Italian Web Design ( http://www.italianwebdesign.it ) </li></ul><ul><li>Internet Magazine nr. 124 - March 2008 “JAST non è… just another Framework!” </li></ul><ul><li>JAST is an IWA Useful Resource! </li></ul>JA va S cript T oolkit http://jastegg.it – Creative Commons 3.0 – by – nc – Diego La Monica

×