OAT (OpenLink AJAX Toolkit) is a JavaScript-based toolkit for browser-independent Rich Internet Application development. It includes a rich collection of UI Widgets/Controls, Event Management System, and a truly platform independent Data Access Layer called AJAX Database Connectivity.
For maximum effect when viewing this Toolkit demo, please set your desktop resolution to at least 1024x768 pixels.
Usage
Using this toolkit is as simple as including two .js files in the <head> portion of an HTML document, and specifying
a list of features you want to use. The framework will build the dependency tree and dynamically include all needed (and no other!)
files.
OAT works in Gecko browsers (Firefox, Mozilla/SeaMonkey), IE6, Opera and Apple WebKit.
This particular demonstration page is XHTML/1.0 Strict valid.
Licensing information
OpenLink Software's Ajax Toolkit (OAT)
Copyright (C) 2006 Ondrej Zara
Copyright (C) 2006 OpenLink Software
This software is licensed under the GNU General Public License (see
COPYING).
Note that the only valid version of the GPL license as far as this project
is concerned is the original GNU General Public License Version 2, dated
June 1991.
Bar Chart
Bar Chart - percentage
Grid
Interactive Pivot table
Use the select-box above the table to select a desired aggragate function
Use the link below the table to toggle a Pivot chart
Click the main heading (left top corner) to change numerical type
Click any aggregate heading to change the order and filter values
Drag any aggregate heading to any place that becomes red
Aggregate function:
Date picker
Color picker
Click rectangle to change its color
AJAX
Asynchronous HTTP calls are easily available. Test them by specifying a search term (at least 5 chars); this script will tell you how many pages Google finds.
Tree control
/
boot
kernel
etc
resolv.conf
inittab
lib
modules
share
usr
var
log
messages
JSON - JavaScript Object Notation
Click the button to display the whole JSON library in appropriate notation in the space below...
Can be used for personalized home page or similar. Drag these boxes around to see what they can do...
Welcome!
This is your home page.
News?
Everyone wants to have some cool boxes for syndicating news via RSS/ATOM today...
Weather forecast
Is another possibility for filling these draggable things up.
Google
[first three results will be displayed here]
Panelbar
This whole page is organized into parts using the Panelbar control (on the left side of the page).
Its interface is well known from many user applications and web sites, and allows quick, easy, and intuitive navigation across multiple topics.
Ticker
Hover on any flag to see a short description...
Dimmer
This control allows creation of DOM elements with 'modal' property, i.e., the user is unable to interact with
any other objects while the modal element is shown.
This box is now modal. You may not click anything on the page until this box is closed.
Cryptography
Basic cryptographic routines can be found in this library.
As you write text into input below, base64 version and two hashes are dynamically updated.
Base64 encoded:
MD5 hash:
SHA hash:
Statistics
Click the button below to generate a fresh set of random data.
Number of values:
Maximum value:
Data:
QuickEdit (or Edit-in-place)
This one might come handy when users want to quickly edit some portion of text displayed on page.
Feel free to change the text below to suit your needs.
Dear sir,
I would like to thank you for the information you recently sent me.
It proved to be very useful.
Yours, XXX
Combo list
Similar to existing <select> boxes, this one also provides a possibility of direct user input.
Combo button
Enables user to specify an action to be performed when button is clicked. Suitable for applications where multiple actions can
be performed over one set of data.
Combo box
This one is basically an enhanced <select> which allows richer options.
Fish Eye
Pure eye-candy, well known from Apple systems. Also known as 'dock'. Please note that images are not displayed correctly in IE because of its known PNG support issues.
Ghost Drag
Offers the well-known drag'n'drop functionality. User drags element's 'ghost',
which may be dropped on a landing zone to perform some action. Otherwise, the 'ghost' returns back. Try this by putting
some fruit items into this shopping cart:
This is a generic window. It may be resized & dragged, just like any other element.
It can, of course, contain any HTML markup:
One
Two
Three
An important feature of these windows is that they automatically choose their look, based on operating system used.
So they are rectangular on Windows, and rounded/brushed on Mac.
Slider
Value:
WebDAV Browser
Click on buttons to see WebDAV Browser in actions.
Use 'demo' when asked for credentials.
Documentation
The documentation project aims to describe all crucial objects and methods of OAT. It is available as a simple JS application here.