完善 dnd 的功能

test/browser/demo/index.html

@@ -45,7 +45,7 @@
       <tr><th>耗时：</th><td id="g_time">0s</td></tr>
     </table>
   </fieldset>
-  <fieldset>
+  <fieldset style="display: none">
     <legend class="collapse">高级参数配置[+]</legend>
     <table style="display: none">
       <tr><th>Host</th><td> <input id="g_host" disabled /> (CORS上线之前暂时不支持修改Host)</td></tr>

test/browser/demo/src/config.js

@@ -19,6 +19,30 @@ define(function (require) {
 
     var exports = {};
 
+    // 分片上传的时候，并行的请求数目（带宽有限的情况下，太多了也没啥用）
+    exports.kParallel = 2;
+
+    // 超过了 5M 就需要分片上传（这个不是 BOS 的限制，而是我自己定义的逻辑）
+    exports.kMinFileSize = 5 * 1024 * 1024;
+
+    /**
+     * @return {{bucket:string, prefix:string}}
+     */
+    exports.getOptions = function () {
+        var match = /#\/([^\/]+)((\/[^\/]+)+)?/.exec(location.hash);
+        var bucketName = match ? match[1] : null;
+        var prefix = (match ? match[2] : '') || '';
+
+        if (prefix && prefix[0] === '/') {
+            prefix = prefix.substr(1);
+        }
+        if (prefix && !/\/$/.test(prefix)) {
+            prefix = prefix + '/';
+        }
+
+        return {bucketName: bucketName, prefix: prefix};
+    };
+
     exports.get = function () {
         var config = {
             bos: {

test/browser/demo/src/dnd.js

@@ -16,6 +16,18 @@ define(function (require) {
 
     var $ = require('jquery');
     var u = require('underscore');
+    var async = require('async');
+
+    var config = require('./config');
+    var Klient = require('./client');
+    var fileList = require('./file-list');
+    var TaskManager = require('./task_manager');
+    var Task = require('./task');
+
+    /**
+     * @type {TaskManager}
+     */
+    var gTM = null;
 
     function onDragOver(e) {
         e.preventDefault();
@@ -29,6 +41,11 @@ define(function (require) {
     function onDropFiles(e) {
         e.preventDefault();
 
+        gTM = new TaskManager();
+        gTM.startup().then(function () {
+            console.log('gTM.done');
+        });
+
         u.each(e.originalEvent.dataTransfer.items, function (item) {
             var entry = item.webkitGetAsEntry();
             if (entry) {
@@ -44,6 +61,11 @@ define(function (require) {
         if (entry.isFile) {
             entry.file(function (file) {
                 console.log('File: ', path + file.name);
+
+                var options = config.getOptions();
+                var bucketName = options.bucketName;
+                var key = options.prefix + path + file.name;
+                gTM.addTask(new Task(bucketName, key, file, options));
             });
         }
         else if (entry.isDirectory) {

test/browser/demo/src/file-list.js

@@ -22,6 +22,7 @@ define(function (require) {
     var etpl = require('etpl');
     var u = require('underscore');
 
+    var config = require('./config');
     var Klient = require('./client');
     var kPageCount = 10;
 
@@ -32,34 +33,27 @@ define(function (require) {
         $('.file-list tbody').html(html);
     }
 
-    function getListObjectsOptions() {
-        var match = /#\/([^\/]+)((\/[^\/]+)+)?/.exec(location.hash);
-        var bucketName = match ? match[1] : null;
-        var prefix = (match ? match[2] : '') || '';
-
-        if (prefix && prefix[0] === '/') {
-            prefix = prefix.substr(1);
-        }
-        if (prefix && !/\/$/.test(prefix)) {
-            prefix = prefix + '/';
-        }
-
-        var options = {
+    function getOptions() {
+        var options = u.extend({
             maxKeys: kPageCount,
             marker: '',
-            delimiter: '/',
-            prefix: prefix,
-            bucketName: bucketName
-        };
+            delimiter: '/'
+        }, config.getOptions());
 
         return options;
     }
 
+    var working = false;
     function loadDirectory() {
+        if (working) {
+            return;
+        }
+        working = true;
+
         var client = Klient.createInstance();
         if (location.hash.length > 2) {
             // listObjects
-            var options = getListObjectsOptions();
+            var options = getOptions();
             var bucketName = options.bucketName;
             delete options.bucketName;
             if (bucketName) {
@@ -71,6 +65,9 @@ define(function (require) {
                             button.parents('tfoot').show();
                             button.data('next-marker', res.body.nextMarker);
                         }
+                    })
+                    .fin(function () {
+                        working = false;
                     });
                 return;
             }
@@ -85,6 +82,9 @@ define(function (require) {
                     item.is_dir = true;
                 });
                 renderBody('TPL_list_buckets', {rows: buckets});
+            })
+            .fin(function () {
+                working = false;
             });
     }
 
@@ -94,7 +94,7 @@ define(function (require) {
         var nextMarker = button.data('next-marker');
 
         // listObjects
-        var options = getListObjectsOptions();
+        var options = getOptions();
         var bucketName = options.bucketName;
         delete options.bucketName;
         options.marker = nextMarker;
@@ -131,6 +131,10 @@ define(function (require) {
             });
     }
 
+    exports.refresh = function () {
+        loadDirectory();
+    };
+
     exports.init = function () {
         loadDirectory();
         $(window).on('hashchange', loadDirectory);

test/browser/demo/src/helper.js

@@ -14,17 +14,12 @@
 define(function (require) {
     var exports = {};
 
-    // 超过了 5M 就需要分片上传（这个不是 BOS 的限制，而是我自己定义的逻辑）
-    var kMinFileSize = 5 * 1024 * 1024;
-
-    // 分片上传的时候，并行的请求数目（带宽有限的情况下，太多了也没啥用）
-    var kParallel = 2;
-
     var sdk = require('baidubce-sdk');
     var u = require('underscore');
     var async = require('async');
 
     var Klient = require('./client');
+    var config = require('./config');
 
     function uploadSingleFile(client, bucketName, key, blob, options) {
         var ext = key.split(/\./g).pop();
@@ -42,7 +37,7 @@ define(function (require) {
 
     function getTasks(file, uploadId, bucketName, key) {
         var leftSize = file.size;
-        var minPartSize = kMinFileSize;
+        var minPartSize = config.kMinFileSize;
         var offset = 0;
         var partNumber = 1;
 
@@ -115,7 +110,7 @@ define(function (require) {
                     loaded: 0,
                     total: tasks.length
                 };
-                async.mapLimit(tasks, kParallel, uploadPartFile(state, client), function (err, results) {
+                async.mapLimit(tasks, config.kParallel, uploadPartFile(state, client), function (err, results) {
                     if (err) {
                         deferred.reject(err);
                     }
@@ -142,19 +137,18 @@ define(function (require) {
         options = options || {};
         var client = opt_client || Klient.createInstance();
 
-        if (blob.size > kMinFileSize) {
+        if (blob.size > config.kMinFileSize) {
             return uploadSuperFile(client, bucketName, key, blob, options);
         }
-        else {
-            client.on('progress', function (evt) {
-                client.emit('bosprogress', {
-                    lengthComputable: evt.lengthComputable,
-                    loaded: evt.loaded,
-                    total: evt.total
-                });
+
+        client.on('progress', function (evt) {
+            client.emit('bosprogress', {
+                lengthComputable: evt.lengthComputable,
+                loaded: evt.loaded,
+                total: evt.total
             });
-            return uploadSingleFile(client, bucketName, key, blob, options);
-        }
+        });
+        return uploadSingleFile(client, bucketName, key, blob, options);
     };
 
     return exports;

test/browser/demo/src/task.js

@@ -0,0 +1,52 @@
+/**
+ * Copyright (c) 2014 Baidu.com, Inc. All Rights Reserved
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on
+ * an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations under the License.
+ */
+
+define(function (require) {
+    var helper = require('./helper');
+
+    /**
+     * @constructor
+     * @param {string} bucketName The bucket name.
+     * @param {string} key The object name.
+     * @param {Blob} blob 需要上传的文件内容.
+     * @param {Object=} options 上传文件的参数.
+     * @param {sdk.BosClient=} client The bos client.
+     */
+    function Task(bucketName, key, blob, options, client) {
+        this.bucketName = bucketName;
+        this.key = key;
+        this.blob = blob;
+        this.options = options;
+        this.client = client;
+    }
+
+    /**
+     * @return {sdk.Q.promise}
+     */
+    Task.prototype.run = function () {
+        return helper.upload(this.bucketName, this.key, this.blob, this.options, this.client);
+    };
+
+    return Task;
+});
+
+
+
+
+
+
+
+
+
+
+/* vim: set ts=4 sw=4 sts=4 tw=120: */

test/browser/demo/src/task_manager.js

@@ -0,0 +1,103 @@
+/**
+ * Copyright (c) 2014 Baidu.com, Inc. All Rights Reserved
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on
+ * an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations under the License.
+ */
+
+define(function (require) {
+    var u = require('underscore');
+    var sdk = require('baidubce-sdk');
+
+    var config = require('./config');
+
+    /**
+     * 上传文件夹的时候，文件的列表是异步获取的，无法直接使用 async 的接口
+     * @constructor
+     */
+    function TaskManager() {
+        /**
+         * 最多可以同时运行的任务数目.
+         * @type {number}
+         */
+        this.parallel = config.kParallel;
+
+        /**
+         * @type {number}
+         * 当前运行的任务数目
+         */
+        this.running = 0;
+
+        /**
+         * FIFO
+         * @type {Array.<Task>}
+         */
+        this.tasks = [];
+
+        this.deferred = sdk.Q.defer();
+    }
+
+    /**
+     * @param {Task} task 需要执行的任务.
+     */
+    TaskManager.prototype.addTask = function (task) {
+        this.tasks.push(task);
+        this.runNext();
+    };
+
+    TaskManager.prototype.runNext = function () {
+        if (this.running >= this.parallel) {
+            return;
+        }
+
+        if (this.tasks.length <= 0) {
+            this.deferred.resolve();
+            return;
+        }
+
+        // FIFO
+        var task = this.tasks.shift();
+        if (task && typeof task.run === 'function') {
+            this.running ++;
+            task.run()
+                .done(u.bind(this.runTaskSuccess, this))
+                .catch(u.bind(this.runTaskFailure, this));
+        }
+    };
+
+    TaskManager.prototype.runTaskFailure = function (err) {
+        this.deferred.reject(err);
+    };
+
+    TaskManager.prototype.runTaskSuccess = function () {
+        this.running--;
+        this.runNext();
+    };
+
+    /**
+     * 开始执行 this.tasks 里面的任务.
+     * @return {sdk.Q.promise}
+     */
+    TaskManager.prototype.startup = function () {
+        return this.deferred.promise;
+    };
+
+    return TaskManager;
+});
+
+
+
+
+
+
+
+
+
+
+/* vim: set ts=4 sw=4 sts=4 tw=120: */