PacktLib: Yahoo! User Interface Library 2.x Cookbook

Yahoo! User Interface 2.x Cookbook

Credits

About the Author

About the Reviewers

Fetching the latest version of YUI 2.x

Letting YDN manage YUI dependencies dynamically

Configuring the YUILoader component

Letting YUI manage My Script dependencies

Importing JavaScript and CSS with the Get component

Configuring the Get component

Building namespaces

Including YUI CSS

Evaluating object types, the YUI way

Using hasOwnProperty to fix for...in loops

Extending JavaScript objects, the YUI way

Augmenting objects using YUI

Detecting client browser and platforms

Using the Cookie component

Using the JSON package

Using DOM and Selector Components

Introduction

Searching the document

Searching for element children and siblings

Searching for element ancestors

Working with HTML classes

Modifying element styles and HTML attributes

Element positions and sizes

Using and comparing regions

Using advanced DOM functions

Using Selector to search the DOM

Using CSS 2 and 3 Selectors with YUI

Filtering and testing nodes using selector

Using Event Component

Introduction

Using YUI to attach JavaScript event listeners

Event normalization functions

Removing event listeners

Listening for key events

Using special YUI only events

Using YUI helper event functions

Using custom events

The simple way to add custom events to classes

Using Connection Component

Introduction

Making your first AJAX request

Exploring the callback object properties

Exploring the response object properties

Handling event callback functions

Subscribing to connection events globally

Uploading files using Connection Manager

Making cross-domain AJAX requests

Other useful Connection Manager static function

Putting it all together

Using DataSource Component

Introduction

Simple examples of each DataSource type

Using the JavaScript array response type

Using the JSON response type

Using the XML ResponseType

Using the text response type

Using the HTML table response type

Exploring advanced DataSource features

Using Logger and YUI Test Components

Introduction

Writing your first log statement

Exploring the Logger component

Configuring and using the LogReader class

Using the LogWriter component

Writing your first test case

How to use assertions

Simulating user actions in your tests

Using TestSuite to manage TestCases

Using TestRunner to run tests

Using Element and Button Components

Introduction

Creating your first element object

Subscribing to events on element objects

Using AttributeProvider to attributes for classes

Manipulating the DOM using element objects

Creating your first button object

Using ButtonGroups to control related buttons

Using events with button and ButtonGroup objects

Using Menu Component

Introduction

Creating your first Menu object

Grouping related MenuItems

Adding Submenus to your Menus

Traversing a Menu instance

Adding help text to your MenuItems

Configuring Menu and MenuItem instances

Subscribing to events on Menu objects

Using the ContextMenu Menu object

Using the MenuBar Menu object

Controlling a Menu using a Button object

Using Animation Component

Introduction

Creating your first animation

Exploring the animation attributes

Using and writing easing functions

Subscribing to animation events

Animating colors

Animating with motion

Animating an element's scroll offset

Using Drag and Drop Component

Introduction

Creating your first Drag and Drop element

Configuring and using Drag and Drop manager

Handling Drag and Drop events between DD and DDTarget objects

Limiting Drag and Drop interactions by grouping instances

Constraining drag elements within a region

Using drag handles

Limiting the drag element regions for dragging

Using Container Component

Introduction

Using Module, the foundation for all containers

Exploring Overlay, a foundation for all positioned containers

Creating a JavaScript driven tooltip

Exploring the Panel infrastructure

Showing on-demand forms with dialog

Replacing browser dialogs with SimpleDialog

Adding animation effects to your containers

Using DataTable Component

Introduction

Creating a simple DataTable

Defining DataTable columns

Custom cell formatting

Manipulating columns and rows

Sorting your DataTable

Paginating your DataTable

Scrolling your DataTable

Selecting rows, columns, and cells

Inline cell editing

Retrieving remote data for DataTable

Using TreeView Component

Introduction

Creating a simple TreeView

Defining node definitions

Navigating and searching the tree

Adding and removing nodes

Animating TreeView expand and collapse

Editing the content of a node

Handling TreeView events

Working with dynamic data

Creating custom node types

Other Useful Components

Introduction

Using the Autocomplete component

Using the Calendar component

Using the History component

Using the Resize component

Using the Slider component

Using the TabView component

Some Interesting Beta Components

Introduction

Using the SWF component

Using the SWFStore component

Using the Storage component

Using the StyleSheet component

Using the Charts component

Using the Uploader component

Index