Free Sample
+ Collection

Yahoo User Interface Library 2.x Cookbook

Matt Snider

Over 70 simple incredibly effective recipes for taking control of Yahoo! User Interface Library like a Pro
RRP $26.99
RRP $44.99
Print + eBook

Want this title & more?

$12.99 p/month

Subscribe to PacktLib

Enjoy full and instant access to over 2000 books and videos – you’ll find everything you need to stay ahead of the curve and make sure you can always get the job done.

Book Details

ISBN 139781849511629
Paperback436 pages

About This Book

  • Easily develop feature-rich internet applications to interact with the user using various built-in components of YUI library
  • Simple and powerful recipes explaining how to use and implement YUI 2.x components
  • Gain a thorough understanding of the YUI tools
  • Plenty of example code to help you improve your coding and productivity with the YUI Library
  • Hands-on solutions that takes a practical approach to recipes

Who This Book Is For

If you are a web application developer and have some prior experience with or interest in using YUI 2.x to improve the UI of their web applications, then this book is for you. It assumes the reader has prior knowledge of JavaScript, HTML, CSS, and basic understanding of how a website works. This book provides an easy-to-use guide for implementing YUI 2.x components, and does not require an expertise in either JavaScript or YUI.

Table of Contents

Chapter 1: USING YUI 2.x
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 loops
Extending JavaScript objects, the YUI way
Augmenting objects using YUI
Detecting client browser and platforms
Using the Cookie component
Using the JSON package
Chapter 2: Using DOM and Selector Components
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
Chapter 3: Using Event Component
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
Chapter 4: Using Connection Component
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
Chapter 5: Using DataSource Component
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
Chapter 6: Using Logger and YUI Test Components
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
Chapter 7: Using Element and Button Components
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
Chapter 8: Using Menu Component
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
Chapter 9: Using Animation Component
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
Chapter 10: Using Drag and Drop Component
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
Chapter 11: Using Container Component
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
Chapter 12: Using DataTable Component
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
Chapter 13: Using TreeView Component
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
Chapter 14: Other Useful Components
Using the Autocomplete component
Using the Calendar component
Using the History component
Using the Resize component
Using the Slider component
Using the TabView component
Chapter 15: Some Interesting Beta Components
Using the SWF component
Using the SWFStore component
Using the Storage component
Using the StyleSheet component
Using the Charts component
Using the Uploader component

What You Will Learn

  • Understand how YUI 2.x works and what features are available
  • Understand how YUI components interact with the DOM, and why
  • Effortlessly search the DOM and listen for end-user events
  • Simplify retrieving server-side data using AJAX and DataSource
  • Learn how to load your scripts and CSS on demand
  • Create sophisticated HTML-based panels, tooltips, and dialogs
  • Make interactive inputs with AutoComplete
  • Harness the power of drag and drop for your UI
  • Build sortable, dynamic tables using DataTable
  • Design richer user interfaces using YUI buttons and menus
  • Show data hierarchies using the TreeView
  • Explore some of the more recent beta components
  • Take control of your UI as you master YUI 2.x


In Detail

The Yahoo! User Interface (YUI) Library is a set of utilities and controls, written in JavaScript, for building richly interactive web applications using techniques such as DOM scripting, DHTML, and AJAX. Although you can create stylish Internet applications by modifying its default components, even advanced users find it challenging to create impressive feature-rich Internet applications using YUI.

This book will help you learn how to use YUI 2.x to build richer, more interactive web applications that impress clients and wow your friends. It has recipes explaining over twenty-five YUI components, showing how to use them, and how to configure them to meet your needs. Each covered component will have extractable code samples that showcase the common ways that the component is used.

The book starts by explaining the core features of YUI 2.x, the utilities that the rest of the library depends on and that will make your life easier. It then explains how to build UI components and make AJAX requests using the YUI framework. Each recipe will cover the most common ways to use a component, how to configure it, and then explain any other features that may be available. We wrap things up by looking at some of the recent beta components and explain how to use them, and how they may be useful on your web application.

For each of the recipes, there is an introductory example, then more advanced examples, followed by an explanation of how the component works and what YUI is doing. For more experienced developers, most recipes also include additional discussion of the solution, explaining to further customize and enhance the component.


Read More

Recommended for You

Learning the Yahoo! User Interface library
$ 16.20
Web Application Development with Yii 2 and PHP
$ 21.99
Instant Yii 1.1 Application Development Starter
$ 12.99