• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Yui mixer
 

Yui mixer

on

  • 836 views

Quick i

Quick i

Statistics

Views

Total Views
836
Views on SlideShare
836
Embed Views
0

Actions

Likes
1
Downloads
4
Comments
0

0 Embeds 0

No embeds

Accessibility

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…
Post Comment
Edit your comment
  • How many have used YUI?How many have done FE dev?Design Patterns - Use

Yui mixer Yui mixer Presentation Transcript

  • YUI
    Open Hack Day mixer session
    Harsha Vashisht
    mail@harsharv.comhttp://www.harsharv.com
  • THOMAS ALVA EDISON
    NIKOLA TESLA
  • The web is a total mess!
  • Auto Complete
    Data Table
    Interface Widgets
    Button
    Layout
    Menu
    Calendar
    Rich Text
    Charts
    Tab View
    Container
  • Everything is fully documented with around 300 examples!
  • 1. Documentationhttp://developer.yahoo.com/yui/docs/2. Exampleshttp://developer.yahoo.com/yui/examples/
  • Now, lets have a look at what YUI has to offer.
  • 1. Data Sourcehttp://developer.yahoo.com/yui/3/datasource/
  • The DataSource Utility provides a consistent API for the retrieval of data from arbitrary sources over a variety of supported protocols.
  • Remote sources
    Polling
    Caching
    Events
  • http://developer.yahoo.com/yui/3/examples/datasource/datasource_get.html
  • YUI allows you to fetch data from YQL directly!
  • http://developer.yahoo.com/yui/3/examples/yql/simple-yql.html
  • 2. Auto complete
  • http://developer.yahoo.com/yui/3/examples/autocomplete/ac_datasource.html
  • 3. Data Charts
  • Now.. I want to draw a graph..
  • Duck.. There will be code
    Duck.. There will be code
  • My code..
    YUI().use('charts', function (Y)
    {
    varmyDataValues = [
    {category:"5/1/2010", values:2000},
    {category:"5/2/2010", values:50},
    {category:"5/3/2010", values:400},
    {category:"5/4/2010", values:200},
    {category:"5/5/2010", values:5000}
    ];
    varmychart = new Y.Chart({dataProvider:myDataValues, render:"#mychart"});
    });
  • Ain’t that kick ass???
  • Let us look at the examples page…
    http://developer.yahoo.com/yui/3/examples/
  • Harsha R. Vashishtmail@harsharv.com
    http://www.harsharv.comhttp://twitter.com/harsharv
    http://www.facebook.com/harsharvhttp://www.slideshare.net/harsharv