Today is a big step forward for us, we are proud to feature the first showcase of our Drag&Drop implementation.

This is not what you may think about, you may think about drag & drop as being stuck inside your browser window but today what we’re going to show is a new way of conceiving drag & drop applications. The one you have always waiting for, imagine interacting with the browser chrome and your OS…

In the video, we are providing a simple yet powerful application to import a RSS feed in your webpage. The classical way is to type in the feed URL  and then getting redirected to it, which commonly takes 3 to 5 steps.  With this implementation you just have to drop the rss icon onto an appropriate target and that’s all folks!

We use YQL and JSONP to transform RSS into JSON and of course a Swell Element to dynamically attach the behavior to the webpage.

Here’s the Javascript code to handle this.

var dd2 = new Swell.Lib.DD.Droppable('moo');
 
dd2.ondrop = function(e) {
    var file = this.getData(e, 'DD_URL').split("\n")[0];
    if (/^http\:\/\//i.test(file) !== true) {
        return false;
    }
    $('debug').setHTML('loading…');
    e.target.className = '';
 
    var yqlRequest = 'http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20rss%20where%20url=%22'+file+'%22&format=json&callback=moo';
    html.script({
        'type' : 'text/javascript',
        'src'  : yqlRequest
    }).appendTo(document.getElementsByTagName('head')[0]);
}

And the full video.

The Swell guys tries to set high standards in terms of code quality and usability, but first and foremost, always think about the future of web appps and how they can ease the process of using these features in your fav browser today.
That’s why we are working on the first native Drag & drop implementation in a Javascript library, just think about the possibilities of making the web interacting with your desktop…

We are also working on WebSockets implementation in Swell using XMLHttp Streaming, this will talk to Comet fans