 | Level: Intermediate Greg Travis (mito@panix.com), VP, Technology Development, Dynamic Logic
31 Jan 2006 The ability to add notes and comments to your Web site can be a powerful and attractive feature for users. This tutorial demonstrates how to implement an Asynchronous JavaScript and XML (AJAX)-based user annotation system in the form of yellow sticky notes that sit on top of regular Web page content. The only additional, required configuration is a back-end Perl script that stores the annotations
In this tutorial
- What is Ajax?
- Create and run the standalone JavaScript code
- Working with bookmarklets
- Overview of the Stickies system
- Bootstrapping the Stickies code
- The Sticky class
- Interacting with the DOM tree
- Editable text nodes
- Server interaction
- Server-side storage
Prerequisites
To use this tutorial, you should have a basic familiarity with JavaScript code and DOM. Although the end is written in Perl, its implementation isn't the focus of the tutorial, so knowledge of Perl isn't required.
System requirements
You will need JavaScript enabled in your browser. You'll need the following:
- A Web server that can run any kind of Web site, and that can run a simple Common Gateway Interface (CGI) script written in Perl.This server can be the same one as the content Web server, or a different server entirely.
- The stickies require JavaScript to run. JavaScript is, as always, a moving target, so I cannot guarantee that the code in this tutorial will run in any browser. That said, I know the code works in recent versions Firefox and Mozilla.
- The source code for the Stickies system, which is in the stickies-src.zip file in the Downloads section of the tutorial.
Duration
Under 2 hours
Formats html, pdf
| | | |
