HTML5+jQueryのドラッグ&ドロップに対応したアップローダー・droparea

Gmailライクにローカル環境からブラウザに
ドラッグ&ドロップで画像をアップロード可能
にするHTML5+jQuery製のアップローダー
droparea。今後、こうしてキーボードを使う
頻度が減っていくんですかね・・HTML5の
出現で一気に加速した印象ですね。

jQuery HTML5 UploaderやjQuery File Uploadの後発に当たりますね。

droparea

イメージアップローダーです。Gmailライクにドラッグ&ドロップでアップロード出来ます。

コード

s = {
    'init': m.init,
    'start': m.start,
    'complete': m.complete,
    'instructions': 'drop an image file here',
    'over'        : 'drop file here!',
    'nosupport'   : 'No support for the File API in this web browser',
    'noimage'     : 'Unsupported file type!',
    'uploaded'    : 'Uploaded',
    'maxsize'     : '500', //Kb
    'post'        : 'upload.php'
};

jQueryプラグイン内でテキストやサイズを制御できます。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
<script src="droparea.js" type="text/javascript"></script>
    <script>
 
                $('.droparea').droparea({
                    'post' : 'upload.php',
                    'init' : function(r){
                        //console.log('my init',r);
                    },
                    'start' : function(r){
                        //console.log('my start',r);
                    },
                    'error' : function(r){
                        //console.log('my error',r);
                    },
                    'complete' : function(r){
                        //console.log('my complete',r);
                    }
                });
            </script>