• Save
YUI for your Hacks-IITB
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

YUI for your Hacks-IITB

on

  • 8,084 views

YUI for your Hacks, talk for University hack day in IIT Mumbai

YUI for your Hacks, talk for University hack day in IIT Mumbai

Statistics

Views

Total Views
8,084
Views on SlideShare
8,081
Embed Views
3

Actions

Likes
3
Downloads
22
Comments
4

1 Embed 3

http://www.linkedin.com 3

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
  • *CLICK the LINK to keep updated on all the latest Mods/Glitches*
    adf.ly\QBJDM
    Are you sure you want to
    Your message goes here
    Processing…
  • http://fileace.com/t5f0v
    Are you sure you want to
    Your message goes here
    Processing…
  • real hack
    http://www.slideshare.net
    Are you sure you want to
    Your message goes here
    Processing…
  • Wanna hack Facebook, Yahoo, Hotmail, Gmail, Myspace, Skype??? Someones cheating on you? or just want to prank a friend? contact Monsterzero609atsafe-maildotnet.......for a fair price ;)
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

YUI for your Hacks-IITB Presentation Transcript

  • 1. YUI for your Hacks http://developer.yahoo.com/yui/ University Hack Day – IIT Mumbai
  • 2. Yahoo! Internal presentation Subramanyan Murali Maps Frontend Engineer, Hacker
  • 3.
    • “ The browser is an inefficient application platform”
    • -Douglas Crockford
    Yahoo! Hack U
  • 4.
    • It is an dynamic environment with a lot of inconsistencies …
    Yahoo! Hack U
  • 5.
    • … hence we end up spending more time fixing the mess, rather than developing
    Yahoo! Hack U
  • 6.
    • To abstract out all this mess, we built
    Yahoo! Hack U
  • 7.
    • Do more with less
    Yahoo! Hack U
  • 8.
    • Enough talk, show me the code !!
    Yahoo! Hack U
  • 9.
    • <script type=&quot;text/javascript&quot; src=&quot; http://yui.yahooapis.com/2.6.0/build/yahoo-dom-event/yahoo-dom-event.js &quot; ></script>
    Yahoo! Hack U
  • 10.
    • Enabling Drag Drop …
    Yahoo! Hack U Step 1 – Include http://yui.yahooapis.com/2.6.0/build/dragdrop/dragdrop-min.js Step 2 – the code var dd1 = new YAHOO.util.DD(&quot;element1&quot;); That simple ….
  • 11.
    • YUI tells you what happened and when through Custom Events
    Yahoo! Hack U
  • 12.
    • Animation is easy too 
    Yahoo! Hack U
  • 13.
    • <div id=&quot; test &quot;></div>
    • <script>
    • var myAnim = new YAHOO.util.Anim (' test ', {
    • width: { to : 400 }
    • }, 1, YAHOO.util.Easing.easeOut );
    • myAnim. animate ();
    • </script>
    Yahoo! Hack U
  • 14.
    • Fetching data from a remote host forms basis of most hacks
    Yahoo! Hack U
  • 15.
    • Ajax = YUI connection manager
    • http://developer.yahoo.com/yui/connection/
    Yahoo! Hack U
  • 16.
    • <script src=&quot; http://yui.yahooapis.com/2.6.0/build/connection/connection-min.js &quot;></script>
    Yahoo! Hack U
  • 17.
    • <script>
    • var callback =
    • {
    • success : function( o ) { /*success handler code*/ },
    • failure : function( o ) { /*failure handler code*/ },
    • }
    • var transaction = YAHOO.util.Connect.asyncRequest ('GET', sUrl, callback , null);
    • </script>
    Yahoo! Hack U
  • 18.
    • Cross domain request can be through a same origin proxy …
    Yahoo! Hack U
  • 19.
    • … or through dynamic script node attach
    Yahoo! Hack U
  • 20.
    • Write your own script attach routine, or use YUI get Utility
    • http://developer.yahoo.com/yui/get/
    Yahoo! Hack U
  • 21.
    • … Or use my implementation
    • http://indiahacku.in/subram/dataFetch.js
    Yahoo! Hack U
  • 22.
    • Var url = “ http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20flickr.photos.search(120)%20where%20tags%3D%22hacku%22 ”;
    • YAHOO.remoteData.fetch (url, callBack, scopeObj, JsonCallback);
    Yahoo! Hack U
  • 23.
    • Better presentation = great layouts using = YUI Layout Manager
    • http://developer.yahoo.com/yui/layout/
    Yahoo! Hack U
  • 24.
    • Fluid CSS layouts using YUI Grids
    • http://developer.yahoo.com/yui/grids/
    • Grid building made easy with YUI grind Builder
    • http://developer.yahoo.com/yui/grids/builder/
    Yahoo! Hack U
  • 25.
    • Present modules with YUI Container widgets
    • http://developer.yahoo.com/yui/container/
    Yahoo! Hack U
  • 26.
    • Building things has never been easier
    Yahoo! Hack U
  • 27. Yahoo! Hack U Tab view Slider Data Table Carousel Tree view Rich Text Editor Layout Manager Grid Builder DOM & Event Element Connection Get YQL Pipes Yahoo! APIs Cool app / hack / innovation
  • 28. Yahoo! Hack U Close to 300 examples http://developer.yahoo.com/yui/examples/
  • 29.
    • Hack away !!
    Yahoo! Hack U