Chapter 1, Designing a Simple Quiz Application , makes use of jQuery UI's interaction components to create a quiz application. You will learn about jQuery UI's sortable, draggable, and droppable components in this chapter.

Chapter 2, Building a Jigsaw Puzzle Game, teaches you to create a Jigsaw puzzle game using some of the jQuery UI's interaction components. You will learn to divide an image into multiple tiles along with sortable techniques.

Chapter 3, Creating a Website Tour, will create a user-friendly tool to tour different parts of a web page. You will learn about jQuery UI's tooltip component and some other components in this chapter.

Chapter 4, Creating a Tabbed News Reader, teaches you to create a news reader using an external API. Using the reddit API, you will learn about creating a mashup with jQuery UI's tabs and dialog components.

Chapter 5, Implementing CAPTCHA using Draggable and Droppable, deals with creating CAPTCHAs. Using jQuery UI's draggable and droppable components, you will be able to create three different CAPTCHA implementations.

Chapter 6, Creating an Event Timeline Using a Slider, will teach you to create an interactive timeline to visualize events that occurred in different years. You will also learn different techniques of using the slider component.

Chapter 7, Using jQuery UI with Google Maps API, teaches you to use jQuery UI components with Google Maps. You will learn to control markers on a map using a slider. You will also learn to control the zoom level using a spinner.

Chapter 8, Creating a Photo Album Manager, explains how to create a photo album to display pictures. Users will be able to edit the names of any picture as well as delete and/or rearrange pictures in an album.

Chapter 9, Creating Widgets Using the Widget Factory, teaches you to create new widgets. In detailed steps, you will learn to create two different widgets to cover all aspects of the jQuery UI widget factory.

Chapter 10, Building a Color Picker with Hex RGB Conversion, creates a simple color selector tool. Along with RGB to Hex conversion, this chapter will guide you in creating a tool that will allow you to change the text as well as the background color of a page, using multiple slider and spinner components.

Chapter 11, Creating a Fully Functional Dashboard, puts together all the learning acquired through the previous 10 chapters to create a dashboard with multiple widgets. You will learn to create six different widgets in this chapter.

Appendix, Best Practices for Developing with jQuery UI, guides you with the best possible ways to create rich applications. This chapter will also teach you about the best coding practices and optimizations.

You should have a web server installed on your system. Apache is recommended but you can use IIS as well. You will also need PHP (version 5.2 or above) for some chapters. You can install all of these in a single go using a software such as Wamp Server or you can install them separately. jQuery (version 1.6 or higher recommended) and jQuery UI libraries (version 1.11.2 recommended) will also be required.

In terms of technical proficiency, this book assumes that you have worked with jQuery and jQuery UI libraries, HTML, CSS, and JSON. This book will take care of the rest.

This book is aimed at frontend developers who use jQuery and jQuery UI on a daily basis and want to take their skills of jQuery UI to an advanced level. The book provides step-by-step instructions, with details supported by pictures to help you become an expert in using different jQuery UI components.

In this book, you will find a number of styles of text that distinguish between different kinds of information. Here are some examples of these styles, and an explanation of their meaning.

Code words in text, database table names, folder names, filenames, file extensions, pathnames, dummy URLs, user input, and Twitter handles are shown as follows: "We have created a div with CSS class container which will act as parent div for all the page elements"

A block of code is set as follows:

var t = this;
  $( ".slider" ).slider(
  {
    range: "min",
    max: 255,
    slide : function (event, ui) 
    {
      t.setColor($(this), ui.value);
    },
    change : function (event, ui) 
    {
      t.setColor($(this), ui.value);
    }
  });

When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:

var t = this;
  $(".slider").slider(
  {
    range: "min",
    max: 255,
    slide : function (event, ui) 
    {
      t.setColor($(this), ui.value);
    },
    change : function (event, ui) 
    {
      t.setColor($(this), ui.value);
    }
  });

Any command-line input or output is written as follows:

# cp /usr/src/asterisk-addons/configs/cdr_mysql.conf.sample
     /etc/asterisk/cdr_mysql.conf

New terms and important words are shown in bold. Words that you see on the screen, in menus or dialog boxes for example, appear in the text like this: "clicking the Next button moves you to the next screen".

Feedback from our readers is always welcome. Let us know what you think about this book—what you liked or may have disliked. Reader feedback is important for us to develop titles that you really get the most out of.

To send us general feedback, simply send an e-mail to <[email protected]>, and mention the book title via the subject of your message.

If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, see our author guide on www.packtpub.com/authors.

Now that you are the proud owner of a Packt book, we have a number of things to help you to get the most from your purchase.