The mechanism behind: the Ajax library, the DOM element wrapper and the Asset component are assuring most of the work (handling the upload and the callback process), the DDM detects the dragged files, then your browser is doing the rest, defining the interaction between your desktop and the file input (nicely styled of course).

By now, two browsers are playing well with the demo (Safari 4, Chrome 2+).

For the firefox browser use the folowing:
http://www.thecssninja.com/demo/drag-drop_upload/

Here’s the code :

Swell.Core.Event.add('upload', 'change', function() {
    $('loader').show();
    $('foorm').xhr(function() {
        var currentEl = $('upload').current();
        $('filelist').show();
        for (var i = 0, len = currentEl.files.length; i < len; i++) {
            $('filelist').appendHTML(currentEl.files.item(i).fileName + '
');
        }
        var imgs = this.responseText.split('|');
        new Swell.Core.Asset().load('img', imgs, function(img) {
            $('loader').hide();
            $(img).appendTo('image-container');
        });
    });
});

http://blog.justswell.org/drag-and-drop-files-from-your-desktop-to-your-browser-using-javascript/
http://www.webmonkey.com/2009/08/html_5_file_api_brings_drag-and-drop_file_uploads_to_the_web/

Ajax.org Platform is a pure javascript application framework for creating real-time collaborative applications that run in the browser. Ajax.org Platform radically changes the way you write applications:

- Live markup
- Markup and JSON api
- Collaborative backbone
- 100% open source software

http://www.ajax.org/#demos/elements.chart.3dline
http://www.ajax.org/#demos/elements.flowchart

jQuery Visualize Plugin, ktorý používa HTML 5 Canvas:

$(‘table’).visualize({ type: ‘pie’, pieMargin: 10, title: ‘my Graph’ });
$(‘table’).visualize({ type: ‘line’ });
$(‘table’).visualize({ type: ‘area’ });

http://www.filamentgroup.com/examples/charting_v2/
http://www.filamentgroup.com/lab/jquery_visualize_plugin_accessible_charts_graphs_from_tables_html5_canvas/

Knižnica, využíva jQuery, orientovaná iba na klientské použitie, nezávislá na serverovej technológii, beží aj v PHP aj v ASP.NET.

// create the Grid
var grid = new Ext.grid.GridPanel({
store: store,
columns: [
{ id: 'company' , header: 'Company' , width: 160, sortable: true , dataIndex: 'company'},
{ header: 'Price' , width: 75, sortable: true , renderer: 'usMoney' , dataIndex: 'price' },
],
stripeRows: true,
autoExpandColumn: ‘company’,
height: 350,
width: 600
});

http://www.extjs.com/deploy/dev/examples/
http://examples.extjs.eu/

Google IO video ako použiť JSON na prenos dát server/client, effektívne updaty na server cez PUT a PATCH.

var head = document.getElementsByTagName(‘head’)[0];
var script = document.createElement(’script’);
script.src = ‘http://picasaweb.google.com/data/feed/api/user/’ + username + ‘?alt=json&callback=callback’;
head.appendChild(script);

http://code.google.com/events/io/2009/sessions/EvolutionGoogleDataProtocol.htm
http://code.google.com/apis/gdata/docs/json.html