O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

PHP and script.aculo.us Web 2.0 Application Interfaces

Book Description

Build powerful interactive AJAX applications with script.aculo.us and PHP

  • Get started quickly with script.aculo.us library with as little as one line of code

  • Explore Prototype library features, tutorials, code, and examples

  • Learn script.aculo.us' In-place Editing, Auto Completion, Sliders, Drag-and-Drop, Effects, and Multimedia

  • A book with less jargon, and more code explanation for building real-world examples â??Tadalist clone, Digg and Delicious clones, 43things.com clone

In Detail

script.aculo.us is a JavaScript library that provides dynamic visual effects, user interface controls, and robust AJAX features. It is to client-side what PHP is to server-side â?? powerful, simple, complete fun, and above all, a MUST! As developers, we all dream of building applications that users can instantly fall in love with and get productive. Simple and niche applications are the future of web applications. script.aculo.us when used with PHP as a server-side scripting language, can give us a new way of looking at things and changing the way we work.

script.aculo.us provides you with easy-to-use, cross-browser user interface JavaScript libraries to enhance your web sites and web applications. It provides dynamic visual effects, user interface controls, and robust AJAX features. This book covers all aspects for a developer to learn and master the art of using advanced JavaScript also referred to as 2.0 aspects in PHP web applications. script.aculo.us is an effective and powerful add-on to the Prototype library and when combined with PHP, it can make a lot of difference. The difference every developer dreams of.

This book has been written keeping in view every basic step as well as covering the most complex aspects while writing our applications â?? from simple effects, to the AJAX way of communicating through systems in applications. It gives you a completely new way of adding interactivity to your web applications. You will learn how sript.aculo.us provides interactivity and beauty to your project so that it engages users and appeals to the masses.

Faster, more efficient, and more productive applications are what we are trying to build. Each chapter of this book has been hand-crafted to make sure that you as a developer can learn and master the art of making beautiful applications.

The book covers all the various aspects of script.aculo.us with a few real-world clone projects, which will surely help you explore your creative side.

The aim of this book is to make you go "WOW"!

Table of Contents

  1. PHP and script.aculo.us Web 2.0 Application Interfaces
  2. Credits
  3. About the author
  4. About the reviewers
  5. Preface
    1. What this book covers
    2. Who this book is for
    3. Conventions
    4. Reader feedback
    5. Customer support
      1. Downloading the example code for the book
      2. Errata
      3. Piracy
      4. Questions
  6. 1. About script.aculo.us
    1. Welcome to the script.aculo.us world
    2. Versions
    3. The script.aculo.us fun begins
      1. Effects
      2. Drag and drop
      3. AJAX
    4. Much more fun
    5. Summary
  7. 2. Exploring Client-side Techniques with Prototype
    1. About Prototype
      1. The story so far: Versions
      2. Compatibility
    2. Prototype features − a walk-through
      1. Getting started with Dollar, DOM, and more
      2. AJAX components − an overview
        1. Ajax.Request
        2. Ajax.Updater
        3. Ajax.PeriodicalUpdater
        4. Ajax.Responders
      3. Hands-on examples
          1. Username availability script using Ajax.Request
          2. Display username availability script using Ajax.Updater
    3. Event handling
      1. Description
      2. Handling general events
        1. Syntax
      3. Handling mouse events
      4. Handling keyboard events
      5. Hands-on examples
        1. Handling the keyboard events example
        2. Handling mouse event example
    4. Redefining forms with Prototype
      1. Introduction
      2. Description
      3. Usage
      4. Hands-on examples
    5. Getting more hands-on
      1. Hands-on example: How to use XML to read data from the server using Prototype
    6. Summary
  8. 3. Server-side Techniques with PHP and MySQL
    1. Basic requirements
      1. A word about PHP 5.0 or above
      2. A word about MySQL 5.0
      3. The WAMP server: A must-have for Windows users
      4. phpMyAdmin
    2. Getting the playground ready
      1. Checking the PHP installation using the WAMP server
      2. Checking the MySQL installation using the WAMP server
      3. Adding Prototype library in our code
      4. Adding the script.aculo.us library in our code
      5. Basic classes
        1. DBConfig.php
        2. DBClass.php
        3. Secure.php
    3. Hands-on examples: Common scripts
      1. User login management system
        1. Signup.php
        2. Login.php
        3. Index.php
        4. Logout.php
      2. Adding a username availability script to the login management system
      3. Creating a simple tag cloud
    4. Summary
  9. 4. Adding Effects and Multimedia to User Interface Design
    1. Introduction to effects
    2. Types of effects
      1. Common parameters
      2. Code usage
    3. Hands-on examples
      1. The core effects
      2. Various effects
      3. Combining all the effects
    4. Playing sounds with script.aculo.us
      1. Types of sounds
        1. MP3 sounds
      2. Code usage
      3. A hands-on example
    5. Summary
  10. 5. AJAX Drag and Drop Feature using script.aculo.us
    1. Introduction to the drag and drop feature
    2. Explanation of the drag and drop feature
    3. Code usage of the drag and drop feature
    4. Hands-on example: Creating a drag and drop sample in one line of code
    5. Hands-on example: Advanced drag and drop tutorial
    6. Summary
  11. 6. In-place Editing using script.aculo.us
    1. An introduction to the in-place editing feature
    2. Getting started with in-place editing
    3. Code usage of the in-place editing features and options
      1. Tips and tricks with in-place editing
        1. Disabling the element for the in-place editing functionality
        2. Entering into the edit mode
        3. Submitting on Blur
        4. Callbacks for onEnterEditMode and onLeaveEditMode
      2. Hands-on example: In-place editing with server-side handling
      3. Hands-on example: InPlaceCollectionEditor
      4. Summary
  12. 7. Creating Autocompletion using script.aculo.us
    1. Introduction to autocompletion
    2. Explanation of the autocompletion feature
      1. Types of autocompletion sources
        1. Remote sources
        2. Local sources
      2. Options for autocompletion sources
        1. Options for remote sources
        2. Options for local sources
    3. Code usage of autocompletion using remote sources
          1. Adding options to our constructor
    4. Code usage of autocompletion using local sources
          1. Adding options to our constructor
    5. Hands-on example: Autocompletion using remote sources
    6. Hands-on example: Advanced autocompletion using remote sources for multiple fields
    7. Hands-on example: Autocompletion using local sources
    8. Summary
  13. 8. Slider for Dynamic Applications using script.aculo.us
    1. First steps with slider
      1. Parameters for the slider definition
      2. Options with the slider
      3. Types of slider
        1. Vertical slider
        2. Horizontal slider
    2. Code usage for the slider
      1. Code usage for the vertical slider
      2. Code usage for the horizontal slider
      3. Code usage for sliders with options
    3. Tips and tricks with the slider
      1. Reading the current value of the slider
      2. Multiple handles in the slider
      3. Disabling the slider
      4. Enabling the slider
    4. Hands-on example: Using vertical and horizontal slider
    5. Summary
  14. 9. script.aculo.us in One Go
    1. Hands-on example: Multiple script.aculo.us features mash up
      1. Adding in-place editing in page
      2. Adding effects to the page
      3. How about adding the drag and drop feature?
      4. Out of the box thinking − adding multiple features to an element
    2. Hands-on example: Quick revision of all the features of script.aculo.us in one page
      1. Let's start with effects
      2. Some in-place editing
      3. A little bit of drag and drop
      4. The slider needs to be in picture too
      5. How can we miss music?
    3. Summary
  15. 10. Todonow: A Tadalist Clone
    1. The BIG picture
    2. Features and functionality
    3. Creating a database playground
    4. Let's log in...
    5. User interface comes first
    6. View all my lists
      1. Logic and code
    7. View all my lists along with a summary of incomplete items
      1. Logic and code
    8. Creating new lists
      1. Logic and code
    9. Adding items to our lists
      1. Adding items to the database
      2. Reading the newly added item and placing it back on the page
    10. Adding effects to our items
    11. Mark items as completed
      1. Add the item to the completed <div>
      2. Delete the item from the incomplete <div>
      3. Change the status of the item to completed
    12. Convert completed items to incomplete status
      1. Add the item to the incomplete <div>
      2. Delete the item from the complete <div>
      3. Change the status of the item to incomplete
    13. Deleting lists
    14. Let's wrap up and log out
    15. Our Todonow is ready to go live
    16. Summary
  16. 11. Creating Delicious and Digg Bookmarks Manager
    1. Application at a glance
    2. Features and functionality
    3. The database playground for our application
    4. User profile home page
    5. Submit new tutorials
      1. Submitting a tutorial URL
      2. Adding title, description, and tags to the tutorial
    6. View tutorial
    7. Deleting tutorials
    8. Search using real-time autocompletion
    9. Exploring the tag cloud features of 2.0 applications
      1. Adding tags to tutorials
      2. Reading all the tags in the database
      3. Creating a tag cloud
      4. Search using tags
    10. Don't forget to log out
    11. Ideas for life
    12. Summary
  17. 12. Creating a Shopping Search Engine
    1. Application at a glance
    2. Features and functionalities
    3. The user management system
    4. Selecting the products to buy
    5. Adding effects
    6. Searching products
    7. Searching products using the tag cloud
      1. Generating a tag cloud
      2. View products for a tag name
    8. Summary
  18. 13. Common 43: 43 Things, 43 Places, and 43 People Clones
    1. Getting the database ready
      1. Database for places
      2. Database for people
      3. Database for things
    2. Advanced commenting system
      1. Creating a comments form
      2. Posting comments
      3. Edit or Delete comments
    3. Modules ready to go live
      1. User management system
      2. Tag cloud features
    4. Adding 2.0 flavour to applications
      1. AJAX modules
      2. Effects
      3. Real-time search
      4. In-place editing
      5. Drag and drop
    5. Putting the building blocks together
      1. Features and functionalities
    6. Summary