From 33357efdf1291d836a7c969a16e881ac2a461e83 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BA=9E=E4=B8=9C=E6=97=AD?= <850374051@qq.com>
Date: Tue, 18 May 2021 11:15:53 +0800
Subject: [PATCH] =?UTF-8?q?=E5=89=8D=E7=AB=AF=E6=8E=A5=E5=8F=A3=E5=AF=B9?=
 =?UTF-8?q?=E6=8E=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 index.html                                    |    2 +-
 static/css/listingItems/items.css             |    4 +-
 static/css/user/user.css                      |   18 +-
 static/js/api/index.js                        |    2 +-
 static/js/api/user.js                         |   39 +
 static/js/common/main.js                      |    5 +
 static/js/common/tools.js                     |   49 +-
 static/js/lib/webUploader/uploader.js         | 5437 +++++++++++++++++
 static/js/lib/webUploader/webUploader.js      |  240 +
 .../lib/webUploader/webuploader.flashonly.js  | 4042 ++++++++++++
 .../webUploader/webuploader.flashonly.min.js  |    2 +
 .../announcementList/announcementDetail.js    |   10 +-
 .../announcementList/announcementList.js      |    8 +-
 .../project/announcementList/attestation.js   |   12 +-
 static/js/project/bidding/biddingList.js      |    8 +-
 static/js/project/demand/demand.js            |    8 +-
 static/js/project/index.js                    |   34 +-
 static/js/project/interact/interact.js        |    4 +-
 static/js/project/listingItems/items.js       |   28 +-
 static/js/project/listingItems/itemsList.js   |   49 +-
 static/js/project/new/new.js                  |    4 +-
 static/js/project/new/newDetail.js            |    2 +-
 static/js/project/policy/policy.js            |   12 +-
 static/js/project/user/index.js               |  223 +-
 view/listingItems/itemsList.html              |    7 +-
 view/login/login.html                         |   12 +-
 view/user/user.html                           |  316 +-
 27 files changed, 10292 insertions(+), 285 deletions(-)
 create mode 100644 static/js/api/user.js
 create mode 100644 static/js/lib/webUploader/uploader.js
 create mode 100644 static/js/lib/webUploader/webUploader.js
 create mode 100644 static/js/lib/webUploader/webuploader.flashonly.js
 create mode 100644 static/js/lib/webUploader/webuploader.flashonly.min.js

diff --git a/index.html b/index.html
index e9bc3ce..6d65806 100644
--- a/index.html
+++ b/index.html
@@ -82,7 +82,7 @@
 <!--                    </ul>-->
 <!--                </div>-->
                 <div class="fr">
-                    <a href="view/user/user.html">请登录</a>
+                    <a href="view/login/login.html">请登录</a>
                     <a href="view/login/register.html">免费注册</a>
                 </div>
                 <div class="clear"></div>
diff --git a/static/css/listingItems/items.css b/static/css/listingItems/items.css
index c083960..3fd11f9 100644
--- a/static/css/listingItems/items.css
+++ b/static/css/listingItems/items.css
@@ -50,8 +50,8 @@
 }
 
 .auction_hall_table_tab_select {
-    color: #FFFFFF;
-    background: #007b76;
+    color: #FFFFFF!important;
+    background: #007b76!important;
 }
 
 .data_input, .data_input2, .data_input3, .data_input4 {
diff --git a/static/css/user/user.css b/static/css/user/user.css
index 396880a..6a41d45 100644
--- a/static/css/user/user.css
+++ b/static/css/user/user.css
@@ -32,15 +32,30 @@
 }
 
 .userTable input[type='button']{
+    background: #e1e1e1;
+    padding: 8px 15px;
+    color: #848484;
+    border: none;
+    border-radius: 20px;
+}
+
+.userTable .active{
+    background: #007b76!important;
+    color: #FFFFFF!important;
+}
+
+.userTable input[type='button']:hover{
     background: #007b76;
     padding: 8px 15px;
-    color: #ffffff;
+    color: #FFFFFF;
     border: none;
     border-radius: 20px;
+    cursor: pointer;
 }
 
 .userTable table tr td span{
     color: red;
+    cursor: pointer;
 }
 
 .userTable table tr td{
@@ -56,6 +71,7 @@
     width: 90%;
     height: 36px;
     margin-left: 10px;
+    padding-left: 10px;
 }
 
 .userTable table tr:first-child td{
diff --git a/static/js/api/index.js b/static/js/api/index.js
index 3baed19..4b9ef2a 100644
--- a/static/js/api/index.js
+++ b/static/js/api/index.js
@@ -2,7 +2,7 @@
 *  获取用户、登录、注册相关
 -----------------*/
 var captchaImage_get = '/captchaImage';  //图形验证码接口
-var login_post = '/login';    //用户登录接口       
+var login_post = '/login';    //用户登录接口
 var getInfo_get = '/getInfo'  //获取用户信息
 
 
diff --git a/static/js/api/user.js b/static/js/api/user.js
new file mode 100644
index 0000000..eee1a15
--- /dev/null
+++ b/static/js/api/user.js
@@ -0,0 +1,39 @@
+/*--------------
+*  用户类
+-----------------*/
+
+/*
+@purl /transaction/website/member/{id}
+@param
+*/
+var userUpdate = '/transaction/website/member'  //修改用户信息类接口
+
+/*
+@purl /getInfo
+@param
+*/
+var userData = '/getInfo'  //修改用户信息类接口
+
+/*
+@purl /transaction/website/member/{id}
+@param
+*/
+var userMember = '/transaction/member/userId'  //用户信息类接口
+
+/*
+@purl /transaction/demand/supplyDemandList/member
+@param
+*/
+var userSupply = '/transaction/demand/supplyDemandList/member'  //我的供求类接口
+
+/*
+@purl /transaction/communicate/communicateList/member
+@param
+*/
+var userConsulting = '/transaction/communicate/communicateList/member'  //我的咨询类接口
+
+/*
+@purl /transaction/outproject/biddinglist/member
+@param
+*/
+var userBidding = '/transaction/outproject/biddinglist/member'  //我的竞价类接口
\ No newline at end of file
diff --git a/static/js/common/main.js b/static/js/common/main.js
index 5f0b6c3..3e40798 100644
--- a/static/js/common/main.js
+++ b/static/js/common/main.js
@@ -29,6 +29,7 @@ requirejs.config({
         demandApi: 'api/demand', //个人供求接口
         policyApi: 'api/policy',//政策法规接口
         interactApi: 'api/interact',//互动交流接口
+        user: 'api/user'//用户信息接口
     },
     shim: {
         bootstrap: {
@@ -52,6 +53,10 @@ requirejs.config({
         paging: {
             deps: ['jquery'],
             exports: 'paging'
+        },
+        uploader:{
+            deps: ['jquery','webuploader','flashonly','flashonlyMin'],
+            exports: 'uploader'
         }
     }
 });
diff --git a/static/js/common/tools.js b/static/js/common/tools.js
index 50b9515..1327436 100644
--- a/static/js/common/tools.js
+++ b/static/js/common/tools.js
@@ -39,7 +39,52 @@ define(['jquery', 'dialog'], function ($, dialog) {
 					var msg = data.msg;
 					if (code === 401) {
 						_this.initDialog('系统提示', '登录状态已过期，您可以继续留在该页面，或者重新登录', function () {
-							_this.skip('/user/login.html')
+							_this.skip('/view/login/login.html')
+						}, '重新登录', function () { }, "取消")
+					} else if (code === 500) {
+						_this.initError(msg)
+						cb(data);
+					} else if (code != 200) {
+						_this.initError(msg)
+					} else {
+						cb(data);
+					}
+				}
+			});
+		},
+		/**
+		 * ajax put
+		 * @param url (String)
+		 * @param data (Json) 需要提交的数据
+		 * @param cb(Function) 回调函数
+		 * @param Bearer(Boolean) 是否需要Bearer,不需要传true
+		 */
+		doPut: function (url, data, cb, Bearer) {
+			var _this = this;
+			var headAttribute = '';
+			if (Bearer && Bearer == true || _this.getCookie('Admin-Token') == '') {
+				headAttribute = function (xhr) {
+					xhr.setRequestHeader("Content-Type", 'application/json;charset=utf-8');
+				}
+			} else {
+				headAttribute = function (xhr) {
+					xhr.setRequestHeader("Content-Type", 'application/json;charset=utf-8');
+					xhr.setRequestHeader('Authorization', 'Bearer ' + _this.getCookie('Admin-Token'))
+				}
+			}
+			$.ajax({
+				url: ajaxJsUrl + url + '?=' + Math.random(),
+				type: 'put',
+				data: JSON.stringify(data),
+				dataType: 'json',
+				contentType: "application/json",
+				beforeSend: headAttribute,
+				success: function (data) {
+					var code = data.code;
+					var msg = data.msg;
+					if (code === 401) {
+						_this.initDialog('系统提示', '登录状态已过期，您可以继续留在该页面，或者重新登录', function () {
+							_this.skip('/view/login/login.html')
 						}, '重新登录', function () { }, "取消")
 					} else if (code === 500) {
 						_this.initError(msg)
@@ -92,7 +137,7 @@ define(['jquery', 'dialog'], function ($, dialog) {
 					var msg = data.msg;
 					if (code === 401) {
 						_this.initDialog('系统提示', '登录状态已过期，您可以继续留在该页面，或者重新登录', function () {
-							_this.skip('/user/login.html')
+							_this.skip('/view/login/login.html')
 						}, '重新登录', function () { }, "取消")
 					} else if (code === 500) {
 						_this.initError(msg)
diff --git a/static/js/lib/webUploader/uploader.js b/static/js/lib/webUploader/uploader.js
new file mode 100644
index 0000000..cff0594
--- /dev/null
+++ b/static/js/lib/webUploader/uploader.js
@@ -0,0 +1,5437 @@
+/* WebUploader 0.1.0 */
+(function( window, undefined ) {
+    /**
+     * @fileOverview 让内部各个部件的代码可以用[amd](https://github.com/amdjs/amdjs-api/wiki/AMD)模块定义方式组织起来。
+     *
+     * AMD API 内部的简单不完全实现，请忽略。只有当WebUploader被合并成一个文件的时候才会引入。
+     */
+    var internalAmd = (function( global, undefined ) {
+            var modules = {},
+    
+                // 简单不完全实现https://github.com/amdjs/amdjs-api/wiki/require
+                require = function( deps, callback ) {
+                    var args, len, i;
+    
+                    // 如果deps不是数组，则直接返回指定module
+                    if ( typeof deps === 'string' ) {
+                        return getModule( deps );
+                    } else {
+                        args = [];
+                        for( len = deps.length, i = 0; i < len; i++ ) {
+                            args.push( getModule( deps[ i ] ) );
+                        }
+    
+                        return callback.apply( null, args );
+                    }
+                },
+    
+                // 内部的define，暂时不支持不指定id.
+                define = function( id, deps, factory ) {
+                    if ( arguments.length === 2 ) {
+                        factory = deps;
+                        deps = null;
+                    }
+    
+                    if ( typeof id !== 'string' || !factory ) {
+                        throw new Error('Define Error');
+                    }
+    
+                    require( deps || [], function() {
+                        setModule( id, factory, arguments );
+                    });
+                },
+    
+                // 设置module, 兼容CommonJs写法。
+                setModule = function( id, factory, args ) {
+                    var module = {
+                            exports: factory
+                        },
+                        returned;
+    
+                    if ( typeof factory === 'function' ) {
+                        args.length || (args = [ require, module.exports, module ]);
+                        returned = factory.apply( null, args );
+                        returned !== undefined && (module.exports = returned);
+                    }
+    
+                    modules[ id ] = module.exports;
+                },
+    
+                // 根据id获取module
+                getModule = function( id ) {
+                    var module = modules[ id ] || global[ id ];
+    
+                    if ( !module ) {
+                        throw new Error( '`' + id + '` is undefined' );
+                    }
+    
+                    return module;
+                };
+    
+            return {
+                define: define,
+                require: require,
+    
+                // 暴露所有的模块。
+                modules: modules
+            };
+        })( window ),
+    
+        /* jshint unused: false */
+        require = internalAmd.require,
+        define = internalAmd.define;
+
+    /**
+     * @fileOverview 基础类方法。
+     */
+    
+    /**
+     * Web Uploader内部类的详细说明，以下提及的功能类，都可以在`WebUploader`这个变量中访问到。
+     *
+     * As you know, Web Uploader的每个文件都是用过[AMD](https://github.com/amdjs/amdjs-api/wiki/AMD)规范中的`define`组织起来的, 每个Module都会有个module id.
+     * 默认module id该文件的路径，而此路径将会转化成名字空间存放在WebUploader中。如：
+     *
+     * * module `base`：WebUploader.Base
+     * * module `file`: WebUploader.File
+     * * module `lib/dnd`: WebUploader.Lib.Dnd
+     * * module `runtime/html5/dnd`: WebUploader.Runtime.Html5.Dnd
+     *
+     *
+     * 以下文档将可能省略`WebUploader`前缀。
+     * @module WebUploader
+     * @title WebUploader API文档
+     */
+    define( 'base', [
+        'jQuery'
+    ], function( $ ) {
+    
+        var noop = function() {},
+            call = Function.call;
+    
+        // http://jsperf.com/uncurrythis
+        // 反科里化
+        function uncurryThis( fn ) {
+            return function() {
+                return call.apply( fn, arguments );
+            };
+        }
+    
+        function bindFn( fn, context ) {
+            return Function.prototype.bind ? fn.bind( context ) : function() {
+                return fn.apply( context, arguments );
+            };
+        }
+    
+        function createObject( proto ) {
+            var f;
+    
+            if ( Object.create ) {
+                return Object.create( proto );
+            } else {
+                f = function() {};
+                f.prototype = proto;
+                return new f();
+            }
+        }
+    
+    
+        /**
+         * 基础类，提供一些简单常用的方法。
+         * @class Base
+         */
+        return {
+    
+            /**
+             * @property {String} version 当前版本号。
+             */
+            version: '0.1.0',
+    
+            /**
+             * @property {jQuery|Zepto} $ 引用依赖的jQuery或者Zepto对象。
+             */
+            $: $,
+    
+            /**
+             * 创建一个[Deferred](http://api.jquery.com/category/deferred-object/)对象。
+             * 详细的Deferred用法说明，请参照jQuery的API文档。
+             *
+             * Deferred对象在钩子回掉函数中经常要用到，用来处理需要等待的异步操作。
+             *
+             *
+             * @method Deferred
+             * @grammar Base.Deferred() => Deferred
+             * @example
+             * // 在文件开始发送前做些异步操作。
+             * // WebUploader会等待此异步操作完成后，开始发送文件。
+             * Uploader.register({
+             *     'before-send-file': 'doSomthingAsync'
+             * }, {
+             *
+             *     doSomthingAsync: function() {
+             *         var deferred = Base.Deferred();
+             *
+             *         // 模拟一次异步操作。
+             *         setTimeout(deferred.resolve, 2000);
+             *
+             *         return deferred.promise();
+             *     }
+             * });
+             */
+            Deferred: $.Deferred,
+    
+            /**
+             * 判断传入的参数是否为一个promise对象。
+             * @method isPromise
+             * @grammar Base.isPromise( anything ) => Boolean
+             * @param  {*}  anything 检测对象。
+             * @return {Boolean}
+             * @example
+             * console.log( Base.isPromise() );    // => false
+             * console.log( Base.isPromise({ key: '123' }) );    // => false
+             * console.log( Base.isPromise( Base.Deferred().promise() ) );    // => true
+             *
+             * // Deferred也是一个Promise
+             * console.log( Base.isPromise( Base.Deferred() ) );    // => true
+             */
+            isPromise: function( anything ) {
+                return anything && typeof anything.then === 'function';
+            },
+    
+    
+            /**
+             * 返回一个promise，此promise在所有传入的promise都完成了后完成。
+             * 详细请查看[这里](http://api.jquery.com/jQuery.when/)。
+             *
+             * @method when
+             * @grammar Base.when( promise1[, promise2[, promise3...]] ) => Promise
+             */
+            when: $.when,
+    
+            /**
+             * @description  简单的浏览器检查结果。
+             *
+             * * `webkit`  webkit版本号，如果浏览器为非webkit内核，此属性为`undefined`。
+             * * `chrome`  chrome浏览器版本号，如果浏览器为chrome，此属性为`undefined`。
+             * * `ie`  ie浏览器版本号，如果浏览器为非ie，此属性为`undefined`。**暂不支持ie10+**
+             * * `firefox`  firefox浏览器版本号，如果浏览器为非firefox，此属性为`undefined`。
+             * * `safari`  safari浏览器版本号，如果浏览器为非safari，此属性为`undefined`。
+             * * `opera`  opera浏览器版本号，如果浏览器为非opera，此属性为`undefined`。
+             *
+             * @property {Object} [browser]
+             */
+            browser: (function( ua ) {
+                var ret = {},
+                    webkit = ua.match( /WebKit\/([\d.]+)/ ),
+                    chrome = ua.match( /Chrome\/([\d.]+)/ ) ||
+                        ua.match( /CriOS\/([\d.]+)/ ),
+    
+                    ie = ua.match( /MSIE\s([\d.]+)/ ),
+                    firefox = ua.match( /Firefox\/([\d.]+)/ ),
+                    safari = ua.match( /Safari\/([\d.]+)/ ),
+                    opera = ua.match( /OPR\/([\d.]+)/ );
+    
+                webkit && (ret.webkit = parseFloat( webkit[ 1 ] ));
+                chrome && (ret.chrome = parseFloat( chrome[ 1 ] ));
+                ie && (ret.ie = parseFloat( ie[ 1 ] ));
+                firefox && (ret.firefox = parseFloat( firefox[ 1 ] ));
+                safari && (ret.safari = parseFloat( safari[ 1 ] ));
+                opera && (ret.opera = parseFloat( opera[ 1 ] ));
+    
+                return ret;
+            })( navigator.userAgent ),
+    
+            /**
+             * 实现类与类之间的继承。
+             * @method inherits
+             * @grammar Base.inherits( super ) => child
+             * @grammar Base.inherits( super, protos ) => child
+             * @grammar Base.inherits( super, protos, statics ) => child
+             * @param  {Class} super 父类
+             * @param  {Object | Function} [protos] 子类或者对象。如果对象中包含constructor，子类将是用此属性值。
+             * @param  {Function} [protos.constructor] 子类构造器，不指定的话将创建个临时的直接执行父类构造器的方法。
+             * @param  {Object} [statics] 静态属性或方法。
+             * @return {Class} 返回子类。
+             * @example
+             * function Person() {
+             *     console.log( 'Super' );
+             * }
+             * Person.prototype.hello = function() {
+             *     console.log( 'hello' );
+             * };
+             *
+             * var Manager = Base.inherits( Person, {
+             *     world: function() {
+             *         console.log( 'World' );
+             *     }
+             * });
+             *
+             * // 因为没有指定构造器，父类的构造器将会执行。
+             * var instance = new Manager();    // => Super
+             *
+             * // 继承子父类的方法
+             * instance.hello();    // => hello
+             * instance.world();    // => World
+             *
+             * // 子类的__super__属性指向父类
+             * console.log( Manager.__super__ === Person );    // => true
+             */
+            inherits: function( Super, protos, staticProtos ) {
+                var child;
+    
+                if ( typeof protos === 'function' ) {
+                    child = protos;
+                    protos = null;
+                } else if ( protos && protos.hasOwnProperty('constructor') ) {
+                    child = protos.constructor;
+                } else {
+                    child = function() {
+                        return Super.apply( this, arguments );
+                    };
+                }
+    
+                // 复制静态方法
+                $.extend( true, child, Super, staticProtos || {} );
+    
+                /* jshint camelcase: false */
+    
+                // 让子类的__super__属性指向父类。
+                child.__super__ = Super.prototype;
+    
+                // 构建原型，添加原型方法或属性。
+                // 暂时用Object.create实现。
+                child.prototype = createObject( Super.prototype );
+                protos && $.extend( true, child.prototype, protos );
+    
+                return child;
+            },
+    
+            /**
+             * 一个不做任何事情的方法。可以用来赋值给默认的callback.
+             * @method noop
+             */
+            noop: noop,
+    
+            /**
+             * 返回一个新的方法，此方法将已指定的`context`来执行。
+             * @grammar Base.bindFn( fn, context ) => Function
+             * @method bindFn
+             * @example
+             * var doSomething = function() {
+             *         console.log( this.name );
+             *     },
+             *     obj = {
+             *         name: 'Object Name'
+             *     },
+             *     aliasFn = Base.bind( doSomething, obj );
+             *
+             *  aliasFn();    // => Object Name
+             *
+             */
+            bindFn: bindFn,
+    
+            /**
+             * 引用Console.log如果存在的话，否则引用一个[空函数loop](#WebUploader:Base.log)。
+             * @grammar Base.log( args... ) => undefined
+             * @method log
+             */
+            log: (function() {
+                if ( window.console ) {
+                    return bindFn( console.log, console );
+                }
+                return noop;
+            })(),
+    
+            nextTick: (function() {
+    
+                return function( cb ) {
+                    setTimeout( cb, 1 );
+                };
+    
+                // @bug 当浏览器不在当前窗口时就停了。
+                // var next = window.requestAnimationFrame ||
+                //     window.webkitRequestAnimationFrame ||
+                //     window.mozRequestAnimationFrame ||
+                //     function( cb ) {
+                //         window.setTimeout( cb, 1000 / 60 );
+                //     };
+    
+                // // fix: Uncaught TypeError: Illegal invocation
+                // return bindFn( next, window );
+            })(),
+    
+            /**
+             * 被[uncurrythis](http://www.2ality.com/2011/11/uncurrying-this.html)的数组slice方法。
+             * 将用来将非数组对象转化成数组对象。
+             * @grammar Base.slice( target, start[, end] ) => Array
+             * @method slice
+             * @example
+             * function doSomthing() {
+             *     var args = Base.slice( arguments, 1 );
+             *     console.log( args );
+             * }
+             *
+             * doSomthing( 'ignored', 'arg2', 'arg3' );    // => Array ["arg2", "arg3"]
+             */
+            slice: uncurryThis( [].slice ),
+    
+            /**
+             * 生成唯一的ID
+             * @method guid
+             * @grammar Base.guid() => String
+             * @grammar Base.guid( prefx ) => String
+             */
+            guid: (function() {
+                var counter = 0;
+    
+                return function( prefix ) {
+                    var guid = (+new Date()).toString( 32 ),
+                        i = 0;
+    
+                    for ( ; i < 5; i++ ) {
+                        guid += Math.floor( Math.random() * 65535 ).toString( 32 );
+                    }
+    
+                    return (prefix || 'wu_') + guid + (counter++).toString( 32 );
+                };
+            })(),
+    
+            /**
+             * 格式化文件大小, 输出成带单位的字符串
+             * @method formatSize
+             * @grammar Base.formatSize( size ) => String
+             * @grammar Base.formatSize( size, pointLength ) => String
+             * @grammar Base.formatSize( size, pointLength, units ) => String
+             * @param {Number} size 文件大小
+             * @param {Number} [pointLength=2] 精确到的小数点数。
+             * @param {Array} [units=[ 'B', 'K', 'M', 'G', 'TB' ]] 单位数组。从字节，到千字节，一直往上指定。如果单位数组里面只指定了到了K(千字节)，同时文件大小大于M, 此方法的输出将还是显示成多少K.
+             * @example
+             * console.log( Base.formatSize( 100 ) );    // => 100B
+             * console.log( Base.formatSize( 1024 ) );    // => 1.00K
+             * console.log( Base.formatSize( 1024, 0 ) );    // => 1K
+             * console.log( Base.formatSize( 1024 * 1024 ) );    // => 1.00M
+             * console.log( Base.formatSize( 1024 * 1024 * 1024 ) );    // => 1.00G
+             * console.log( Base.formatSize( 1024 * 1024 * 1024, 0, ['B', 'KB', 'MB'] ) );    // => 1024MB
+             */
+            formatSize: function( size, pointLength, units ) {
+                var unit;
+    
+                units = units || [ 'B', 'K', 'M', 'G', 'TB' ];
+    
+                while ( (unit = units.shift()) && size > 1024 ) {
+                    size = size / 1024;
+                }
+    
+                return (unit === 'B' ? size : size.toFixed( pointLength || 2 )) +
+                        unit;
+            }
+        };
+    });
+
+    /**
+     * @fileOverview Mediator
+     */
+    define( 'mediator', [
+        'base'
+    ], function( Base ) {
+        var $ = Base.$,
+            slice = [].slice,
+            separator = /\s+/,
+            protos;
+    
+        // 根据条件过滤出事件handlers.
+        function findHandlers( arr, name, callback, context ) {
+            return $.grep( arr, function( handler ) {
+                return handler &&
+                        (!name || handler.e === name) &&
+                        (!callback || handler.cb === callback ||
+                        handler.cb._cb === callback) &&
+                        (!context || handler.ctx === context);
+            });
+        }
+    
+        function eachEvent( events, callback, iterator ) {
+            // 不支持对象，只支持多个event用空格隔开
+            $.each( (events || '').split( separator ), function( _, key ) {
+                iterator( key, callback );
+            });
+        }
+    
+        function triggerHanders( events, args ) {
+            var stoped = false,
+                i = -1,
+                len = events.length,
+                handler;
+    
+            while ( ++i < len ) {
+                handler = events[ i ];
+    
+                if ( handler.cb.apply( handler.ctx2, args ) === false ) {
+                    stoped = true;
+                    break;
+                }
+            }
+    
+            return !stoped;
+        }
+    
+        protos = {
+    
+            /**
+             * 绑定事件。
+             *
+             * `callback`方法在执行时，arguments将会来源于trigger的时候携带的参数。如
+             * ```javascript
+             * var obj = {};
+             *
+             * // 使得obj有事件行为
+             * Mediator.installTo( obj );
+             *
+             * obj.on( 'testa', function( arg1, arg2 ) {
+             *     console.log( arg1, arg2 ); // => 'arg1', 'arg2'
+             * });
+             *
+             * obj.trigger( 'testa', 'arg1', 'arg2' );
+             * ```
+             *
+             * 如果`callback`中，某一个方法`return false`了，则后续的其他`callback`都不会被执行到。
+             * 切会影响到`trigger`方法的返回值，为`false`。
+             *
+             * `on`还可以用来添加一个特殊事件`all`, 这样所有的事件触发都会响应到。同时此类`callback`中的arguments有一个不同处，
+             * 就是第一个参数为`type`，记录当前是什么事件在触发。此类`callback`的优先级比脚低，会再正常`callback`执行完后触发。
+             * ```javascript
+             * obj.on( 'all', function( type, arg1, arg2 ) {
+             *     console.log( type, arg1, arg2 ); // => 'testa', 'arg1', 'arg2'
+             * });
+             * ```
+             *
+             * @method on
+             * @grammar on( name, callback[, context] ) => self
+             * @param  {String}   name     事件名，支持多个事件用空格隔开
+             * @param  {Function} callback 事件处理器
+             * @param  {Object}   [context]  事件处理器的上下文。
+             * @return {self} 返回自身，方便链式
+             * @chainable
+             * @class Mediator
+             */
+            on: function( name, callback, context ) {
+                var me = this,
+                    set;
+    
+                if ( !callback ) {
+                    return this;
+                }
+    
+                set = this._events || (this._events = []);
+    
+                eachEvent( name, callback, function( name, callback ) {
+                    var handler = { e: name };
+    
+                    handler.cb = callback;
+                    handler.ctx = context;
+                    handler.ctx2 = context || me;
+                    handler.id = set.length;
+    
+                    set.push( handler );
+                });
+    
+                return this;
+            },
+    
+            /**
+             * 绑定事件，且当handler执行完后，自动解除绑定。
+             * @method once
+             * @grammar once( name, callback[, context] ) => self
+             * @param  {String}   name     事件名
+             * @param  {Function} callback 事件处理器
+             * @param  {Object}   [context]  事件处理器的上下文。
+             * @return {self} 返回自身，方便链式
+             * @chainable
+             */
+            once: function( name, callback, context ) {
+                var me = this;
+    
+                if ( !callback ) {
+                    return me;
+                }
+    
+                eachEvent( name, callback, function( name, callback ) {
+                    var once = function() {
+                            me.off( name, once );
+                            return callback.apply( context || me, arguments );
+                        };
+    
+                    once._cb = callback;
+                    me.on( name, once, context );
+                });
+    
+                return me;
+            },
+    
+            /**
+             * 解除事件绑定
+             * @method off
+             * @grammar off( [name[, callback[, context] ] ] ) => self
+             * @param  {String}   [name]     事件名
+             * @param  {Function} [callback] 事件处理器
+             * @param  {Object}   [context]  事件处理器的上下文。
+             * @return {self} 返回自身，方便链式
+             * @chainable
+             */
+            off: function( name, cb, ctx ) {
+                var events = this._events;
+    
+                if ( !events ) {
+                    return this;
+                }
+    
+                if ( !name && !cb && !ctx ) {
+                    this._events = [];
+                    return this;
+                }
+    
+                eachEvent( name, cb, function( name, cb ) {
+                    $.each( findHandlers( events, name, cb, ctx ), function() {
+                        delete events[ this.id ];
+                    });
+                });
+    
+                return this;
+            },
+    
+            /**
+             * 触发事件
+             * @method trigger
+             * @grammar trigger( name[, args...] ) => self
+             * @param  {String}   type     事件名
+             * @param  {*} [...] 任意参数
+             * @return {Boolean} 如果handler中return false了，则返回false, 否则返回true
+             */
+            trigger: function( type ) {
+                var args, events, allEvents;
+    
+                if ( !this._events || !type ) {
+                    return this;
+                }
+    
+                args = slice.call( arguments, 1 );
+                events = findHandlers( this._events, type );
+                allEvents = findHandlers( this._events, 'all' );
+    
+                return triggerHanders( events, args ) &&
+                        triggerHanders( allEvents, arguments );
+            }
+        };
+    
+        /**
+         * 中介者，它本身是个单例，但可以通过[installTo](#WebUploader:Mediator:installTo)方法，使任何对象具备事件行为。
+         * 主要目的是负责模块与模块之间的合作，降低耦合度。
+         *
+         * @class Mediator
+         */
+        return $.extend({
+    
+            /**
+             * 可以通过这个接口，使任何对象具备事件功能。
+             * @method installTo
+             * @param  {Object} obj 需要具备事件行为的对象。
+             * @return {Object} 返回obj.
+             */
+            installTo: function( obj ) {
+                return $.extend( obj, protos );
+            }
+    
+        }, protos );
+    });
+
+    /**
+     * @fileOverview Uploader上传类
+     */
+    define( 'uploader', [
+        'base',
+        'mediator'
+    ], function( Base, Mediator ) {
+    
+        var $ = Base.$;
+    
+        /**
+         * 上传入口类。
+         * @class Uploader
+         * @constructor
+         * @grammar new Uploader( opts ) => Uploader
+         * @example
+         * var uploader = WebUploader.Uploader({
+         *     swf: 'path_of_swf/Uploader.swf',
+         *
+         *     // 开起分片上传。
+         *     chunked: true
+         * });
+         */
+        function Uploader( opts ) {
+            this.options = $.extend( true, {}, Uploader.options, opts );
+            this._init( this.options );
+        }
+    
+        // default Options
+        // widgets中有相应扩展
+        Uploader.options = {};
+        Mediator.installTo( Uploader.prototype );
+    
+        // 批量添加纯命令式方法。
+        $.each({
+            upload: 'start-upload',
+            stop: 'stop-upload',
+            getFile: 'get-file',
+            getFiles: 'get-files',
+            // addFile: 'add-file',
+            // addFiles: 'add-file',
+            removeFile: 'remove-file',
+            skipFile: 'skip-file',
+            retry: 'retry',
+            isInProgress: 'is-in-progress',
+            makeThumb: 'make-thumb',
+            getDimension: 'get-dimension',
+            addButton: 'add-btn',
+            getRuntimeType: 'get-runtime-type',
+            refresh: 'refresh',
+            disable: 'disable',
+            enable: 'enable'
+        }, function( fn, command ) {
+            Uploader.prototype[ fn ] = function() {
+                return this.request( command, arguments );
+            };
+        });
+    
+        $.extend( Uploader.prototype, {
+            state: 'pending',
+    
+            _init: function( opts ) {
+                var me = this;
+    
+                me.request( 'init', opts, function() {
+                    me.state = 'ready';
+                    me.trigger('ready');
+                });
+            },
+    
+            /**
+             * 获取或者设置Uploader配置项。
+             * @method option
+             * @grammar option( key ) => *
+             * @grammar option( key, val ) => self
+             * @example
+             *
+             * // 初始状态图片上传前不会压缩
+             * var uploader = new WebUploader.Uploader({
+             *     resize: null;
+             * });
+             *
+             * // 修改后图片上传前，尝试将图片压缩到1600 * 1600
+             * uploader.options( 'resize', {
+             *     width: 1600,
+             *     height: 1600
+             * });
+             */
+            option: function( key, val ) {
+                var opts = this.options;
+    
+                // setter
+                if ( arguments.length > 1 ) {
+    
+                    if ( $.isPlainObject( val ) &&
+                            $.isPlainObject( opts[ key ] ) ) {
+                        $.extend( opts[ key ], val );
+                    } else {
+                        opts[ key ] = val;
+                    }
+    
+                } else {    // getter
+                    return key ? opts[ key ] : opts;
+                }
+            },
+    
+            /**
+             * 获取文件统计信息。返回一个包含一下信息的对象。
+             * * `successNum` 上传成功的文件数
+             * * `uploadFailNum` 上传失败的文件数
+             * * `cancelNum` 被删除的文件数
+             * * `invalidNum` 无效的文件数
+             * * `queueNum` 还在队列中的文件数
+             * @method getStats
+             * @grammar getStats() => Object
+             */
+            getStats: function() {
+                // return this._mgr.getStats.apply( this._mgr, arguments );
+                var stats = this.request('get-stats');
+    
+                return {
+                    successNum: stats.numOfSuccess,
+    
+                    // who care?
+                    // queueFailNum: 0,
+                    cancelNum: stats.numOfCancel,
+                    invalidNum: stats.numOfInvalid,
+                    uploadFailNum: stats.numOfUploadFailed,
+                    queueNum: stats.numOfQueue
+                };
+            },
+    
+            // 需要重写此方法来来支持opts.onEvent和instance.onEvent的处理器
+            trigger: function( type/*, args...*/ ) {
+                var args = [].slice.call( arguments, 1 ),
+                    opts = this.options,
+                    name = 'on' + type.substring( 0, 1 ).toUpperCase() +
+                        type.substring( 1 );
+    
+                if ( Mediator.trigger.apply( this, arguments ) === false ) {
+                    return false;
+                }
+    
+                if ( $.isFunction( opts[ name ] ) &&
+                        opts[ name ].apply( this, args ) === false ) {
+                    return false;
+                }
+    
+                if ( $.isFunction( this[ name ] ) &&
+                        this[ name ].apply( this, args ) === false ) {
+                    return false;
+                }
+    
+                return true;
+            },
+    
+            // widgets/widget.js将补充此方法的详细文档。
+            request: Base.noop,
+    
+            reset: function() {
+                // @todo
+            }
+        });
+    
+        /**
+         * 创建Uploader实例，等同于new Uploader( opts );
+         * @method create
+         * @class Base
+         * @static
+         * @grammar Base.create( opts ) => Uploader
+         */
+        Base.create = function( opts ) {
+            return new Uploader( opts );
+        };
+    
+        // 暴露Uploader，可以通过它来扩展业务逻辑。
+        Base.Uploader = Uploader;
+    
+        return Uploader;
+    });
+
+    /**
+     * @fileOverview Runtime管理器，负责Runtime的选择, 连接
+     */
+    define( 'runtime/runtime', [
+        'base',
+        'mediator'
+    ], function( Base, Mediator ) {
+    
+        var $ = Base.$,
+            factories = {},
+    
+            // 获取对象的第一个key
+            getFirstKey = function( obj ) {
+                for ( var key in obj ) {
+                    if ( obj.hasOwnProperty( key ) ) {
+                        return key;
+                    }
+                }
+                return null;
+            };
+    
+        // 接口类。
+        function Runtime( options ) {
+            this.options = $.extend({
+                container: document.body
+            }, options );
+            this.uid = Base.guid('rt_');
+        }
+    
+        $.extend( Runtime.prototype, {
+    
+            getContainer: function() {
+                var opts = this.options,
+                    parent, container;
+    
+                if ( this._container ) {
+                    return this._container;
+                }
+    
+                parent = opts.container || $( document.body );
+                container = $( document.createElement('div') );
+    
+                container.attr( 'id', 'rt_' + this.uid );
+                container.css({
+                    position: 'absolute',
+                    top: '0px',
+                    left: '0px',
+                    width: '1px',
+                    height: '1px',
+                    overflow: 'hidden'
+                });
+    
+                parent.append( container );
+                parent.addClass( 'webuploader-container' );
+                this._container = container;
+                return container;
+            },
+    
+            init: Base.noop,
+            exec: Base.noop,
+    
+            destroy: function() {
+                if ( this._container ) {
+                    this._container.parentNode.removeChild( this.__container );
+                }
+    
+                this.off();
+            }
+        });
+    
+        Runtime.orders = 'html5,flash';
+    
+    
+        /**
+         * 添加Runtime实现。
+         * @param {String} type    类型
+         * @param {Runtime} factory 具体Runtime实现。
+         */
+        Runtime.addRuntime = function( type, factory ) {
+            factories[ type ] = factory;
+        };
+    
+        Runtime.hasRuntime = function( type ) {
+            return !!(type ? factories[ type ] : getFirstKey( factories ));
+        };
+    
+        Runtime.create = function( opts, orders ) {
+            var type, runtime;
+    
+            orders = orders || Runtime.orders;
+            $.each( orders.split( /\s*,\s*/g ), function() {
+                if ( factories[ this ] ) {
+                    type = this;
+                    return false;
+                }
+            });
+    
+            type = type || getFirstKey( factories );
+    
+            if ( !type ) {
+                throw new Error('Runtime Error');
+            }
+    
+            runtime = new factories[ type ]( opts );
+            return runtime;
+        };
+    
+        Mediator.installTo( Runtime.prototype );
+        return Runtime;
+    });
+
+    /**
+     * @fileOverview Runtime管理器，负责Runtime的选择, 连接
+     */
+    define( 'runtime/client', [
+        'base',
+        'mediator',
+        'runtime/runtime'
+    ], function( Base, Mediator, Runtime ) {
+    
+        var cache = (function() {
+                var obj = {};
+    
+                return {
+                    add: function( runtime ) {
+                        obj[ runtime.uid ] = runtime;
+                    },
+    
+                    get: function( ruid ) {
+                        var i;
+    
+                        if ( ruid ) {
+                            return obj[ ruid ];
+                        }
+    
+                        for ( i in obj ) {
+                            return obj[ i ];
+                        }
+    
+                        return null;
+                    },
+    
+                    remove: function( runtime ) {
+                        delete obj[ runtime.uid ];
+                    },
+    
+                    has: function() {
+                        return !!this.get.apply( this, arguments );
+                    }
+                };
+            })();
+    
+        function RuntimeClient( component, standalone ) {
+            var deferred = Base.Deferred(),
+                runtime;
+    
+            this.uid = Base.guid('client_');
+    
+            this.runtimeReady = function( cb ) {
+                return deferred.done( cb );
+            };
+    
+            this.connectRuntime = function( opts, cb ) {
+                if ( runtime ) {
+                    return;
+                }
+    
+                deferred.done( cb );
+    
+                if ( typeof opts === 'string' && cache.get( opts ) ) {
+                    runtime = cache.get( opts );
+    
+                // 像filePicker只能独立存在，不能公用。
+                } else if ( !standalone && cache.has() ) {
+                    runtime = cache.get();
+                }
+    
+                if ( !runtime ) {
+                    runtime = Runtime.create( opts, opts.runtimeOrder );
+                    cache.add( runtime );
+                    runtime.promise = deferred.promise();
+                    runtime.once( 'ready', deferred.resolve );
+                    runtime.init();
+                    runtime.client = 1;
+                    return runtime;
+                }
+    
+                runtime.promise.then( deferred.resolve );
+                runtime.client++;
+                return runtime;
+            };
+    
+            this.getRuntime = function() {
+                return runtime;
+            };
+    
+            this.disconnectRuntime = function() {
+                if ( !runtime ) {
+                    return;
+                }
+    
+                runtime.client--;
+    
+                if ( runtime.client <= 0 ) {
+                    cache.remove( runtime );
+                    delete runtime.promise;
+                    runtime.destroy();
+                }
+    
+                runtime = null;
+            };
+    
+            this.exec = function() {
+                if ( !runtime ) {
+                    return;
+                }
+    
+                var args = Base.slice( arguments );
+                component && args.unshift( component );
+    
+                return runtime.exec.apply( this, args );
+            };
+    
+            this.getRuid = function() {
+                return runtime && runtime.uid;
+            };
+    
+            this.destroy = (function( destroy ) {
+                return function() {
+                    destroy && destroy.apply( this, arguments );
+                    this.trigger('destroy');
+                    this.off();
+                    this.exec( 'destroy' );
+                    this.disconnectRuntime();
+                };
+            })( this.destroy );
+        }
+    
+        Mediator.installTo( RuntimeClient.prototype );
+        return RuntimeClient;
+    });
+
+    /**
+     * @fileOverview Blob
+     */
+    define( 'lib/blob', [
+        'base',
+        'runtime/client'
+    ], function( Base, RuntimeClient ) {
+    
+        function Blob( ruid, source ) {
+            var me = this;
+    
+            me.source = source;
+            me.ruid = ruid;
+    
+            RuntimeClient.call( me, 'Blob' );
+    
+            this.uid = source.uid || this.uid;
+            this.type = source.type || '';
+            this.size = source.size || 0;
+    
+            if ( ruid ) {
+                me.connectRuntime( ruid );
+            }
+        }
+    
+        Base.inherits( RuntimeClient, {
+            constructor: Blob,
+    
+            slice: function( start, end ) {
+                return this.exec( 'slice', start, end );
+            },
+    
+            getSource: function() {
+                return this.source;
+            }
+        });
+    
+        return Blob;
+    });
+
+    /**
+     * @fileOverview File
+     */
+    define( 'lib/file', [
+        'base',
+        'lib/blob'
+    ], function( Base, Blob ) {
+    
+        var uid = 0,
+            rExt = /\.([^.]+)$/;
+    
+        function File( ruid, file ) {
+            var ext;
+    
+            Blob.apply( this, arguments );
+            this.name = file.name || ('untitled' + uid++);
+            ext = rExt.exec( file.name ) ? RegExp.$1.toLowerCase() : '';
+    
+            if ( !this.type &&  ~'jpg,jpeg,png,gif,bmp'.indexOf( ext ) ) {
+                this.type = 'image/' + ext;
+            }
+    
+            this.ext = ext;
+            this.lastModifiedDate = file.lastModifiedDate ||
+                    (new Date()).toLocaleString();
+        }
+    
+        return Base.inherits( Blob, File );
+    });
+
+    /**
+     * @fileOverview 错误信息
+     */
+    define( 'lib/filepicker', [
+        'base',
+        'runtime/client',
+        'lib/file'
+    ], function( Base, RuntimeClent, File ) {
+    
+        var $ = Base.$;
+    
+        function FilePicker( opts ) {
+    
+            opts = this.options = $.extend({}, FilePicker.options, opts );
+            opts.container = $( opts.id );
+    
+            if ( !opts.container.length ) {
+                throw new Error('按钮指定错误');
+            }
+    
+            opts.label = opts.label || opts.container.text() || '选择文件';
+            opts.button = $( opts.button || document.createElement('div') );
+            opts.button.text( opts.label );
+            opts.container.html( opts.button );
+    
+            RuntimeClent.call( this, 'FilePicker', true );
+        }
+    
+        FilePicker.options = {
+            button: null,
+            container: null,
+            label: null,
+            multiple: true,
+            accept: null
+        };
+    
+        Base.inherits( RuntimeClent, {
+            constructor: FilePicker,
+    
+            init: function() {
+                var me = this,
+                    opts = me.options,
+                    button = opts.button;
+    
+                button.addClass('webuploader-pick');
+    
+                me.on( 'all', function( type ) {
+                    var files;
+    
+                    switch ( type ) {
+                        case 'mouseenter':
+                            button.addClass('webuploader-pick-hover');
+                            break;
+    
+                        case 'mouseleave':
+                            button.removeClass('webuploader-pick-hover');
+                            break;
+    
+                        case 'change':
+                            files = me.exec('getFiles');
+                            me.trigger( 'select', $.map( files, function( file ) {
+                                return new File( me.getRuid(), file );
+                            }) );
+                            break;
+                    }
+                });
+    
+                me.connectRuntime( opts, function() {
+                    me.refresh();
+                    me.exec( 'init', opts );
+                });
+    
+                $( window ).on( 'resize', function() {
+                    me.refresh();
+                });
+            },
+    
+            refresh: function() {
+                var shimContainer = this.getRuntime().getContainer(),
+                    button = this.options.button,
+                    width = button.outerWidth(),
+                    height = button.outerHeight(),
+                    pos = button.offset();
+    
+                width && shimContainer.css({
+                    width: width + 'px',
+                    height: height + 'px'
+                }).offset( pos );
+            },
+    
+            destroy: function() {
+                if ( this.runtime ) {
+                    this.exec('destroy');
+                    this.disconnectRuntime();
+                }
+            }
+        });
+    
+        return FilePicker;
+    });
+
+    /**
+     * @fileOverview 组件基类。
+     */
+    define( 'widgets/widget', [
+        'base',
+        'uploader'
+    ], function( Base, Uploader ) {
+    
+        var $ = Base.$,
+            _init = Uploader.prototype._init,
+            IGNORE = {},
+            widgetClass = [];
+    
+        function isArrayLike( obj ) {
+            if ( !obj ) {
+                return false;
+            }
+    
+            var length = obj.length,
+                type = $.type( obj );
+    
+            if ( obj.nodeType === 1 && length ) {
+                return true;
+            }
+    
+            return type === 'array' || type !== 'function' && type !== 'string' &&
+                    (length === 0 || typeof length === 'number' && length > 0 &&
+                    (length - 1) in obj);
+        }
+    
+        function Widget( uploader ) {
+            this.owner = uploader;
+            this.options = uploader.options;
+        }
+    
+        $.extend( Widget.prototype, {
+    
+            init: Base.noop,
+    
+            // 类Backbone的事件监听声明，监听uploader实例上的事件
+            // widget直接无法监听事件，事件只能通过uploader来传递
+            invoke: function( apiName, args ) {
+    
+                /*
+                    {
+                        'make-thumb': 'makeThumb'
+                    }
+                 */
+                var map = this.responseMap;
+    
+                // 如果无API响应声明则忽略
+                if ( !map || !(apiName in map) || !(map[ apiName ] in this) ||
+                        !$.isFunction( this[ map[ apiName ] ] ) ) {
+    
+                    return IGNORE;
+                }
+    
+                return this[ map[ apiName ] ].apply( this, args );
+    
+            },
+    
+            /**
+             * 发送命令。当传入`callback`或者`handler`中返回`promise`时。返回一个当所有`handler`中的promise都完成后完成的新`promise`。
+             * @method request
+             * @grammar request( command, args ) => * | Promise
+             * @grammar request( command, args, callback ) => Promise
+             * @for  Uploader
+             */
+            request: function() {
+                return this.owner.request.apply( this.owner, arguments );
+            }
+        });
+    
+        // 扩展Uploader.
+        $.extend( Uploader.prototype, {
+    
+            // 覆写_init用来初始化widgets
+            _init: function() {
+                var me = this,
+                    widgets = me._widgets = [];
+    
+                $.each( widgetClass, function( _, klass ) {
+                    widgets.push( new klass( me ) );
+                });
+    
+                return _init.apply( me, arguments );
+            },
+    
+            request: function( apiName, args, callback ) {
+                var i = 0,
+                    widgets = this._widgets,
+                    len = widgets.length,
+                    rlts = [],
+                    dfds = [],
+                    widget, rlt;
+    
+                args = isArrayLike( args ) ? args : [ args ];
+    
+                for ( ; i < len; i++ ) {
+                    widget = widgets[ i ];
+                    rlt = widget.invoke( apiName, args );
+    
+                    if ( rlt !== IGNORE ) {
+    
+                        // Deferred对象
+                        if ( Base.isPromise( rlt ) ) {
+                            dfds.push( rlt );
+                        } else {
+                            rlts.push( rlt );
+                        }
+                    }
+                }
+    
+                // 如果有callback，则用异步方式。
+                if ( callback || dfds.length ) {
+                    return Base.when.apply( Base, dfds )
+    
+                            // 很重要不能删除。删除了会死循环。
+                            // 保证执行顺序。让callback总是在下一个tick中执行。
+                            .then(function() {
+                                var deferred = Base.Deferred(),
+                                    args = arguments;
+    
+                                setTimeout(function() {
+                                    deferred.resolve.apply( deferred, args );
+                                }, 1 );
+    
+                                return deferred.promise();
+                            })
+                            .then( callback || Base.noop );
+                } else {
+                    return rlts[ 0 ];
+                }
+            }
+        });
+    
+        /**
+         * 添加组件
+         * @param  {object} widgetProto 组件原型，构造函数通过constructor属性定义
+         * @param  {object} responseMap API名称与函数实现的映射
+         * @example
+         *     Uploader.register( {
+         *         init: function( options ) {},
+         *         makeThumb: function() {}
+         *     }, {
+         *         'make-thumb': 'makeThumb'
+         *     } );
+         */
+        Uploader.register = Widget.register = function( responseMap, widgetProto ) {
+            var map = { init: 'init' },
+                klass;
+    
+            if ( arguments.length === 1 ) {
+                widgetProto = responseMap;
+                widgetProto.responseMap = map;
+            } else {
+                widgetProto.responseMap = $.extend( map, responseMap );
+            }
+    
+            klass = Base.inherits( Widget, widgetProto );
+            widgetClass.push( klass );
+    
+            return klass;
+        };
+    
+        return Widget;
+    });
+
+    /**
+     * @fileOverview 文件选择相关
+     */
+    define( 'widgets/filepicker', [
+        'base',
+        'uploader',
+        'lib/filepicker',
+        'widgets/widget'
+    ], function( Base, Uploader, FilePicker ) {
+    
+        Base.$.extend( Uploader.options, {
+    
+            /**
+             * @property {Selector | Object} [pick=undefined]
+             * @namespace options
+             * @for Uploader
+             * @description 指定选择文件的按钮容器，不指定则不创建按钮。
+             *
+             * * `id` {Seletor} 指定选择文件的按钮容器，不指定则不创建按钮。
+             * * `label` {String} 指定按钮文字。不指定时优先从指定的容器中看是否自带文字。
+             * * `multiple` {Boolean} 是否开起同时选择多个文件能力。
+             */
+            pick: null,
+    
+            /**
+             * @property {Arroy} [accept=null]
+             * @namespace options
+             * @for Uploader
+             * @description 指定接受哪些类型的文件。 由于目前还有ext转mimeType表，所以这里需要分开指定。
+             *
+             * * `title` {String} 文字描述
+             * * `extensions` {String} 允许的文件后缀，不带点，多个用逗号分割。
+             * * `mimeTypes` {String} 多个用逗号分割。
+             *
+             * 如：
+             *
+             * ```
+             * {
+             *     title: 'Images',
+             *     extensions: 'gif,jpg,jpeg,bmp,png',
+             *     mimeTypes: 'image/*'
+             * }
+             * ```
+             */
+            accept: null/*{
+                title: 'Images',
+                extensions: 'gif,jpg,jpeg,bmp,png',
+                mimeTypes: 'image/*'
+            }*/
+        });
+    
+        return Uploader.register({
+            'add-btn': 'addButton',
+            'refresh': 'refresh'
+        }, {
+    
+            init: function( opts ) {
+                this.pickers = [];
+                return opts.pick && this.addButton( opts.pick );
+            },
+    
+            refresh: function() {
+                $.each( this.pickers, function() {
+                    this.refresh();
+                });
+            },
+    
+            /**
+             * @method addButton
+             * @for Uploader
+             * @grammar addButton( pick ) => Promise
+             * @description
+             * 添加文件选择按钮，如果一个按钮不够，需要调用此方法来添加。参数跟[options.pick](#WebUploader:Uploader:options)一致。
+             * @example
+             * uploader.addButton({
+             *     id: '#btnContainer',
+             *     label: '选择文件'
+             * });
+             */
+            addButton: function( pick ) {
+                var me = this,
+                    opts = me.options,
+                    accept = opts.accept,
+                    options, picker, deferred;
+    
+                if ( !pick ) {
+                    return;
+                }
+    
+                deferred = Base.Deferred();
+    
+                if ( typeof pick === 'string' ) {
+                    pick = {
+                        id: pick
+                    };
+                }
+    
+                options = $.extend({}, pick, {
+                    accept: $.isPlainObject( accept ) ? [ accept ] : accept,
+                    swf: opts.swf,
+                    runtimeOrder: opts.runtimeOrder
+                });
+    
+                picker = new FilePicker( options );
+    
+                picker.once( 'ready', deferred.resolve );
+                picker.on( 'select', function( files ) {
+                    me.owner.request( 'add-file', [ files ]);
+                });
+                picker.init();
+    
+                this.pickers.push( picker );
+    
+                return deferred.promise();
+            }
+        });
+    });
+
+    /**
+     * @fileOverview 文件属性封装
+     */
+    define( 'file', [
+        'base',
+        'mediator'
+    ], function( Base, Mediator ) {
+    
+        var $ = Base.$,
+            idPrefix = 'WU_FILE_',
+            idSuffix = 0,
+            rExt = /\.([^.]+)$/,
+            statusMap = {};
+    
+        function gid() {
+            return idPrefix + idSuffix++;
+        }
+    
+        /**
+         * 文件类
+         * @class File
+         * @constructor 构造函数
+         * @grammar new File( source ) => File
+         * @param {Lib.File} source [lib.File](#Lib.File)实例, 此source对象是带有Runtime信息的。
+         */
+        function WUFile( source ) {
+    
+            /**
+             * 文件名，包括扩展名（后缀）
+             * @property name
+             * @type {string}
+             */
+            this.name = source.name || 'Untitled';
+    
+            /**
+             * 文件体积（字节）
+             * @property size
+             * @type {uint}
+             * @default 0
+             */
+            this.size = source.size || 0;
+    
+            /**
+             * 文件MIMETYPE类型，与文件类型的对应关系请参考[http://t.cn/z8ZnFny](http://t.cn/z8ZnFny)
+             * @property type
+             * @type {string}
+             * @default 'image/png'
+             */
+            this.type = source.type || 'image/png';
+    
+            /**
+             * 文件最后修改日期
+             * @property lastModifiedDate
+             * @type {int}
+             * @default 当前时间戳
+             */
+            this.lastModifiedDate = source.lastModifiedDate || (new Date() * 1);
+    
+            /**
+             * 文件ID，每个对象具有唯一ID，与文件名无关
+             * @property id
+             * @type {string}
+             */
+            this.id = gid();
+    
+            /**
+             * 文件扩展名，通过文件名获取，例如test.png的扩展名为png
+             * @property ext
+             * @type {string}
+             */
+            this.ext = rExt.exec( this.name ) ? RegExp.$1 : '';
+    
+    
+            /**
+             * 状态文字说明。在不同的status语境下有不同的用途。
+             * @property statusText
+             * @type {string}
+             */
+            this.statusText = '';
+    
+            // 存储文件状态，防止通过属性直接修改
+            statusMap[ this.id ] = WUFile.Status.INITED;
+    
+            this.source = source;
+            this.loaded = 0;
+    
+            this.on( 'error', function( msg ) {
+                this.setStatus( WUFile.Status.ERROR, msg );
+            });
+        }
+    
+        $.extend( WUFile.prototype, {
+    
+            /**
+             * 设置状态，状态变化时会触发`change`事件。
+             * @method setStatus
+             * @grammar setStatus( status[, statusText] );
+             * @param {File.Status|String} status [文件状态值](#WebUploader:File:File.Status)
+             * @param {String} [statusText=''] 状态说明，常在error时使用，用http, abort,server等来标记是由于什么原因导致文件错误。
+             */
+            setStatus: function( status, text ) {
+    
+                var prevStatus = statusMap[ this.id ];
+    
+                typeof text !== 'undefined' && (this.statusText = text);
+    
+                if ( status !== prevStatus ) {
+                    statusMap[ this.id ] = status;
+                    /**
+                     * 文件状态变化
+                     * @event statuschange
+                     */
+                    this.trigger( 'statuschange', status, prevStatus );
+                }
+    
+            },
+    
+            /**
+             * 获取文件状态
+             * @return {File.Status}
+             * @example
+                     文件状态具体包括以下几种类型：
+                     {
+                         // 初始化
+                        INITED:     0,
+                        // 已入队列
+                        QUEUED:     1,
+                        // 正在上传
+                        PROGRESS:     2,
+                        // 上传出错
+                        ERROR:         3,
+                        // 上传成功
+                        COMPLETE:     4,
+                        // 上传取消
+                        CANCELLED:     5
+                    }
+             */
+            getStatus: function() {
+                return statusMap[ this.id ];
+            },
+    
+            /**
+             * 获取文件原始信息。
+             * @return {*}
+             */
+            getSource: function() {
+                return this.source;
+            },
+    
+            destory: function() {
+                delete statusMap[ this.id ];
+            }
+        });
+    
+        Mediator.installTo( WUFile.prototype );
+    
+        /**
+         * 文件状态值，具体包括以下几种类型：
+         * * `inited` 初始状态
+         * * `queued` 已经进入队列, 等待上传
+         * * `progress` 上传中
+         * * `complete` 上传完成。
+         * * `error` 上传出错，可重试
+         * * `interrupt` 上传中断，可续传。
+         * * `invalid` 文件不合格，不能重试上传。会自动从队列中移除。
+         * * `cancelled` 文件被移除。
+         * @property {Object} Status
+         * @namespace File
+         * @class File
+         * @static
+         */
+        WUFile.Status = {
+            INITED:     'inited',    // 初始状态
+            QUEUED:     'queued',    // 已经进入队列, 等待上传
+            PROGRESS:   'progress',    // 上传中
+            ERROR:      'error',    // 上传出错，可重试
+            COMPLETE:   'complete',    // 上传完成。
+            CANCELLED:  'cancelled',    // 上传取消。
+            INTERRUPT:  'interrupt',    // 上传中断，可续传。
+            INVALID:    'invalid'    // 文件不合格，不能重试上传。
+        };
+    
+        return WUFile;
+    });
+
+    /**
+     * @fileOverview 错误信息
+     */
+    define( 'lib/dnd', [
+        'base',
+        'mediator',
+        'runtime/client'
+    ], function( Base, Mediator, RuntimeClent ) {
+    
+        var $ = Base.$;
+    
+        function DragAndDrop( opts ) {
+            opts = this.options = $.extend({}, DragAndDrop.options, opts );
+    
+            opts.container = $( opts.container );
+    
+            if ( !opts.container.length ) {
+                return;
+            }
+    
+            RuntimeClent.call( this, 'DragAndDrop' );
+        }
+    
+        DragAndDrop.options = {
+            accept: null,
+            disableGlobalDnd: true
+        };
+    
+        Base.inherits( RuntimeClent, {
+            constructor: DragAndDrop,
+    
+            init: function() {
+                var me = this;
+    
+                me.connectRuntime( me.options, function() {
+                    me.exec('init');
+                });
+            },
+    
+            destroy: function() {
+                this.disconnectRuntime();
+            }
+        });
+    
+        Mediator.installTo( DragAndDrop.prototype );
+    
+        return DragAndDrop;
+    });
+
+    /**
+     * @fileOverview 错误信息
+     */
+    define( 'lib/filepaste', [
+        'base',
+        'mediator',
+        'runtime/client'
+    ], function( Base, Mediator, RuntimeClent ) {
+    
+        var $ = Base.$;
+    
+        function FilePaste( opts ) {
+            opts = this.options = $.extend({}, opts );
+            opts.container = $( opts.container || document.body );
+            RuntimeClent.call( this, 'FilePaste' );
+        }
+    
+        Base.inherits( RuntimeClent, {
+            constructor: FilePaste,
+    
+            init: function() {
+                var me = this;
+    
+                me.connectRuntime( me.options, function() {
+                    me.exec('init');
+                });
+            },
+    
+            destroy: function() {
+                this.exec('destroy');
+                this.disconnectRuntime();
+                this.off();
+            }
+        });
+    
+        Mediator.installTo( FilePaste.prototype );
+    
+        return FilePaste;
+    });
+
+    /**
+     * @fileOverview Image
+     */
+    define( 'lib/image', [
+        'base',
+        'runtime/client',
+        'lib/blob'
+    ], function( Base, RuntimeClient, Blob ) {
+        var $ = Base.$;
+    
+        // 构造器。
+        function Image( opts ) {
+            this.options = $.extend({}, Image.options, opts );
+            RuntimeClient.call( this, 'Image' );
+    
+            this.on( 'load', function() {
+                this._info = this.exec( 'info' );
+                this._meta = this.exec( 'meta' );
+            });
+        }
+    
+        // 默认选项。
+        Image.options = {
+    
+            // 默认的图片处理质量
+            quality: 90,
+    
+            // 是否裁剪
+            crop: false,
+    
+            // 是否保留头部信息
+            preserveHeaders: true,
+    
+            // 是否允许放大。
+            allowMagnify: true
+        };
+    
+        // 继承RuntimeClient.
+        Base.inherits( RuntimeClient, {
+            constructor: Image,
+    
+            info: function( val ) {
+    
+                // setter
+                if ( val ) {
+                    this._info = val;
+                    return this;
+                }
+    
+                // getter
+                return this._info;
+            },
+    
+            meta: function( val ) {
+    
+                // setter
+                if ( val ) {
+                    this._meta = val;
+                    return this;
+                }
+    
+                // getter
+                return this._meta;
+            },
+    
+            loadFromBlob: function( blob ) {
+                var me = this,
+                    ruid = blob.getRuid();
+    
+                this.connectRuntime( ruid, function() {
+                    me.exec( 'init', me.options );
+                    me.exec( 'loadFromBlob', blob );
+                });
+            },
+    
+            resize: function() {
+                var args = Base.slice( arguments );
+                return this.exec.apply( this, [ 'resize' ].concat( args ) );
+            },
+    
+            getAsDataUrl: function( type ) {
+                return this.exec( 'getAsDataUrl', type );
+            },
+    
+            getAsBlob: function( type ) {
+                var blob = this.exec( 'getAsBlob', type );
+    
+                return new Blob( this.getRuid(), blob );
+            }
+        });
+    
+        return Image;
+    });
+
+    /**
+     * @fileOverview Transport
+     */
+    define( 'lib/transport', [
+        'base',
+        'runtime/client',
+        'mediator'
+    ], function( Base, RuntimeClient, Mediator ) {
+    
+        var $ = Base.$;
+    
+        function Transport( opts ) {
+            var me = this;
+    
+            opts = me.options = $.extend( true, {}, Transport.options, opts || {} );
+            RuntimeClient.call( this, 'Transport' );
+    
+            this._blob = null;
+            this._formData = opts.formData || {};
+            this._headers = opts.headers || {};
+    
+            this.on( 'progress', this._timeout );
+            this.on( 'load error', function() {
+                me.trigger( 'progress', 1 );
+                clearTimeout( me._timer );
+            });
+        }
+    
+        Transport.options = {
+            server: '',
+            method: 'POST',
+    
+            // 跨域时，是否允许携带cookie, 只有html5 runtime才有效
+            withCredentials: false,
+            fileVar: 'file',
+            timeout: 2 * 60 * 1000,    // 2分钟
+            formData: {},
+            headers: {},
+            sendAsBinary: false
+        };
+    
+        $.extend( Transport.prototype, {
+    
+            // 添加Blob, 只能添加一次，最后一次有效。
+            appendBlob: function( key, blob, filename ) {
+                var me = this,
+                    opts = me.options;
+    
+                if ( me.getRuid() ) {
+                    me.disconnectRuntime();
+                }
+    
+                // 连接到blob归属的同一个runtime.
+                me.connectRuntime( blob.ruid, function() {
+                    me.exec('init');
+                });
+    
+                me._blob = blob;
+                opts.fileVar = key || opts.fileVar;
+                opts.filename = filename || opts.filename;
+            },
+    
+            // 添加其他字段
+            append: function( key, value ) {
+                if ( typeof key === 'object' ) {
+                    $.extend( this._formData, key );
+                } else {
+                    this._formData[ key ] = value;
+                }
+            },
+    
+            setRequestHeader: function( key, value ) {
+                if ( typeof key === 'object' ) {
+                    $.extend( this._headers, key );
+                } else {
+                    this._headers[ key ] = value;
+                }
+            },
+    
+            send: function( method ) {
+                this.exec( 'send', method );
+                this._timeout();
+            },
+    
+            abort: function() {
+                clearTimeout( this._timer );
+                return this.exec('abort');
+            },
+    
+            destroy: function() {
+                this.trigger('destroy');
+                this.off();
+                this.exec('destroy');
+                this.disconnectRuntime();
+            },
+    
+            getResponse: function() {
+                return this.exec('getResponse');
+            },
+    
+            getResponseAsJson: function() {
+                return this.exec('getResponseAsJson');
+            },
+    
+            getStatus: function() {
+                return this.exec('getStatus');
+            },
+    
+            _timeout: function() {
+                var me = this,
+                    duration = me.options.timeout;
+    
+                if ( !duration ) {
+                    return;
+                }
+    
+                clearTimeout( me._timer );
+                me._timer = setTimeout(function() {
+                    me.abort();
+                    me.trigger( 'error', 'timeout' );
+                }, duration );
+            }
+    
+        });
+    
+        // 让Transport具备事件功能。
+        Mediator.installTo( Transport.prototype );
+    
+        return Transport;
+    });
+
+    /**
+     * @fileOverview 文件队列
+     */
+    define( 'queue', [
+        'base',
+        'mediator',
+        'file'
+    ], function( Base, Mediator, WUFile ) {
+    
+        var $ = Base.$,
+            STATUS = WUFile.Status;
+    
+        /**
+         * 文件队列, 用来存储各个状态中的文件。
+         * @class Queue
+         * @extends Mediator
+         */
+        function Queue() {
+    
+            /**
+             * 统计文件数。
+             * * `numOfQueue` 队列中的文件数。
+             * * `numOfSuccess` 上传成功的文件数
+             * * `numOfCancel` 被移除的文件数
+             * * `numOfProgress` 正在上传中的文件数
+             * * `numOfUploadFailed` 上传错误的文件数。
+             * * `numOfInvalid` 无效的文件数。
+             * @property {Object} stats
+             */
+            this.stats = {
+                numOfQueue: 0,
+                numOfSuccess: 0,
+                numOfCancel: 0,
+                numOfProgress: 0,
+                numOfUploadFailed: 0,
+                numOfInvalid: 0
+            };
+    
+            // 上传队列，仅包括等待上传的文件
+            this._queue = [];
+    
+            // 存储所有文件
+            this._map = {};
+        }
+    
+        $.extend( Queue.prototype, {
+    
+            /**
+             * 将新文件加入对队列尾部
+             *
+             * @method append
+             * @param  {File} file   文件对象
+             */
+            append: function( file ) {
+                this._queue.push( file );
+                this._fileAdded( file );
+                return this;
+            },
+    
+            /**
+             * 将新文件加入对队列头部
+             *
+             * @method prepend
+             * @param  {File} file   文件对象
+             */
+            prepend: function( file ) {
+                this._queue.unshift( file );
+                this._fileAdded( file );
+                return this;
+            },
+    
+            /**
+             * 获取文件对象
+             *
+             * @method getFile
+             * @param  {String} fileId   文件ID
+             * @return {File}
+             */
+            getFile: function( fileId ) {
+                if ( typeof fileId !== 'string' ) {
+                    return fileId;
+                }
+                return this._map[ fileId ];
+            },
+    
+            /**
+             * 从队列中取出一个指定状态的文件。
+             * @grammar fetch( status ) => File
+             * @method fetch
+             * @param {String} status [文件状态值](#WebUploader:File:File.Status)
+             * @return {File} [File](#WebUploader:File)
+             */
+            fetch: function( status ) {
+                var len = this._queue.length,
+                    i, file;
+    
+                status = status || STATUS.QUEUED;
+    
+                for ( i = 0; i < len; i++ ) {
+                    file = this._queue[ i ];
+    
+                    if ( status === file.getStatus() ) {
+                        return file;
+                    }
+                }
+    
+                return null;
+            },
+    
+            /**
+             * 获取指定类型的文件列表, 列表中每一个成员为[File](#WebUploader:File)对象。
+             * @grammar getFiles( [status1[, status2 ...]] ) => Array
+             * @method getFiles
+             * @param {String} [status] [文件状态值](#WebUploader:File:File.Status)
+             */
+            getFiles: function() {
+                var sts = [].slice.call( arguments, 0 ),
+                    ret = [],
+                    i = 0,
+                    len = this._queue.length,
+                    file;
+    
+                for ( ; i < len; i++ ) {
+                    file = this._queue[ i ];
+    
+                    if ( sts.length && !~$.inArray( file.getStatus(), sts ) ) {
+                        continue;
+                    }
+    
+                    ret.push( file );
+                }
+    
+                return ret;
+            },
+    
+            _fileAdded: function( file ) {
+                var me = this,
+                    existing = this._map[ file.id ];
+    
+                if ( !existing ) {
+                    this._map[ file.id ] = file;
+    
+                    file.on( 'statuschange', function( cur, pre ) {
+                        me._onFileStatusChange( cur, pre );
+                    });
+                }
+    
+                file.setStatus( STATUS.QUEUED );
+            },
+    
+            _onFileStatusChange: function( curStatus, preStatus ) {
+                var stats = this.stats;
+    
+                switch ( preStatus ) {
+                    case STATUS.PROGRESS:
+                        stats.numOfProgress--;
+                        break;
+    
+                    case STATUS.QUEUED:
+                        stats.numOfQueue --;
+                        break;
+    
+                    case STATUS.ERROR:
+                        stats.numOfUploadFailed--;
+                        break;
+    
+                    case STATUS.INVALID:
+                        stats.numOfInvalid--;
+                        break;
+                }
+    
+                switch ( curStatus ) {
+                    case STATUS.QUEUED:
+                        stats.numOfQueue++;
+                        break;
+    
+                    case STATUS.PROGRESS:
+                        stats.numOfProgress++;
+                        break;
+    
+                    case STATUS.ERROR:
+                        stats.numOfUploadFailed++;
+                        break;
+    
+                    case STATUS.COMPLETE:
+                        stats.numOfSuccess++;
+                        break;
+    
+                    case STATUS.CANCELLED:
+                        stats.numOfCancel++;
+                        break;
+    
+                    case STATUS.INVALID:
+                        stats.numOfInvalid++;
+                        break;
+                }
+            }
+    
+        });
+    
+        Mediator.installTo( Queue.prototype );
+    
+        return Queue;
+    });
+
+    /**
+     * @fileOverview Runtime管理器，负责Runtime的选择, 连接
+     */
+    define( 'runtime/compbase', function() {
+    
+        function CompBase( owner, runtime ) {
+    
+            this.owner = owner;
+            this.options = owner.options;
+    
+            this.getRuntime = function() {
+                return runtime;
+            };
+    
+            this.getRuid = function() {
+                return runtime.uid;
+            };
+    
+            this.trigger = function() {
+                return owner.trigger.apply( owner, arguments );
+            };
+        }
+    
+        return CompBase;
+    });
+
+    /**
+     * @fileOverview FlashRuntime
+     */
+    define( 'runtime/flash/runtime', [
+        'base',
+        'runtime/runtime',
+        'runtime/compbase'
+    ], function( Base, Runtime, CompBase ) {
+    
+        var $ = Base.$,
+            type = 'flash',
+            components = {};
+    
+    
+        function getFlashVersion() {
+            var version;
+    
+            try {
+                version = navigator.plugins[ 'Shockwave Flash' ];
+                version = version.description;
+            } catch ( ex ) {
+                try {
+                    version = new ActiveXObject('ShockwaveFlash.ShockwaveFlash')
+                            .GetVariable('$version');
+                } catch ( ex2 ) {
+                    version = '0.0';
+                }
+            }
+            version = version.match( /\d+/g );
+            return parseFloat( version[ 0 ] + '.' + version[ 1 ], 10 );
+        }
+    
+        function FlashRuntime() {
+            var pool = {},
+                clients = {},
+                destory = this.destory,
+                me = this,
+                jsreciver = Base.guid('webuploader_');
+    
+            Runtime.apply( me, arguments );
+            me.type = type;
+    
+    
+            // 这个方法的调用者，实际上是RuntimeClient
+            me.exec = function( comp, fn/*, args...*/ ) {
+                var client = this,
+                    uid = client.uid,
+                    args = Base.slice( arguments, 2 ),
+                    instance;
+    
+                clients[ uid ] = client;
+    
+                if ( components[ comp ] ) {
+                    if ( !pool[ uid ] ) {
+                        pool[ uid ] = new components[ comp ]( client, me );
+                    }
+    
+                    instance = pool[ uid ];
+    
+                    if ( instance[ fn ] ) {
+                        return instance[ fn ].apply( instance, args );
+                    }
+                }
+    
+                return me.flashExec.apply( client, arguments );
+            };
+    
+            function hander( evt, obj ) {
+                var type = evt.type || evt,
+                    parts, uid;
+    
+                parts = type.split('::');
+                uid = parts[ 0 ];
+                type = parts[ 1 ];
+    
+                // console.log.apply( console, arguments );
+    
+                if ( type === 'Ready' && uid === me.uid ) {
+                    me.trigger('ready');
+                } else if ( clients[ uid ] ) {
+                    clients[ uid ].trigger( type.toLowerCase(), evt, obj );
+                }
+    
+                // Base.log( evt, obj );
+            }
+    
+            // flash的接受器。
+            window[ jsreciver ] = function() {
+                var args = arguments;
+    
+                // 为了能捕获得到。
+                setTimeout(function() {
+                    hander.apply( null, args );
+                }, 1 );
+            };
+    
+            this.jsreciver = jsreciver;
+    
+            this.destory = function() {
+                // @todo 删除池子中的所有实例
+                return destory && destory.apply( this, arguments );
+            };
+    
+            this.flashExec = function( comp, fn ) {
+                var flash = me.getFlash(),
+                    args = Base.slice( arguments, 2 );
+    
+                return flash.exec( this.uid, comp, fn, args );
+            };
+    
+            // @todo
+        }
+    
+        Base.inherits( Runtime, {
+            constructor: FlashRuntime,
+    
+            init: function() {
+                var container = this.getContainer(),
+                    opts = this.options,
+                    html;
+    
+                // if not the minimal height, shims are not initialized
+                // in older browsers (e.g FF3.6, IE6,7,8, Safari 4.0,5.0, etc)
+                container.css({
+                    position: 'absolute',
+                    top: '-8px',
+                    left: '-8px',
+                    width: '9px',
+                    height: '9px',
+                    overflow: 'hidden'
+                });
+    
+                // insert flash object
+                html = '<object id="' + this.uid + '" type="application/' +
+                        'x-shockwave-flash" data="' +  opts.swf + '" ';
+    
+                if ( Base.isIE ) {
+                    html += 'classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" ';
+                }
+    
+                html += 'width="100%" height="100%" style="outline:0">'  +
+                    '<param name="movie" value="' + opts.swf + '" />' +
+                    '<param name="flashvars" value="uid=' + this.uid +
+                    '&jsreciver=' + this.jsreciver + '" />' +
+                    '<param name="wmode" value="transparent" />' +
+                    '<param name="allowscriptaccess" value="always" />' +
+                '</object>';
+    
+                container.html( html );
+            },
+    
+            getFlash: function() {
+                if ( this._flash ) {
+                    return this._flash;
+                }
+    
+                this._flash = $( '#' + this.uid ).get( 0 );
+                return this._flash;
+            }
+    
+        });
+    
+        FlashRuntime.register = function( name, component ) {
+            component = components[ name ] = Base.inherits( CompBase, $.extend({
+    
+                // @todo fix this later
+                flashExec: function() {
+                    var owner = this.owner,
+                        runtime = this.getRuntime();
+    
+                    return runtime.flashExec.apply( owner, arguments );
+                }
+            }, component ) );
+    
+            return component;
+        };
+    
+        if ( getFlashVersion() >= 11.3 ) {
+            Runtime.addRuntime( type, FlashRuntime );
+        }
+    
+        return FlashRuntime;
+    });
+
+    /**
+     * @fileOverview FilePicker
+     */
+    define( 'runtime/flash/filepicker', [
+        'base',
+        'runtime/flash/runtime'
+    ], function( Base, FlashRuntime ) {
+        var $ = Base.$;
+    
+        return FlashRuntime.register( 'FilePicker', {
+            init: function( opts ) {
+                var copy = $.extend({}, opts );
+    
+                delete copy.button;
+                delete copy.container;
+    
+                this.flashExec( 'FilePicker', 'init', copy );
+            },
+    
+            destroy: function() {
+                // todo
+            }
+        });
+    });
+
+    /**
+     * @fileOverview 图片压缩
+     */
+    define( 'runtime/flash/image', [
+        'runtime/flash/runtime'
+    ], function( FlashRuntime ) {
+    
+        return FlashRuntime.register( 'Image', {
+            // init: function( options ) {
+            //     var owner = this.owner;
+    
+            //     this.flashExec( 'Image', 'init', options );
+            //     owner.on( 'load', function() {
+            //         debugger;
+            //     });
+            // },
+    
+            loadFromBlob: function( blob ) {
+                var owner = this.owner;
+    
+                owner.info() && this.flashExec( 'Image', 'info', owner.info() );
+                owner.meta() && this.flashExec( 'Image', 'meta', owner.meta() );
+    
+                this.flashExec( 'Image', 'loadFromBlob', blob.uid );
+            }
+        });
+    });
+
+    /**
+     * @fileOverview  Transport flash实现
+     */
+    define( 'runtime/flash/transport', [
+        'base',
+        'runtime/flash/runtime',
+        'runtime/client'
+    ], function( Base, FlashRuntime, RuntimeClient ) {
+    
+        return FlashRuntime.register( 'Transport', {
+            init: function() {
+                this._status = 0;
+                this._response = null;
+                this._responseJson = null;
+            },
+    
+            send: function() {
+                var owner = this.owner,
+                    opts = this.options,
+                    xhr = this._initAjax(),
+                    blob = owner._blob,
+                    server = opts.server,
+                    formData, binary;
+    
+                xhr.connectRuntime( blob.ruid );
+    
+                if ( opts.sendAsBinary ) {
+                    server += (/\?/.test( server ) ? '&' : '?') +
+                            $.param( owner._formData );
+    
+                    binary = blob.uid;
+                } else {
+                    $.each( owner._formData, function( k, v ) {
+                        xhr.exec( 'append', k, v );
+                    });
+    
+                    xhr.exec( 'appendBlob', opts.fileVar, blob.uid,
+                            opts.filename || owner._formData.name || '' );
+                }
+    
+                this._setRequestHeader( xhr, opts.headers );
+                xhr.exec( 'send', {
+                    method: opts.method,
+                    url: server
+                }, binary );
+            },
+    
+            getStatus: function() {
+                return this._status;
+            },
+    
+            getResponse: function() {
+                return this._response;
+            },
+    
+            getResponseAsJson: function() {
+                return this._responseJson;
+            },
+    
+            abort: function() {
+                var xhr = this._xhr;
+    
+                if ( xhr ) {
+                    xhr.exec('abort');
+                    xhr.destroy();
+                    this._xhr = xhr = null;
+                }
+            },
+    
+            destroy: function() {
+                this.abort();
+            },
+    
+            _initAjax: function() {
+                var me = this,
+                    xhr = new RuntimeClient('XMLHttpRequest'),
+                    opts = this.options;
+    
+                xhr.on( 'uploadprogress progress', function( e ) {
+                    return me.trigger( 'progress', e.loaded / e.total );
+                });
+    
+                xhr.on( 'load', function( e ) {
+                    var status = xhr.exec( 'getStatus' );
+    
+                    xhr.off();
+                    me._xhr = null;
+    
+                    if ( status === 200 ) {
+                        me._response = xhr.exec('getResponse');
+                        me._responseJson = xhr.exec('getResponseAsJson');
+                        return me.trigger('load');
+                    }
+    
+                    me._status = status;
+                    xhr.destroy();
+                    xhr = null;
+    
+                    return me.trigger( 'error', 'http' );
+                });
+    
+                xhr.on( 'error', function() {
+                    xhr.off();
+                    me._xhr = null;
+                    me.trigger( 'error', 'http' );
+                });
+    
+                me._xhr = xhr;
+                return xhr;
+            },
+    
+            _setRequestHeader: function( xhr, headers ) {
+                $.each( headers, function( key, val ) {
+                    xhr.exec( 'setRequestHeader', key, val );
+                });
+            }
+        });
+    });
+
+    /**
+     * @fileOverview Html5Runtime
+     */
+    define( 'runtime/html5/runtime', [
+        'base',
+        'runtime/runtime',
+        'runtime/compbase'
+    ], function( Base, Runtime, CompBase ) {
+    
+        var type = 'html5',
+            components = {};
+    
+        function Html5Runtime() {
+            var pool = {},
+                me = this,
+                destory = this.destory;
+    
+            Runtime.apply( me, arguments );
+            me.type = type;
+    
+    
+            // 这个方法的调用者，实际上是RuntimeClient
+            me.exec = function( comp, fn/*, args...*/) {
+                var client = this,
+                    uid = client.uid,
+                    args = Base.slice( arguments, 2 ),
+                    instance;
+    
+                if ( components[ comp ] ) {
+                    instance = pool[ uid ] = pool[ uid ] ||
+                            new components[ comp ]( client, me );
+    
+                    if ( instance[ fn ] ) {
+                        return instance[ fn ].apply( instance, args );
+                    }
+                }
+            };
+    
+            me.destory = function() {
+                // @todo 删除池子中的所有实例
+                return destory && destory.apply( this, arguments );
+            };
+        }
+    
+        Base.inherits( Runtime, {
+            constructor: Html5Runtime,
+    
+            // 不需要连接其他程序，直接执行callback
+            init: function() {
+                var me = this;
+                setTimeout(function() {
+                    me.trigger('ready');
+                }, 1 );
+            }
+    
+        });
+    
+        Html5Runtime.register = function( name, component ) {
+            var klass = components[ name ] = Base.inherits( CompBase, component );
+            return klass;
+        };
+    
+        // 注册html5运行时。
+        if ( window.Blob && window.FileReader && window.DataView ) {
+            Runtime.addRuntime( type, Html5Runtime );
+        }
+    
+        return Html5Runtime;
+    });
+
+    /**
+     * @fileOverview Blob Html实现
+     */
+    define( 'runtime/html5/blob', [
+        'runtime/html5/runtime',
+        'lib/blob'
+    ], function( Html5Runtime, Blob ) {
+    
+        return Html5Runtime.register( 'Blob', {
+            slice: function( start, end ) {
+                var blob = this.owner.source,
+                    slice = blob.slice || blob.webkitSlice || blob.mozSlice;
+    
+                blob = slice.call( blob, start, end );
+    
+                return new Blob( this.getRuid(), blob );
+            }
+        });
+    });
+
+    /**
+     * @fileOverview FilePaste
+     */
+    define( 'runtime/html5/dnd', [
+        'base',
+        'runtime/html5/runtime',
+        'lib/file'
+    ], function( Base, Html5Runtime, File ) {
+    
+        var $ = Base.$;
+    
+        return Html5Runtime.register( 'DragAndDrop', {
+            init: function() {
+                var elem = this.elem = this.options.container;
+    
+                this.dragEnterHandler = Base.bindFn( this._dragEnterHandler, this );
+                this.dragOverHandler = Base.bindFn( this._dragOverHandler, this );
+                this.dragLeaveHandler = Base.bindFn( this._dragLeaveHandler, this );
+                this.dropHandler = Base.bindFn( this._dropHandler, this );
+    
+                elem.on( 'dragenter', this.dragEnterHandler );
+                elem.on( 'dragover', this.dragOverHandler );
+                elem.on( 'dragleave', this.dragLeaveHandler );
+                elem.on( 'drop', this.dropHandler );
+    
+                if ( this.options.disableGlobalDnd ) {
+                    $( document ).on( 'dragover', this.dragOverHandler );
+                    $( document ).on( 'drop', this.dropHandler );
+                }
+            },
+    
+            _dragEnterHandler: function( e ) {
+                this.elem.addClass('webuploader-dnd-over');
+    
+                e = e.originalEvent || e;
+                e.dataTransfer.dropEffect = 'copy';
+    
+                return false;
+            },
+    
+            _dragOverHandler: function( e ) {
+                // 只处理框内的。
+                if ( !$.contains( this.elem.parent().get( 0 ), e.target ) ) {
+                    return false;
+                }
+    
+                this._dragEnterHandler.call( this, e );
+    
+                return false;
+            },
+    
+            _dragLeaveHandler: function() {
+                this.elem.removeClass('webuploader-dnd-over');
+                return false;
+            },
+    
+            _dropHandler: function( e ) {
+                var results  = [],
+                    promises = [],
+                    me = this,
+                    ruid = me.getRuid(),
+                    items, files, dataTransfer, file, i, len, canAccessFolder;
+    
+                // 只处理框内的。
+                if ( !$.contains( me.elem.parent().get( 0 ), e.target ) ) {
+                    return false;
+                }
+    
+                e = e.originalEvent || e;
+                dataTransfer = e.dataTransfer;
+                items = dataTransfer.items;
+                files = dataTransfer.files;
+    
+                canAccessFolder = !!(items && items[ 0 ].webkitGetAsEntry);
+    
+                for ( i = 0, len = files.length; i < len; i++ ) {
+                    file = files[ i ];
+                    if ( file.type ) {
+                        results.push( file );
+                    } else if ( !file.type && canAccessFolder ) {
+                        promises.push( this._traverseDirectoryTree(
+                                items[ i ].webkitGetAsEntry(), results ) );
+                    }
+                }
+    
+                Base.when.apply( Base, promises ).done(function() {
+                    me.trigger( 'drop', $.map( results, function( file ) {
+                        return new File( ruid, file );
+                    }) );
+                });
+    
+                this.elem.removeClass('webuploader-dnd-over');
+                return false;
+            },
+    
+            _traverseDirectoryTree: function( entry, results ) {
+                var deferred = Base.Deferred(),
+                    me = this;
+    
+                if ( entry.isFile ) {
+                    entry.file(function( file ) {
+                        file.type && results.push( file );
+                        deferred.resolve( true );
+                    });
+                } else if ( entry.isDirectory ) {
+                    entry.createReader().readEntries(function( entries ) {
+                        var len = entries.length,
+                            promises = [],
+                            arr = [],    // 为了保证顺序。
+                            i;
+    
+                        for ( i = 0; i < len; i++ ) {
+                            promises.push( me._traverseDirectoryTree(
+                                    entries[ i ], arr ) );
+                        }
+    
+                        Base.when.apply( Base, promises ).then(function() {
+                            results.push.apply( results, arr );
+                            deferred.resolve( true );
+                        }, deferred.reject );
+                    });
+                }
+    
+                return deferred.promise();
+            },
+    
+            destroy: function() {
+                var elem = this.elem;
+    
+                elem.off( 'dragenter', this.dragEnterHandler );
+                elem.off( 'dragover', this.dragEnterHandler );
+                elem.off( 'dragleave', this.dragLeaveHandler );
+                elem.off( 'drop', this.dropHandler );
+    
+                if ( this.options.disableGlobalDnd ) {
+                    $( document ).off( 'dragover', this.dragOverHandler );
+                    $( document ).off( 'drop', this.dropHandler );
+                }
+            }
+        });
+    });
+
+    /**
+     * @fileOverview FilePaste
+     */
+    define( 'runtime/html5/filepaste', [
+        'base',
+        'runtime/html5/runtime',
+        'lib/file'
+    ], function( Base, Html5Runtime, File ) {
+    
+        return Html5Runtime.register( 'FilePaste', {
+            init: function() {
+                var opts = this.options,
+                    elem = this.elem = opts.container,
+                    accept = '.*',
+                    arr, i, len, item;
+    
+                // accetp的mimeTypes中生成匹配正则。
+                if ( opts.accept ) {
+                    arr = [];
+    
+                    for ( i = 0, len = opts.accept.length; i < len; i++ ) {
+                        item = opts.accept[ i ].mimeTypes;
+                        item && arr.push( item );
+                    }
+    
+                    if ( arr.length ) {
+                        accept = arr.join(',');
+                        accept = accept.replace( /,/g, '|' ).replace( /\*/g, '.*' );
+                    }
+                }
+                this.accept = accept = new RegExp( accept, 'i' );
+                this.hander = Base.bindFn( this._pasteHander, this );
+                elem.on( 'paste', this.hander );
+            },
+    
+            _pasteHander: function( e ) {
+                var allowed = [],
+                    ruid = this.getRuid(),
+                    files, file, blob, i, len;
+    
+                e = e.originalEvent || e;
+                e.preventDefault();
+                e.stopPropagation();
+    
+                files = e.clipboardData.items;
+    
+                for ( i = 0, len = files.length; i < len; i++ ) {
+                    file = files[ i ];
+    
+                    if ( !file.type || !(blob = file.getAsFile()) ||
+                            blob.size < 6 ) {
+                        continue;
+                    }
+    
+                    allowed.push( new File( ruid, blob ) );
+                }
+    
+                allowed.length && this.trigger( 'paste', allowed );
+            },
+    
+            destroy: function() {
+                this.elem.off( 'paste', this.hander );
+            }
+        });
+    });
+
+    /**
+     * @fileOverview FilePicker
+     */
+    define( 'runtime/html5/filepicker', [
+        'base',
+        'runtime/html5/runtime'
+    ], function( Base, Html5Runtime ) {
+    
+        var $ = Base.$;
+    
+        return Html5Runtime.register( 'FilePicker', {
+            init: function() {
+                var container = this.getRuntime().getContainer(),
+                    me = this,
+                    owner = me.owner,
+                    opts = me.options,
+                    lable = $( document.createElement('label') ),
+                    input = $( document.createElement('input') ),
+                    arr, i, len, mouseHandler;
+    
+                input.attr( 'type', 'file' );
+    
+                input.css({
+                    position: 'absolute',
+                    clip: 'rect(1px,1px,1px,1px)'
+                });
+    
+                lable.on( 'click', function() {
+                    input.trigger('click');
+                });
+    
+                lable.css({
+                    opacity: 0,
+                    width: '100%',
+                    height: '100%',
+                    display: 'block',
+                    cursor: 'pointer',
+                    background: '#ffffff'
+                });
+    
+                if ( opts.multiple ) {
+                    input.attr( 'multiple', 'multiple' );
+                }
+    
+                // @todo Firefox不支持单独指定后缀
+                if ( opts.accept && opts.accept.length > 0 ) {
+                    arr = [];
+    
+                    for ( i = 0, len = opts.accept.length; i < len; i++ ) {
+                        arr.push( opts.accept[ i ].mimeTypes );
+                    }
+    
+                    input.attr( 'accept', arr.join(',') );
+                }
+    
+                container.append( input );
+                container.append( lable );
+    
+                mouseHandler = function( e ) {
+                    owner.trigger( e.type );
+                };
+    
+                input.on( 'change', function( e ) {
+                    var fn = arguments.callee,
+                        clone;
+    
+                    me.files = e.target.files;
+    
+                    // reset input
+                    clone = this.cloneNode( true );
+                    this.parentNode.replaceChild( clone, this );
+    
+                    input.off();
+                    input = $( clone ).on( 'change', fn )
+                            .on( 'mouseenter mouseleave', mouseHandler );
+    
+                    owner.trigger('change');
+                });
+    
+                lable.on( 'mouseenter mouseleave', mouseHandler );
+    
+            },
+    
+    
+            getFiles: function() {
+                return this.files;
+            },
+    
+            destroy: function() {
+                // todo
+            }
+        });
+    });
+
+    /**
+     * Terms:
+     *
+     * Uint8Array, FileReader, BlobBuilder, atob, ArrayBuffer
+     * @fileOverview Image控件
+     */
+    define( 'runtime/html5/util', function() {
+    
+        var urlAPI = window.createObjectURL && window ||
+                window.URL && URL.revokeObjectURL && URL ||
+                window.webkitURL;
+    
+        return {
+            createObjectURL: urlAPI && urlAPI.createObjectURL,
+            revokeObjectURL: urlAPI && urlAPI.revokeObjectURL,
+    
+            dataURL2Blob: function( dataURI ) {
+                var byteStr, intArray, ab, i, mimetype, parts;
+    
+                parts = dataURI.split(',');
+    
+                if ( ~parts[ 0 ].indexOf('base64') ) {
+                    byteStr = atob( parts[ 1 ] );
+                } else {
+                    byteStr = decodeURIComponent( parts[ 1 ] );
+                }
+    
+                ab = new ArrayBuffer( byteStr.length );
+                intArray = new Uint8Array( ab );
+    
+                for ( i = 0; i < byteStr.length; i++ ) {
+                    intArray[ i ] = byteStr.charCodeAt( i );
+                }
+    
+                mimetype = parts[ 0 ].split(':')[ 1 ].split(';')[ 0 ];
+    
+                return new Blob([ ab ], {
+                    type: mimetype
+                });
+            },
+    
+            dataURL2ArrayBuffer: function( dataURI ) {
+                var byteStr, intArray, i, parts;
+    
+                parts = dataURI.split(',');
+    
+                if ( ~parts[ 0 ].indexOf('base64') ) {
+                    byteStr = atob( parts[ 1 ] );
+                } else {
+                    byteStr = decodeURIComponent( parts[ 1 ] );
+                }
+    
+                intArray = new Uint8Array( byteStr.length );
+    
+                for ( i = 0; i < byteStr.length; i++ ) {
+                    intArray[ i ] = byteStr.charCodeAt( i );
+                }
+    
+                return intArray.buffer;
+            },
+    
+            arrayBufferToBlob: function( buffer, type ) {
+                return new Blob([ buffer ], type ? { type: type } : {} );
+            }
+        };
+    });
+
+    /**
+     * Terms:
+     *
+     * Uint8Array, FileReader, BlobBuilder, atob, ArrayBuffer
+     * @fileOverview Image控件
+     */
+    define( 'runtime/html5/imagemeta', [
+        'runtime/html5/util'
+    ], function( Util ) {
+    
+        var api;
+    
+        api = {
+            parsers: {
+                0xffe1: []
+            },
+    
+            maxMetaDataSize: 262144,
+    
+            parse: function( blob, cb ) {
+                var me = this,
+                    fr = new FileReader();
+    
+                fr.onload = function() {
+                    cb( false, me._parse( this.result ) );
+                    fr = fr.onload = fr.onerror = null;
+                };
+    
+                fr.onerror = function( e ) {
+                    cb( e.message );
+                    fr = fr.onload = fr.onerror = null;
+                };
+    
+                blob = blob.slice( 0, me.maxMetaDataSize );
+                fr.readAsArrayBuffer( blob.getSource() );
+            },
+    
+            _parse: function( buffer, noParse ) {
+                if ( buffer.byteLength < 6 ) {
+                    return;
+                }
+    
+                var dataview = new DataView( buffer ),
+                    offset = 2,
+                    maxOffset = dataview.byteLength - 4,
+                    headLength = offset,
+                    ret = {},
+                    markerBytes, markerLength, parsers, i;
+    
+                if ( dataview.getUint16( 0 ) === 0xffd8 ) {
+    
+                    while ( offset < maxOffset ) {
+                        markerBytes = dataview.getUint16( offset );
+    
+                        if ( markerBytes >= 0xffe0 && markerBytes <= 0xffef ||
+                                markerBytes === 0xfffe ) {
+    
+                            markerLength = dataview.getUint16( offset + 2 ) + 2;
+    
+                            if ( offset + markerLength > dataview.byteLength ) {
+                                break;
+                            }
+    
+                            parsers = api.parsers[ markerBytes ];
+    
+                            if ( !noParse && parsers ) {
+                                for ( i = 0; i < parsers.length; i += 1 ) {
+                                    parsers[ i ].call( api, dataview, offset,
+                                            markerLength, ret );
+                                }
+                            }
+    
+                            offset += markerLength;
+                            headLength = offset;
+                        } else {
+                            break;
+                        }
+                    }
+    
+                    if ( headLength > 6 ) {
+                        if ( buffer.slice ) {
+                            ret.imageHead = buffer.slice( 2, headLength );
+                        } else {
+                            // Workaround for IE10, which does not yet
+                            // support ArrayBuffer.slice:
+                            ret.imageHead = new Uint8Array( buffer )
+                                    .subarray( 2, headLength );
+                        }
+                    }
+                }
+    
+                return ret;
+            },
+    
+            updateImageHead: function( buffer, head ) {
+                var data = this._parse( buffer, true ),
+                    buf1, buf2, bodyoffset;
+    
+    
+                bodyoffset = 2;
+                if ( data.imageHead ) {
+                    bodyoffset = 2 + data.imageHead.byteLength;
+                }
+    
+                if ( buffer.slice ) {
+                    buf2 = buffer.slice( bodyoffset );
+                } else {
+                    buf2 = new Uint8Array( buffer ).subarray( bodyoffset );
+                }
+    
+                buf1 = new Uint8Array( head.byteLength + 2 + buf2.byteLength );
+    
+                buf1[ 0 ] = 0xFF;
+                buf1[ 1 ] = 0xD8;
+                buf1.set( new Uint8Array( head ), 2 );
+                buf1.set( new Uint8Array( buf2 ), head.byteLength + 2 );
+    
+                return buf1.buffer;
+            }
+        };
+    
+        return api;
+    });
+
+    /**
+     * @fileOverview Image
+     */
+    define( 'runtime/html5/image', [
+        'runtime/html5/runtime',
+        'runtime/html5/util',
+        'runtime/html5/imagemeta'
+    ], function( Html5Runtime, Util, ImageMeta ) {
+    
+        var BLANK = 'data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs%3D';
+    
+        return Html5Runtime.register( 'Image', {
+    
+            // flag: 标记是否被修改过。
+            modified: false,
+    
+            init: function( opts ) {
+                var me = this,
+                    img = new Image();
+    
+                img.onload = function() {
+    
+                    me._info = {
+                        type: me.type,
+                        width: this.width,
+                        height: this.height
+                    };
+    
+                    // 读取meta信息。
+                    if ( !me._metas && ~'image/jpegimage/jpg'.indexOf( me.type ) ) {
+                        ImageMeta.parse( me._blob, function( error, ret ) {
+                            me._metas = ret;
+                            me.owner.trigger('load');
+                        });
+                    } else {
+                        me.owner.trigger('load');
+                    }
+                };
+    
+                img.onerror = function() {
+                    me.owner.trigger('error');
+                };
+    
+                me._img = img;
+            },
+    
+            loadFromBlob: function( blob ) {
+                var me = this,
+                    img = me._img;
+    
+                me._blob = blob;
+                me.type = blob.type;
+                img.src = Util.createObjectURL( blob.getSource() );
+                me.owner.once( 'load', function() {
+                    Util.revokeObjectURL( img.src );
+                });
+            },
+    
+            resize: function( width, height ) {
+                var canvas = this._canvas ||
+                        (this._canvas = document.createElement('canvas'));
+    
+                this._resize( this._img, canvas, width, height );
+                this._blob = null;    // 没用了，可以删掉了。
+                this.modified = true;
+                this.owner.trigger('complete');
+            },
+    
+            getAsBlob: function( type ) {
+                var blob = this._blob,
+                    opts = this.options,
+                    canvas;
+    
+                type = type || this.type;
+    
+                // blob需要重新生成。
+                if ( this.modified || this.type !== type ) {
+                    canvas = this._canvas;
+    
+                    if ( type === 'image/jpeg' ) {
+                        blob = canvas.toDataURL( 'image/jpeg', opts.quality / 100 );
+    
+                        if ( opts.preserveHeaders && this._metas &&
+                                this._metas.imageHead ) {
+    
+                            blob = Util.dataURL2ArrayBuffer( blob );
+                            blob = ImageMeta.updateImageHead( blob,
+                                    this._metas.imageHead );
+                            blob = Util.arrayBufferToBlob( blob, type );
+                            return blob;
+                        }
+                    } else {
+                        blob = canvas.toDataURL( type );
+                    }
+    
+                    blob = Util.dataURL2Blob( blob );
+                }
+    
+                return blob;
+            },
+    
+            getAsDataUrl: function( type ) {
+                var opts = this.options;
+    
+                type = type || this.type;
+    
+                if ( type === 'image/jpeg' ) {
+                    return this._canvas.toDataURL( type, opts.quality / 100 );
+                } else {
+                    return this._canvas.toDataURL( type );
+                }
+            },
+    
+            getOrientation: function() {
+                return this._metas && this._metas.exif &&
+                        this._metas.exif.get('Orientation') || 1;
+            },
+    
+            info: function( val ) {
+    
+                // setter
+                if ( val ) {
+                    this._info = val;
+                    return this;
+                }
+    
+                // getter
+                return this._info;
+            },
+    
+            meta: function( val ) {
+    
+                // setter
+                if ( val ) {
+                    this._meta = val;
+                    return this;
+                }
+    
+                // getter
+                return this._meta;
+            },
+    
+            destroy: function() {
+                var canvas = this._canvas;
+                this._img.onload = null;
+    
+                if ( canvas ) {
+                    canvas.getContext('2d')
+                            .clearRect( 0, 0, canvas.width, canvas.height );
+                    canvas.width = canvas.height = 0;
+                    this._canvas = null;
+                }
+    
+                // 释放内存。非常重要，否则释放不了image的内存。
+                this._img.src = BLANK;
+                this._img = this._blob = null;
+            },
+    
+            _resize: function( img, cvs, width, height ) {
+                var opts = this.options,
+                    naturalWidth = img.width,
+                    naturalHeight = img.height,
+                    orientation = this.getOrientation(),
+                    scale, w, h, x, y;
+    
+                // values that require 90 degree rotation
+                if ( ~[ 5, 6, 7, 8 ].indexOf( orientation ) ) {
+    
+                    // 交换width, height的值。
+                    width ^= height;
+                    height ^= width;
+                    width ^= height;
+                }
+    
+                scale = Math[ opts.crop ? 'max' : 'min' ]( width / naturalWidth,
+                        height / naturalHeight );
+    
+                // 不允许放大。
+                opts.allowMagnify || (scale = Math.min( 1, scale ));
+    
+                w = naturalWidth * scale;
+                h = naturalHeight * scale;
+    
+                if ( opts.crop ) {
+                    cvs.width = width;
+                    cvs.height = height;
+                } else {
+                    cvs.width = w;
+                    cvs.height = h;
+                }
+    
+                x = (cvs.width - w) / 2;
+                y = (cvs.height - h) / 2;
+    
+                opts.preserveHeaders || this._rotateToOrientaion( cvs, orientation );
+    
+                this._renderImageToCanvas( cvs, img, x, y, w, h );
+            },
+    
+            _rotateToOrientaion: function( canvas, orientation ) {
+                var width = canvas.width,
+                    height = canvas.height,
+                    ctx = canvas.getContext('2d');
+    
+                switch ( orientation ) {
+                    case 5:
+                    case 6:
+                    case 7:
+                    case 8:
+                        canvas.width = height;
+                        canvas.height = width;
+                        break;
+                }
+    
+                switch ( orientation ) {
+                    case 2:    // horizontal flip
+                        ctx.translate( width, 0 );
+                        ctx.scale( -1, 1 );
+                        break;
+    
+                    case 3:    // 180 rotate left
+                        ctx.translate( width, height );
+                        ctx.rotate( Math.PI );
+                        break;
+    
+                    case 4:    // vertical flip
+                        ctx.translate( 0, height );
+                        ctx.scale( 1, -1 );
+                        break;
+    
+                    case 5:    // vertical flip + 90 rotate right
+                        ctx.rotate( 0.5 * Math.PI );
+                        ctx.scale( 1, -1 );
+                        break;
+    
+                    case 6:    // 90 rotate right
+                        ctx.rotate( 0.5 * Math.PI );
+                        ctx.translate( 0, -height );
+                        break;
+    
+                    case 7:    // horizontal flip + 90 rotate right
+                        ctx.rotate( 0.5 * Math.PI );
+                        ctx.translate( width, -height );
+                        ctx.scale( -1, 1 );
+                        break;
+    
+                    case 8:    // 90 rotate left
+                        ctx.rotate( -0.5 * Math.PI );
+                        ctx.translate( -width, 0 );
+                        break;
+                }
+            },
+    
+            _renderImageToCanvas: function( canvas, img, x, y, w, h ) {
+                canvas.getContext('2d').drawImage( img, x, y, w, h );
+            }
+    
+            /*_renderImageToCanvas: (function() {
+                var subsampled, vertSquashRatio;
+    
+                // Detect subsampling in loaded image.
+                // In iOS, larger images than 2M pixels may be subsampled in rendering.
+                function detectSubsampling(img) {
+                    var iw = img.naturalWidth,
+                        ih = img.naturalHeight;
+                    if (iw * ih > 1024 * 1024) { // subsampling may happen over megapixel image
+                        var canvas = document.createElement('canvas');
+                        canvas.width = canvas.height = 1;
+                        var ctx = canvas.getContext('2d');
+                        ctx.drawImage(img, -iw + 1, 0);
+                        // subsampled image becomes half smaller in rendering size.
+                        // check alpha channel value to confirm image is covering edge pixel or not.
+                        // if alpha value is 0 image is not covering, hence subsampled.
+                        return ctx.getImageData(0, 0, 1, 1).data[3] === 0;
+                    } else {
+                        return false;
+                    }
+                }
+    
+    
+                // Detecting vertical squash in loaded image.
+                // Fixes a bug which squash image vertically while drawing into canvas for some images.
+                function detectVerticalSquash(img, iw, ih) {
+                    var canvas = document.createElement('canvas');
+                    canvas.width = 1;
+                    canvas.height = ih;
+                    var ctx = canvas.getContext('2d');
+                    ctx.drawImage(img, 0, 0);
+                    var data = ctx.getImageData(0, 0, 1, ih).data;
+                    // search image edge pixel position in case it is squashed vertically.
+                    var sy = 0;
+                    var ey = ih;
+                    var py = ih;
+                    while (py > sy) {
+                        var alpha = data[(py - 1) * 4 + 3];
+                        if (alpha === 0) {
+                            ey = py;
+                        } else {
+                            sy = py;
+                        }
+                        py = (ey + sy) >> 1;
+                    }
+                    var ratio = (py / ih);
+                    return (ratio === 0) ? 1 : ratio;
+                }
+    
+                return function( canvas, img, x, y, w, h ) {
+    
+    
+                    var iw = img.naturalWidth, ih = img.naturalHeight;
+                    var width = w, height = h;
+                    var ctx = canvas.getContext('2d');
+                    ctx.save();
+    
+                    subsampled = typeof subsampled === 'undefined' ? detectSubsampling( img ) : subsampled;
+                    if ( subsampled ) {
+                        iw /= 2;
+                        ih /= 2;
+                    }
+    
+                    var d = 1024; // size of tiling canvas
+                    var tmpCanvas = document.createElement('canvas');
+                    tmpCanvas.width = tmpCanvas.height = d;
+                    var tmpCtx = tmpCanvas.getContext('2d');
+    
+                    vertSquashRatio = vertSquashRatio || detectVerticalSquash(img, iw, ih);
+                    console.log( vertSquashRatio );
+    
+                    var dw = Math.ceil(d * width / iw);
+                    var dh = Math.ceil(d * height / ih / vertSquashRatio);
+                    var sy = 0;
+                    var dy = 0;
+                    while (sy < ih) {
+                      var sx = 0;
+                      var dx = 0;
+                      while (sx < iw) {
+                        tmpCtx.clearRect(0, 0, d, d);
+                        tmpCtx.drawImage(img, x - sx, y - sy );
+                        ctx.drawImage(tmpCanvas, 0, 0, d, d, dx, dy, dw, dh);
+                        sx += d;
+                        dx += dw;
+                      }
+                      sy += d;
+                      dy += dh;
+                    }
+                    ctx.restore();
+                    tmpCanvas = tmpCtx = null;
+                };
+            })()*/
+        });
+    });
+
+    /**
+     * 代码来自于：https://github.com/blueimp/JavaScript-Load-Image
+     * 暂时项目中只用了orientation.
+     *
+     * 去除了 Exif Sub IFD Pointer, GPS Info IFD Pointer, Exif Thumbnail.
+     * @fileOverview EXIF解析
+     */
+    
+    // Sample
+    // ====================================
+    // Make : Apple
+    // Model : iPhone 4S
+    // Orientation : 1
+    // XResolution : 72 [72/1]
+    // YResolution : 72 [72/1]
+    // ResolutionUnit : 2
+    // Software : QuickTime 7.7.1
+    // DateTime : 2013:09:01 22:53:55
+    // ExifIFDPointer : 190
+    // ExposureTime : 0.058823529411764705 [1/17]
+    // FNumber : 2.4 [12/5]
+    // ExposureProgram : Normal program
+    // ISOSpeedRatings : 800
+    // ExifVersion : 0220
+    // DateTimeOriginal : 2013:09:01 22:52:51
+    // DateTimeDigitized : 2013:09:01 22:52:51
+    // ComponentsConfiguration : YCbCr
+    // ShutterSpeedValue : 4.058893515764426
+    // ApertureValue : 2.5260688216892597 [4845/1918]
+    // BrightnessValue : -0.3126686601998395
+    // MeteringMode : Pattern
+    // Flash : Flash did not fire, compulsory flash mode
+    // FocalLength : 4.28 [107/25]
+    // SubjectArea : [4 values]
+    // FlashpixVersion : 0100
+    // ColorSpace : 1
+    // PixelXDimension : 2448
+    // PixelYDimension : 3264
+    // SensingMethod : One-chip color area sensor
+    // ExposureMode : 0
+    // WhiteBalance : Auto white balance
+    // FocalLengthIn35mmFilm : 35
+    // SceneCaptureType : Standard
+    define( 'runtime/html5/imagemeta/exif', [
+        'base',
+        'runtime/html5/imagemeta'
+    ], function( Base, ImageMeta ) {
+    
+        var EXIF = {};
+    
+        EXIF.ExifMap = function() {
+            return this;
+        };
+    
+        EXIF.ExifMap.prototype.map = {
+            'Orientation': 0x0112
+        };
+    
+        EXIF.ExifMap.prototype.get = function( id ) {
+            return this[ id ] || this[ this.map[ id ] ];
+        };
+    
+        EXIF.exifTagTypes = {
+            // byte, 8-bit unsigned int:
+            1: {
+                getValue: function( dataView, dataOffset ) {
+                    return dataView.getUint8( dataOffset );
+                },
+                size: 1
+            },
+    
+            // ascii, 8-bit byte:
+            2: {
+                getValue: function( dataView, dataOffset ) {
+                    return String.fromCharCode( dataView.getUint8( dataOffset ) );
+                },
+                size: 1,
+                ascii: true
+            },
+    
+            // short, 16 bit int:
+            3: {
+                getValue: function( dataView, dataOffset, littleEndian ) {
+                    return dataView.getUint16( dataOffset, littleEndian );
+                },
+                size: 2
+            },
+    
+            // long, 32 bit int:
+            4: {
+                getValue: function( dataView, dataOffset, littleEndian ) {
+                    return dataView.getUint32( dataOffset, littleEndian );
+                },
+                size: 4
+            },
+    
+            // rational = two long values,
+            // first is numerator, second is denominator:
+            5: {
+                getValue: function( dataView, dataOffset, littleEndian ) {
+                    return dataView.getUint32( dataOffset, littleEndian ) /
+                        dataView.getUint32( dataOffset + 4, littleEndian );
+                },
+                size: 8
+            },
+    
+            // slong, 32 bit signed int:
+            9: {
+                getValue: function( dataView, dataOffset, littleEndian ) {
+                    return dataView.getInt32( dataOffset, littleEndian );
+                },
+                size: 4
+            },
+    
+            // srational, two slongs, first is numerator, second is denominator:
+            10: {
+                getValue: function( dataView, dataOffset, littleEndian ) {
+                    return dataView.getInt32( dataOffset, littleEndian ) /
+                        dataView.getInt32( dataOffset + 4, littleEndian );
+                },
+                size: 8
+            }
+        };
+    
+        // undefined, 8-bit byte, value depending on field:
+        EXIF.exifTagTypes[ 7 ] = EXIF.exifTagTypes[ 1 ];
+    
+        EXIF.getExifValue = function( dataView, tiffOffset, offset, type, length,
+                littleEndian ) {
+    
+            var tagType = EXIF.exifTagTypes[ type ],
+                tagSize, dataOffset, values, i, str, c;
+    
+            if ( !tagType ) {
+                Base.log('Invalid Exif data: Invalid tag type.');
+                return;
+            }
+    
+            tagSize = tagType.size * length;
+    
+            // Determine if the value is contained in the dataOffset bytes,
+            // or if the value at the dataOffset is a pointer to the actual data:
+            dataOffset = tagSize > 4 ? tiffOffset + dataView.getUint32( offset + 8,
+                    littleEndian ) : (offset + 8);
+    
+            if ( dataOffset + tagSize > dataView.byteLength ) {
+                Base.log('Invalid Exif data: Invalid data offset.');
+                return;
+            }
+    
+            if ( length === 1 ) {
+                return tagType.getValue( dataView, dataOffset, littleEndian );
+            }
+    
+            values = [];
+    
+            for ( i = 0; i < length; i += 1 ) {
+                values[ i ] = tagType.getValue( dataView,
+                        dataOffset + i * tagType.size, littleEndian );
+            }
+    
+            if ( tagType.ascii ) {
+                str = '';
+    
+                // Concatenate the chars:
+                for ( i = 0; i < values.length; i += 1 ) {
+                    c = values[ i ];
+    
+                    // Ignore the terminating NULL byte(s):
+                    if ( c === '\u0000' ) {
+                        break;
+                    }
+                    str += c;
+                }
+    
+                return str;
+            }
+            return values;
+        };
+    
+        EXIF.parseExifTag = function( dataView, tiffOffset, offset, littleEndian,
+                data ) {
+    
+            var tag = dataView.getUint16( offset, littleEndian );
+            data.exif[ tag ] = EXIF.getExifValue( dataView, tiffOffset, offset,
+                    dataView.getUint16( offset + 2, littleEndian ),    // tag type
+                    dataView.getUint32( offset + 4, littleEndian ),    // tag length
+                    littleEndian );
+        };
+    
+        EXIF.parseExifTags = function( dataView, tiffOffset, dirOffset,
+                littleEndian, data ) {
+    
+            var tagsNumber, dirEndOffset, i;
+    
+            if ( dirOffset + 6 > dataView.byteLength ) {
+                Base.log('Invalid Exif data: Invalid directory offset.');
+                return;
+            }
+    
+            tagsNumber = dataView.getUint16( dirOffset, littleEndian );
+            dirEndOffset = dirOffset + 2 + 12 * tagsNumber;
+    
+            if ( dirEndOffset + 4 > dataView.byteLength ) {
+                Base.log('Invalid Exif data: Invalid directory size.');
+                return;
+            }
+    
+            for ( i = 0; i < tagsNumber; i += 1 ) {
+                this.parseExifTag( dataView, tiffOffset,
+                        dirOffset + 2 + 12 * i,    // tag offset
+                        littleEndian, data );
+            }
+    
+            // Return the offset to the next directory:
+            return dataView.getUint32( dirEndOffset, littleEndian );
+        };
+    
+        // EXIF.getExifThumbnail = function(dataView, offset, length) {
+        //     var hexData,
+        //         i,
+        //         b;
+        //     if (!length || offset + length > dataView.byteLength) {
+        //         Base.log('Invalid Exif data: Invalid thumbnail data.');
+        //         return;
+        //     }
+        //     hexData = [];
+        //     for (i = 0; i < length; i += 1) {
+        //         b = dataView.getUint8(offset + i);
+        //         hexData.push((b < 16 ? '0' : '') + b.toString(16));
+        //     }
+        //     return 'data:image/jpeg,%' + hexData.join('%');
+        // };
+    
+        EXIF.parseExifData = function( dataView, offset, length, data ) {
+    
+            var tiffOffset = offset + 10,
+                littleEndian, dirOffset;
+    
+            // Check for the ASCII code for "Exif" (0x45786966):
+            if ( dataView.getUint32( offset + 4 ) !== 0x45786966 ) {
+                // No Exif data, might be XMP data instead
+                return;
+            }
+            if ( tiffOffset + 8 > dataView.byteLength ) {
+                Base.log('Invalid Exif data: Invalid segment size.');
+                return;
+            }
+    
+            // Check for the two null bytes:
+            if ( dataView.getUint16( offset + 8 ) !== 0x0000 ) {
+                Base.log('Invalid Exif data: Missing byte alignment offset.');
+                return;
+            }
+    
+            // Check the byte alignment:
+            switch ( dataView.getUint16( tiffOffset ) ) {
+                case 0x4949:
+                    littleEndian = true;
+                    break;
+    
+                case 0x4D4D:
+                    littleEndian = false;
+                    break;
+    
+                default:
+                    Base.log('Invalid Exif data: Invalid byte alignment marker.');
+                    return;
+            }
+    
+            // Check for the TIFF tag marker (0x002A):
+            if ( dataView.getUint16( tiffOffset + 2, littleEndian ) !== 0x002A ) {
+                Base.log('Invalid Exif data: Missing TIFF marker.');
+                return;
+            }
+    
+            // Retrieve the directory offset bytes, usually 0x00000008 or 8 decimal:
+            dirOffset = dataView.getUint32( tiffOffset + 4, littleEndian );
+            // Create the exif object to store the tags:
+            data.exif = new EXIF.ExifMap();
+            // Parse the tags of the main image directory and retrieve the
+            // offset to the next directory, usually the thumbnail directory:
+            dirOffset = EXIF.parseExifTags( dataView, tiffOffset,
+                    tiffOffset + dirOffset, littleEndian, data );
+    
+            // 尝试读取缩略图
+            // if ( dirOffset ) {
+            //     thumbnailData = {exif: {}};
+            //     dirOffset = EXIF.parseExifTags(
+            //         dataView,
+            //         tiffOffset,
+            //         tiffOffset + dirOffset,
+            //         littleEndian,
+            //         thumbnailData
+            //     );
+    
+            //     // Check for JPEG Thumbnail offset:
+            //     if (thumbnailData.exif[0x0201]) {
+            //         data.exif.Thumbnail = EXIF.getExifThumbnail(
+            //             dataView,
+            //             tiffOffset + thumbnailData.exif[0x0201],
+            //             thumbnailData.exif[0x0202] // Thumbnail data length
+            //         );
+            //     }
+            // }
+        };
+    
+        ImageMeta.parsers[ 0xffe1 ].push( EXIF.parseExifData );
+        return EXIF;
+    });
+
+    /**
+     * @fileOverview Transport
+     * @todo 支持chunked传输，优势：
+     * 可以将大文件分成小块，挨个传输，可以提高大文件成功率，当失败的时候，也只需要重传那小部分，
+     * 而不需要重头再传一次。另外断点续传也需要用chunked方式。
+     */
+    define( 'runtime/html5/transport', [
+        'base',
+        'runtime/html5/runtime'
+    ], function( Base, Html5Runtime ) {
+    
+        var noop = Base.noop,
+            $ = Base.$;
+    
+        return Html5Runtime.register( 'Transport', {
+            init: function() {
+                this._status = 0;
+                this._response = null;
+            },
+    
+            send: function() {
+                var owner = this.owner,
+                    opts = this.options,
+                    xhr = this._initAjax(),
+                    blob = owner._blob,
+                    server = opts.server,
+                    formData, binary;
+    
+                if ( opts.sendAsBinary ) {
+                    server += (/\?/.test( server ) ? '&' : '?') +
+                            $.param( owner._formData );
+    
+                    binary = blob.getSource();
+                } else {
+                    formData = new FormData();
+                    $.each( owner._formData, function( k, v ) {
+                        formData.append( k, v );
+                    });
+    
+                    formData.append( opts.fileVar, blob.getSource(),
+                            opts.filename || owner._formData.name || '' );
+                }
+    
+                if ( opts.withCredentials && 'withCredentials' in xhr ) {
+                    xhr.open( opts.method, server, true );
+                    xhr.withCredentials = true;
+                } else {
+                    xhr.open( opts.method, server );
+                }
+    
+                this._setRequestHeader( xhr, opts.headers );
+                binary && xhr.overrideMimeType('application/octet-stream');
+                xhr.send( binary || formData );
+            },
+    
+            getResponse: function() {
+                return this._response;
+            },
+    
+            getResponseAsJson: function() {
+                return this._parseJson( this._response );
+            },
+    
+            getStatus: function() {
+                return this._status;
+            },
+    
+            abort: function() {
+                var xhr = this._xhr;
+    
+                if ( xhr ) {
+                    xhr.upload.onprogress = noop;
+                    xhr.onreadystatechange = noop;
+                    xhr.abort();
+    
+                    this._xhr = xhr = null;
+                }
+            },
+    
+            destroy: function() {
+                this.abort();
+            },
+    
+            _initAjax: function() {
+                var me = this,
+                    xhr = new XMLHttpRequest(),
+                    opts = this.options;
+    
+                if ( opts.withCredentials && !('withCredentials' in xhr) &&
+                        typeof XDomainRequest !== 'undefined' ) {
+                    xhr = new XDomainRequest();
+                }
+    
+                xhr.upload.onprogress = function( e ) {
+                    var percentage = 0;
+    
+                    if ( e.lengthComputable ) {
+                        percentage = e.loaded / e.total;
+                    }
+    
+                    return me.trigger( 'progress', percentage );
+                };
+    
+                xhr.onreadystatechange = function() {
+    
+                    if ( xhr.readyState !== 4 ) {
+                        return;
+                    }
+    
+                    xhr.upload.onprogress = noop;
+                    xhr.onreadystatechange = noop;
+                    me._xhr = null;
+    
+                    // 只考虑200的情况
+                    if ( xhr.status === 200 ) {
+                        me._response = xhr.responseText;
+                        return me.trigger('load');
+                    }
+    
+                    me._status = xhr.status;
+                    xhr = null;
+    
+                    return me.trigger( 'error', me._status ? 'http' : 'abort' );
+                };
+    
+                me._xhr = xhr;
+                return xhr;
+            },
+    
+            _setRequestHeader: function( xhr, headers ) {
+                $.each( headers, function( key, val ) {
+                    xhr.setRequestHeader( key, val );
+                });
+            },
+    
+            _parseJson: function( str ) {
+                var json;
+    
+                try {
+                    json = JSON.parse( str );
+                } catch ( ex ) {
+                    json = {};
+                }
+    
+                return json;
+            }
+        });
+    });
+
+    /**
+     * @fileOverview DragAndDrop Widget。
+     */
+    define( 'widgets/filednd', [
+        'base',
+        'uploader',
+        'lib/dnd',
+        'widgets/widget'
+    ], function( Base, Uploader, Dnd ) {
+    
+        Uploader.options.dnd = '';
+    
+        /**
+         * @property {Selector} [dnd=undefined]  指定Drag And Drop拖拽的容器，如果不指定，则不启动。
+         * @namespace options
+         * @for Uploader
+         */
+        return Uploader.register({
+            init: function( opts ) {
+    
+                if ( !opts.dnd || this.request('predict-runtime-type') !== 'html5' ) {
+                    return;
+                }
+    
+                var me = this,
+                    deferred = Base.Deferred(),
+                    options = $.extend({}, {
+                        container: opts.dnd,
+                        accept: opts.accept
+                    }),
+                    dnd;
+    
+                dnd = new Dnd( options );
+    
+                dnd.once( 'ready', deferred.resolve );
+                dnd.on( 'drop', function( files ) {
+                    me.request( 'add-file', [ files ]);
+                });
+                dnd.init();
+    
+                return deferred.promise();
+            }
+        });
+    });
+
+    /**
+     * @fileOverview 组件基类。
+     */
+    define( 'widgets/filepaste', [
+        'base',
+        'uploader',
+        'lib/filepaste',
+        'widgets/widget'
+    ], function( Base, Uploader, FilePaste ) {
+    
+        /**
+         * @property {Selector} [paste=undefined]  指定监听paste事件的容器，如果不指定，不启用此功能。此功能为通过粘贴来添加截屏的图片。建议设置为`document.body`.
+         * @namespace options
+         * @for Uploader
+         */
+        return Uploader.register({
+            init: function( opts ) {
+    
+                if ( !opts.paste || this.request('predict-runtime-type') !== 'html5' ) {
+                    return;
+                }
+    
+                var me = this,
+                    deferred = Base.Deferred(),
+                    options = $.extend({}, {
+                        container: opts.paste,
+                        accept: opts.accept
+                    }),
+                    paste;
+    
+                paste = new FilePaste( options );
+    
+                paste.once( 'ready', deferred.resolve );
+                paste.on( 'paste', function( files ) {
+                    me.owner.request( 'add-file', [ files ]);
+                });
+                paste.init();
+    
+                return deferred.promise();
+            }
+        });
+    });
+
+    /**
+     * @fileOverview 图片操作, 负责预览图片和上传前压缩图片
+     */
+    define( 'widgets/image', [
+        'base',
+        'uploader',
+        'lib/image',
+        'widgets/widget'
+    ], function( Base, Uploader, Image ) {
+    
+        var $ = Base.$,
+            throttle;
+    
+        // 根据要处理的文件大小来节流，一次不能处理太多，会卡。
+        throttle = (function( max ) {
+            var occupied = 0,
+                waiting = [],
+                tick = function() {
+                    var item;
+    
+                    while( waiting.length && occupied < max ) {
+                        item = waiting.shift();
+                        occupied += item[ 0 ];
+                        item[ 1 ]();
+                    }
+                };
+    
+            return function( emiter, size, cb ) {
+                waiting.push( [ size, cb ] );
+                emiter.once( 'destroy', function() {
+                    occupied -= size;
+                    setTimeout( tick, 1 );
+                } );
+                setTimeout( tick, 1 );
+            }
+        })( 5 * 1024 * 1024 );
+    
+        $.extend( Uploader.options, {
+    
+            /**
+             * @property {Object} [thumb]
+             * @namespace options
+             * @for Uploader
+             * @description 配置生成缩略图的选项。
+             *
+             * 默认为：
+             *
+             * ```javascript
+             * {
+             *     width: 110,
+             *     height: 110,
+             *
+             *     // 图片质量，只有type为`image/jpeg`的时候才有效。
+             *     quality: 70,
+             *
+             *     // 是否允许放大，如果想要生成小图的时候不失真，此选项应该设置为false.
+             *     allowMagnify: true,
+             *
+             *     // 是否允许裁剪。
+             *     crop: true,
+             *
+             *     // 是否保留头部meta信息。
+             *     preserveHeaders: false,
+             *
+             *     // 为空的话则保留原有图片格式。
+             *     // 否则强制转换成指定的类型。
+             *     type: 'image/jpeg'
+             * }
+             * ```
+             */
+            thumb: {
+                width: 110,
+                height: 110,
+                quality: 70,
+                allowMagnify: true,
+                crop: true,
+                preserveHeaders: false,
+    
+                // 为空的话则保留原有图片格式。
+                // 否则强制转换成指定的类型。
+                type: 'image/jpeg'
+            },
+    
+            /**
+             * @property {Object} [compress]
+             * @namespace options
+             * @for Uploader
+             * @description 配置压缩的图片的选项。如果此选项为`false`, 则图片在上传前不进行压缩。
+             *
+             * 默认为：
+             *
+             * ```javascript
+             * {
+             *     width: 1600,
+             *     height: 1600,
+             *
+             *     // 图片质量，只有type为`image/jpeg`的时候才有效。
+             *     quality: 90,
+             *
+             *     // 是否允许放大，如果想要生成小图的时候不失真，此选项应该设置为false.
+             *     allowMagnify: false,
+             *
+             *     // 是否允许裁剪。
+             *     crop: false,
+             *
+             *     // 是否保留头部meta信息。
+             *     preserveHeaders: true
+             * }
+             * ```
+             */
+            compress: {
+                width: 1600,
+                height: 1600,
+                quality: 90,
+                allowMagnify: false,
+                crop: false,
+                preserveHeaders: true
+            }
+        });
+    
+        return Uploader.register({
+            'make-thumb': 'makeThumb',
+            'before-send-file': 'compressImage'
+        }, {
+    
+    
+            /**
+             * 生成缩略图，此过程为异步，所以需要传入`callback`。
+             * 通常情况在图片加入队里后调用此方法来生成预览图以增强交互效果。
+             * @method makeThumb
+             * @grammar makeThumb( file, cb ) => undefined
+             * @grammar makeThumb( file, cb, width, height ) => undefined
+             * @for Uploader
+             * @example
+             *
+             * uploader.on( 'fileQueued', function( file ) {
+             *     var $li = ...;
+             *
+             *     uploader.makeThumb( file, function( error, ret ) {
+             *         if ( error ) {
+             *             $li.text('预览错误');
+             *         } else {
+             *             $li.append('<img alt="" src="' + ret + '" />');
+             *         }
+             *     });
+             *
+             * });
+             */
+            makeThumb: function( file, cb, width, height ) {
+                var opts, image;
+    
+                file = this.request( 'get-file', file );
+    
+                // 只预览图片格式。
+                if ( !file.type.match( /^image/ ) ) {
+                    cb( true );
+                    return;
+                }
+    
+                opts = $.extend( {}, this.options.thumb );
+    
+                // 如果传入的是object.
+                if ( $.isPlainObject( width ) ) {
+                    opts = $.extend( opts, width );
+                    width = null;
+                }
+    
+                width = width || opts.width;
+                height = height || opts.height;
+    
+                image = new Image( opts );
+    
+                image.once( 'load', function() {
+                    file._info = file._info || image.info();
+                    file._meta = file._meta || image.meta();
+                    image.resize( width, height );
+                });
+    
+                image.once( 'complete', function() {
+                    cb( false, image.getAsDataUrl( opts.type ) );
+                    image.destroy();
+                });
+    
+                image.once( 'error', function() {
+                    cb( true );
+                    image.destroy();
+                });
+    
+                throttle( image, file.source.size, function() {
+                    file._info && image.info( file._info );
+                    file._meta && image.meta( file._meta );
+                    image.loadFromBlob( file.source );
+                });
+            },
+    
+            compressImage: function( file ) {
+                var opts = this.options.compress || this.options.resize,
+                    compressSize = opts && opts.compressSize || 300 * 1024,
+                    image, deferred;
+    
+                file = this.request( 'get-file', file );
+    
+                // 只预览图片格式。
+                if ( !opts || !~'image/jpeg,image/jpg'.indexOf( file.type ) ||
+                        file.size < compressSize ||
+                        file._compressed ) {
+                    return;
+                }
+    
+                opts = $.extend( {}, opts );
+                deferred = Base.Deferred();
+    
+                image = new Image( opts );
+    
+                deferred.always(function() {
+                    image.destroy();
+                    image = null;
+                });
+                image.once( 'error', deferred.reject );
+                image.once( 'load', function() {
+                    file._info = file._info || image.info();
+                    file._meta = file._meta || image.meta();
+                    image.resize( opts.width, opts.height );
+                });
+    
+                image.once( 'complete', function() {
+                    var blob, size;
+    
+                    blob = image.getAsBlob( opts.type );
+                    size = file.size;
+    
+                    // 如果压缩后，比原来还大则不用压缩后的。
+                    if ( blob.size < size ) {
+                        // file.source.destroy && file.source.destroy();
+                        file.source = blob;
+                        file.size = blob.size;
+    
+                        file.trigger( 'resize', blob.size, size );
+                    }
+    
+                    // 标记，避免重复压缩。
+                    file._compressed = true;
+                    deferred.resolve( true );
+                });
+    
+                file._info && image.info( file._info );
+                file._meta && image.meta( file._meta );
+    
+                image.loadFromBlob( file.source );
+                return deferred.promise();
+            }
+        });
+    });
+
+    /**
+     * @fileOverview 队列
+     */
+    define( 'widgets/queue', [
+        'base',
+        'uploader',
+        'queue',
+        'file',
+        'widgets/widget'
+    ], function( Base, Uploader, Queue, WUFile ) {
+    
+        var $ = Base.$,
+            Status = WUFile.Status;
+    
+        return Uploader.register({
+            'add-file': 'addFiles',
+            'get-file': 'getFile',
+            'fetch-file': 'fetchFile',
+            'get-stats': 'getStats',
+            'get-files': 'getFiles',
+            'remove-file': 'removeFile',
+            'retry': 'retry'
+        }, {
+    
+            init: function( opts ) {
+                var len, i, item, arr, accept;
+    
+                if ( $.isPlainObject( opts.accept ) ) {
+                    opts.accept = [ opts.accept ];
+                }
+    
+                // accept中的中生成匹配正则。
+                if ( opts.accept ) {
+                    arr = [];
+    
+                    for ( i = 0, len = opts.accept.length; i < len; i++ ) {
+                        item = opts.accept[ i ].extensions;
+                        item && arr.push( item );
+                    }
+    
+                    if ( arr.length ) {
+                        accept = arr.join(',')
+                                .replace( /,/g, '$|' )
+                                .replace( /\*/g, '.*' );
+                    }
+    
+                    this.accept = new RegExp( accept, 'i' );
+                }
+    
+                this.queue = new Queue();
+                this.stats = this.queue.stats;
+            },
+    
+            /**
+             * @event beforeFileQueued
+             * @param {File} file File对象
+             * @description 当文件被加入队列之前触发，此事件的handler返回值为`false`，则此文件不会被添加进入队列。
+             * @for  Uploader
+             */
+    
+            /**
+             * @event fileQueued
+             * @param {File} file File对象
+             * @description 当文件被加入队列以后触发。
+             * @for  Uploader
+             */
+    
+    
+            _addFile: function( file ) {
+                var me = this;
+    
+                if ( !file || file.size < 6 || me.accept &&
+                        !me.accept.test( file.name ) ) {
+                    return;
+                }
+    
+                if ( !(file instanceof WUFile) ) {
+                    file = new WUFile( file );
+                }
+    
+                if ( !me.owner.trigger( 'beforeFileQueued', file ) ) {
+                    return;
+                }
+    
+                me.queue.append( file );
+                me.owner.trigger( 'fileQueued', file );
+                return file;
+            },
+    
+            getFile: function( fileId ) {
+                return this.queue.getFile( fileId );
+            },
+    
+            /**
+             * @event filesQueued
+             * @param {File} files 数组，内容为原始File(lib/File）对象。
+             * @description 当一批文件添加进队列以后触发。
+             * @for  Uploader
+             */
+            addFiles: function( files ) {
+                var me = this;
+    
+                if ( !files.length ) {
+                    files = [ files ];
+                }
+    
+                files = $.map( files, function( file ) {
+                    return me._addFile( file );
+                });
+    
+                me.owner.trigger( 'filesQueued', files );
+    
+                if ( me.options.auto ) {
+                    me.request('start-upload');
+                }
+            },
+    
+            getStats: function() {
+                return this.stats;
+            },
+    
+            /**
+             * @event fileDequeued
+             * @param {File} file File对象
+             * @description 当文件被移除队列后触发。
+             * @for  Uploader
+             */
+    
+            /**
+             * @method removeFile
+             * @grammar removeFile( file ) => undefined
+             * @grammar removeFile( id ) => undefined
+             * @param {File|id} file File对象或这File对象的id
+             * @description 移除某一文件。
+             * @for  Uploader
+             * @example
+             *
+             * $li.on('click', '.remove-this', function() {
+             *     uploader.removeFile( file );
+             * })
+             */
+            removeFile: function( file ) {
+                var me = this;
+    
+                file = file.id ? file : me.queue.getFile( file );
+    
+                file.setStatus( Status.CANCELLED );
+                me.owner.trigger( 'fileDequeued', file );
+            },
+    
+            /**
+             * @method getFiles
+             * @grammar getFiles() => Array
+             * @grammar getFiles( status1, status2, status... ) => Array
+             * @description 返回指定状态的文件集合，不传参数将返回所有状态的文件。
+             * @for  Uploader
+             * @example
+             * console.log( uploader.getFiles() );    // => all files
+             * console.log( uploader.getFiles('error') )    // => all error files.
+             */
+            getFiles: function() {
+                return this.queue.getFiles.apply( this.queue, arguments );
+            },
+    
+            fetchFile: function() {
+                return this.queue.fetch.apply( this.queue, arguments );
+            },
+    
+            /**
+             * @method retry
+             * @grammar retry() => undefined
+             * @grammar retry( file ) => undefined
+             * @description 重试上传，重试指定文件，或者从出错的文件开始重新上传。
+             * @for  Uploader
+             * @example
+             * function retry() {
+             *     uploader.retry();
+             * }
+             */
+            retry: function( file, noForceStart ) {
+                var me = this,
+                    files, i, len;
+    
+                if ( file ) {
+                    file = file.id ? file : me.queue.getFile( file );
+                    file.setStatus( Status.QUEUED );
+                    noForceStart || me.request('start-upload');
+                    return;
+                }
+    
+                files = me.queue.getFiles( Status.ERROR );
+                i = 0;
+                len = files.length;
+    
+                for ( ; i < len; i++ ) {
+                    file = files[ i ];
+                    file.setStatus( Status.QUEUED );
+                }
+    
+                me.request('start-upload');
+            }
+        });
+    
+    });
+
+    /**
+     * @fileOverview 添加获取Runtime相关信息的方法。
+     */
+    define( 'widgets/runtime', [
+        'uploader',
+        'runtime/runtime',
+        'widgets/widget'
+    ], function( Uploader, Runtime ) {
+    
+        Uploader.support = function() {
+            return Runtime.hasRuntime.apply( Runtime, arguments );
+        };
+    
+        return Uploader.register({
+            'predict-runtime-type': 'predictRuntmeType'
+        }, {
+    
+            init: function() {
+                if ( !this.predictRuntmeType() ) {
+                    throw Error('Runtime Error');
+                }
+            },
+    
+            /**
+             * 预测Uploader将采用哪个`Runtime`
+             * @grammar predictRuntmeType() => String
+             * @method predictRuntmeType
+             * @for  Uploader
+             */
+            predictRuntmeType: function() {
+                var orders = this.options.runtimeOrder || Runtime.orders,
+                    type = this.type,
+                    i, len;
+    
+                if ( !type ) {
+                    orders = orders.split( /\s*,\s*/g );
+    
+                    for ( i = 0, len = orders.length; i < len; i++ ) {
+                        if ( Runtime.hasRuntime( orders[ i ] ) ) {
+                            this.type = type = orders[ i ];
+                            break;
+                        }
+                    }
+                }
+    
+                return type;
+            }
+        });
+    });
+
+    /**
+     * @fileOverview 负责文件上传相关。
+     */
+    define( 'widgets/upload', [
+        'base',
+        'uploader',
+        'file',
+        'lib/transport',
+        'widgets/widget'
+    ], function( Base, Uploader, WUFile, Transport ) {
+    
+        var $ = Base.$,
+            isPromise = Base.isPromise,
+            Status = WUFile.Status;
+    
+        // 添加默认配置项
+        $.extend( Uploader.options, {
+    
+    
+            /**
+             * @property {Boolean} [prepareNextFile=false]
+             * @namespace options
+             * @for Uploader
+             * @description 是否允许在文件传输时提前把下一个文件准备好。
+             * 对于一个文件的准备工作比较耗时，比如图片压缩，md5序列化。
+             * 如果能提前在当前文件传输期处理，可以节省总体耗时。
+             */
+            prepareNextFile: false,
+    
+            /**
+             * @property {Boolean} [chunked=false]
+             * @namespace options
+             * @for Uploader
+             * @description 是否要分片处理大文件上传。
+             */
+            chunked: false,
+    
+            /**
+             * @property {Boolean} [chunkSize=5242880]
+             * @namespace options
+             * @for Uploader
+             * @description 如果要分片，分多大一片？ 默认大小为5M.
+             */
+            chunkSize: 5 * 1024 * 1024,
+    
+            /**
+             * @property {Boolean} [chunkRetry=2]
+             * @namespace options
+             * @for Uploader
+             * @description 如果某个分片由于网络问题出错，允许自动重传多少次？
+             */
+            chunkRetry: 2,
+    
+            /**
+             * @property {Boolean} [threads=3]
+             * @namespace options
+             * @for Uploader
+             * @description 上传并发数。允许同时最大上传进程数。
+             */
+            threads: 3
+        });
+    
+        // 负责将文件切片。
+        function CuteFile( file, chunkSize ) {
+            var pending = [],
+                blob = file.source,
+                total = blob.size,
+                chunks = chunkSize ? Math.ceil( total / chunkSize ) : 1,
+                start = 0,
+                index = 0,
+                len;
+    
+            while ( index < chunks ) {
+                len = Math.min( chunkSize, total - start );
+                pending.push({
+                    file: file,
+                    start: start,
+                    end: start + len,
+                    total: total,
+                    chunks: chunks,
+                    chunk: index++
+                });
+                start += len;
+            }
+    
+            file.blocks = pending.concat();
+            file.remaning = pending.length;
+    
+            return {
+                file: file,
+    
+                has: function() {
+                    return !!pending.length;
+                },
+    
+                fetch: function() {
+                    return pending.shift();
+                }
+            };
+        }
+    
+        Uploader.register({
+            'start-upload': 'start',
+            'stop-upload': 'stop',
+            'skip-file': 'skipFile',
+            'is-in-progress': 'isInProgress'
+        }, {
+    
+            init: function() {
+                var owner = this.owner;
+    
+                this.runing = false;
+    
+                // 记录当前正在传的数据，跟threads相关
+                this.pool = [];
+    
+                // 缓存即将上传的文件。
+                this.pending = [];
+    
+                // 跟踪还有多少分片没有完成上传。
+                this.remaning = 0;
+                this.__tick = Base.bindFn( this._tick, this );
+    
+                owner.on( 'uploadComplete', function( file ) {
+                    // 把其他块取消了。
+                    file.blocks && $.each( file.blocks, function( _, v ) {
+                        v.transport && (v.transport.abort(), v.transport.destroy());
+                        delete v.transport;
+                    });
+    
+                    delete file.blocks;
+                    delete file.remaning;
+                });
+            },
+    
+            /**
+             * @event startUpload
+             * @description 当开始上传流程时触发。
+             * @for  Uploader
+             */
+    
+            /**
+             * 开始上传。此方法可以从初始状态调用开始上传流程，也可以从暂停状态调用，继续上传流程。
+             * @grammar upload() => undefined
+             * @method upload
+             * @for  Uploader
+             */
+            start: function() {
+                var me = this;
+    
+                // 移出invalid的文件
+                $.each( me.request( 'get-files', Status.INVALID ), function() {
+                    me.request( 'remove-file', this );
+                });
+    
+                if ( me.runing ) {
+                    return;
+                }
+    
+                me.runing = true;
+    
+                // 如果有暂停的，则续传
+                $.each( me.pool, function( _, v ) {
+                    var file = v.file;
+    
+                    if ( file.getStatus() === Status.INTERRUPT ) {
+                        file.setStatus( Status.PROGRESS );
+                        me._trigged = false;
+                        v.transport && v.transport.send();
+                    }
+                });
+    
+                me._trigged = false;
+                me.owner.trigger('startUpload');
+                Base.nextTick( me.__tick );
+            },
+    
+            /**
+             * @event stopUpload
+             * @description 当开始上传流程暂停时触发。
+             * @for  Uploader
+             */
+    
+            /**
+             * 暂停上传。第一个参数为是否中断上传当前正在上传的文件。
+             * @grammar stop() => undefined
+             * @grammar stop( true ) => undefined
+             * @method stop
+             * @for  Uploader
+             */
+            stop: function( interrupt ) {
+                var me = this;
+    
+                if ( me.runing === false ) {
+                    return;
+                }
+    
+                me.runing = false;
+    
+                interrupt && $.each( me.pool, function( _, v ) {
+                    v.transport && v.transport.abort();
+                    v.file.setStatus( Status.INTERRUPT );
+                });
+    
+                me.owner.trigger('stopUpload');
+            },
+    
+            /**
+             * 判断`Uplaode`r是否正在上传中。
+             * @grammar isInProgress() => Boolean
+             * @method isInProgress
+             * @for  Uploader
+             */
+            isInProgress: function() {
+                return !!this.runing;
+            },
+    
+            getStats: function() {
+                return this.request('get-stats');
+            },
+    
+            /**
+             * 掉过一个文件上传，直接标记指定文件为已上传状态。
+             * @grammar skipFile( file ) => undefined
+             * @method skipFile
+             * @for  Uploader
+             */
+            skipFile: function( file, status ) {
+                file = this.request( 'get-file', file );
+    
+                file.setStatus( status || Status.COMPLETE );
+                file.skipped = true;
+    
+                // 如果正在上传。
+                file.blocks && $.each( file.blocks, function( _, v ) {
+                    var _tr = v.transport;
+    
+                    if ( _tr ) {
+                        _tr.abort();
+                        _tr.destroy();
+                        delete v.transport;
+                    }
+                });
+    
+                this.owner.trigger( 'uploadSkip', file );
+            },
+    
+            /**
+             * @event uploadFinished
+             * @description 当文件上传结束时触发。
+             * @for  Uploader
+             */
+            _tick: function() {
+                var me = this,
+                    opts = me.options,
+                    fn, val;
+    
+                // 上一个promise还没有结束，则等待完成后再执行。
+                if ( me._promise ) {
+                    return me._promise.always( me.__tick );
+                }
+    
+                // 还有位置，且还有文件要处理的话。
+                if ( me.pool.length < opts.threads && (val = me._nextBlock()) ) {
+                    me._trigged = false;
+    
+                    fn = function( val ) {
+                        me._promise = null;
+    
+                        // 有可能是reject过来的，所以要检测val的类型。
+                        val && val.file && me._startSend( val );
+                        Base.nextTick( me.__tick );
+                    };
+    
+                    me._promise = isPromise( val ) ? val.always( fn ) : fn( val );
+    
+                // 没有要上传的了，且没有正在传输的了。
+                } else if ( !me.remaning && !me.getStats().numOfQueue ) {
+                    me.runing = false;
+    
+                    me._trigged || Base.nextTick(function() {
+                        me.owner.trigger('uploadFinished');
+                    });
+                    me._trigged = true;
+                }
+            },
+    
+            _nextBlock: function() {
+                var me = this,
+                    act = me._act,
+                    opts = me.options,
+                    next, done;
+    
+                // 如果当前文件还有没有需要传输的，则直接返回剩下的。
+                if ( act && act.has() &&
+                        act.file.getStatus() === Status.PROGRESS ) {
+    
+                    // 是否提前准备下一个文件
+                    if ( opts.prepareNextFile && !me.pending.length ) {
+                        me._prepareNextFile();
+                    }
+    
+                    return act.fetch();
+    
+                // 否则，如果正在运行，则准备下一个文件，并等待完成后返回下个分片。
+                } else if ( me.runing ) {
+    
+                    // 如果缓存中有，则直接在缓存中取，没有则去queue中取。
+                    if ( !me.pending.length && me.getStats().numOfQueue ) {
+                        me._prepareNextFile();
+                    }
+    
+                    next = me.pending.shift();
+                    done = function( file ) {
+                        if ( !file ) {
+                            return null;
+                        }
+    
+                        act = CuteFile( file, opts.chunked ? opts.chunkSize : 0 );
+                        me._act = act;
+                        return act.fetch();
+                    };
+    
+                    // 文件可能还在prepare中，也有可能已经完全准备好了。
+                    return isPromise( next ) ? next.then( done ) : done( next );
+                }
+            },
+    
+            _prepareNextFile: function() {
+                var me = this,
+                    file = me.request('fetch-file'),
+                    pending = me.pending,
+                    promise;
+    
+                if ( file ) {
+    
+                    promise = me.request( 'before-send-file', file, function() {
+    
+                        // 有可能文件被skip掉了。文件被skip掉后，状态坑定不是Queued.
+                        if ( file.getStatus() === Status.QUEUED ) {
+                            me.owner.trigger( 'uploadStart', file );
+                            file.setStatus( Status.PROGRESS );
+                            return file;
+                        }
+    
+                        return me._finishFile( file );
+                    });
+    
+                    // 如果还在pending中，则替换成文件本身。
+                    promise.done(function() {
+                        var idx = $.inArray( promise, pending );
+    
+                        ~idx && pending.splice( idx, 1, file );
+                    });
+    
+                    // befeore-send-file的钩子就有错误发生。
+                    promise.fail( function( reason ) {
+                        file.setStatus( Status.ERROR, reason );
+                        me.owner.trigger( 'uploadError', file, type );
+                        me.owner.trigger( 'uploadComplete', file );
+                    });
+    
+                    pending.push( promise );
+                }
+            },
+    
+            // 让出位置了，可以让其他分片开始上传
+            _popBlock: function( block ) {
+                var idx = $.inArray( block, this.pool );
+    
+                this.pool.splice( idx, 1 );
+                block.file.remaning--;
+                this.remaning--;
+            },
+    
+            // 开始上传，可以被掉过。如果promise被reject了，则表示跳过此分片。
+            _startSend: function( block ) {
+                var me = this,
+                    file = block.file,
+                    promise;
+    
+                me.pool.push( block );
+                me.remaning++;
+    
+                // 如果没有分片，则直接使用原始的。
+                // 不会丢失content-type信息。
+                block.blob = block.chunks === 1 ? file.source :
+                        file.source.slice( block.start, block.end );
+    
+                // hook, 每个分片发送之前可能要做些异步的事情。
+                promise = me.request( 'before-send', block, function() {
+    
+                    // 有可能文件已经上传出错了，所以不需要再传输了。
+                    if ( file.getStatus() === Status.PROGRESS ) {
+                        me._doSend( block );
+                    } else {
+                        me._popBlock( block );
+                        Base.nextTick( me.__tick );
+                    }
+                });
+    
+                // 如果为fail了，则跳过此分片。
+                promise.fail(function() {
+                    if ( file.remaning === 1 ) {
+                        me._finishFile( file ).always(function() {
+                            block.percentage = 1;
+                            me._popBlock( block );
+                            me.owner.trigger( 'uploadComplete', file );
+                            Base.nextTick( me.__tick );
+                        });
+                    } else {
+                        block.percentage = 1;
+                        me._popBlock( block );
+                        Base.nextTick( me.__tick );
+                    }
+                });
+            },
+    
+            /**
+             * @event uploadProgress
+             * @param {File} file File对象
+             * @param {Number} percentage 上传进度
+             * @description 上传过程中触发，携带上传进度。
+             * @for  Uploader
+             */
+    
+            /**
+             * @event uploadError
+             * @param {File} file File对象
+             * @param {String} reason 出错的code
+             * @description 当文件上传出错时触发。
+             * @for  Uploader
+             */
+    
+            /**
+             * @event uploadSuccess
+             * @param {File} file File对象
+             * @description 当文件上传成功时触发。
+             * @for  Uploader
+             */
+    
+            /**
+             * @event uploadComplete
+             * @param {File} [file] File对象
+             * @description 不管成功或者失败，文件上传完成时触发。
+             * @for  Uploader
+             */
+    
+            // 做上传操作。
+            _doSend: function( block ) {
+                var me = this,
+                    owner = me.owner,
+                    opts = me.options,
+                    file = block.file,
+                    tr = new Transport( opts ),
+                    data = $.extend({}, opts.formData ),
+                    headers = $.extend({}, opts.headers );
+    
+                block.transport = tr;
+    
+                tr.on( 'destroy', function() {
+                    delete block.transport;
+                    me._popBlock( block );
+                    Base.nextTick( me.__tick );
+                });
+    
+                // 广播上传进度。以文件为单位。
+                tr.on( 'progress', function( percentage ) {
+                    var totalPercent = 0,
+                        uploaded = 0;
+    
+                    // 可能没有abort掉，progress还是执行进来了。
+                    // if ( !file.blocks ) {
+                    //     return;
+                    // }
+    
+                    totalPercent = block.percentage = percentage;
+    
+                    if ( block.chunks > 1 ) {    // 计算文件的整体速度。
+                        $.each( file.blocks, function( _, v ) {
+                            uploaded += (v.percentage || 0) * (v.end - v.start);
+                        });
+    
+                        totalPercent = uploaded / file.size;
+                    }
+    
+                    owner.trigger( 'uploadProgress', file, totalPercent || 0 );
+                });
+    
+                // 尝试重试，然后广播文件上传出错。
+                tr.on( 'error', function( type ) {
+                    block.retried = block.retried || 0;
+    
+                    // 自动重试
+                    if ( block.chunks > 1 && ~'http,abort'.indexOf( type ) &&
+                            block.retried < opts.chunkRetry ) {
+    
+                        block.retried++;
+                        tr.send();
+    
+                    } else {
+                        file.setStatus( Status.ERROR, type );
+                        owner.trigger( 'uploadError', file, type );
+                        owner.trigger( 'uploadComplete', file );
+                    }
+                });
+    
+                // 上传成功
+                tr.on( 'load', function() {
+                    var ret = tr.getResponseAsJson() || {},
+                        reject, fn;
+    
+                    ret._raw = tr.getResponse();
+                    fn = function( value ) {
+                        reject = value;
+                    };
+    
+                    // 服务端响应了，不代表成功了，询问是否响应正确。
+                    if ( !owner.trigger( 'uploadAccept', block, ret, fn ) ) {
+                        reject = reject || 'server';
+                    }
+    
+                    // 如果非预期，转向上传出错。
+                    if ( reject ) {
+                        tr.trigger( 'error', reject );
+                        return;
+                    }
+    
+                    // 全部上传完成。
+                    if ( file.remaning === 1 ) {
+                        me._finishFile( file, ret );
+                    } else {
+                        tr.destroy();
+                    }
+                });
+    
+                // 配置默认的上传字段。
+                data = $.extend( data, {
+                    id: file.id,
+                    name: file.name,
+                    type: file.type,
+                    lastModifiedDate: file.lastModifiedDate,
+                    size: file.size
+                });
+    
+                block.chunks > 1 && $.extend( data, {
+                    chunks: block.chunks,
+                    chunk: block.chunk
+                });
+    
+                // 在发送之间可以添加字段什么的。。。
+                // 如果默认的字段不够使用，可以通过监听此事件来扩展
+                owner.trigger( 'uploadBeforeSend', block, data, headers );
+    
+                // 开始发送。
+                tr.appendBlob( opts.fileVal, block.blob, file.name );
+                tr.append( data );
+                tr.setRequestHeader( headers );
+                tr.send();
+            },
+    
+            // 完成上传。
+            _finishFile: function( file, ret, hds ) {
+                var owner = this.owner;
+    
+                return owner
+                        .request( 'after-send-file', arguments, function() {
+                            file.setStatus( Status.COMPLETE );
+                            owner.trigger( 'uploadSuccess', file, ret, hds );
+                        })
+                        .fail(function( reason ) {
+    
+                            // 如果外部已经标记为invalid什么的，不再改状态。
+                            if ( file.getStatus() === Status.PROGRESS ) {
+                                file.setStatus( Status.ERROR, reason );
+                            }
+    
+                            owner.trigger( 'uploadError', file, reason );
+                        })
+                        .always(function() {
+                            owner.trigger( 'uploadComplete', file );
+                        });
+            }
+    
+        });
+    });
+
+    /**
+     * @fileOverview 各种验证，包括文件总大小是否超出、单文件是否超出和文件是否重复。
+     */
+    
+    define( 'widgets/validator', [
+        'base',
+        'uploader',
+        'file',
+        'widgets/widget'
+    ], function( Base, Uploader, WUFile ) {
+    
+        var $ = Base.$,
+            validators = {},
+            api;
+    
+        // 暴露给外面的api
+        api = {
+    
+            // 添加验证器
+            addValidator: function( type, cb ) {
+                validators[ type ] = cb;
+            },
+    
+            // 移除验证器
+            removeValidator: function( type ) {
+                delete validators[ type ];
+            }
+        };
+    
+        // 在Uploader初始化的时候启动Validators的初始化
+        Uploader.register({
+            init: function() {
+                var me = this;
+                $.each( validators, function() {
+                    this.call( me.owner );
+                });
+            }
+        });
+    
+        /**
+         * @property {int} [fileNumLimit=undefined]
+         * @namespace options
+         * @for Uploader
+         * @description 验证文件总数量, 超出则不允许加入队列。
+         */
+        api.addValidator( 'fileNumLimit', function() {
+            var uploader = this,
+                opts = uploader.options,
+                count = 0,
+                max = opts.fileNumLimit >> 0,
+                flag = true;
+    
+            if ( !max ) {
+                return;
+            }
+    
+            uploader.on( 'beforeFileQueued', function() {
+    
+                if ( count >= max && flag ) {
+                    flag = false;
+                    this.trigger( 'error', 'Q_EXCEED_NUM_LIMIT', max );
+                    setTimeout(function() {
+                        flag = true;
+                    }, 1 );
+                }
+    
+                return count >= max ? false : true;
+            });
+    
+            uploader.on( 'fileQueued', function() {
+                count++;
+            });
+    
+            uploader.on( 'fileDequeued', function() {
+                count--;
+            });
+        });
+    
+    
+        /**
+         * @property {int} [fileSizeLimit=undefined]
+         * @namespace options
+         * @for Uploader
+         * @description 验证文件总大小是否超出限制, 超出则不允许加入队列。
+         */
+        api.addValidator( 'fileSizeLimit', function() {
+            var uploader = this,
+                opts = uploader.options,
+                count = 0,
+                max = opts.fileSizeLimit >> 0,
+                flag = true;
+    
+            if ( !max ) {
+                return;
+            }
+    
+            uploader.on( 'beforeFileQueued', function( file ) {
+                var invalid = count + file.size > max;
+    
+                if ( invalid && flag ) {
+                    flag = false;
+                    this.trigger( 'error', 'Q_EXCEED_SIZE_LIMIT', max );
+                    setTimeout(function() {
+                        flag = true;
+                    }, 1 );
+                }
+    
+                return invalid ? false : true;
+            });
+    
+            uploader.on( 'fileQueued', function( file ) {
+                count += file.size;
+            });
+    
+            uploader.on( 'fileDequeued', function( file ) {
+                count -= file.size;
+            });
+        });
+    
+        /**
+         * @property {int} [fileSingleSizeLimit=undefined]
+         * @namespace options
+         * @for Uploader
+         * @description 验证单个文件大小是否超出限制, 超出则不允许加入队列。
+         */
+        api.addValidator( 'fileSingleSizeLimit', function() {
+            var uploader = this,
+                opts = uploader.options,
+                max = opts.fileSingleSizeLimit;
+    
+            if ( !max ) {
+                return;
+            }
+    
+            uploader.on( 'fileQueued', function( file ) {
+                if ( file.size > max ) {
+                    file.setStatus( WUFile.Status.INVALID, 'exceed_size' );
+                }
+            });
+        });
+    
+        /**
+         * @property {int} [duplicate=undefined]
+         * @namespace options
+         * @for Uploader
+         * @description 去重， 根据文件名字、文件大小和最后修改时间来生成hash Key.
+         */
+        api.addValidator( 'duplicate', function() {
+            var uploader = this,
+                opts = uploader.options,
+                mapping = {};
+    
+            if ( opts.duplicate ) {
+                return;
+            }
+    
+            function hashString( str ) {
+                var hash = 0,
+                    i = 0,
+                    len = str.length,
+                    _char;
+    
+                for ( ; i < len; i++ ) {
+                    _char = str.charCodeAt( i );
+                    hash = _char + (hash << 6) + (hash << 16) - hash;
+                }
+    
+                return hash;
+            }
+    
+            uploader.on( 'beforeFileQueued', function( file ) {
+                var hash = hashString( file.name + file.size +
+                        file.lastModifiedDate );
+    
+                // 已经重复了
+                if ( mapping[ hash ] ) {
+                    return false;
+                }
+            });
+    
+            uploader.on( 'fileQueued', function( file ) {
+                var hash = hashString( file.name + file.size +
+                        file.lastModifiedDate );
+    
+                mapping[ hash ] = true;
+            });
+    
+            uploader.on( 'fileDequeued', function( file ) {
+                var hash = hashString( file.name + file.size +
+                        file.lastModifiedDate );
+    
+                delete mapping[ hash ];
+            });
+        });
+    
+        return api;
+    });
+
+    /**
+     * @file 暴露变量给外部使用。
+     * 此文件也只有在把webupload合并成一个文件使用的时候才会引入。
+     *
+     * 将所有modules，将路径ids装换成对象。
+     */
+    (function( modules ) {
+        var
+            // 让首写字母大写。
+            ucFirst = function( str ) {
+                return str && (str.charAt( 0 ).toUpperCase() + str.substr( 1 ));
+            },
+    
+            // 暴露出去的key
+            exportName = 'WebUploader',
+            exports = modules.base,
+            key, host, parts, part, last, origin;
+    
+        for ( key in modules ) {
+            host = exports;
+    
+            if ( !modules.hasOwnProperty( key ) ) {
+                continue;
+            }
+    
+            parts = key.split('/');
+            last = ucFirst( parts.pop() );
+    
+            while( (part = ucFirst( parts.shift() )) ) {
+                host[ part ] = host[ part ] || {};
+                host = host[ part ];
+            }
+    
+            host[ last ] = modules[ key ];
+        }
+    
+        if ( typeof module === 'object' && typeof module.exports === 'object' ) {
+            module.exports = exports;
+        } else if ( window.define && window.define.amd ) {
+            window.define( '../build/outro',  exportName, exports );
+        } else {
+            origin = window[ exportName ];
+            window[ exportName ] = exports;
+            window[ exportName ].noConflict = function() {
+                window[ exportName ] = origin;
+            };
+        }
+    })( internalAmd.modules );
+})( this );
\ No newline at end of file
diff --git a/static/js/lib/webUploader/webUploader.js b/static/js/lib/webUploader/webUploader.js
new file mode 100644
index 0000000..341205d
--- /dev/null
+++ b/static/js/lib/webUploader/webUploader.js
@@ -0,0 +1,240 @@
+jQuery(function () {
+    var $ = jQuery,
+        $list = $('#thelist'),
+        $btn = $('#ctlBtn'),
+        state = 'pending',
+        uploader;
+
+    uploader = WebUploader.create({
+
+        // 不压缩image
+        resize: false,
+
+        // swf文件路径
+        swf: 'js/Uploader.swf',
+
+        // 文件接收服务端。
+        server: 'http://webuploader.duapp.com/server/fileupload.php',
+
+        // 选择文件的按钮。可选。
+        // 内部根据当前运行是创建，可能是input元素，也可能是flash.
+        pick: '#picker',
+        // 只允许选择.xls,xlsx文件。
+        accept: {
+            title: 'Excel',
+            extensions: 'xls,xlsx',
+            mimeTypes: 'application/vnd.ms-excel'
+        }
+    });
+
+    // 当有文件添加进来的时候
+    uploader.on('fileQueued', function (file) {
+        $list.append('<div id="' + file.id + '" class="item">' +
+            '<h4 class="info">' + file.name + '</h4>' +
+            '<p class="state">等待上传...</p>' +
+            '</div>');
+    });
+
+    // 文件上传过程中创建进度条实时显示。
+    uploader.on('uploadProgress', function (file, percentage) {
+        var $li = $('#' + file.id),
+            $percent = $li.find('.progress .progress-bar');
+
+        // 避免重复创建
+        if (!$percent.length) {
+            $percent = $('<div class="progress progress-striped active">' +
+                '<div class="progress-bar" role="progressbar" style="width: 0%">' +
+                '</div>' +
+                '</div>').appendTo($li).find('.progress-bar');
+        }
+
+        $li.find('p.state').text('上传中');
+
+        $percent.css('width', percentage * 100 + '%');
+    });
+
+    uploader.on('uploadSuccess', function (file) {
+        $('#' + file.id).find('p.state').text('已上传');
+    });
+
+    uploader.on('uploadError', function (file) {
+        $('#' + file.id).find('p.state').text('上传出错');
+    });
+
+    uploader.on('uploadComplete', function (file) {
+        $('#' + file.id).find('.progress').fadeOut();
+    });
+
+    uploader.on('all', function (type) {
+        if (type === 'startUpload') {
+            state = 'uploading';
+        } else if (type === 'stopUpload') {
+            state = 'paused';
+        } else if (type === 'uploadFinished') {
+            state = 'done';
+        }
+
+        if (state === 'uploading') {
+            $btn.text('暂停上传');
+        } else {
+            $btn.text('开始上传');
+        }
+    });
+
+    $btn.on('click', function () {
+        if (state === 'uploading') {
+            uploader.stop();
+        } else {
+            uploader.upload();
+        }
+    });
+});
+
+/*// 图片上传demo
+jQuery(function () {
+    var $ = jQuery,
+    $list = $('#fileList'),
+    // 优化retina, 在retina下这个值是2
+    ratio = window.devicePixelRatio || 1,
+
+    // 缩略图大小
+    thumbnailWidth = 100 * ratio,
+    thumbnailHeight = 100 * ratio,
+
+    // Web Uploader实例
+    uploader;
+
+    // 初始化Web Uploader
+    uploader = WebUploader.create({
+
+        // 自动上传。
+        auto: true,
+
+        // swf文件路径
+        swf: '/js/Uploader.swf',
+
+        // 文件接收服务端。
+        server: 'http://webuploader.duapp.com/server/fileupload.php',
+
+        // 选择文件的按钮。可选。
+        // 内部根据当前运行是创建，可能是input元素，也可能是flash.
+        pick: '#filePicker',
+
+        // 只允许选择文件，可选。
+        accept: {
+            title: 'Images',
+            extensions: 'gif,jpg,jpeg,bmp,png',
+            mimeTypes: 'image/!*'
+        }
+    });
+
+    // 当有文件添加进来的时候
+    uploader.on('fileQueued', function (file) {
+        var $li = $(
+            '<div id="' + file.id + '" class="file-item thumbnail">' +
+            '<img>' +
+            '<div class="info">' + file.name + '</div>' +
+            '</div>'
+            ),
+            $img = $li.find('img');
+
+        $list.append($li);
+
+        // 创建缩略图
+        uploader.makeThumb(file, function (error, src) {
+            if (error) {
+                $img.replaceWith('<span>不能预览</span>');
+                return;
+            }
+
+            $img.attr('src', src);
+        }, thumbnailWidth, thumbnailHeight);
+    });
+
+    // 文件上传过程中创建进度条实时显示。
+    uploader.on('uploadProgress', function (file, percentage) {
+        var $li = $('#' + file.id),
+            $percent = $li.find('.progress span');
+
+        // 避免重复创建
+        if (!$percent.length) {
+             $percent = $('<p class="progress"><span></span></p>')
+            .appendTo($li)
+            .find('span');
+        }
+        $percent.css('width', percentage * 100 + '%');
+    });
+
+    // 文件上传成功，给item添加成功class, 用样式标记上传成功。
+    uploader.on('uploadSuccess', function (file) {
+        $('#' + file.id).addClass('upload-state-done');
+    });
+
+    // 文件上传失败，现实上传出错。
+    uploader.on('uploadError', function (file) {
+        var $li = $('#' + file.id),
+            $error = $li.find('div.error');
+
+        // 避免重复创建
+        if (!$error.length) {
+            $error = $('<div class="error"></div>').appendTo($li);
+         }
+        $error.text('上传失败');
+    });
+
+    // 完成上传完了，成功或者失败，先删除进度条。
+    uploader.on('uploadComplete', function (file) {
+        $('#' + file.id).find('.progress').remove();
+    });
+});
+
+/*var $ = jQuery,
+    $list = $('#thelist'),
+    $btn = $('#ctlBtn'),
+    state = 'pending';
+var uploader = WebUploader.create({
+    // swf文件路径
+    swf: 'js/Uploader.swf',
+    // 文件接收服务端。
+    server: 'http://webuploader.duapp.com/server/fileupload.php',
+    // 选择文件的按钮。可选。
+    // 内部根据当前运行是创建，可能是input元素，也可能是flash.
+    pick: '#picker',
+    // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
+    resize: false
+});
+// 当有文件被添加进队列的时候
+uploader.on( 'fileQueued', function( file ) {
+    $list.append( '<div id="' + file.id + '" class="item">' +
+        '<h4 class="info">' + file.name + '</h4>' +
+        '<p class="state">等待上传...</p>' +
+        '</div>' );
+});
+// 文件上传过程中创建进度条实时显示。
+uploader.on( 'uploadProgress', function( file, percentage ) {
+    var $li = $( '#'+file.id ),
+        $percent = $li.find('.progress .progress-bar');
+
+    // 避免重复创建
+    if ( !$percent.length ) {
+        $percent = $('<div class="progress progress-striped active">' +
+            '<div class="progress-bar" role="progressbar" style="width: 0%">' +
+            '</div>' +
+            '</div>').appendTo( $li ).find('.progress-bar');
+    }
+
+    $li.find('p.state').text('上传中');
+
+    $percent.css( 'width', percentage * 100 + '%' );
+});
+uploader.on( 'uploadSuccess', function( file ) {
+    $( '#'+file.id ).find('p.state').text('已上传');
+});
+
+uploader.on( 'uploadError', function( file ) {
+    $( '#'+file.id ).find('p.state').text('上传出错');
+});
+
+uploader.on( 'uploadComplete', function( file ) {
+    $( '#'+file.id ).find('.progress').fadeOut();
+});*/
\ No newline at end of file
diff --git a/static/js/lib/webUploader/webuploader.flashonly.js b/static/js/lib/webUploader/webuploader.flashonly.js
new file mode 100644
index 0000000..c51d7b8
--- /dev/null
+++ b/static/js/lib/webUploader/webuploader.flashonly.js
@@ -0,0 +1,4042 @@
+/* WebUploader 0.1.0 */
+(function( window, undefined ) {
+    /**
+     * @fileOverview 让内部各个部件的代码可以用[amd](https://github.com/amdjs/amdjs-api/wiki/AMD)模块定义方式组织起来。
+     *
+     * AMD API 内部的简单不完全实现，请忽略。只有当WebUploader被合并成一个文件的时候才会引入。
+     */
+    var internalAmd = (function( global, undefined ) {
+            var modules = {},
+    
+                // 简单不完全实现https://github.com/amdjs/amdjs-api/wiki/require
+                require = function( deps, callback ) {
+                    var args, len, i;
+    
+                    // 如果deps不是数组，则直接返回指定module
+                    if ( typeof deps === 'string' ) {
+                        return getModule( deps );
+                    } else {
+                        args = [];
+                        for( len = deps.length, i = 0; i < len; i++ ) {
+                            args.push( getModule( deps[ i ] ) );
+                        }
+    
+                        return callback.apply( null, args );
+                    }
+                },
+    
+                // 内部的define，暂时不支持不指定id.
+                define = function( id, deps, factory ) {
+                    if ( arguments.length === 2 ) {
+                        factory = deps;
+                        deps = null;
+                    }
+    
+                    if ( typeof id !== 'string' || !factory ) {
+                        throw new Error('Define Error');
+                    }
+    
+                    require( deps || [], function() {
+                        setModule( id, factory, arguments );
+                    });
+                },
+    
+                // 设置module, 兼容CommonJs写法。
+                setModule = function( id, factory, args ) {
+                    var module = {
+                            exports: factory
+                        },
+                        returned;
+    
+                    if ( typeof factory === 'function' ) {
+                        args.length || (args = [ require, module.exports, module ]);
+                        returned = factory.apply( null, args );
+                        returned !== undefined && (module.exports = returned);
+                    }
+    
+                    modules[ id ] = module.exports;
+                },
+    
+                // 根据id获取module
+                getModule = function( id ) {
+                    var module = modules[ id ] || global[ id ];
+    
+                    if ( !module ) {
+                        throw new Error( '`' + id + '` is undefined' );
+                    }
+    
+                    return module;
+                };
+    
+            return {
+                define: define,
+                require: require,
+    
+                // 暴露所有的模块。
+                modules: modules
+            };
+        })( window ),
+    
+        /* jshint unused: false */
+        require = internalAmd.require,
+        define = internalAmd.define;
+
+    /**
+     * @fileOverview 基础类方法。
+     */
+    
+    /**
+     * Web Uploader内部类的详细说明，以下提及的功能类，都可以在`WebUploader`这个变量中访问到。
+     *
+     * As you know, Web Uploader的每个文件都是用过[AMD](https://github.com/amdjs/amdjs-api/wiki/AMD)规范中的`define`组织起来的, 每个Module都会有个module id.
+     * 默认module id该文件的路径，而此路径将会转化成名字空间存放在WebUploader中。如：
+     *
+     * * module `base`：WebUploader.Base
+     * * module `file`: WebUploader.File
+     * * module `lib/dnd`: WebUploader.Lib.Dnd
+     * * module `runtime/html5/dnd`: WebUploader.Runtime.Html5.Dnd
+     *
+     *
+     * 以下文档将可能省略`WebUploader`前缀。
+     * @module WebUploader
+     * @title WebUploader API文档
+     */
+    define( 'base', [
+        'jQuery'
+    ], function( $ ) {
+    
+        var noop = function() {},
+            call = Function.call;
+    
+        // http://jsperf.com/uncurrythis
+        // 反科里化
+        function uncurryThis( fn ) {
+            return function() {
+                return call.apply( fn, arguments );
+            };
+        }
+    
+        function bindFn( fn, context ) {
+            return Function.prototype.bind ? fn.bind( context ) : function() {
+                return fn.apply( context, arguments );
+            };
+        }
+    
+        function createObject( proto ) {
+            var f;
+    
+            if ( Object.create ) {
+                return Object.create( proto );
+            } else {
+                f = function() {};
+                f.prototype = proto;
+                return new f();
+            }
+        }
+    
+    
+        /**
+         * 基础类，提供一些简单常用的方法。
+         * @class Base
+         */
+        return {
+    
+            /**
+             * @property {String} version 当前版本号。
+             */
+            version: '0.1.0',
+    
+            /**
+             * @property {jQuery|Zepto} $ 引用依赖的jQuery或者Zepto对象。
+             */
+            $: $,
+    
+            /**
+             * 创建一个[Deferred](http://api.jquery.com/category/deferred-object/)对象。
+             * 详细的Deferred用法说明，请参照jQuery的API文档。
+             *
+             * Deferred对象在钩子回掉函数中经常要用到，用来处理需要等待的异步操作。
+             *
+             *
+             * @method Deferred
+             * @grammar Base.Deferred() => Deferred
+             * @example
+             * // 在文件开始发送前做些异步操作。
+             * // WebUploader会等待此异步操作完成后，开始发送文件。
+             * Uploader.register({
+             *     'before-send-file': 'doSomthingAsync'
+             * }, {
+             *
+             *     doSomthingAsync: function() {
+             *         var deferred = Base.Deferred();
+             *
+             *         // 模拟一次异步操作。
+             *         setTimeout(deferred.resolve, 2000);
+             *
+             *         return deferred.promise();
+             *     }
+             * });
+             */
+            Deferred: $.Deferred,
+    
+            /**
+             * 判断传入的参数是否为一个promise对象。
+             * @method isPromise
+             * @grammar Base.isPromise( anything ) => Boolean
+             * @param  {*}  anything 检测对象。
+             * @return {Boolean}
+             * @example
+             * console.log( Base.isPromise() );    // => false
+             * console.log( Base.isPromise({ key: '123' }) );    // => false
+             * console.log( Base.isPromise( Base.Deferred().promise() ) );    // => true
+             *
+             * // Deferred也是一个Promise
+             * console.log( Base.isPromise( Base.Deferred() ) );    // => true
+             */
+            isPromise: function( anything ) {
+                return anything && typeof anything.then === 'function';
+            },
+    
+    
+            /**
+             * 返回一个promise，此promise在所有传入的promise都完成了后完成。
+             * 详细请查看[这里](http://api.jquery.com/jQuery.when/)。
+             *
+             * @method when
+             * @grammar Base.when( promise1[, promise2[, promise3...]] ) => Promise
+             */
+            when: $.when,
+    
+            /**
+             * @description  简单的浏览器检查结果。
+             *
+             * * `webkit`  webkit版本号，如果浏览器为非webkit内核，此属性为`undefined`。
+             * * `chrome`  chrome浏览器版本号，如果浏览器为chrome，此属性为`undefined`。
+             * * `ie`  ie浏览器版本号，如果浏览器为非ie，此属性为`undefined`。**暂不支持ie10+**
+             * * `firefox`  firefox浏览器版本号，如果浏览器为非firefox，此属性为`undefined`。
+             * * `safari`  safari浏览器版本号，如果浏览器为非safari，此属性为`undefined`。
+             * * `opera`  opera浏览器版本号，如果浏览器为非opera，此属性为`undefined`。
+             *
+             * @property {Object} [browser]
+             */
+            browser: (function( ua ) {
+                var ret = {},
+                    webkit = ua.match( /WebKit\/([\d.]+)/ ),
+                    chrome = ua.match( /Chrome\/([\d.]+)/ ) ||
+                        ua.match( /CriOS\/([\d.]+)/ ),
+    
+                    ie = ua.match( /MSIE\s([\d.]+)/ ),
+                    firefox = ua.match( /Firefox\/([\d.]+)/ ),
+                    safari = ua.match( /Safari\/([\d.]+)/ ),
+                    opera = ua.match( /OPR\/([\d.]+)/ );
+    
+                webkit && (ret.webkit = parseFloat( webkit[ 1 ] ));
+                chrome && (ret.chrome = parseFloat( chrome[ 1 ] ));
+                ie && (ret.ie = parseFloat( ie[ 1 ] ));
+                firefox && (ret.firefox = parseFloat( firefox[ 1 ] ));
+                safari && (ret.safari = parseFloat( safari[ 1 ] ));
+                opera && (ret.opera = parseFloat( opera[ 1 ] ));
+    
+                return ret;
+            })( navigator.userAgent ),
+    
+            /**
+             * 实现类与类之间的继承。
+             * @method inherits
+             * @grammar Base.inherits( super ) => child
+             * @grammar Base.inherits( super, protos ) => child
+             * @grammar Base.inherits( super, protos, statics ) => child
+             * @param  {Class} super 父类
+             * @param  {Object | Function} [protos] 子类或者对象。如果对象中包含constructor，子类将是用此属性值。
+             * @param  {Function} [protos.constructor] 子类构造器，不指定的话将创建个临时的直接执行父类构造器的方法。
+             * @param  {Object} [statics] 静态属性或方法。
+             * @return {Class} 返回子类。
+             * @example
+             * function Person() {
+             *     console.log( 'Super' );
+             * }
+             * Person.prototype.hello = function() {
+             *     console.log( 'hello' );
+             * };
+             *
+             * var Manager = Base.inherits( Person, {
+             *     world: function() {
+             *         console.log( 'World' );
+             *     }
+             * });
+             *
+             * // 因为没有指定构造器，父类的构造器将会执行。
+             * var instance = new Manager();    // => Super
+             *
+             * // 继承子父类的方法
+             * instance.hello();    // => hello
+             * instance.world();    // => World
+             *
+             * // 子类的__super__属性指向父类
+             * console.log( Manager.__super__ === Person );    // => true
+             */
+            inherits: function( Super, protos, staticProtos ) {
+                var child;
+    
+                if ( typeof protos === 'function' ) {
+                    child = protos;
+                    protos = null;
+                } else if ( protos && protos.hasOwnProperty('constructor') ) {
+                    child = protos.constructor;
+                } else {
+                    child = function() {
+                        return Super.apply( this, arguments );
+                    };
+                }
+    
+                // 复制静态方法
+                $.extend( true, child, Super, staticProtos || {} );
+    
+                /* jshint camelcase: false */
+    
+                // 让子类的__super__属性指向父类。
+                child.__super__ = Super.prototype;
+    
+                // 构建原型，添加原型方法或属性。
+                // 暂时用Object.create实现。
+                child.prototype = createObject( Super.prototype );
+                protos && $.extend( true, child.prototype, protos );
+    
+                return child;
+            },
+    
+            /**
+             * 一个不做任何事情的方法。可以用来赋值给默认的callback.
+             * @method noop
+             */
+            noop: noop,
+    
+            /**
+             * 返回一个新的方法，此方法将已指定的`context`来执行。
+             * @grammar Base.bindFn( fn, context ) => Function
+             * @method bindFn
+             * @example
+             * var doSomething = function() {
+             *         console.log( this.name );
+             *     },
+             *     obj = {
+             *         name: 'Object Name'
+             *     },
+             *     aliasFn = Base.bind( doSomething, obj );
+             *
+             *  aliasFn();    // => Object Name
+             *
+             */
+            bindFn: bindFn,
+    
+            /**
+             * 引用Console.log如果存在的话，否则引用一个[空函数loop](#WebUploader:Base.log)。
+             * @grammar Base.log( args... ) => undefined
+             * @method log
+             */
+            log: (function() {
+                if ( window.console ) {
+                    return bindFn( console.log, console );
+                }
+                return noop;
+            })(),
+    
+            nextTick: (function() {
+    
+                return function( cb ) {
+                    setTimeout( cb, 1 );
+                };
+    
+                // @bug 当浏览器不在当前窗口时就停了。
+                // var next = window.requestAnimationFrame ||
+                //     window.webkitRequestAnimationFrame ||
+                //     window.mozRequestAnimationFrame ||
+                //     function( cb ) {
+                //         window.setTimeout( cb, 1000 / 60 );
+                //     };
+    
+                // // fix: Uncaught TypeError: Illegal invocation
+                // return bindFn( next, window );
+            })(),
+    
+            /**
+             * 被[uncurrythis](http://www.2ality.com/2011/11/uncurrying-this.html)的数组slice方法。
+             * 将用来将非数组对象转化成数组对象。
+             * @grammar Base.slice( target, start[, end] ) => Array
+             * @method slice
+             * @example
+             * function doSomthing() {
+             *     var args = Base.slice( arguments, 1 );
+             *     console.log( args );
+             * }
+             *
+             * doSomthing( 'ignored', 'arg2', 'arg3' );    // => Array ["arg2", "arg3"]
+             */
+            slice: uncurryThis( [].slice ),
+    
+            /**
+             * 生成唯一的ID
+             * @method guid
+             * @grammar Base.guid() => String
+             * @grammar Base.guid( prefx ) => String
+             */
+            guid: (function() {
+                var counter = 0;
+    
+                return function( prefix ) {
+                    var guid = (+new Date()).toString( 32 ),
+                        i = 0;
+    
+                    for ( ; i < 5; i++ ) {
+                        guid += Math.floor( Math.random() * 65535 ).toString( 32 );
+                    }
+    
+                    return (prefix || 'wu_') + guid + (counter++).toString( 32 );
+                };
+            })(),
+    
+            /**
+             * 格式化文件大小, 输出成带单位的字符串
+             * @method formatSize
+             * @grammar Base.formatSize( size ) => String
+             * @grammar Base.formatSize( size, pointLength ) => String
+             * @grammar Base.formatSize( size, pointLength, units ) => String
+             * @param {Number} size 文件大小
+             * @param {Number} [pointLength=2] 精确到的小数点数。
+             * @param {Array} [units=[ 'B', 'K', 'M', 'G', 'TB' ]] 单位数组。从字节，到千字节，一直往上指定。如果单位数组里面只指定了到了K(千字节)，同时文件大小大于M, 此方法的输出将还是显示成多少K.
+             * @example
+             * console.log( Base.formatSize( 100 ) );    // => 100B
+             * console.log( Base.formatSize( 1024 ) );    // => 1.00K
+             * console.log( Base.formatSize( 1024, 0 ) );    // => 1K
+             * console.log( Base.formatSize( 1024 * 1024 ) );    // => 1.00M
+             * console.log( Base.formatSize( 1024 * 1024 * 1024 ) );    // => 1.00G
+             * console.log( Base.formatSize( 1024 * 1024 * 1024, 0, ['B', 'KB', 'MB'] ) );    // => 1024MB
+             */
+            formatSize: function( size, pointLength, units ) {
+                var unit;
+    
+                units = units || [ 'B', 'K', 'M', 'G', 'TB' ];
+    
+                while ( (unit = units.shift()) && size > 1024 ) {
+                    size = size / 1024;
+                }
+    
+                return (unit === 'B' ? size : size.toFixed( pointLength || 2 )) +
+                        unit;
+            }
+        };
+    });
+
+    /**
+     * @fileOverview Mediator
+     */
+    define( 'mediator', [
+        'base'
+    ], function( Base ) {
+        var $ = Base.$,
+            slice = [].slice,
+            separator = /\s+/,
+            protos;
+    
+        // 根据条件过滤出事件handlers.
+        function findHandlers( arr, name, callback, context ) {
+            return $.grep( arr, function( handler ) {
+                return handler &&
+                        (!name || handler.e === name) &&
+                        (!callback || handler.cb === callback ||
+                        handler.cb._cb === callback) &&
+                        (!context || handler.ctx === context);
+            });
+        }
+    
+        function eachEvent( events, callback, iterator ) {
+            // 不支持对象，只支持多个event用空格隔开
+            $.each( (events || '').split( separator ), function( _, key ) {
+                iterator( key, callback );
+            });
+        }
+    
+        function triggerHanders( events, args ) {
+            var stoped = false,
+                i = -1,
+                len = events.length,
+                handler;
+    
+            while ( ++i < len ) {
+                handler = events[ i ];
+    
+                if ( handler.cb.apply( handler.ctx2, args ) === false ) {
+                    stoped = true;
+                    break;
+                }
+            }
+    
+            return !stoped;
+        }
+    
+        protos = {
+    
+            /**
+             * 绑定事件。
+             *
+             * `callback`方法在执行时，arguments将会来源于trigger的时候携带的参数。如
+             * ```javascript
+             * var obj = {};
+             *
+             * // 使得obj有事件行为
+             * Mediator.installTo( obj );
+             *
+             * obj.on( 'testa', function( arg1, arg2 ) {
+             *     console.log( arg1, arg2 ); // => 'arg1', 'arg2'
+             * });
+             *
+             * obj.trigger( 'testa', 'arg1', 'arg2' );
+             * ```
+             *
+             * 如果`callback`中，某一个方法`return false`了，则后续的其他`callback`都不会被执行到。
+             * 切会影响到`trigger`方法的返回值，为`false`。
+             *
+             * `on`还可以用来添加一个特殊事件`all`, 这样所有的事件触发都会响应到。同时此类`callback`中的arguments有一个不同处，
+             * 就是第一个参数为`type`，记录当前是什么事件在触发。此类`callback`的优先级比脚低，会再正常`callback`执行完后触发。
+             * ```javascript
+             * obj.on( 'all', function( type, arg1, arg2 ) {
+             *     console.log( type, arg1, arg2 ); // => 'testa', 'arg1', 'arg2'
+             * });
+             * ```
+             *
+             * @method on
+             * @grammar on( name, callback[, context] ) => self
+             * @param  {String}   name     事件名，支持多个事件用空格隔开
+             * @param  {Function} callback 事件处理器
+             * @param  {Object}   [context]  事件处理器的上下文。
+             * @return {self} 返回自身，方便链式
+             * @chainable
+             * @class Mediator
+             */
+            on: function( name, callback, context ) {
+                var me = this,
+                    set;
+    
+                if ( !callback ) {
+                    return this;
+                }
+    
+                set = this._events || (this._events = []);
+    
+                eachEvent( name, callback, function( name, callback ) {
+                    var handler = { e: name };
+    
+                    handler.cb = callback;
+                    handler.ctx = context;
+                    handler.ctx2 = context || me;
+                    handler.id = set.length;
+    
+                    set.push( handler );
+                });
+    
+                return this;
+            },
+    
+            /**
+             * 绑定事件，且当handler执行完后，自动解除绑定。
+             * @method once
+             * @grammar once( name, callback[, context] ) => self
+             * @param  {String}   name     事件名
+             * @param  {Function} callback 事件处理器
+             * @param  {Object}   [context]  事件处理器的上下文。
+             * @return {self} 返回自身，方便链式
+             * @chainable
+             */
+            once: function( name, callback, context ) {
+                var me = this;
+    
+                if ( !callback ) {
+                    return me;
+                }
+    
+                eachEvent( name, callback, function( name, callback ) {
+                    var once = function() {
+                            me.off( name, once );
+                            return callback.apply( context || me, arguments );
+                        };
+    
+                    once._cb = callback;
+                    me.on( name, once, context );
+                });
+    
+                return me;
+            },
+    
+            /**
+             * 解除事件绑定
+             * @method off
+             * @grammar off( [name[, callback[, context] ] ] ) => self
+             * @param  {String}   [name]     事件名
+             * @param  {Function} [callback] 事件处理器
+             * @param  {Object}   [context]  事件处理器的上下文。
+             * @return {self} 返回自身，方便链式
+             * @chainable
+             */
+            off: function( name, cb, ctx ) {
+                var events = this._events;
+    
+                if ( !events ) {
+                    return this;
+                }
+    
+                if ( !name && !cb && !ctx ) {
+                    this._events = [];
+                    return this;
+                }
+    
+                eachEvent( name, cb, function( name, cb ) {
+                    $.each( findHandlers( events, name, cb, ctx ), function() {
+                        delete events[ this.id ];
+                    });
+                });
+    
+                return this;
+            },
+    
+            /**
+             * 触发事件
+             * @method trigger
+             * @grammar trigger( name[, args...] ) => self
+             * @param  {String}   type     事件名
+             * @param  {*} [...] 任意参数
+             * @return {Boolean} 如果handler中return false了，则返回false, 否则返回true
+             */
+            trigger: function( type ) {
+                var args, events, allEvents;
+    
+                if ( !this._events || !type ) {
+                    return this;
+                }
+    
+                args = slice.call( arguments, 1 );
+                events = findHandlers( this._events, type );
+                allEvents = findHandlers( this._events, 'all' );
+    
+                return triggerHanders( events, args ) &&
+                        triggerHanders( allEvents, arguments );
+            }
+        };
+    
+        /**
+         * 中介者，它本身是个单例，但可以通过[installTo](#WebUploader:Mediator:installTo)方法，使任何对象具备事件行为。
+         * 主要目的是负责模块与模块之间的合作，降低耦合度。
+         *
+         * @class Mediator
+         */
+        return $.extend({
+    
+            /**
+             * 可以通过这个接口，使任何对象具备事件功能。
+             * @method installTo
+             * @param  {Object} obj 需要具备事件行为的对象。
+             * @return {Object} 返回obj.
+             */
+            installTo: function( obj ) {
+                return $.extend( obj, protos );
+            }
+    
+        }, protos );
+    });
+
+    /**
+     * @fileOverview Uploader上传类
+     */
+    define( 'uploader', [
+        'base',
+        'mediator'
+    ], function( Base, Mediator ) {
+    
+        var $ = Base.$;
+    
+        /**
+         * 上传入口类。
+         * @class Uploader
+         * @constructor
+         * @grammar new Uploader( opts ) => Uploader
+         * @example
+         * var uploader = WebUploader.Uploader({
+         *     swf: 'path_of_swf/Uploader.swf',
+         *
+         *     // 开起分片上传。
+         *     chunked: true
+         * });
+         */
+        function Uploader( opts ) {
+            this.options = $.extend( true, {}, Uploader.options, opts );
+            this._init( this.options );
+        }
+    
+        // default Options
+        // widgets中有相应扩展
+        Uploader.options = {};
+        Mediator.installTo( Uploader.prototype );
+    
+        // 批量添加纯命令式方法。
+        $.each({
+            upload: 'start-upload',
+            stop: 'stop-upload',
+            getFile: 'get-file',
+            getFiles: 'get-files',
+            // addFile: 'add-file',
+            // addFiles: 'add-file',
+            removeFile: 'remove-file',
+            skipFile: 'skip-file',
+            retry: 'retry',
+            isInProgress: 'is-in-progress',
+            makeThumb: 'make-thumb',
+            getDimension: 'get-dimension',
+            addButton: 'add-btn',
+            getRuntimeType: 'get-runtime-type',
+            refresh: 'refresh',
+            disable: 'disable',
+            enable: 'enable'
+        }, function( fn, command ) {
+            Uploader.prototype[ fn ] = function() {
+                return this.request( command, arguments );
+            };
+        });
+    
+        $.extend( Uploader.prototype, {
+            state: 'pending',
+    
+            _init: function( opts ) {
+                var me = this;
+    
+                me.request( 'init', opts, function() {
+                    me.state = 'ready';
+                    me.trigger('ready');
+                });
+            },
+    
+            /**
+             * 获取或者设置Uploader配置项。
+             * @method option
+             * @grammar option( key ) => *
+             * @grammar option( key, val ) => self
+             * @example
+             *
+             * // 初始状态图片上传前不会压缩
+             * var uploader = new WebUploader.Uploader({
+             *     resize: null;
+             * });
+             *
+             * // 修改后图片上传前，尝试将图片压缩到1600 * 1600
+             * uploader.options( 'resize', {
+             *     width: 1600,
+             *     height: 1600
+             * });
+             */
+            option: function( key, val ) {
+                var opts = this.options;
+    
+                // setter
+                if ( arguments.length > 1 ) {
+    
+                    if ( $.isPlainObject( val ) &&
+                            $.isPlainObject( opts[ key ] ) ) {
+                        $.extend( opts[ key ], val );
+                    } else {
+                        opts[ key ] = val;
+                    }
+    
+                } else {    // getter
+                    return key ? opts[ key ] : opts;
+                }
+            },
+    
+            /**
+             * 获取文件统计信息。返回一个包含一下信息的对象。
+             * * `successNum` 上传成功的文件数
+             * * `uploadFailNum` 上传失败的文件数
+             * * `cancelNum` 被删除的文件数
+             * * `invalidNum` 无效的文件数
+             * * `queueNum` 还在队列中的文件数
+             * @method getStats
+             * @grammar getStats() => Object
+             */
+            getStats: function() {
+                // return this._mgr.getStats.apply( this._mgr, arguments );
+                var stats = this.request('get-stats');
+    
+                return {
+                    successNum: stats.numOfSuccess,
+    
+                    // who care?
+                    // queueFailNum: 0,
+                    cancelNum: stats.numOfCancel,
+                    invalidNum: stats.numOfInvalid,
+                    uploadFailNum: stats.numOfUploadFailed,
+                    queueNum: stats.numOfQueue
+                };
+            },
+    
+            // 需要重写此方法来来支持opts.onEvent和instance.onEvent的处理器
+            trigger: function( type/*, args...*/ ) {
+                var args = [].slice.call( arguments, 1 ),
+                    opts = this.options,
+                    name = 'on' + type.substring( 0, 1 ).toUpperCase() +
+                        type.substring( 1 );
+    
+                if ( Mediator.trigger.apply( this, arguments ) === false ) {
+                    return false;
+                }
+    
+                if ( $.isFunction( opts[ name ] ) &&
+                        opts[ name ].apply( this, args ) === false ) {
+                    return false;
+                }
+    
+                if ( $.isFunction( this[ name ] ) &&
+                        this[ name ].apply( this, args ) === false ) {
+                    return false;
+                }
+    
+                return true;
+            },
+    
+            // widgets/widget.js将补充此方法的详细文档。
+            request: Base.noop,
+    
+            reset: function() {
+                // @todo
+            }
+        });
+    
+        /**
+         * 创建Uploader实例，等同于new Uploader( opts );
+         * @method create
+         * @class Base
+         * @static
+         * @grammar Base.create( opts ) => Uploader
+         */
+        Base.create = function( opts ) {
+            return new Uploader( opts );
+        };
+    
+        // 暴露Uploader，可以通过它来扩展业务逻辑。
+        Base.Uploader = Uploader;
+    
+        return Uploader;
+    });
+
+    /**
+     * @fileOverview Runtime管理器，负责Runtime的选择, 连接
+     */
+    define( 'runtime/runtime', [
+        'base',
+        'mediator'
+    ], function( Base, Mediator ) {
+    
+        var $ = Base.$,
+            factories = {},
+    
+            // 获取对象的第一个key
+            getFirstKey = function( obj ) {
+                for ( var key in obj ) {
+                    if ( obj.hasOwnProperty( key ) ) {
+                        return key;
+                    }
+                }
+                return null;
+            };
+    
+        // 接口类。
+        function Runtime( options ) {
+            this.options = $.extend({
+                container: document.body
+            }, options );
+            this.uid = Base.guid('rt_');
+        }
+    
+        $.extend( Runtime.prototype, {
+    
+            getContainer: function() {
+                var opts = this.options,
+                    parent, container;
+    
+                if ( this._container ) {
+                    return this._container;
+                }
+    
+                parent = opts.container || $( document.body );
+                container = $( document.createElement('div') );
+    
+                container.attr( 'id', 'rt_' + this.uid );
+                container.css({
+                    position: 'absolute',
+                    top: '0px',
+                    left: '0px',
+                    width: '1px',
+                    height: '1px',
+                    overflow: 'hidden'
+                });
+    
+                parent.append( container );
+                parent.addClass( 'webuploader-container' );
+                this._container = container;
+                return container;
+            },
+    
+            init: Base.noop,
+            exec: Base.noop,
+    
+            destroy: function() {
+                if ( this._container ) {
+                    this._container.parentNode.removeChild( this.__container );
+                }
+    
+                this.off();
+            }
+        });
+    
+        Runtime.orders = 'html5,flash';
+    
+    
+        /**
+         * 添加Runtime实现。
+         * @param {String} type    类型
+         * @param {Runtime} factory 具体Runtime实现。
+         */
+        Runtime.addRuntime = function( type, factory ) {
+            factories[ type ] = factory;
+        };
+    
+        Runtime.hasRuntime = function( type ) {
+            return !!(type ? factories[ type ] : getFirstKey( factories ));
+        };
+    
+        Runtime.create = function( opts, orders ) {
+            var type, runtime;
+    
+            orders = orders || Runtime.orders;
+            $.each( orders.split( /\s*,\s*/g ), function() {
+                if ( factories[ this ] ) {
+                    type = this;
+                    return false;
+                }
+            });
+    
+            type = type || getFirstKey( factories );
+    
+            if ( !type ) {
+                throw new Error('Runtime Error');
+            }
+    
+            runtime = new factories[ type ]( opts );
+            return runtime;
+        };
+    
+        Mediator.installTo( Runtime.prototype );
+        return Runtime;
+    });
+
+    /**
+     * @fileOverview Runtime管理器，负责Runtime的选择, 连接
+     */
+    define( 'runtime/client', [
+        'base',
+        'mediator',
+        'runtime/runtime'
+    ], function( Base, Mediator, Runtime ) {
+    
+        var cache = (function() {
+                var obj = {};
+    
+                return {
+                    add: function( runtime ) {
+                        obj[ runtime.uid ] = runtime;
+                    },
+    
+                    get: function( ruid ) {
+                        var i;
+    
+                        if ( ruid ) {
+                            return obj[ ruid ];
+                        }
+    
+                        for ( i in obj ) {
+                            return obj[ i ];
+                        }
+    
+                        return null;
+                    },
+    
+                    remove: function( runtime ) {
+                        delete obj[ runtime.uid ];
+                    },
+    
+                    has: function() {
+                        return !!this.get.apply( this, arguments );
+                    }
+                };
+            })();
+    
+        function RuntimeClient( component, standalone ) {
+            var deferred = Base.Deferred(),
+                runtime;
+    
+            this.uid = Base.guid('client_');
+    
+            this.runtimeReady = function( cb ) {
+                return deferred.done( cb );
+            };
+    
+            this.connectRuntime = function( opts, cb ) {
+                if ( runtime ) {
+                    return;
+                }
+    
+                deferred.done( cb );
+    
+                if ( typeof opts === 'string' && cache.get( opts ) ) {
+                    runtime = cache.get( opts );
+    
+                // 像filePicker只能独立存在，不能公用。
+                } else if ( !standalone && cache.has() ) {
+                    runtime = cache.get();
+                }
+    
+                if ( !runtime ) {
+                    runtime = Runtime.create( opts, opts.runtimeOrder );
+                    cache.add( runtime );
+                    runtime.promise = deferred.promise();
+                    runtime.once( 'ready', deferred.resolve );
+                    runtime.init();
+                    runtime.client = 1;
+                    return runtime;
+                }
+    
+                runtime.promise.then( deferred.resolve );
+                runtime.client++;
+                return runtime;
+            };
+    
+            this.getRuntime = function() {
+                return runtime;
+            };
+    
+            this.disconnectRuntime = function() {
+                if ( !runtime ) {
+                    return;
+                }
+    
+                runtime.client--;
+    
+                if ( runtime.client <= 0 ) {
+                    cache.remove( runtime );
+                    delete runtime.promise;
+                    runtime.destroy();
+                }
+    
+                runtime = null;
+            };
+    
+            this.exec = function() {
+                if ( !runtime ) {
+                    return;
+                }
+    
+                var args = Base.slice( arguments );
+                component && args.unshift( component );
+    
+                return runtime.exec.apply( this, args );
+            };
+    
+            this.getRuid = function() {
+                return runtime && runtime.uid;
+            };
+    
+            this.destroy = (function( destroy ) {
+                return function() {
+                    destroy && destroy.apply( this, arguments );
+                    this.trigger('destroy');
+                    this.off();
+                    this.exec( 'destroy' );
+                    this.disconnectRuntime();
+                };
+            })( this.destroy );
+        }
+    
+        Mediator.installTo( RuntimeClient.prototype );
+        return RuntimeClient;
+    });
+
+    /**
+     * @fileOverview Blob
+     */
+    define( 'lib/blob', [
+        'base',
+        'runtime/client'
+    ], function( Base, RuntimeClient ) {
+    
+        function Blob( ruid, source ) {
+            var me = this;
+    
+            me.source = source;
+            me.ruid = ruid;
+    
+            RuntimeClient.call( me, 'Blob' );
+    
+            this.uid = source.uid || this.uid;
+            this.type = source.type || '';
+            this.size = source.size || 0;
+    
+            if ( ruid ) {
+                me.connectRuntime( ruid );
+            }
+        }
+    
+        Base.inherits( RuntimeClient, {
+            constructor: Blob,
+    
+            slice: function( start, end ) {
+                return this.exec( 'slice', start, end );
+            },
+    
+            getSource: function() {
+                return this.source;
+            }
+        });
+    
+        return Blob;
+    });
+
+    /**
+     * @fileOverview File
+     */
+    define( 'lib/file', [
+        'base',
+        'lib/blob'
+    ], function( Base, Blob ) {
+    
+        var uid = 0,
+            rExt = /\.([^.]+)$/;
+    
+        function File( ruid, file ) {
+            var ext;
+    
+            Blob.apply( this, arguments );
+            this.name = file.name || ('untitled' + uid++);
+            ext = rExt.exec( file.name ) ? RegExp.$1.toLowerCase() : '';
+    
+            if ( !this.type &&  ~'jpg,jpeg,png,gif,bmp'.indexOf( ext ) ) {
+                this.type = 'image/' + ext;
+            }
+    
+            this.ext = ext;
+            this.lastModifiedDate = file.lastModifiedDate ||
+                    (new Date()).toLocaleString();
+        }
+    
+        return Base.inherits( Blob, File );
+    });
+
+    /**
+     * @fileOverview 错误信息
+     */
+    define( 'lib/filepicker', [
+        'base',
+        'runtime/client',
+        'lib/file'
+    ], function( Base, RuntimeClent, File ) {
+    
+        var $ = Base.$;
+    
+        function FilePicker( opts ) {
+    
+            opts = this.options = $.extend({}, FilePicker.options, opts );
+            opts.container = $( opts.id );
+    
+            if ( !opts.container.length ) {
+                throw new Error('按钮指定错误');
+            }
+    
+            opts.label = opts.label || opts.container.text() || '选择文件';
+            opts.button = $( opts.button || document.createElement('div') );
+            opts.button.text( opts.label );
+            opts.container.html( opts.button );
+    
+            RuntimeClent.call( this, 'FilePicker', true );
+        }
+    
+        FilePicker.options = {
+            button: null,
+            container: null,
+            label: null,
+            multiple: true,
+            accept: null
+        };
+    
+        Base.inherits( RuntimeClent, {
+            constructor: FilePicker,
+    
+            init: function() {
+                var me = this,
+                    opts = me.options,
+                    button = opts.button;
+    
+                button.addClass('webuploader-pick');
+    
+                me.on( 'all', function( type ) {
+                    var files;
+    
+                    switch ( type ) {
+                        case 'mouseenter':
+                            button.addClass('webuploader-pick-hover');
+                            break;
+    
+                        case 'mouseleave':
+                            button.removeClass('webuploader-pick-hover');
+                            break;
+    
+                        case 'change':
+                            files = me.exec('getFiles');
+                            me.trigger( 'select', $.map( files, function( file ) {
+                                return new File( me.getRuid(), file );
+                            }) );
+                            break;
+                    }
+                });
+    
+                me.connectRuntime( opts, function() {
+                    me.refresh();
+                    me.exec( 'init', opts );
+                });
+    
+                $( window ).on( 'resize', function() {
+                    me.refresh();
+                });
+            },
+    
+            refresh: function() {
+                var shimContainer = this.getRuntime().getContainer(),
+                    button = this.options.button,
+                    width = button.outerWidth(),
+                    height = button.outerHeight(),
+                    pos = button.offset();
+    
+                width && shimContainer.css({
+                    width: width + 'px',
+                    height: height + 'px'
+                }).offset( pos );
+            },
+    
+            destroy: function() {
+                if ( this.runtime ) {
+                    this.exec('destroy');
+                    this.disconnectRuntime();
+                }
+            }
+        });
+    
+        return FilePicker;
+    });
+
+    /**
+     * @fileOverview 组件基类。
+     */
+    define( 'widgets/widget', [
+        'base',
+        'uploader'
+    ], function( Base, Uploader ) {
+    
+        var $ = Base.$,
+            _init = Uploader.prototype._init,
+            IGNORE = {},
+            widgetClass = [];
+    
+        function isArrayLike( obj ) {
+            if ( !obj ) {
+                return false;
+            }
+    
+            var length = obj.length,
+                type = $.type( obj );
+    
+            if ( obj.nodeType === 1 && length ) {
+                return true;
+            }
+    
+            return type === 'array' || type !== 'function' && type !== 'string' &&
+                    (length === 0 || typeof length === 'number' && length > 0 &&
+                    (length - 1) in obj);
+        }
+    
+        function Widget( uploader ) {
+            this.owner = uploader;
+            this.options = uploader.options;
+        }
+    
+        $.extend( Widget.prototype, {
+    
+            init: Base.noop,
+    
+            // 类Backbone的事件监听声明，监听uploader实例上的事件
+            // widget直接无法监听事件，事件只能通过uploader来传递
+            invoke: function( apiName, args ) {
+    
+                /*
+                    {
+                        'make-thumb': 'makeThumb'
+                    }
+                 */
+                var map = this.responseMap;
+    
+                // 如果无API响应声明则忽略
+                if ( !map || !(apiName in map) || !(map[ apiName ] in this) ||
+                        !$.isFunction( this[ map[ apiName ] ] ) ) {
+    
+                    return IGNORE;
+                }
+    
+                return this[ map[ apiName ] ].apply( this, args );
+    
+            },
+    
+            /**
+             * 发送命令。当传入`callback`或者`handler`中返回`promise`时。返回一个当所有`handler`中的promise都完成后完成的新`promise`。
+             * @method request
+             * @grammar request( command, args ) => * | Promise
+             * @grammar request( command, args, callback ) => Promise
+             * @for  Uploader
+             */
+            request: function() {
+                return this.owner.request.apply( this.owner, arguments );
+            }
+        });
+    
+        // 扩展Uploader.
+        $.extend( Uploader.prototype, {
+    
+            // 覆写_init用来初始化widgets
+            _init: function() {
+                var me = this,
+                    widgets = me._widgets = [];
+    
+                $.each( widgetClass, function( _, klass ) {
+                    widgets.push( new klass( me ) );
+                });
+    
+                return _init.apply( me, arguments );
+            },
+    
+            request: function( apiName, args, callback ) {
+                var i = 0,
+                    widgets = this._widgets,
+                    len = widgets.length,
+                    rlts = [],
+                    dfds = [],
+                    widget, rlt;
+    
+                args = isArrayLike( args ) ? args : [ args ];
+    
+                for ( ; i < len; i++ ) {
+                    widget = widgets[ i ];
+                    rlt = widget.invoke( apiName, args );
+    
+                    if ( rlt !== IGNORE ) {
+    
+                        // Deferred对象
+                        if ( Base.isPromise( rlt ) ) {
+                            dfds.push( rlt );
+                        } else {
+                            rlts.push( rlt );
+                        }
+                    }
+                }
+    
+                // 如果有callback，则用异步方式。
+                if ( callback || dfds.length ) {
+                    return Base.when.apply( Base, dfds )
+    
+                            // 很重要不能删除。删除了会死循环。
+                            // 保证执行顺序。让callback总是在下一个tick中执行。
+                            .then(function() {
+                                var deferred = Base.Deferred(),
+                                    args = arguments;
+    
+                                setTimeout(function() {
+                                    deferred.resolve.apply( deferred, args );
+                                }, 1 );
+    
+                                return deferred.promise();
+                            })
+                            .then( callback || Base.noop );
+                } else {
+                    return rlts[ 0 ];
+                }
+            }
+        });
+    
+        /**
+         * 添加组件
+         * @param  {object} widgetProto 组件原型，构造函数通过constructor属性定义
+         * @param  {object} responseMap API名称与函数实现的映射
+         * @example
+         *     Uploader.register( {
+         *         init: function( options ) {},
+         *         makeThumb: function() {}
+         *     }, {
+         *         'make-thumb': 'makeThumb'
+         *     } );
+         */
+        Uploader.register = Widget.register = function( responseMap, widgetProto ) {
+            var map = { init: 'init' },
+                klass;
+    
+            if ( arguments.length === 1 ) {
+                widgetProto = responseMap;
+                widgetProto.responseMap = map;
+            } else {
+                widgetProto.responseMap = $.extend( map, responseMap );
+            }
+    
+            klass = Base.inherits( Widget, widgetProto );
+            widgetClass.push( klass );
+    
+            return klass;
+        };
+    
+        return Widget;
+    });
+
+    /**
+     * @fileOverview 文件选择相关
+     */
+    define( 'widgets/filepicker', [
+        'base',
+        'uploader',
+        'lib/filepicker',
+        'widgets/widget'
+    ], function( Base, Uploader, FilePicker ) {
+    
+        Base.$.extend( Uploader.options, {
+    
+            /**
+             * @property {Selector | Object} [pick=undefined]
+             * @namespace options
+             * @for Uploader
+             * @description 指定选择文件的按钮容器，不指定则不创建按钮。
+             *
+             * * `id` {Seletor} 指定选择文件的按钮容器，不指定则不创建按钮。
+             * * `label` {String} 指定按钮文字。不指定时优先从指定的容器中看是否自带文字。
+             * * `multiple` {Boolean} 是否开起同时选择多个文件能力。
+             */
+            pick: null,
+    
+            /**
+             * @property {Arroy} [accept=null]
+             * @namespace options
+             * @for Uploader
+             * @description 指定接受哪些类型的文件。 由于目前还有ext转mimeType表，所以这里需要分开指定。
+             *
+             * * `title` {String} 文字描述
+             * * `extensions` {String} 允许的文件后缀，不带点，多个用逗号分割。
+             * * `mimeTypes` {String} 多个用逗号分割。
+             *
+             * 如：
+             *
+             * ```
+             * {
+             *     title: 'Images',
+             *     extensions: 'gif,jpg,jpeg,bmp,png',
+             *     mimeTypes: 'image/*'
+             * }
+             * ```
+             */
+            accept: null/*{
+                title: 'Images',
+                extensions: 'gif,jpg,jpeg,bmp,png',
+                mimeTypes: 'image/*'
+            }*/
+        });
+    
+        return Uploader.register({
+            'add-btn': 'addButton',
+            'refresh': 'refresh'
+        }, {
+    
+            init: function( opts ) {
+                this.pickers = [];
+                return opts.pick && this.addButton( opts.pick );
+            },
+    
+            refresh: function() {
+                $.each( this.pickers, function() {
+                    this.refresh();
+                });
+            },
+    
+            /**
+             * @method addButton
+             * @for Uploader
+             * @grammar addButton( pick ) => Promise
+             * @description
+             * 添加文件选择按钮，如果一个按钮不够，需要调用此方法来添加。参数跟[options.pick](#WebUploader:Uploader:options)一致。
+             * @example
+             * uploader.addButton({
+             *     id: '#btnContainer',
+             *     label: '选择文件'
+             * });
+             */
+            addButton: function( pick ) {
+                var me = this,
+                    opts = me.options,
+                    accept = opts.accept,
+                    options, picker, deferred;
+    
+                if ( !pick ) {
+                    return;
+                }
+    
+                deferred = Base.Deferred();
+    
+                if ( typeof pick === 'string' ) {
+                    pick = {
+                        id: pick
+                    };
+                }
+    
+                options = $.extend({}, pick, {
+                    accept: $.isPlainObject( accept ) ? [ accept ] : accept,
+                    swf: opts.swf,
+                    runtimeOrder: opts.runtimeOrder
+                });
+    
+                picker = new FilePicker( options );
+    
+                picker.once( 'ready', deferred.resolve );
+                picker.on( 'select', function( files ) {
+                    me.owner.request( 'add-file', [ files ]);
+                });
+                picker.init();
+    
+                this.pickers.push( picker );
+    
+                return deferred.promise();
+            }
+        });
+    });
+
+    /**
+     * @fileOverview 文件属性封装
+     */
+    define( 'file', [
+        'base',
+        'mediator'
+    ], function( Base, Mediator ) {
+    
+        var $ = Base.$,
+            idPrefix = 'WU_FILE_',
+            idSuffix = 0,
+            rExt = /\.([^.]+)$/,
+            statusMap = {};
+    
+        function gid() {
+            return idPrefix + idSuffix++;
+        }
+    
+        /**
+         * 文件类
+         * @class File
+         * @constructor 构造函数
+         * @grammar new File( source ) => File
+         * @param {Lib.File} source [lib.File](#Lib.File)实例, 此source对象是带有Runtime信息的。
+         */
+        function WUFile( source ) {
+    
+            /**
+             * 文件名，包括扩展名（后缀）
+             * @property name
+             * @type {string}
+             */
+            this.name = source.name || 'Untitled';
+    
+            /**
+             * 文件体积（字节）
+             * @property size
+             * @type {uint}
+             * @default 0
+             */
+            this.size = source.size || 0;
+    
+            /**
+             * 文件MIMETYPE类型，与文件类型的对应关系请参考[http://t.cn/z8ZnFny](http://t.cn/z8ZnFny)
+             * @property type
+             * @type {string}
+             * @default 'image/png'
+             */
+            this.type = source.type || 'image/png';
+    
+            /**
+             * 文件最后修改日期
+             * @property lastModifiedDate
+             * @type {int}
+             * @default 当前时间戳
+             */
+            this.lastModifiedDate = source.lastModifiedDate || (new Date() * 1);
+    
+            /**
+             * 文件ID，每个对象具有唯一ID，与文件名无关
+             * @property id
+             * @type {string}
+             */
+            this.id = gid();
+    
+            /**
+             * 文件扩展名，通过文件名获取，例如test.png的扩展名为png
+             * @property ext
+             * @type {string}
+             */
+            this.ext = rExt.exec( this.name ) ? RegExp.$1 : '';
+    
+    
+            /**
+             * 状态文字说明。在不同的status语境下有不同的用途。
+             * @property statusText
+             * @type {string}
+             */
+            this.statusText = '';
+    
+            // 存储文件状态，防止通过属性直接修改
+            statusMap[ this.id ] = WUFile.Status.INITED;
+    
+            this.source = source;
+            this.loaded = 0;
+    
+            this.on( 'error', function( msg ) {
+                this.setStatus( WUFile.Status.ERROR, msg );
+            });
+        }
+    
+        $.extend( WUFile.prototype, {
+    
+            /**
+             * 设置状态，状态变化时会触发`change`事件。
+             * @method setStatus
+             * @grammar setStatus( status[, statusText] );
+             * @param {File.Status|String} status [文件状态值](#WebUploader:File:File.Status)
+             * @param {String} [statusText=''] 状态说明，常在error时使用，用http, abort,server等来标记是由于什么原因导致文件错误。
+             */
+            setStatus: function( status, text ) {
+    
+                var prevStatus = statusMap[ this.id ];
+    
+                typeof text !== 'undefined' && (this.statusText = text);
+    
+                if ( status !== prevStatus ) {
+                    statusMap[ this.id ] = status;
+                    /**
+                     * 文件状态变化
+                     * @event statuschange
+                     */
+                    this.trigger( 'statuschange', status, prevStatus );
+                }
+    
+            },
+    
+            /**
+             * 获取文件状态
+             * @return {File.Status}
+             * @example
+                     文件状态具体包括以下几种类型：
+                     {
+                         // 初始化
+                        INITED:     0,
+                        // 已入队列
+                        QUEUED:     1,
+                        // 正在上传
+                        PROGRESS:     2,
+                        // 上传出错
+                        ERROR:         3,
+                        // 上传成功
+                        COMPLETE:     4,
+                        // 上传取消
+                        CANCELLED:     5
+                    }
+             */
+            getStatus: function() {
+                return statusMap[ this.id ];
+            },
+    
+            /**
+             * 获取文件原始信息。
+             * @return {*}
+             */
+            getSource: function() {
+                return this.source;
+            },
+    
+            destory: function() {
+                delete statusMap[ this.id ];
+            }
+        });
+    
+        Mediator.installTo( WUFile.prototype );
+    
+        /**
+         * 文件状态值，具体包括以下几种类型：
+         * * `inited` 初始状态
+         * * `queued` 已经进入队列, 等待上传
+         * * `progress` 上传中
+         * * `complete` 上传完成。
+         * * `error` 上传出错，可重试
+         * * `interrupt` 上传中断，可续传。
+         * * `invalid` 文件不合格，不能重试上传。会自动从队列中移除。
+         * * `cancelled` 文件被移除。
+         * @property {Object} Status
+         * @namespace File
+         * @class File
+         * @static
+         */
+        WUFile.Status = {
+            INITED:     'inited',    // 初始状态
+            QUEUED:     'queued',    // 已经进入队列, 等待上传
+            PROGRESS:   'progress',    // 上传中
+            ERROR:      'error',    // 上传出错，可重试
+            COMPLETE:   'complete',    // 上传完成。
+            CANCELLED:  'cancelled',    // 上传取消。
+            INTERRUPT:  'interrupt',    // 上传中断，可续传。
+            INVALID:    'invalid'    // 文件不合格，不能重试上传。
+        };
+    
+        return WUFile;
+    });
+
+    /**
+     * @fileOverview 错误信息
+     */
+    define( 'lib/dnd', [
+        'base',
+        'mediator',
+        'runtime/client'
+    ], function( Base, Mediator, RuntimeClent ) {
+    
+        var $ = Base.$;
+    
+        function DragAndDrop( opts ) {
+            opts = this.options = $.extend({}, DragAndDrop.options, opts );
+    
+            opts.container = $( opts.container );
+    
+            if ( !opts.container.length ) {
+                return;
+            }
+    
+            RuntimeClent.call( this, 'DragAndDrop' );
+        }
+    
+        DragAndDrop.options = {
+            accept: null,
+            disableGlobalDnd: true
+        };
+    
+        Base.inherits( RuntimeClent, {
+            constructor: DragAndDrop,
+    
+            init: function() {
+                var me = this;
+    
+                me.connectRuntime( me.options, function() {
+                    me.exec('init');
+                });
+            },
+    
+            destroy: function() {
+                this.disconnectRuntime();
+            }
+        });
+    
+        Mediator.installTo( DragAndDrop.prototype );
+    
+        return DragAndDrop;
+    });
+
+    /**
+     * @fileOverview 错误信息
+     */
+    define( 'lib/filepaste', [
+        'base',
+        'mediator',
+        'runtime/client'
+    ], function( Base, Mediator, RuntimeClent ) {
+    
+        var $ = Base.$;
+    
+        function FilePaste( opts ) {
+            opts = this.options = $.extend({}, opts );
+            opts.container = $( opts.container || document.body );
+            RuntimeClent.call( this, 'FilePaste' );
+        }
+    
+        Base.inherits( RuntimeClent, {
+            constructor: FilePaste,
+    
+            init: function() {
+                var me = this;
+    
+                me.connectRuntime( me.options, function() {
+                    me.exec('init');
+                });
+            },
+    
+            destroy: function() {
+                this.exec('destroy');
+                this.disconnectRuntime();
+                this.off();
+            }
+        });
+    
+        Mediator.installTo( FilePaste.prototype );
+    
+        return FilePaste;
+    });
+
+    /**
+     * @fileOverview Image
+     */
+    define( 'lib/image', [
+        'base',
+        'runtime/client',
+        'lib/blob'
+    ], function( Base, RuntimeClient, Blob ) {
+        var $ = Base.$;
+    
+        // 构造器。
+        function Image( opts ) {
+            this.options = $.extend({}, Image.options, opts );
+            RuntimeClient.call( this, 'Image' );
+    
+            this.on( 'load', function() {
+                this._info = this.exec( 'info' );
+                this._meta = this.exec( 'meta' );
+            });
+        }
+    
+        // 默认选项。
+        Image.options = {
+    
+            // 默认的图片处理质量
+            quality: 90,
+    
+            // 是否裁剪
+            crop: false,
+    
+            // 是否保留头部信息
+            preserveHeaders: true,
+    
+            // 是否允许放大。
+            allowMagnify: true
+        };
+    
+        // 继承RuntimeClient.
+        Base.inherits( RuntimeClient, {
+            constructor: Image,
+    
+            info: function( val ) {
+    
+                // setter
+                if ( val ) {
+                    this._info = val;
+                    return this;
+                }
+    
+                // getter
+                return this._info;
+            },
+    
+            meta: function( val ) {
+    
+                // setter
+                if ( val ) {
+                    this._meta = val;
+                    return this;
+                }
+    
+                // getter
+                return this._meta;
+            },
+    
+            loadFromBlob: function( blob ) {
+                var me = this,
+                    ruid = blob.getRuid();
+    
+                this.connectRuntime( ruid, function() {
+                    me.exec( 'init', me.options );
+                    me.exec( 'loadFromBlob', blob );
+                });
+            },
+    
+            resize: function() {
+                var args = Base.slice( arguments );
+                return this.exec.apply( this, [ 'resize' ].concat( args ) );
+            },
+    
+            getAsDataUrl: function( type ) {
+                return this.exec( 'getAsDataUrl', type );
+            },
+    
+            getAsBlob: function( type ) {
+                var blob = this.exec( 'getAsBlob', type );
+    
+                return new Blob( this.getRuid(), blob );
+            }
+        });
+    
+        return Image;
+    });
+
+    /**
+     * @fileOverview Transport
+     */
+    define( 'lib/transport', [
+        'base',
+        'runtime/client',
+        'mediator'
+    ], function( Base, RuntimeClient, Mediator ) {
+    
+        var $ = Base.$;
+    
+        function Transport( opts ) {
+            var me = this;
+    
+            opts = me.options = $.extend( true, {}, Transport.options, opts || {} );
+            RuntimeClient.call( this, 'Transport' );
+    
+            this._blob = null;
+            this._formData = opts.formData || {};
+            this._headers = opts.headers || {};
+    
+            this.on( 'progress', this._timeout );
+            this.on( 'load error', function() {
+                me.trigger( 'progress', 1 );
+                clearTimeout( me._timer );
+            });
+        }
+    
+        Transport.options = {
+            server: '',
+            method: 'POST',
+    
+            // 跨域时，是否允许携带cookie, 只有html5 runtime才有效
+            withCredentials: false,
+            fileVar: 'file',
+            timeout: 2 * 60 * 1000,    // 2分钟
+            formData: {},
+            headers: {},
+            sendAsBinary: false
+        };
+    
+        $.extend( Transport.prototype, {
+    
+            // 添加Blob, 只能添加一次，最后一次有效。
+            appendBlob: function( key, blob, filename ) {
+                var me = this,
+                    opts = me.options;
+    
+                if ( me.getRuid() ) {
+                    me.disconnectRuntime();
+                }
+    
+                // 连接到blob归属的同一个runtime.
+                me.connectRuntime( blob.ruid, function() {
+                    me.exec('init');
+                });
+    
+                me._blob = blob;
+                opts.fileVar = key || opts.fileVar;
+                opts.filename = filename || opts.filename;
+            },
+    
+            // 添加其他字段
+            append: function( key, value ) {
+                if ( typeof key === 'object' ) {
+                    $.extend( this._formData, key );
+                } else {
+                    this._formData[ key ] = value;
+                }
+            },
+    
+            setRequestHeader: function( key, value ) {
+                if ( typeof key === 'object' ) {
+                    $.extend( this._headers, key );
+                } else {
+                    this._headers[ key ] = value;
+                }
+            },
+    
+            send: function( method ) {
+                this.exec( 'send', method );
+                this._timeout();
+            },
+    
+            abort: function() {
+                clearTimeout( this._timer );
+                return this.exec('abort');
+            },
+    
+            destroy: function() {
+                this.trigger('destroy');
+                this.off();
+                this.exec('destroy');
+                this.disconnectRuntime();
+            },
+    
+            getResponse: function() {
+                return this.exec('getResponse');
+            },
+    
+            getResponseAsJson: function() {
+                return this.exec('getResponseAsJson');
+            },
+    
+            getStatus: function() {
+                return this.exec('getStatus');
+            },
+    
+            _timeout: function() {
+                var me = this,
+                    duration = me.options.timeout;
+    
+                if ( !duration ) {
+                    return;
+                }
+    
+                clearTimeout( me._timer );
+                me._timer = setTimeout(function() {
+                    me.abort();
+                    me.trigger( 'error', 'timeout' );
+                }, duration );
+            }
+    
+        });
+    
+        // 让Transport具备事件功能。
+        Mediator.installTo( Transport.prototype );
+    
+        return Transport;
+    });
+
+    /**
+     * @fileOverview 文件队列
+     */
+    define( 'queue', [
+        'base',
+        'mediator',
+        'file'
+    ], function( Base, Mediator, WUFile ) {
+    
+        var $ = Base.$,
+            STATUS = WUFile.Status;
+    
+        /**
+         * 文件队列, 用来存储各个状态中的文件。
+         * @class Queue
+         * @extends Mediator
+         */
+        function Queue() {
+    
+            /**
+             * 统计文件数。
+             * * `numOfQueue` 队列中的文件数。
+             * * `numOfSuccess` 上传成功的文件数
+             * * `numOfCancel` 被移除的文件数
+             * * `numOfProgress` 正在上传中的文件数
+             * * `numOfUploadFailed` 上传错误的文件数。
+             * * `numOfInvalid` 无效的文件数。
+             * @property {Object} stats
+             */
+            this.stats = {
+                numOfQueue: 0,
+                numOfSuccess: 0,
+                numOfCancel: 0,
+                numOfProgress: 0,
+                numOfUploadFailed: 0,
+                numOfInvalid: 0
+            };
+    
+            // 上传队列，仅包括等待上传的文件
+            this._queue = [];
+    
+            // 存储所有文件
+            this._map = {};
+        }
+    
+        $.extend( Queue.prototype, {
+    
+            /**
+             * 将新文件加入对队列尾部
+             *
+             * @method append
+             * @param  {File} file   文件对象
+             */
+            append: function( file ) {
+                this._queue.push( file );
+                this._fileAdded( file );
+                return this;
+            },
+    
+            /**
+             * 将新文件加入对队列头部
+             *
+             * @method prepend
+             * @param  {File} file   文件对象
+             */
+            prepend: function( file ) {
+                this._queue.unshift( file );
+                this._fileAdded( file );
+                return this;
+            },
+    
+            /**
+             * 获取文件对象
+             *
+             * @method getFile
+             * @param  {String} fileId   文件ID
+             * @return {File}
+             */
+            getFile: function( fileId ) {
+                if ( typeof fileId !== 'string' ) {
+                    return fileId;
+                }
+                return this._map[ fileId ];
+            },
+    
+            /**
+             * 从队列中取出一个指定状态的文件。
+             * @grammar fetch( status ) => File
+             * @method fetch
+             * @param {String} status [文件状态值](#WebUploader:File:File.Status)
+             * @return {File} [File](#WebUploader:File)
+             */
+            fetch: function( status ) {
+                var len = this._queue.length,
+                    i, file;
+    
+                status = status || STATUS.QUEUED;
+    
+                for ( i = 0; i < len; i++ ) {
+                    file = this._queue[ i ];
+    
+                    if ( status === file.getStatus() ) {
+                        return file;
+                    }
+                }
+    
+                return null;
+            },
+    
+            /**
+             * 获取指定类型的文件列表, 列表中每一个成员为[File](#WebUploader:File)对象。
+             * @grammar getFiles( [status1[, status2 ...]] ) => Array
+             * @method getFiles
+             * @param {String} [status] [文件状态值](#WebUploader:File:File.Status)
+             */
+            getFiles: function() {
+                var sts = [].slice.call( arguments, 0 ),
+                    ret = [],
+                    i = 0,
+                    len = this._queue.length,
+                    file;
+    
+                for ( ; i < len; i++ ) {
+                    file = this._queue[ i ];
+    
+                    if ( sts.length && !~$.inArray( file.getStatus(), sts ) ) {
+                        continue;
+                    }
+    
+                    ret.push( file );
+                }
+    
+                return ret;
+            },
+    
+            _fileAdded: function( file ) {
+                var me = this,
+                    existing = this._map[ file.id ];
+    
+                if ( !existing ) {
+                    this._map[ file.id ] = file;
+    
+                    file.on( 'statuschange', function( cur, pre ) {
+                        me._onFileStatusChange( cur, pre );
+                    });
+                }
+    
+                file.setStatus( STATUS.QUEUED );
+            },
+    
+            _onFileStatusChange: function( curStatus, preStatus ) {
+                var stats = this.stats;
+    
+                switch ( preStatus ) {
+                    case STATUS.PROGRESS:
+                        stats.numOfProgress--;
+                        break;
+    
+                    case STATUS.QUEUED:
+                        stats.numOfQueue --;
+                        break;
+    
+                    case STATUS.ERROR:
+                        stats.numOfUploadFailed--;
+                        break;
+    
+                    case STATUS.INVALID:
+                        stats.numOfInvalid--;
+                        break;
+                }
+    
+                switch ( curStatus ) {
+                    case STATUS.QUEUED:
+                        stats.numOfQueue++;
+                        break;
+    
+                    case STATUS.PROGRESS:
+                        stats.numOfProgress++;
+                        break;
+    
+                    case STATUS.ERROR:
+                        stats.numOfUploadFailed++;
+                        break;
+    
+                    case STATUS.COMPLETE:
+                        stats.numOfSuccess++;
+                        break;
+    
+                    case STATUS.CANCELLED:
+                        stats.numOfCancel++;
+                        break;
+    
+                    case STATUS.INVALID:
+                        stats.numOfInvalid++;
+                        break;
+                }
+            }
+    
+        });
+    
+        Mediator.installTo( Queue.prototype );
+    
+        return Queue;
+    });
+
+    /**
+     * @fileOverview Runtime管理器，负责Runtime的选择, 连接
+     */
+    define( 'runtime/compbase', function() {
+    
+        function CompBase( owner, runtime ) {
+    
+            this.owner = owner;
+            this.options = owner.options;
+    
+            this.getRuntime = function() {
+                return runtime;
+            };
+    
+            this.getRuid = function() {
+                return runtime.uid;
+            };
+    
+            this.trigger = function() {
+                return owner.trigger.apply( owner, arguments );
+            };
+        }
+    
+        return CompBase;
+    });
+
+    /**
+     * @fileOverview FlashRuntime
+     */
+    define( 'runtime/flash/runtime', [
+        'base',
+        'runtime/runtime',
+        'runtime/compbase'
+    ], function( Base, Runtime, CompBase ) {
+    
+        var $ = Base.$,
+            type = 'flash',
+            components = {};
+    
+    
+        function getFlashVersion() {
+            var version;
+    
+            try {
+                version = navigator.plugins[ 'Shockwave Flash' ];
+                version = version.description;
+            } catch ( ex ) {
+                try {
+                    version = new ActiveXObject('ShockwaveFlash.ShockwaveFlash')
+                            .GetVariable('$version');
+                } catch ( ex2 ) {
+                    version = '0.0';
+                }
+            }
+            version = version.match( /\d+/g );
+            return parseFloat( version[ 0 ] + '.' + version[ 1 ], 10 );
+        }
+    
+        function FlashRuntime() {
+            var pool = {},
+                clients = {},
+                destory = this.destory,
+                me = this,
+                jsreciver = Base.guid('webuploader_');
+    
+            Runtime.apply( me, arguments );
+            me.type = type;
+    
+    
+            // 这个方法的调用者，实际上是RuntimeClient
+            me.exec = function( comp, fn/*, args...*/ ) {
+                var client = this,
+                    uid = client.uid,
+                    args = Base.slice( arguments, 2 ),
+                    instance;
+    
+                clients[ uid ] = client;
+    
+                if ( components[ comp ] ) {
+                    if ( !pool[ uid ] ) {
+                        pool[ uid ] = new components[ comp ]( client, me );
+                    }
+    
+                    instance = pool[ uid ];
+    
+                    if ( instance[ fn ] ) {
+                        return instance[ fn ].apply( instance, args );
+                    }
+                }
+    
+                return me.flashExec.apply( client, arguments );
+            };
+    
+            function hander( evt, obj ) {
+                var type = evt.type || evt,
+                    parts, uid;
+    
+                parts = type.split('::');
+                uid = parts[ 0 ];
+                type = parts[ 1 ];
+    
+                // console.log.apply( console, arguments );
+    
+                if ( type === 'Ready' && uid === me.uid ) {
+                    me.trigger('ready');
+                } else if ( clients[ uid ] ) {
+                    clients[ uid ].trigger( type.toLowerCase(), evt, obj );
+                }
+    
+                // Base.log( evt, obj );
+            }
+    
+            // flash的接受器。
+            window[ jsreciver ] = function() {
+                var args = arguments;
+    
+                // 为了能捕获得到。
+                setTimeout(function() {
+                    hander.apply( null, args );
+                }, 1 );
+            };
+    
+            this.jsreciver = jsreciver;
+    
+            this.destory = function() {
+                // @todo 删除池子中的所有实例
+                return destory && destory.apply( this, arguments );
+            };
+    
+            this.flashExec = function( comp, fn ) {
+                var flash = me.getFlash(),
+                    args = Base.slice( arguments, 2 );
+    
+                return flash.exec( this.uid, comp, fn, args );
+            };
+    
+            // @todo
+        }
+    
+        Base.inherits( Runtime, {
+            constructor: FlashRuntime,
+    
+            init: function() {
+                var container = this.getContainer(),
+                    opts = this.options,
+                    html;
+    
+                // if not the minimal height, shims are not initialized
+                // in older browsers (e.g FF3.6, IE6,7,8, Safari 4.0,5.0, etc)
+                container.css({
+                    position: 'absolute',
+                    top: '-8px',
+                    left: '-8px',
+                    width: '9px',
+                    height: '9px',
+                    overflow: 'hidden'
+                });
+    
+                // insert flash object
+                html = '<object id="' + this.uid + '" type="application/' +
+                        'x-shockwave-flash" data="' +  opts.swf + '" ';
+    
+                if ( Base.isIE ) {
+                    html += 'classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" ';
+                }
+    
+                html += 'width="100%" height="100%" style="outline:0">'  +
+                    '<param name="movie" value="' + opts.swf + '" />' +
+                    '<param name="flashvars" value="uid=' + this.uid +
+                    '&jsreciver=' + this.jsreciver + '" />' +
+                    '<param name="wmode" value="transparent" />' +
+                    '<param name="allowscriptaccess" value="always" />' +
+                '</object>';
+    
+                container.html( html );
+            },
+    
+            getFlash: function() {
+                if ( this._flash ) {
+                    return this._flash;
+                }
+    
+                this._flash = $( '#' + this.uid ).get( 0 );
+                return this._flash;
+            }
+    
+        });
+    
+        FlashRuntime.register = function( name, component ) {
+            component = components[ name ] = Base.inherits( CompBase, $.extend({
+    
+                // @todo fix this later
+                flashExec: function() {
+                    var owner = this.owner,
+                        runtime = this.getRuntime();
+    
+                    return runtime.flashExec.apply( owner, arguments );
+                }
+            }, component ) );
+    
+            return component;
+        };
+    
+        if ( getFlashVersion() >= 11.3 ) {
+            Runtime.addRuntime( type, FlashRuntime );
+        }
+    
+        return FlashRuntime;
+    });
+
+    /**
+     * @fileOverview FilePicker
+     */
+    define( 'runtime/flash/filepicker', [
+        'base',
+        'runtime/flash/runtime'
+    ], function( Base, FlashRuntime ) {
+        var $ = Base.$;
+    
+        return FlashRuntime.register( 'FilePicker', {
+            init: function( opts ) {
+                var copy = $.extend({}, opts );
+    
+                delete copy.button;
+                delete copy.container;
+    
+                this.flashExec( 'FilePicker', 'init', copy );
+            },
+    
+            destroy: function() {
+                // todo
+            }
+        });
+    });
+
+    /**
+     * @fileOverview 图片压缩
+     */
+    define( 'runtime/flash/image', [
+        'runtime/flash/runtime'
+    ], function( FlashRuntime ) {
+    
+        return FlashRuntime.register( 'Image', {
+            // init: function( options ) {
+            //     var owner = this.owner;
+    
+            //     this.flashExec( 'Image', 'init', options );
+            //     owner.on( 'load', function() {
+            //         debugger;
+            //     });
+            // },
+    
+            loadFromBlob: function( blob ) {
+                var owner = this.owner;
+    
+                owner.info() && this.flashExec( 'Image', 'info', owner.info() );
+                owner.meta() && this.flashExec( 'Image', 'meta', owner.meta() );
+    
+                this.flashExec( 'Image', 'loadFromBlob', blob.uid );
+            }
+        });
+    });
+
+    /**
+     * @fileOverview  Transport flash实现
+     */
+    define( 'runtime/flash/transport', [
+        'base',
+        'runtime/flash/runtime',
+        'runtime/client'
+    ], function( Base, FlashRuntime, RuntimeClient ) {
+    
+        return FlashRuntime.register( 'Transport', {
+            init: function() {
+                this._status = 0;
+                this._response = null;
+                this._responseJson = null;
+            },
+    
+            send: function() {
+                var owner = this.owner,
+                    opts = this.options,
+                    xhr = this._initAjax(),
+                    blob = owner._blob,
+                    server = opts.server,
+                    formData, binary;
+    
+                xhr.connectRuntime( blob.ruid );
+    
+                if ( opts.sendAsBinary ) {
+                    server += (/\?/.test( server ) ? '&' : '?') +
+                            $.param( owner._formData );
+    
+                    binary = blob.uid;
+                } else {
+                    $.each( owner._formData, function( k, v ) {
+                        xhr.exec( 'append', k, v );
+                    });
+    
+                    xhr.exec( 'appendBlob', opts.fileVar, blob.uid,
+                            opts.filename || owner._formData.name || '' );
+                }
+    
+                this._setRequestHeader( xhr, opts.headers );
+                xhr.exec( 'send', {
+                    method: opts.method,
+                    url: server
+                }, binary );
+            },
+    
+            getStatus: function() {
+                return this._status;
+            },
+    
+            getResponse: function() {
+                return this._response;
+            },
+    
+            getResponseAsJson: function() {
+                return this._responseJson;
+            },
+    
+            abort: function() {
+                var xhr = this._xhr;
+    
+                if ( xhr ) {
+                    xhr.exec('abort');
+                    xhr.destroy();
+                    this._xhr = xhr = null;
+                }
+            },
+    
+            destroy: function() {
+                this.abort();
+            },
+    
+            _initAjax: function() {
+                var me = this,
+                    xhr = new RuntimeClient('XMLHttpRequest'),
+                    opts = this.options;
+    
+                xhr.on( 'uploadprogress progress', function( e ) {
+                    return me.trigger( 'progress', e.loaded / e.total );
+                });
+    
+                xhr.on( 'load', function( e ) {
+                    var status = xhr.exec( 'getStatus' );
+    
+                    xhr.off();
+                    me._xhr = null;
+    
+                    if ( status === 200 ) {
+                        me._response = xhr.exec('getResponse');
+                        me._responseJson = xhr.exec('getResponseAsJson');
+                        return me.trigger('load');
+                    }
+    
+                    me._status = status;
+                    xhr.destroy();
+                    xhr = null;
+    
+                    return me.trigger( 'error', 'http' );
+                });
+    
+                xhr.on( 'error', function() {
+                    xhr.off();
+                    me._xhr = null;
+                    me.trigger( 'error', 'http' );
+                });
+    
+                me._xhr = xhr;
+                return xhr;
+            },
+    
+            _setRequestHeader: function( xhr, headers ) {
+                $.each( headers, function( key, val ) {
+                    xhr.exec( 'setRequestHeader', key, val );
+                });
+            }
+        });
+    });
+
+    /**
+     * @fileOverview DragAndDrop Widget。
+     */
+    define( 'widgets/filednd', [
+        'base',
+        'uploader',
+        'lib/dnd',
+        'widgets/widget'
+    ], function( Base, Uploader, Dnd ) {
+    
+        Uploader.options.dnd = '';
+    
+        /**
+         * @property {Selector} [dnd=undefined]  指定Drag And Drop拖拽的容器，如果不指定，则不启动。
+         * @namespace options
+         * @for Uploader
+         */
+        return Uploader.register({
+            init: function( opts ) {
+    
+                if ( !opts.dnd || this.request('predict-runtime-type') !== 'html5' ) {
+                    return;
+                }
+    
+                var me = this,
+                    deferred = Base.Deferred(),
+                    options = $.extend({}, {
+                        container: opts.dnd,
+                        accept: opts.accept
+                    }),
+                    dnd;
+    
+                dnd = new Dnd( options );
+    
+                dnd.once( 'ready', deferred.resolve );
+                dnd.on( 'drop', function( files ) {
+                    me.request( 'add-file', [ files ]);
+                });
+                dnd.init();
+    
+                return deferred.promise();
+            }
+        });
+    });
+
+    /**
+     * @fileOverview 组件基类。
+     */
+    define( 'widgets/filepaste', [
+        'base',
+        'uploader',
+        'lib/filepaste',
+        'widgets/widget'
+    ], function( Base, Uploader, FilePaste ) {
+    
+        /**
+         * @property {Selector} [paste=undefined]  指定监听paste事件的容器，如果不指定，不启用此功能。此功能为通过粘贴来添加截屏的图片。建议设置为`document.body`.
+         * @namespace options
+         * @for Uploader
+         */
+        return Uploader.register({
+            init: function( opts ) {
+    
+                if ( !opts.paste || this.request('predict-runtime-type') !== 'html5' ) {
+                    return;
+                }
+    
+                var me = this,
+                    deferred = Base.Deferred(),
+                    options = $.extend({}, {
+                        container: opts.paste,
+                        accept: opts.accept
+                    }),
+                    paste;
+    
+                paste = new FilePaste( options );
+    
+                paste.once( 'ready', deferred.resolve );
+                paste.on( 'paste', function( files ) {
+                    me.owner.request( 'add-file', [ files ]);
+                });
+                paste.init();
+    
+                return deferred.promise();
+            }
+        });
+    });
+
+    /**
+     * @fileOverview 图片操作, 负责预览图片和上传前压缩图片
+     */
+    define( 'widgets/image', [
+        'base',
+        'uploader',
+        'lib/image',
+        'widgets/widget'
+    ], function( Base, Uploader, Image ) {
+    
+        var $ = Base.$,
+            throttle;
+    
+        // 根据要处理的文件大小来节流，一次不能处理太多，会卡。
+        throttle = (function( max ) {
+            var occupied = 0,
+                waiting = [],
+                tick = function() {
+                    var item;
+    
+                    while( waiting.length && occupied < max ) {
+                        item = waiting.shift();
+                        occupied += item[ 0 ];
+                        item[ 1 ]();
+                    }
+                };
+    
+            return function( emiter, size, cb ) {
+                waiting.push( [ size, cb ] );
+                emiter.once( 'destroy', function() {
+                    occupied -= size;
+                    setTimeout( tick, 1 );
+                } );
+                setTimeout( tick, 1 );
+            }
+        })( 5 * 1024 * 1024 );
+    
+        $.extend( Uploader.options, {
+    
+            /**
+             * @property {Object} [thumb]
+             * @namespace options
+             * @for Uploader
+             * @description 配置生成缩略图的选项。
+             *
+             * 默认为：
+             *
+             * ```javascript
+             * {
+             *     width: 110,
+             *     height: 110,
+             *
+             *     // 图片质量，只有type为`image/jpeg`的时候才有效。
+             *     quality: 70,
+             *
+             *     // 是否允许放大，如果想要生成小图的时候不失真，此选项应该设置为false.
+             *     allowMagnify: true,
+             *
+             *     // 是否允许裁剪。
+             *     crop: true,
+             *
+             *     // 是否保留头部meta信息。
+             *     preserveHeaders: false,
+             *
+             *     // 为空的话则保留原有图片格式。
+             *     // 否则强制转换成指定的类型。
+             *     type: 'image/jpeg'
+             * }
+             * ```
+             */
+            thumb: {
+                width: 110,
+                height: 110,
+                quality: 70,
+                allowMagnify: true,
+                crop: true,
+                preserveHeaders: false,
+    
+                // 为空的话则保留原有图片格式。
+                // 否则强制转换成指定的类型。
+                type: 'image/jpeg'
+            },
+    
+            /**
+             * @property {Object} [compress]
+             * @namespace options
+             * @for Uploader
+             * @description 配置压缩的图片的选项。如果此选项为`false`, 则图片在上传前不进行压缩。
+             *
+             * 默认为：
+             *
+             * ```javascript
+             * {
+             *     width: 1600,
+             *     height: 1600,
+             *
+             *     // 图片质量，只有type为`image/jpeg`的时候才有效。
+             *     quality: 90,
+             *
+             *     // 是否允许放大，如果想要生成小图的时候不失真，此选项应该设置为false.
+             *     allowMagnify: false,
+             *
+             *     // 是否允许裁剪。
+             *     crop: false,
+             *
+             *     // 是否保留头部meta信息。
+             *     preserveHeaders: true
+             * }
+             * ```
+             */
+            compress: {
+                width: 1600,
+                height: 1600,
+                quality: 90,
+                allowMagnify: false,
+                crop: false,
+                preserveHeaders: true
+            }
+        });
+    
+        return Uploader.register({
+            'make-thumb': 'makeThumb',
+            'before-send-file': 'compressImage'
+        }, {
+    
+    
+            /**
+             * 生成缩略图，此过程为异步，所以需要传入`callback`。
+             * 通常情况在图片加入队里后调用此方法来生成预览图以增强交互效果。
+             * @method makeThumb
+             * @grammar makeThumb( file, cb ) => undefined
+             * @grammar makeThumb( file, cb, width, height ) => undefined
+             * @for Uploader
+             * @example
+             *
+             * uploader.on( 'fileQueued', function( file ) {
+             *     var $li = ...;
+             *
+             *     uploader.makeThumb( file, function( error, ret ) {
+             *         if ( error ) {
+             *             $li.text('预览错误');
+             *         } else {
+             *             $li.append('<img alt="" src="' + ret + '" />');
+             *         }
+             *     });
+             *
+             * });
+             */
+            makeThumb: function( file, cb, width, height ) {
+                var opts, image;
+    
+                file = this.request( 'get-file', file );
+    
+                // 只预览图片格式。
+                if ( !file.type.match( /^image/ ) ) {
+                    cb( true );
+                    return;
+                }
+    
+                opts = $.extend( {}, this.options.thumb );
+    
+                // 如果传入的是object.
+                if ( $.isPlainObject( width ) ) {
+                    opts = $.extend( opts, width );
+                    width = null;
+                }
+    
+                width = width || opts.width;
+                height = height || opts.height;
+    
+                image = new Image( opts );
+    
+                image.once( 'load', function() {
+                    file._info = file._info || image.info();
+                    file._meta = file._meta || image.meta();
+                    image.resize( width, height );
+                });
+    
+                image.once( 'complete', function() {
+                    cb( false, image.getAsDataUrl( opts.type ) );
+                    image.destroy();
+                });
+    
+                image.once( 'error', function() {
+                    cb( true );
+                    image.destroy();
+                });
+    
+                throttle( image, file.source.size, function() {
+                    file._info && image.info( file._info );
+                    file._meta && image.meta( file._meta );
+                    image.loadFromBlob( file.source );
+                });
+            },
+    
+            compressImage: function( file ) {
+                var opts = this.options.compress || this.options.resize,
+                    compressSize = opts && opts.compressSize || 300 * 1024,
+                    image, deferred;
+    
+                file = this.request( 'get-file', file );
+    
+                // 只预览图片格式。
+                if ( !opts || !~'image/jpeg,image/jpg'.indexOf( file.type ) ||
+                        file.size < compressSize ||
+                        file._compressed ) {
+                    return;
+                }
+    
+                opts = $.extend( {}, opts );
+                deferred = Base.Deferred();
+    
+                image = new Image( opts );
+    
+                deferred.always(function() {
+                    image.destroy();
+                    image = null;
+                });
+                image.once( 'error', deferred.reject );
+                image.once( 'load', function() {
+                    file._info = file._info || image.info();
+                    file._meta = file._meta || image.meta();
+                    image.resize( opts.width, opts.height );
+                });
+    
+                image.once( 'complete', function() {
+                    var blob, size;
+    
+                    blob = image.getAsBlob( opts.type );
+                    size = file.size;
+    
+                    // 如果压缩后，比原来还大则不用压缩后的。
+                    if ( blob.size < size ) {
+                        // file.source.destroy && file.source.destroy();
+                        file.source = blob;
+                        file.size = blob.size;
+    
+                        file.trigger( 'resize', blob.size, size );
+                    }
+    
+                    // 标记，避免重复压缩。
+                    file._compressed = true;
+                    deferred.resolve( true );
+                });
+    
+                file._info && image.info( file._info );
+                file._meta && image.meta( file._meta );
+    
+                image.loadFromBlob( file.source );
+                return deferred.promise();
+            }
+        });
+    });
+
+    /**
+     * @fileOverview 队列
+     */
+    define( 'widgets/queue', [
+        'base',
+        'uploader',
+        'queue',
+        'file',
+        'widgets/widget'
+    ], function( Base, Uploader, Queue, WUFile ) {
+    
+        var $ = Base.$,
+            Status = WUFile.Status;
+    
+        return Uploader.register({
+            'add-file': 'addFiles',
+            'get-file': 'getFile',
+            'fetch-file': 'fetchFile',
+            'get-stats': 'getStats',
+            'get-files': 'getFiles',
+            'remove-file': 'removeFile',
+            'retry': 'retry'
+        }, {
+    
+            init: function( opts ) {
+                var len, i, item, arr, accept;
+    
+                if ( $.isPlainObject( opts.accept ) ) {
+                    opts.accept = [ opts.accept ];
+                }
+    
+                // accept中的中生成匹配正则。
+                if ( opts.accept ) {
+                    arr = [];
+    
+                    for ( i = 0, len = opts.accept.length; i < len; i++ ) {
+                        item = opts.accept[ i ].extensions;
+                        item && arr.push( item );
+                    }
+    
+                    if ( arr.length ) {
+                        accept = arr.join(',')
+                                .replace( /,/g, '$|' )
+                                .replace( /\*/g, '.*' );
+                    }
+    
+                    this.accept = new RegExp( accept, 'i' );
+                }
+    
+                this.queue = new Queue();
+                this.stats = this.queue.stats;
+            },
+    
+            /**
+             * @event beforeFileQueued
+             * @param {File} file File对象
+             * @description 当文件被加入队列之前触发，此事件的handler返回值为`false`，则此文件不会被添加进入队列。
+             * @for  Uploader
+             */
+    
+            /**
+             * @event fileQueued
+             * @param {File} file File对象
+             * @description 当文件被加入队列以后触发。
+             * @for  Uploader
+             */
+    
+    
+            _addFile: function( file ) {
+                var me = this;
+    
+                if ( !file || file.size < 6 || me.accept &&
+                        !me.accept.test( file.name ) ) {
+                    return;
+                }
+    
+                if ( !(file instanceof WUFile) ) {
+                    file = new WUFile( file );
+                }
+    
+                if ( !me.owner.trigger( 'beforeFileQueued', file ) ) {
+                    return;
+                }
+    
+                me.queue.append( file );
+                me.owner.trigger( 'fileQueued', file );
+                return file;
+            },
+    
+            getFile: function( fileId ) {
+                return this.queue.getFile( fileId );
+            },
+    
+            /**
+             * @event filesQueued
+             * @param {File} files 数组，内容为原始File(lib/File）对象。
+             * @description 当一批文件添加进队列以后触发。
+             * @for  Uploader
+             */
+            addFiles: function( files ) {
+                var me = this;
+    
+                if ( !files.length ) {
+                    files = [ files ];
+                }
+    
+                files = $.map( files, function( file ) {
+                    return me._addFile( file );
+                });
+    
+                me.owner.trigger( 'filesQueued', files );
+    
+                if ( me.options.auto ) {
+                    me.request('start-upload');
+                }
+            },
+    
+            getStats: function() {
+                return this.stats;
+            },
+    
+            /**
+             * @event fileDequeued
+             * @param {File} file File对象
+             * @description 当文件被移除队列后触发。
+             * @for  Uploader
+             */
+    
+            /**
+             * @method removeFile
+             * @grammar removeFile( file ) => undefined
+             * @grammar removeFile( id ) => undefined
+             * @param {File|id} file File对象或这File对象的id
+             * @description 移除某一文件。
+             * @for  Uploader
+             * @example
+             *
+             * $li.on('click', '.remove-this', function() {
+             *     uploader.removeFile( file );
+             * })
+             */
+            removeFile: function( file ) {
+                var me = this;
+    
+                file = file.id ? file : me.queue.getFile( file );
+    
+                file.setStatus( Status.CANCELLED );
+                me.owner.trigger( 'fileDequeued', file );
+            },
+    
+            /**
+             * @method getFiles
+             * @grammar getFiles() => Array
+             * @grammar getFiles( status1, status2, status... ) => Array
+             * @description 返回指定状态的文件集合，不传参数将返回所有状态的文件。
+             * @for  Uploader
+             * @example
+             * console.log( uploader.getFiles() );    // => all files
+             * console.log( uploader.getFiles('error') )    // => all error files.
+             */
+            getFiles: function() {
+                return this.queue.getFiles.apply( this.queue, arguments );
+            },
+    
+            fetchFile: function() {
+                return this.queue.fetch.apply( this.queue, arguments );
+            },
+    
+            /**
+             * @method retry
+             * @grammar retry() => undefined
+             * @grammar retry( file ) => undefined
+             * @description 重试上传，重试指定文件，或者从出错的文件开始重新上传。
+             * @for  Uploader
+             * @example
+             * function retry() {
+             *     uploader.retry();
+             * }
+             */
+            retry: function( file, noForceStart ) {
+                var me = this,
+                    files, i, len;
+    
+                if ( file ) {
+                    file = file.id ? file : me.queue.getFile( file );
+                    file.setStatus( Status.QUEUED );
+                    noForceStart || me.request('start-upload');
+                    return;
+                }
+    
+                files = me.queue.getFiles( Status.ERROR );
+                i = 0;
+                len = files.length;
+    
+                for ( ; i < len; i++ ) {
+                    file = files[ i ];
+                    file.setStatus( Status.QUEUED );
+                }
+    
+                me.request('start-upload');
+            }
+        });
+    
+    });
+
+    /**
+     * @fileOverview 添加获取Runtime相关信息的方法。
+     */
+    define( 'widgets/runtime', [
+        'uploader',
+        'runtime/runtime',
+        'widgets/widget'
+    ], function( Uploader, Runtime ) {
+    
+        Uploader.support = function() {
+            return Runtime.hasRuntime.apply( Runtime, arguments );
+        };
+    
+        return Uploader.register({
+            'predict-runtime-type': 'predictRuntmeType'
+        }, {
+    
+            init: function() {
+                if ( !this.predictRuntmeType() ) {
+                    throw Error('Runtime Error');
+                }
+            },
+    
+            /**
+             * 预测Uploader将采用哪个`Runtime`
+             * @grammar predictRuntmeType() => String
+             * @method predictRuntmeType
+             * @for  Uploader
+             */
+            predictRuntmeType: function() {
+                var orders = this.options.runtimeOrder || Runtime.orders,
+                    type = this.type,
+                    i, len;
+    
+                if ( !type ) {
+                    orders = orders.split( /\s*,\s*/g );
+    
+                    for ( i = 0, len = orders.length; i < len; i++ ) {
+                        if ( Runtime.hasRuntime( orders[ i ] ) ) {
+                            this.type = type = orders[ i ];
+                            break;
+                        }
+                    }
+                }
+    
+                return type;
+            }
+        });
+    });
+
+    /**
+     * @fileOverview 负责文件上传相关。
+     */
+    define( 'widgets/upload', [
+        'base',
+        'uploader',
+        'file',
+        'lib/transport',
+        'widgets/widget'
+    ], function( Base, Uploader, WUFile, Transport ) {
+    
+        var $ = Base.$,
+            isPromise = Base.isPromise,
+            Status = WUFile.Status;
+    
+        // 添加默认配置项
+        $.extend( Uploader.options, {
+    
+    
+            /**
+             * @property {Boolean} [prepareNextFile=false]
+             * @namespace options
+             * @for Uploader
+             * @description 是否允许在文件传输时提前把下一个文件准备好。
+             * 对于一个文件的准备工作比较耗时，比如图片压缩，md5序列化。
+             * 如果能提前在当前文件传输期处理，可以节省总体耗时。
+             */
+            prepareNextFile: false,
+    
+            /**
+             * @property {Boolean} [chunked=false]
+             * @namespace options
+             * @for Uploader
+             * @description 是否要分片处理大文件上传。
+             */
+            chunked: false,
+    
+            /**
+             * @property {Boolean} [chunkSize=5242880]
+             * @namespace options
+             * @for Uploader
+             * @description 如果要分片，分多大一片？ 默认大小为5M.
+             */
+            chunkSize: 5 * 1024 * 1024,
+    
+            /**
+             * @property {Boolean} [chunkRetry=2]
+             * @namespace options
+             * @for Uploader
+             * @description 如果某个分片由于网络问题出错，允许自动重传多少次？
+             */
+            chunkRetry: 2,
+    
+            /**
+             * @property {Boolean} [threads=3]
+             * @namespace options
+             * @for Uploader
+             * @description 上传并发数。允许同时最大上传进程数。
+             */
+            threads: 3
+        });
+    
+        // 负责将文件切片。
+        function CuteFile( file, chunkSize ) {
+            var pending = [],
+                blob = file.source,
+                total = blob.size,
+                chunks = chunkSize ? Math.ceil( total / chunkSize ) : 1,
+                start = 0,
+                index = 0,
+                len;
+    
+            while ( index < chunks ) {
+                len = Math.min( chunkSize, total - start );
+                pending.push({
+                    file: file,
+                    start: start,
+                    end: start + len,
+                    total: total,
+                    chunks: chunks,
+                    chunk: index++
+                });
+                start += len;
+            }
+    
+            file.blocks = pending.concat();
+            file.remaning = pending.length;
+    
+            return {
+                file: file,
+    
+                has: function() {
+                    return !!pending.length;
+                },
+    
+                fetch: function() {
+                    return pending.shift();
+                }
+            };
+        }
+    
+        Uploader.register({
+            'start-upload': 'start',
+            'stop-upload': 'stop',
+            'skip-file': 'skipFile',
+            'is-in-progress': 'isInProgress'
+        }, {
+    
+            init: function() {
+                var owner = this.owner;
+    
+                this.runing = false;
+    
+                // 记录当前正在传的数据，跟threads相关
+                this.pool = [];
+    
+                // 缓存即将上传的文件。
+                this.pending = [];
+    
+                // 跟踪还有多少分片没有完成上传。
+                this.remaning = 0;
+                this.__tick = Base.bindFn( this._tick, this );
+    
+                owner.on( 'uploadComplete', function( file ) {
+                    // 把其他块取消了。
+                    file.blocks && $.each( file.blocks, function( _, v ) {
+                        v.transport && (v.transport.abort(), v.transport.destroy());
+                        delete v.transport;
+                    });
+    
+                    delete file.blocks;
+                    delete file.remaning;
+                });
+            },
+    
+            /**
+             * @event startUpload
+             * @description 当开始上传流程时触发。
+             * @for  Uploader
+             */
+    
+            /**
+             * 开始上传。此方法可以从初始状态调用开始上传流程，也可以从暂停状态调用，继续上传流程。
+             * @grammar upload() => undefined
+             * @method upload
+             * @for  Uploader
+             */
+            start: function() {
+                var me = this;
+    
+                // 移出invalid的文件
+                $.each( me.request( 'get-files', Status.INVALID ), function() {
+                    me.request( 'remove-file', this );
+                });
+    
+                if ( me.runing ) {
+                    return;
+                }
+    
+                me.runing = true;
+    
+                // 如果有暂停的，则续传
+                $.each( me.pool, function( _, v ) {
+                    var file = v.file;
+    
+                    if ( file.getStatus() === Status.INTERRUPT ) {
+                        file.setStatus( Status.PROGRESS );
+                        me._trigged = false;
+                        v.transport && v.transport.send();
+                    }
+                });
+    
+                me._trigged = false;
+                me.owner.trigger('startUpload');
+                Base.nextTick( me.__tick );
+            },
+    
+            /**
+             * @event stopUpload
+             * @description 当开始上传流程暂停时触发。
+             * @for  Uploader
+             */
+    
+            /**
+             * 暂停上传。第一个参数为是否中断上传当前正在上传的文件。
+             * @grammar stop() => undefined
+             * @grammar stop( true ) => undefined
+             * @method stop
+             * @for  Uploader
+             */
+            stop: function( interrupt ) {
+                var me = this;
+    
+                if ( me.runing === false ) {
+                    return;
+                }
+    
+                me.runing = false;
+    
+                interrupt && $.each( me.pool, function( _, v ) {
+                    v.transport && v.transport.abort();
+                    v.file.setStatus( Status.INTERRUPT );
+                });
+    
+                me.owner.trigger('stopUpload');
+            },
+    
+            /**
+             * 判断`Uplaode`r是否正在上传中。
+             * @grammar isInProgress() => Boolean
+             * @method isInProgress
+             * @for  Uploader
+             */
+            isInProgress: function() {
+                return !!this.runing;
+            },
+    
+            getStats: function() {
+                return this.request('get-stats');
+            },
+    
+            /**
+             * 掉过一个文件上传，直接标记指定文件为已上传状态。
+             * @grammar skipFile( file ) => undefined
+             * @method skipFile
+             * @for  Uploader
+             */
+            skipFile: function( file, status ) {
+                file = this.request( 'get-file', file );
+    
+                file.setStatus( status || Status.COMPLETE );
+                file.skipped = true;
+    
+                // 如果正在上传。
+                file.blocks && $.each( file.blocks, function( _, v ) {
+                    var _tr = v.transport;
+    
+                    if ( _tr ) {
+                        _tr.abort();
+                        _tr.destroy();
+                        delete v.transport;
+                    }
+                });
+    
+                this.owner.trigger( 'uploadSkip', file );
+            },
+    
+            /**
+             * @event uploadFinished
+             * @description 当文件上传结束时触发。
+             * @for  Uploader
+             */
+            _tick: function() {
+                var me = this,
+                    opts = me.options,
+                    fn, val;
+    
+                // 上一个promise还没有结束，则等待完成后再执行。
+                if ( me._promise ) {
+                    return me._promise.always( me.__tick );
+                }
+    
+                // 还有位置，且还有文件要处理的话。
+                if ( me.pool.length < opts.threads && (val = me._nextBlock()) ) {
+                    me._trigged = false;
+    
+                    fn = function( val ) {
+                        me._promise = null;
+    
+                        // 有可能是reject过来的，所以要检测val的类型。
+                        val && val.file && me._startSend( val );
+                        Base.nextTick( me.__tick );
+                    };
+    
+                    me._promise = isPromise( val ) ? val.always( fn ) : fn( val );
+    
+                // 没有要上传的了，且没有正在传输的了。
+                } else if ( !me.remaning && !me.getStats().numOfQueue ) {
+                    me.runing = false;
+    
+                    me._trigged || Base.nextTick(function() {
+                        me.owner.trigger('uploadFinished');
+                    });
+                    me._trigged = true;
+                }
+            },
+    
+            _nextBlock: function() {
+                var me = this,
+                    act = me._act,
+                    opts = me.options,
+                    next, done;
+    
+                // 如果当前文件还有没有需要传输的，则直接返回剩下的。
+                if ( act && act.has() &&
+                        act.file.getStatus() === Status.PROGRESS ) {
+    
+                    // 是否提前准备下一个文件
+                    if ( opts.prepareNextFile && !me.pending.length ) {
+                        me._prepareNextFile();
+                    }
+    
+                    return act.fetch();
+    
+                // 否则，如果正在运行，则准备下一个文件，并等待完成后返回下个分片。
+                } else if ( me.runing ) {
+    
+                    // 如果缓存中有，则直接在缓存中取，没有则去queue中取。
+                    if ( !me.pending.length && me.getStats().numOfQueue ) {
+                        me._prepareNextFile();
+                    }
+    
+                    next = me.pending.shift();
+                    done = function( file ) {
+                        if ( !file ) {
+                            return null;
+                        }
+    
+                        act = CuteFile( file, opts.chunked ? opts.chunkSize : 0 );
+                        me._act = act;
+                        return act.fetch();
+                    };
+    
+                    // 文件可能还在prepare中，也有可能已经完全准备好了。
+                    return isPromise( next ) ? next.then( done ) : done( next );
+                }
+            },
+    
+            _prepareNextFile: function() {
+                var me = this,
+                    file = me.request('fetch-file'),
+                    pending = me.pending,
+                    promise;
+    
+                if ( file ) {
+    
+                    promise = me.request( 'before-send-file', file, function() {
+    
+                        // 有可能文件被skip掉了。文件被skip掉后，状态坑定不是Queued.
+                        if ( file.getStatus() === Status.QUEUED ) {
+                            me.owner.trigger( 'uploadStart', file );
+                            file.setStatus( Status.PROGRESS );
+                            return file;
+                        }
+    
+                        return me._finishFile( file );
+                    });
+    
+                    // 如果还在pending中，则替换成文件本身。
+                    promise.done(function() {
+                        var idx = $.inArray( promise, pending );
+    
+                        ~idx && pending.splice( idx, 1, file );
+                    });
+    
+                    // befeore-send-file的钩子就有错误发生。
+                    promise.fail( function( reason ) {
+                        file.setStatus( Status.ERROR, reason );
+                        me.owner.trigger( 'uploadError', file, type );
+                        me.owner.trigger( 'uploadComplete', file );
+                    });
+    
+                    pending.push( promise );
+                }
+            },
+    
+            // 让出位置了，可以让其他分片开始上传
+            _popBlock: function( block ) {
+                var idx = $.inArray( block, this.pool );
+    
+                this.pool.splice( idx, 1 );
+                block.file.remaning--;
+                this.remaning--;
+            },
+    
+            // 开始上传，可以被掉过。如果promise被reject了，则表示跳过此分片。
+            _startSend: function( block ) {
+                var me = this,
+                    file = block.file,
+                    promise;
+    
+                me.pool.push( block );
+                me.remaning++;
+    
+                // 如果没有分片，则直接使用原始的。
+                // 不会丢失content-type信息。
+                block.blob = block.chunks === 1 ? file.source :
+                        file.source.slice( block.start, block.end );
+    
+                // hook, 每个分片发送之前可能要做些异步的事情。
+                promise = me.request( 'before-send', block, function() {
+    
+                    // 有可能文件已经上传出错了，所以不需要再传输了。
+                    if ( file.getStatus() === Status.PROGRESS ) {
+                        me._doSend( block );
+                    } else {
+                        me._popBlock( block );
+                        Base.nextTick( me.__tick );
+                    }
+                });
+    
+                // 如果为fail了，则跳过此分片。
+                promise.fail(function() {
+                    if ( file.remaning === 1 ) {
+                        me._finishFile( file ).always(function() {
+                            block.percentage = 1;
+                            me._popBlock( block );
+                            me.owner.trigger( 'uploadComplete', file );
+                            Base.nextTick( me.__tick );
+                        });
+                    } else {
+                        block.percentage = 1;
+                        me._popBlock( block );
+                        Base.nextTick( me.__tick );
+                    }
+                });
+            },
+    
+            /**
+             * @event uploadProgress
+             * @param {File} file File对象
+             * @param {Number} percentage 上传进度
+             * @description 上传过程中触发，携带上传进度。
+             * @for  Uploader
+             */
+    
+            /**
+             * @event uploadError
+             * @param {File} file File对象
+             * @param {String} reason 出错的code
+             * @description 当文件上传出错时触发。
+             * @for  Uploader
+             */
+    
+            /**
+             * @event uploadSuccess
+             * @param {File} file File对象
+             * @description 当文件上传成功时触发。
+             * @for  Uploader
+             */
+    
+            /**
+             * @event uploadComplete
+             * @param {File} [file] File对象
+             * @description 不管成功或者失败，文件上传完成时触发。
+             * @for  Uploader
+             */
+    
+            // 做上传操作。
+            _doSend: function( block ) {
+                var me = this,
+                    owner = me.owner,
+                    opts = me.options,
+                    file = block.file,
+                    tr = new Transport( opts ),
+                    data = $.extend({}, opts.formData ),
+                    headers = $.extend({}, opts.headers );
+    
+                block.transport = tr;
+    
+                tr.on( 'destroy', function() {
+                    delete block.transport;
+                    me._popBlock( block );
+                    Base.nextTick( me.__tick );
+                });
+    
+                // 广播上传进度。以文件为单位。
+                tr.on( 'progress', function( percentage ) {
+                    var totalPercent = 0,
+                        uploaded = 0;
+    
+                    // 可能没有abort掉，progress还是执行进来了。
+                    // if ( !file.blocks ) {
+                    //     return;
+                    // }
+    
+                    totalPercent = block.percentage = percentage;
+    
+                    if ( block.chunks > 1 ) {    // 计算文件的整体速度。
+                        $.each( file.blocks, function( _, v ) {
+                            uploaded += (v.percentage || 0) * (v.end - v.start);
+                        });
+    
+                        totalPercent = uploaded / file.size;
+                    }
+    
+                    owner.trigger( 'uploadProgress', file, totalPercent || 0 );
+                });
+    
+                // 尝试重试，然后广播文件上传出错。
+                tr.on( 'error', function( type ) {
+                    block.retried = block.retried || 0;
+    
+                    // 自动重试
+                    if ( block.chunks > 1 && ~'http,abort'.indexOf( type ) &&
+                            block.retried < opts.chunkRetry ) {
+    
+                        block.retried++;
+                        tr.send();
+    
+                    } else {
+                        file.setStatus( Status.ERROR, type );
+                        owner.trigger( 'uploadError', file, type );
+                        owner.trigger( 'uploadComplete', file );
+                    }
+                });
+    
+                // 上传成功
+                tr.on( 'load', function() {
+                    var ret = tr.getResponseAsJson() || {},
+                        reject, fn;
+    
+                    ret._raw = tr.getResponse();
+                    fn = function( value ) {
+                        reject = value;
+                    };
+    
+                    // 服务端响应了，不代表成功了，询问是否响应正确。
+                    if ( !owner.trigger( 'uploadAccept', block, ret, fn ) ) {
+                        reject = reject || 'server';
+                    }
+    
+                    // 如果非预期，转向上传出错。
+                    if ( reject ) {
+                        tr.trigger( 'error', reject );
+                        return;
+                    }
+    
+                    // 全部上传完成。
+                    if ( file.remaning === 1 ) {
+                        me._finishFile( file, ret );
+                    } else {
+                        tr.destroy();
+                    }
+                });
+    
+                // 配置默认的上传字段。
+                data = $.extend( data, {
+                    id: file.id,
+                    name: file.name,
+                    type: file.type,
+                    lastModifiedDate: file.lastModifiedDate,
+                    size: file.size
+                });
+    
+                block.chunks > 1 && $.extend( data, {
+                    chunks: block.chunks,
+                    chunk: block.chunk
+                });
+    
+                // 在发送之间可以添加字段什么的。。。
+                // 如果默认的字段不够使用，可以通过监听此事件来扩展
+                owner.trigger( 'uploadBeforeSend', block, data, headers );
+    
+                // 开始发送。
+                tr.appendBlob( opts.fileVal, block.blob, file.name );
+                tr.append( data );
+                tr.setRequestHeader( headers );
+                tr.send();
+            },
+    
+            // 完成上传。
+            _finishFile: function( file, ret, hds ) {
+                var owner = this.owner;
+    
+                return owner
+                        .request( 'after-send-file', arguments, function() {
+                            file.setStatus( Status.COMPLETE );
+                            owner.trigger( 'uploadSuccess', file, ret, hds );
+                        })
+                        .fail(function( reason ) {
+    
+                            // 如果外部已经标记为invalid什么的，不再改状态。
+                            if ( file.getStatus() === Status.PROGRESS ) {
+                                file.setStatus( Status.ERROR, reason );
+                            }
+    
+                            owner.trigger( 'uploadError', file, reason );
+                        })
+                        .always(function() {
+                            owner.trigger( 'uploadComplete', file );
+                        });
+            }
+    
+        });
+    });
+
+    /**
+     * @fileOverview 各种验证，包括文件总大小是否超出、单文件是否超出和文件是否重复。
+     */
+    
+    define( 'widgets/validator', [
+        'base',
+        'uploader',
+        'file',
+        'widgets/widget'
+    ], function( Base, Uploader, WUFile ) {
+    
+        var $ = Base.$,
+            validators = {},
+            api;
+    
+        // 暴露给外面的api
+        api = {
+    
+            // 添加验证器
+            addValidator: function( type, cb ) {
+                validators[ type ] = cb;
+            },
+    
+            // 移除验证器
+            removeValidator: function( type ) {
+                delete validators[ type ];
+            }
+        };
+    
+        // 在Uploader初始化的时候启动Validators的初始化
+        Uploader.register({
+            init: function() {
+                var me = this;
+                $.each( validators, function() {
+                    this.call( me.owner );
+                });
+            }
+        });
+    
+        /**
+         * @property {int} [fileNumLimit=undefined]
+         * @namespace options
+         * @for Uploader
+         * @description 验证文件总数量, 超出则不允许加入队列。
+         */
+        api.addValidator( 'fileNumLimit', function() {
+            var uploader = this,
+                opts = uploader.options,
+                count = 0,
+                max = opts.fileNumLimit >> 0,
+                flag = true;
+    
+            if ( !max ) {
+                return;
+            }
+    
+            uploader.on( 'beforeFileQueued', function() {
+    
+                if ( count >= max && flag ) {
+                    flag = false;
+                    this.trigger( 'error', 'Q_EXCEED_NUM_LIMIT', max );
+                    setTimeout(function() {
+                        flag = true;
+                    }, 1 );
+                }
+    
+                return count >= max ? false : true;
+            });
+    
+            uploader.on( 'fileQueued', function() {
+                count++;
+            });
+    
+            uploader.on( 'fileDequeued', function() {
+                count--;
+            });
+        });
+    
+    
+        /**
+         * @property {int} [fileSizeLimit=undefined]
+         * @namespace options
+         * @for Uploader
+         * @description 验证文件总大小是否超出限制, 超出则不允许加入队列。
+         */
+        api.addValidator( 'fileSizeLimit', function() {
+            var uploader = this,
+                opts = uploader.options,
+                count = 0,
+                max = opts.fileSizeLimit >> 0,
+                flag = true;
+    
+            if ( !max ) {
+                return;
+            }
+    
+            uploader.on( 'beforeFileQueued', function( file ) {
+                var invalid = count + file.size > max;
+    
+                if ( invalid && flag ) {
+                    flag = false;
+                    this.trigger( 'error', 'Q_EXCEED_SIZE_LIMIT', max );
+                    setTimeout(function() {
+                        flag = true;
+                    }, 1 );
+                }
+    
+                return invalid ? false : true;
+            });
+    
+            uploader.on( 'fileQueued', function( file ) {
+                count += file.size;
+            });
+    
+            uploader.on( 'fileDequeued', function( file ) {
+                count -= file.size;
+            });
+        });
+    
+        /**
+         * @property {int} [fileSingleSizeLimit=undefined]
+         * @namespace options
+         * @for Uploader
+         * @description 验证单个文件大小是否超出限制, 超出则不允许加入队列。
+         */
+        api.addValidator( 'fileSingleSizeLimit', function() {
+            var uploader = this,
+                opts = uploader.options,
+                max = opts.fileSingleSizeLimit;
+    
+            if ( !max ) {
+                return;
+            }
+    
+            uploader.on( 'fileQueued', function( file ) {
+                if ( file.size > max ) {
+                    file.setStatus( WUFile.Status.INVALID, 'exceed_size' );
+                }
+            });
+        });
+    
+        /**
+         * @property {int} [duplicate=undefined]
+         * @namespace options
+         * @for Uploader
+         * @description 去重， 根据文件名字、文件大小和最后修改时间来生成hash Key.
+         */
+        api.addValidator( 'duplicate', function() {
+            var uploader = this,
+                opts = uploader.options,
+                mapping = {};
+    
+            if ( opts.duplicate ) {
+                return;
+            }
+    
+            function hashString( str ) {
+                var hash = 0,
+                    i = 0,
+                    len = str.length,
+                    _char;
+    
+                for ( ; i < len; i++ ) {
+                    _char = str.charCodeAt( i );
+                    hash = _char + (hash << 6) + (hash << 16) - hash;
+                }
+    
+                return hash;
+            }
+    
+            uploader.on( 'beforeFileQueued', function( file ) {
+                var hash = hashString( file.name + file.size +
+                        file.lastModifiedDate );
+    
+                // 已经重复了
+                if ( mapping[ hash ] ) {
+                    return false;
+                }
+            });
+    
+            uploader.on( 'fileQueued', function( file ) {
+                var hash = hashString( file.name + file.size +
+                        file.lastModifiedDate );
+    
+                mapping[ hash ] = true;
+            });
+    
+            uploader.on( 'fileDequeued', function( file ) {
+                var hash = hashString( file.name + file.size +
+                        file.lastModifiedDate );
+    
+                delete mapping[ hash ];
+            });
+        });
+    
+        return api;
+    });
+
+    /**
+     * @file 暴露变量给外部使用。
+     * 此文件也只有在把webupload合并成一个文件使用的时候才会引入。
+     *
+     * 将所有modules，将路径ids装换成对象。
+     */
+    (function( modules ) {
+        var
+            // 让首写字母大写。
+            ucFirst = function( str ) {
+                return str && (str.charAt( 0 ).toUpperCase() + str.substr( 1 ));
+            },
+    
+            // 暴露出去的key
+            exportName = 'WebUploader',
+            exports = modules.base,
+            key, host, parts, part, last, origin;
+    
+        for ( key in modules ) {
+            host = exports;
+    
+            if ( !modules.hasOwnProperty( key ) ) {
+                continue;
+            }
+    
+            parts = key.split('/');
+            last = ucFirst( parts.pop() );
+    
+            while( (part = ucFirst( parts.shift() )) ) {
+                host[ part ] = host[ part ] || {};
+                host = host[ part ];
+            }
+    
+            host[ last ] = modules[ key ];
+        }
+    
+        if ( typeof module === 'object' && typeof module.exports === 'object' ) {
+            module.exports = exports;
+        } else if ( window.define && window.define.amd ) {
+            window.define( '../build/outro',  exportName, exports );
+        } else {
+            origin = window[ exportName ];
+            window[ exportName ] = exports;
+            window[ exportName ].noConflict = function() {
+                window[ exportName ] = origin;
+            };
+        }
+    })( internalAmd.modules );
+})( this );
\ No newline at end of file
diff --git a/static/js/lib/webUploader/webuploader.flashonly.min.js b/static/js/lib/webUploader/webuploader.flashonly.min.js
new file mode 100644
index 0000000..f803ef9
--- /dev/null
+++ b/static/js/lib/webUploader/webuploader.flashonly.min.js
@@ -0,0 +1,2 @@
+/* WebUploader 0.1.0 */!function(a){var b=function(a,b){var c={},d=function(a,b){var c,d,e;if("string"==typeof a)return g(a);for(c=[],d=a.length,e=0;d>e;e++)c.push(g(a[e]));return b.apply(null,c)},e=function(a,b,c){if(2===arguments.length&&(c=b,b=null),"string"!=typeof a||!c)throw new Error("Define Error");d(b||[],function(){f(a,c,arguments)})},f=function(a,e,f){var g,h={exports:e};"function"==typeof e&&(f.length||(f=[d,h.exports,h]),g=e.apply(null,f),g!==b&&(h.exports=g)),c[a]=h.exports},g=function(b){var d=c[b]||a[b];if(!d)throw new Error("`"+b+"` is undefined");return d};return{define:e,require:d,modules:c}}(a),c=(b.require,b.define);c("base",["jQuery"],function(b){function c(a){return function(){return g.apply(a,arguments)}}function d(a,b){return a.bind?a.bind(b):function(){return a.apply(b,arguments)}}function e(a){var b;return Object.create?Object.create(a):(b=function(){},b.prototype=a,new b)}var f=function(){},g=Function.call;return{version:"0.1.0",$:b,Deferred:b.Deferred,isPromise:function(a){return a&&"function"==typeof a.then},when:b.when,browser:function(a){var b={},c=a.match(/WebKit\/([\d.]+)/),d=a.match(/Chrome\/([\d.]+)/)||a.match(/CriOS\/([\d.]+)/),e=a.match(/MSIE\s([\d.]+)/),f=a.match(/Firefox\/([\d.]+)/),g=a.match(/Safari\/([\d.]+)/),h=a.match(/OPR\/([\d.]+)/);return c&&(b.webkit=parseFloat(c[1])),d&&(b.chrome=parseFloat(d[1])),e&&(b.ie=parseFloat(e[1])),f&&(b.firefox=parseFloat(f[1])),g&&(b.safari=parseFloat(g[1])),h&&(b.opera=parseFloat(h[1])),b}(navigator.userAgent),inherits:function(a,c,d){var f;return"function"==typeof c?(f=c,c=null):f=c&&c.hasOwnProperty("constructor")?c.constructor:function(){return a.apply(this,arguments)},b.extend(!0,f,a,d||{}),f.__super__=a.prototype,f.prototype=e(a.prototype),c&&b.extend(!0,f.prototype,c),f},noop:f,bindFn:d,log:function(){return a.console.log?d(console.log,console):f}(),nextTick:function(){return function(a){setTimeout(a,1)}}(),slice:c([].slice),guid:function(){var a=0;return function(b){for(var c=(+new Date).toString(32),d=0;5>d;d++)c+=Math.floor(65535*Math.random()).toString(32);return(b||"wu_")+c+(a++).toString(32)}}(),formatSize:function(a,b,c){var d;for(c=c||["B","K","M","G","TB"];(d=c.shift())&&a>1024;)a/=1024;return("B"===d?a:a.toFixed(b||2))+d}}}),c("mediator",["base"],function(a){function b(a,b,c,d){return f.grep(a,function(a){return!(!a||b&&a.e!==b||c&&a.cb!==c&&a.cb._cb!==c||d&&a.ctx!==d)})}function c(a,b,c){(a||"").split(h).forEach(function(a){c(a,b)})}function d(a,b){for(var c,d=!1,e=-1,f=a.length;++e<f;)if(c=a[e],c.cb.apply(c.ctx2,b)===!1){d=!0;break}return!d}var e,f=a.$,g=[].slice,h=/\s+/;return e={on:function(a,b,d){var e,f=this;return b?(e=this._events||(this._events=[]),c(a,b,function(a,b){var c={e:a};c.cb=b,c.ctx=d,c.ctx2=d||f,c.id=e.length,e.push(c)}),this):this},once:function(a,b,d){var e=this;return b?(c(a,b,function(a,b){var c=function(){return e.off(a,c),b.apply(d||e,arguments)};c._cb=b,e.on(a,c,d)}),e):e},off:function(a,d,e){var g=this._events;return g?a||d||e?(c(a,d,function(a,c){f.each(b(g,a,c,e),function(){delete g[this.id]})}),this):(this._events=[],this):this},trigger:function(a){var c,e,f;return this._events&&a?(c=g.call(arguments,1),e=b(this._events,a),f=b(this._events,"all"),d(e,c)&&d(f,arguments)):this}},f.extend({installTo:function(a){return f.extend(a,e)}},e)}),c("uploader",["base","mediator"],function(a,b){function c(a){this.options=d.extend(!0,{},c.options,a),this._init(this.options)}var d=a.$;return c.options={},b.installTo(c.prototype),d.each({upload:"start-upload",stop:"stop-upload",getFile:"get-file",getFiles:"get-files",removeFile:"remove-file",skipFile:"skip-file",retry:"retry",isInProgress:"is-in-progress",makeThumb:"make-thumb",getDimension:"get-dimension",addButton:"add-btn",getRuntimeType:"get-runtime-type",refresh:"refresh",disable:"disable",enable:"enable"},function(a,b){c.prototype[a]=function(){return this.request(b,arguments)}}),d.extend(c.prototype,{state:"pending",_init:function(a){var b=this;b.request("init",a,function(){b.state="ready",b.trigger("ready")})},option:function(a,b){var c=this.options;return arguments.length>1?(d.isPlainObject(b)&&d.isPlainObject(c[a])?d.extend(c[a],b):c[a]=b,void 0):a?c[a]:c},getStats:function(){var a=this.request("get-stats");return{successNum:a.numOfSuccess,cancelNum:a.numOfCancel,invalidNum:a.numOfInvalid,uploadFailNum:a.numOfUploadFailed,queueNum:a.numOfQueue}},trigger:function(a){var c=[].slice.call(arguments,1),e=this.options,f="on"+a.substring(0,1).toUpperCase()+a.substring(1);return b.trigger.apply(this,arguments)===!1?!1:d.isFunction(e[f])&&e[f].apply(this,c)===!1?!1:d.isFunction(this[f])&&this[f].apply(this,c)===!1?!1:!0},request:a.noop,reset:function(){}}),a.create=function(a){return new c(a)},a.Uploader=c,c}),c("runtime/runtime",["base","mediator"],function(a,b){function c(b){this.options=d.extend({container:document.body},b),this.uid=a.guid("rt_")}var d=a.$,e={},f=function(a){for(var b in a)if(a.hasOwnProperty(b))return b;return null};return d.extend(c.prototype,{getContainer:function(){var a,b,c=this.options;return this._container?this._container:(a=c.container||d(document.body),b=d(document.createElement("div")),b.attr("id","rt_"+this.uid),b.css({position:"absolute",top:"0px",left:"0px",width:"1px",height:"1px",overflow:"hidden"}),a.append(b),a.addClass("webuploader-container"),this._container=b,b)},init:a.noop,exec:a.noop,destroy:function(){this._container&&this._container.parentNode.removeChild(this.__container),this.off()}}),c.orders="html5,flash",c.addRuntime=function(a,b){e[a]=b},c.hasRuntime=function(a){return!!(a?e[a]:f(e))},c.create=function(a,b){var g,h;if(b=b||c.orders,d.each(b.split(/\s*,\s*/g),function(){return e[this]?(g=this,!1):void 0}),g=g||f(e),!g)throw new Error("Runtime Error");return h=new e[g](a)},b.installTo(c.prototype),c}),c("runtime/client",["base","mediator","runtime/runtime"],function(a,b,c){function d(b,d){var f,g=a.Deferred();this.uid=a.guid("client_"),this.runtimeReady=function(a){return g.done(a)},this.connectRuntime=function(a,b){return f?void 0:(g.done(b),"string"==typeof a&&e.get(a)?f=e.get(a):!d&&e.has()&&(f=e.get()),f?(f.promise.then(g.resolve),f.client++,f):(f=c.create(a,a.runtimeOrder),e.add(f),f.promise=g.promise(),f.once("ready",g.resolve),f.init(),f.client=1,f))},this.getRuntime=function(){return f},this.disconnectRuntime=function(){f&&(f.client--,f.client<=0&&(e.remove(f),delete f.promise,f.destroy()),f=null)},this.exec=function(){if(f){var c=a.slice(arguments);return b&&c.unshift(b),f.exec.apply(this,c)}},this.getRuid=function(){return f&&f.uid},this.destroy=function(a){return function(){a&&a.apply(this,arguments),this.trigger("destroy"),this.off(),this.exec("destroy"),this.disconnectRuntime()}}(this.destroy)}var e=function(){var a={};return{add:function(b){a[b.uid]=b},get:function(b){var c;if(b)return a[b];for(c in a)return a[c];return null},remove:function(b){delete a[b.uid]},has:function(){return!!this.get.apply(this,arguments)}}}();return b.installTo(d.prototype),d}),c("lib/blob",["base","runtime/client"],function(a,b){function c(a,c){var d=this;d.source=c,d.ruid=a,b.call(d,"Blob"),this.uid=c.uid||this.uid,this.type=c.type||"",this.size=c.size||0,a&&d.connectRuntime(a)}return a.inherits(b,{constructor:c,slice:function(a,b){return this.exec("slice",a,b)},getSource:function(){return this.source}}),c}),c("lib/file",["base","lib/blob"],function(a,b){function c(a,c){var f;b.apply(this,arguments),this.name=c.name||"untitled"+d++,this.type||(f=e.exec(c.name)?RegExp.$1.toLowerCase():"",~"jpg,jpeg,png,gif,bmp".indexOf(f)&&(this.type="image/"+f)),this.ext=f,this.lastModifiedDate=c.lastModifiedDate||(new Date).toLocaleString()}var d=0,e=/\.([^.]+)$/;return a.inherits(b,c)}),c("lib/filepicker",["base","runtime/client","lib/file"],function(b,c,d){function e(a){if(a=this.options=f.extend({},e.options,a),a.container=f(a.id),!a.container.length)throw new Error("按钮指定错误");a.label=a.label||a.container.text()||"选择文件",a.button=f(a.button||document.createElement("div")),a.button.text(a.label),a.container.html(a.button),c.call(this,"FilePicker",!0)}var f=b.$;return e.options={button:null,container:null,label:null,multiple:!0,accept:null},b.inherits(c,{constructor:e,init:function(){var b=this,c=b.options,e=c.button;e.addClass("webuploader-pick"),b.on("all",function(a){var c;switch(a){case"mouseenter":e.addClass("webuploader-pick-hover");break;case"mouseleave":e.removeClass("webuploader-pick-hover");break;case"change":c=b.exec("getFiles"),b.trigger("select",f.map(c,function(a){return new d(b.getRuid(),a)}))}}),b.connectRuntime(c,function(){b.refresh(),b.exec("init",c)}),f(a).on("resize",function(){b.refresh()})},refresh:function(){var a=this.getRuntime().getContainer(),b=this.options.button,c=b.outerWidth(),d=b.outerHeight(),e=b.offset();c&&a.css({width:c+"px",height:d+"px"}).offset(e)},destroy:function(){this.runtime&&(this.exec("destroy"),this.disconnectRuntime())}}),e}),c("widgets/widget",["base","uploader"],function(a,b){function c(a){if(!a)return!1;var b=a.length,c=e.type(a);return 1===a.nodeType&&b?!0:"array"===c||"function"!==c&&"string"!==c&&(0===b||"number"==typeof b&&b>0&&b-1 in a)}function d(a){this.owner=a,this.options=a.options}var e=a.$,f=b.prototype._init,g={},h=[];return e.extend(d.prototype,{init:a.noop,invoke:function(a,b){var c=this.responseMap;return c&&a in c&&c[a]in this&&e.isFunction(this[c[a]])?this[c[a]].apply(this,b):g},request:function(){return this.owner.request.apply(this.owner,arguments)}}),e.extend(b.prototype,{_init:function(){var a=this,b=a._widgets=[];return e.each(h,function(c,d){b.push(new d(a))}),f.apply(a,arguments)},request:function(b,d,e){var f,h,i=0,j=this._widgets,k=j.length,l=[],m=[];for(d=c(d)?d:[d];k>i;i++)f=j[i],h=f.invoke(b,d),h!==g&&(a.isPromise(h)?m.push(h):l.push(h));return e||m.length?a.when.apply(a,m).then(function(){var b=a.Deferred(),c=arguments;return setTimeout(function(){b.resolve.apply(b,c)},1),b.promise()}).then(e||a.noop):l[0]}}),b.register=d.register=function(b,c){var f,g={init:"init"};return 1===arguments.length?(c=b,c.responseMap=g):c.responseMap=e.extend(g,b),f=a.inherits(d,c),h.push(f),f},d}),c("widgets/filepicker",["base","uploader","lib/filepicker","widgets/widget"],function(a,b,c){return a.$.extend(b.options,{pick:null,accept:null}),b.register({"add-btn":"addButton",refresh:"refresh"},{init:function(a){return this.pickers=[],a.pick&&this.addButton(a.pick)},refresh:function(){$.each(this.pickers,function(){this.refresh()})},addButton:function(b){var d,e,f,g=this,h=g.options,i=h.accept;if(b)return f=a.Deferred(),"string"==typeof b&&(b={id:b}),d=$.extend({},b,{accept:$.isPlainObject(i)?[i]:i,swf:h.swf,runtimeOrder:h.runtimeOrder}),e=new c(d),e.once("ready",f.resolve),e.on("select",function(a){g.owner.request("add-file",[a])}),e.init(),this.pickers.push(e),f.promise()}})}),c("file",["base","mediator"],function(a,b){function c(){return f+g++}function d(a){this.name=a.name||"Untitled",this.size=a.size||0,this.type=a.type||"image/png",this.lastModifiedDate=a.lastModifiedDate||1*new Date,this.id=c(),this.ext=h.exec(this.name)?RegExp.$1:"",this.statusText="",i[this.id]=d.Status.INITED,this.source=a,this.loaded=0,this.on("error",function(a){this.setStatus(d.Status.ERROR,a)})}var e=a.$,f="WU_FILE_",g=0,h=/\.([^.]+)$/,i={};return e.extend(d.prototype,{setStatus:function(a,b){var c=i[this.id];"undefined"!=typeof b&&(this.statusText=b),a!==c&&(i[this.id]=a,this.trigger("statuschange",a,c))},getStatus:function(){return i[this.id]},getSource:function(){return this.source},destory:function(){delete i[this.id]}}),b.installTo(d.prototype),d.Status={INITED:"inited",QUEUED:"queued",PROGRESS:"progress",ERROR:"error",COMPLETE:"complete",CANCELLED:"cancelled",INTERRUPT:"interrupt",INVALID:"invalid"},d}),c("lib/dnd",["base","mediator","runtime/client"],function(a,b,c){function d(a){a=this.options=e.extend({},d.options,a),a.container=e(a.container),a.container.length&&c.call(this,"DragAndDrop")}var e=a.$;return d.options={accept:null,disableGlobalDnd:!0},a.inherits(c,{constructor:d,init:function(){var a=this;a.connectRuntime(a.options,function(){a.exec("init")})},destroy:function(){this.disconnectRuntime()}}),b.installTo(d.prototype),d}),c("lib/filepaste",["base","mediator","runtime/client"],function(a,b,c){function d(a){a=this.options=e.extend({},a),a.container=e(a.container||document.body),c.call(this,"FilePaste")}var e=a.$;return a.inherits(c,{constructor:d,init:function(){var a=this;a.connectRuntime(a.options,function(){a.exec("init")})},destroy:function(){this.exec("destroy"),this.disconnectRuntime(),this.off()}}),b.installTo(d.prototype),d}),c("lib/image",["base","runtime/client","lib/blob"],function(a,b,c){function d(a){this.options=e.extend({},d.options,a),b.call(this,"Image"),this.on("load",function(){this._info=this.exec("info"),this._meta=this.exec("meta")})}var e=a.$;return d.options={quality:90,crop:!1,preserveHeaders:!0,allowMagnify:!0},a.inherits(b,{constructor:d,info:function(a){return a?(this._info=a,this):this._info},meta:function(a){return a?(this._meta=a,this):this._meta},loadFromBlob:function(a){var b=this,c=a.getRuid();this.connectRuntime(c,function(){b.exec("init",b.options),b.exec("loadFromBlob",a)})},resize:function(){var b=a.slice(arguments);return this.exec.apply(this,["resize"].concat(b))},getAsDataUrl:function(a){return this.exec("getAsDataUrl",a)},getAsBlob:function(a){var b=this.exec("getAsBlob",a);return new c(this.getRuid(),b)}}),d}),c("lib/transport",["base","runtime/client","mediator"],function(a,b,c){function d(a){var c=this;a=c.options=e.extend(!0,{},d.options,a||{}),b.call(this,"Transport"),this._blob=null,this._formData=a.formData||{},this._headers=a.headers||{},this.on("progress",this._timeout),this.on("load error",function(){c.trigger("progress",1),clearTimeout(c._timer)})}var e=a.$;return d.options={server:"",method:"POST",withCredentials:!1,fileVar:"file",timeout:12e4,formData:{},headers:{},sendAsBinary:!1},e.extend(d.prototype,{appendBlob:function(a,b,c){var d=this,e=d.options;d.getRuid()&&d.disconnectRuntime(),d.connectRuntime(b.ruid,function(){d.exec("init")}),d._blob=b,e.fileVar=a||e.fileVar,e.filename=c||e.filename},append:function(a,b){"object"==typeof a?e.extend(this._formData,a):this._formData[a]=b},setRequestHeader:function(a,b){"object"==typeof a?e.extend(this._headers,a):this._headers[a]=b},send:function(a){this.exec("send",a),this._timeout()},abort:function(){return clearTimeout(this._timer),this.exec("abort")},destroy:function(){this.trigger("destroy"),this.off(),this.exec("destroy"),this.disconnectRuntime()},getResponse:function(){return this.exec("getResponse")},getResponseAsJson:function(){return this.exec("getResponseAsJson")},getStatus:function(){return this.exec("getStatus")},_timeout:function(){var a=this,b=a.options.timeout;b&&(clearTimeout(a._timer),a._timer=setTimeout(function(){a.abort(),a.trigger("error","timeout")},b))}}),c.installTo(d.prototype),d}),c("queue",["base","mediator","file"],function(a,b,c){function d(){this.stats={numOfQueue:0,numOfSuccess:0,numOfCancel:0,numOfProgress:0,numOfUploadFailed:0,numOfInvalid:0},this._queue=[],this._map={}}var e=a.$,f=c.Status;return e.extend(d.prototype,{append:function(a){return this._queue.push(a),this._fileAdded(a),this},prepend:function(a){return this._queue.unshift(a),this._fileAdded(a),this},getFile:function(a){return"string"!=typeof a?a:this._map[a]},fetch:function(a){var b,c,d=this._queue.length;for(a=a||f.QUEUED,b=0;d>b;b++)if(c=this._queue[b],a===c.getStatus())return c;return null},getFiles:function(){for(var a,b=[].slice.call(arguments,0),c=[],d=0,f=this._queue.length;f>d;d++)a=this._queue[d],(!b.length||~e.inArray(a.getStatus(),b))&&c.push(a);return c},_fileAdded:function(a){var b=this,c=this._map[a.id];c||(this._map[a.id]=a,a.on("statuschange",function(a,c){b._onFileStatusChange(a,c)})),a.setStatus(f.QUEUED)},_onFileStatusChange:function(a,b){var c=this.stats;switch(b){case f.PROGRESS:c.numOfProgress--;break;case f.QUEUED:c.numOfQueue--;break;case f.ERROR:c.numOfUploadFailed--;break;case f.INVALID:c.numOfInvalid--}switch(a){case f.QUEUED:c.numOfQueue++;break;case f.PROGRESS:c.numOfProgress++;break;case f.ERROR:c.numOfUploadFailed++;break;case f.COMPLETE:c.numOfSuccess++;break;case f.CANCELLED:c.numOfCancel++;break;case f.INVALID:c.numOfInvalid++}}}),b.installTo(d.prototype),d}),c("runtime/compbase",function(){function a(a,b){this.owner=a,this.options=a.options,this.getRuntime=function(){return b},this.getRuid=function(){return b.uid},this.trigger=function(){return a.trigger.apply(a,arguments)}}return a}),c("runtime/flash/runtime",["base","runtime/runtime","runtime/compbase"],function(b,c,d){function e(){var a;try{a=navigator.plugins["Shockwave Flash"],a=a.description}catch(b){try{a=new ActiveXObject("ShockwaveFlash.ShockwaveFlash").GetVariable("$version")}catch(c){a="0.0"}}return a=a.match(/\d+/g),parseFloat(a[0]+"."+a[1],10)}function f(){function d(a,b){var c,d,e=a.type||a;c=e.split("::"),d=c[0],e=c[1],"Ready"===e&&d===j.uid?j.trigger("ready"):f[d]&&f[d].trigger(e.toLowerCase(),a,b)}var e={},f={},g=this.destory,j=this,k=b.guid("webuploader_");c.apply(j,arguments),j.type=h,j.exec=function(a,c){var d,g=this,h=g.uid,k=b.slice(arguments,2);return f[h]=g,i[a]&&(e[h]||(e[h]=new i[a](g,j)),d=e[h],d[c])?d[c].apply(d,k):j.flashExec.apply(g,arguments)},a[k]=function(){var a=arguments;setTimeout(function(){d.apply(null,a)},1)},this.jsreciver=k,this.destory=function(){return g&&g.apply(this,arguments)},this.flashExec=function(a,c){var d=j.getFlash(),e=b.slice(arguments,2);return d.exec(this.uid,a,c,e)}}var g=b.$,h="flash",i={};return b.inherits(c,{constructor:f,init:function(){var a,c=this.getContainer(),d=this.options;c.css({position:"absolute",top:"-8px",left:"-8px",width:"9px",height:"9px",overflow:"hidden"}),a='<object id="'+this.uid+'" type="application/x-shockwave-flash" data="'+d.swf+'" ',b.isIE&&(a+='classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" '),a+='width="100%" height="100%" style="outline:0"><param name="movie" value="'+d.swf+'" /><param name="flashvars" value="uid='+this.uid+"&jsreciver="+this.jsreciver+'" /><param name="wmode" value="transparent" /><param name="allowscriptaccess" value="always" /></object>',c.html(a)},getFlash:function(){return this._flash?this._flash:(this._flash=g("#"+this.uid).get(0),this._flash)}}),f.register=function(a,c){return c=i[a]=b.inherits(d,g.extend({flashExec:function(){var a=this.owner,b=this.getRuntime();return b.flashExec.apply(a,arguments)}},c))},e()>=11.3&&c.addRuntime(h,f),f}),c("runtime/flash/filepicker",["base","runtime/flash/runtime"],function(a,b){var c=a.$;return b.register("FilePicker",{init:function(a){var b=c.extend({},a);delete b.button,delete b.container,this.flashExec("FilePicker","init",b)},destroy:function(){}})}),c("runtime/flash/image",["runtime/flash/runtime"],function(a){return a.register("Image",{loadFromBlob:function(a){var b=this.owner;b.info()&&this.flashExec("Image","info",b.info()),b.meta()&&this.flashExec("Image","meta",b.meta()),this.flashExec("Image","loadFromBlob",a.uid)}})}),c("runtime/flash/transport",["base","runtime/flash/runtime","runtime/client"],function(a,b,c){return b.register("Transport",{init:function(){this._status=0,this._response=null,this._responseJson=null},send:function(){var a,b=this.owner,c=this.options,d=this._initAjax(),e=b._blob,f=c.server;d.connectRuntime(e.ruid),c.sendAsBinary?(f+=(/\?/.test(f)?"&":"?")+$.param(b._formData),a=e.uid):($.each(b._formData,function(a,b){d.exec("append",a,b)}),d.exec("appendBlob",c.fileVar,e.uid,c.filename||b._formData.name||"")),this._setRequestHeader(d,c.headers),d.exec("send",{method:c.method,url:f},a)},getStatus:function(){return this._status},getResponse:function(){return this._response},getResponseAsJson:function(){return this._responseJson},abort:function(){var a=this._xhr;a&&(a.exec("abort"),a.destroy(),this._xhr=a=null)},destroy:function(){this.abort()},_initAjax:function(){{var a=this,b=new c("XMLHttpRequest");this.options}return b.on("uploadprogress progress",function(b){return a.trigger("progress",b.loaded/b.total)}),b.on("load",function(){var c=b.exec("getStatus");return b.off(),a._xhr=null,200===c?(a._response=b.exec("getResponse"),a._responseJson=b.exec("getResponseAsJson"),a.trigger("load")):(a._status=c,b.destroy(),b=null,a.trigger("error","http"))}),b.on("error",function(){b.off(),a._xhr=null,a.trigger("error","http")}),a._xhr=b,b},_setRequestHeader:function(a,b){$.each(b,function(b,c){a.exec("setRequestHeader",b,c)})}})}),c("widgets/filednd",["base","uploader","lib/dnd","widgets/widget"],function(a,b,c){return b.options.dnd="",b.register({init:function(b){if(b.dnd&&"html5"===this.request("get-runtime-type")){var d,e=this,f=a.Deferred(),g=$.extend({},{container:b.dnd,accept:b.accept});return d=new c(g),d.once("ready",f.resolve),d.on("drop",function(a){e.request("add-file",[a])}),d.init(),f.promise()}}})}),c("widgets/filepaste",["base","uploader","lib/filepaste","widgets/widget"],function(a,b,c){return b.register({init:function(b){if(b.paste&&"html5"===this.request("get-runtime-type")){var d,e=this,f=a.Deferred(),g=$.extend({},{container:b.paste,accept:b.accept});return d=new c(g),d.once("ready",f.resolve),d.on("paste",function(a){e.owner.request("add-file",[a])}),d.init(),f.promise()}}})}),c("widgets/image",["base","uploader","lib/image","widgets/widget"],function(a,b,c){var d,e=a.$;return d=function(a){var b=0,c=[],d=function(){for(var d;c.length&&a>b;)d=c.shift(),b+=d[0],d[1]()};return function(a,e,f){c.push([e,f]),a.once("destroy",function(){b-=e,setTimeout(d,1)}),setTimeout(d,1)}}(5242880),e.extend(b.options,{thumb:{width:110,height:110,quality:70,allowMagnify:!0,crop:!0,preserveHeaders:!1,type:"image/jpeg"},compress:{width:1600,height:1600,quality:90,allowMagnify:!1,crop:!1,preserveHeaders:!0}}),b.register({"make-thumb":"makeThumb","before-send-file":"compressImage"},{makeThumb:function(a,b,f,g){var h,i;return a=this.request("get-file",a),a.type.match(/^image/)?(h=e.extend({},this.options.thumb),e.isPlainObject(f)&&(h=e.extend(h,f),f=null),f=f||h.width,g=g||h.height,i=new c(h),i.once("load",function(){a._info=a._info||i.info(),a._meta=a._meta||i.meta(),i.resize(f,g)}),i.once("complete",function(){b(!1,i.getAsDataUrl(h.type)),i.destroy()}),i.once("error",function(){b(!0),i.destroy()}),d(i,a.source.size,function(){a._info&&i.info(a._info),a._meta&&i.meta(a._meta),i.loadFromBlob(a.source)}),void 0):(b(!0),void 0)},compressImage:function(b){var d,f,g=this.options.compress||this.options.resize,h=g&&g.compressSize||307200;return b=this.request("get-file",b),!g||!~"image/jpeg,image/jpg".indexOf(b.type)||b.size<h||b._compressed?void 0:(g=e.extend({},g),f=a.Deferred(),d=new c(g),f.always(function(){d.destroy(),d=null}),d.once("error",f.reject),d.once("load",function(){b._info=b._info||d.info(),b._meta=b._meta||d.meta(),d.resize(g.width,g.height)}),d.once("complete",function(){var a,c;a=d.getAsBlob(g.type),c=b.size,a.size<c&&(b.source=a,b.size=a.size,b.trigger("resize",a.size,c)),b._compressed=!0,f.resolve(!0)}),b._info&&d.info(b._info),b._meta&&d.meta(b._meta),d.loadFromBlob(b.source),f.promise())}})}),c("widgets/queue",["base","uploader","queue","file","widgets/widget"],function(a,b,c,d){var e=a.$,f=d.Status;return b.register({"add-file":"addFiles","get-file":"getFile","fetch-file":"fetchFile","get-stats":"getStats","get-files":"getFiles","remove-file":"removeFile",retry:"retry"},{init:function(a){var b,d,f,g,h;if(e.isPlainObject(a.accept)&&(a.accept=[a.accept]),a.accept){for(g=[],d=0,b=a.accept.length;b>d;d++)f=a.accept[d].extensions,f&&g.push(f);g.length&&(h=g.join(",").replace(/,/g,"$|").replace(/\*/g,".*")),this.accept=new RegExp(h,"i")}this.queue=new c,this.stats=this.queue.stats},_addFile:function(a){var b=this;if(!(!a||a.size<6||b.accept&&!b.accept.test(a.name))&&(a instanceof d||(a=new d(a)),b.owner.trigger("beforeFileQueued",a)))return b.queue.append(a),b.owner.trigger("fileQueued",a),a},getFile:function(a){return this.queue.getFile(a)},addFiles:function(a){var b=this;a.length||(a=[a]),a=e.map(a,function(a){return b._addFile(a)}),b.owner.trigger("filesQueued",a),b.options.auto&&b.request("start-upload")},getStats:function(){return this.stats},removeFile:function(a){var b=this;a=a.id?a:b.queue.getFile(a),a.setStatus(f.CANCELLED),b.owner.trigger("fileDequeued",a)},getFiles:function(){return this.queue.getFiles.apply(this.queue,arguments)},fetchFile:function(){return this.queue.fetch.apply(this.queue,arguments)},retry:function(a,b){var c,d,e,g=this;if(a)return a=a.id?a:g.queue.getFile(a),a.setStatus(f.QUEUED),b||g.request("start-upload"),void 0;for(c=g.queue.getFiles(f.ERROR),d=0,e=c.length;e>d;d++)a=c[d],a.setStatus(f.QUEUED);g.request("start-upload")}})}),c("widgets/runtime",["uploader","runtime/runtime","widgets/widget"],function(a,b){return a.support=function(){return b.hasRuntime.apply(b,arguments)},a.register({"get-runtime-type":"getRuntmeType"},{init:function(){if(!this.getRuntmeType())throw Error("Runtime Error")},getRuntmeType:function(){var a,c,d=this.options.runtimeOrder||b.orders,e=this.type;if(!e)for(d=d.split(/\s*,\s*/g),a=0,c=d.length;c>a;a++)if(b.hasRuntime(d[a])){this.type=e=d[a];break}return e}})}),c("widgets/upload",["base","uploader","file","lib/transport","widgets/widget"],function(a,b,c,d){function e(a,b){for(var c,d=[],e=a.source,f=e.size,g=b?Math.ceil(f/b):1,h=0,i=0;g>i;)c=Math.min(b,f-h),d.push({file:a,start:h,end:h+c,total:f,chunks:g,chunk:i++}),h+=c;return a.blocks=d.concat(),a.remaning=d.length,{file:a,has:function(){return!!d.length},fetch:function(){return d.shift()}}}var f=a.$,g=a.isPromise,h=c.Status;f.extend(b.options,{prepareNextFile:!1,chunked:!1,chunkSize:5242880,chunkRetry:2,threads:3}),b.register({"start-upload":"start","stop-upload":"stop","skip-file":"skipFile","is-in-progress":"isInProgress"},{init:function(){var b=this.owner;this.runing=!1,this.pool=[],this.pending=[],this.remaning=0,this.__tick=a.bindFn(this._tick,this),b.on("uploadComplete",function(a){a.blocks&&f.each(a.blocks,function(a,b){b.transport&&(b.transport.abort(),b.transport.destroy()),delete b.transport}),delete a.blocks,delete a.remaning})},start:function(){var b=this;f.each(b.request("get-files",h.INVALID),function(){b.request("remove-file",this)}),b.runing||(b.runing=!0,f.each(b.pool,function(a,c){var d=c.file;d.getStatus()===h.INTERRUPT&&(d.setStatus(h.PROGRESS),b._trigged=!1,c.transport&&c.transport.send())}),b._trigged=!1,b.owner.trigger("startUpload"),a.nextTick(b.__tick))},stop:function(a){var b=this;b.runing!==!1&&(b.runing=!1,a&&f.each(b.pool,function(a,b){b.transport&&b.transport.abort(),b.file.setStatus(h.INTERRUPT)}),b.owner.trigger("stopUpload"))},isInProgress:function(){return!!this.runing},getStats:function(){return this.request("get-stats")},skipFile:function(a,b){a=this.request("get-file",a),a.setStatus(b||h.COMPLETE),a.skipped=!0,a.blocks&&f.each(a.blocks,function(a,b){var c=b.transport;c&&(c.abort(),c.destroy(),delete b.transport)}),this.owner.trigger("uploadSkip",a)},_tick:function(){var b,c,d=this,e=d.options;return d._promise?d._promise.always(d.__tick):(d.pool.length<e.threads&&(c=d._nextBlock())?(d._trigged=!1,b=function(b){d._promise=null,b&&b.file&&d._startSend(b),a.nextTick(d.__tick)},d._promise=g(c)?c.always(b):b(c)):d.remaning||d.getStats().numOfQueue||(d.runing=!1,d._trigged||a.nextTick(function(){d.owner.trigger("uploadFinished")}),d._trigged=!0),void 0)},_nextBlock:function(){var a,b,c=this,d=c._act,f=c.options;return d&&d.has()&&d.file.getStatus()===h.PROGRESS?(f.prepareNextFile&&!c.pending.length&&c._prepareNextFile(),d.fetch()):c.runing?(!c.pending.length&&c.getStats().numOfQueue&&c._prepareNextFile(),a=c.pending.shift(),b=function(a){return a?(d=e(a,f.chunked?f.chunkSize:0),c._act=d,d.fetch()):null},g(a)?a.then(b):b(a)):void 0},_prepareNextFile:function(){var a,b=this,c=b.request("fetch-file"),d=b.pending;c&&(a=b.request("before-send-file",c,function(){return c.getStatus()===h.QUEUED?(b.owner.trigger("uploadStart",c),c.setStatus(h.PROGRESS),c):b._finishFile(c)}),a.done(function(){var b=f.inArray(a,d);~b&&d.splice(b,1,c)}),a.fail(function(a){c.setStatus(h.ERROR,a),b.owner.trigger("uploadError",c,type),b.owner.trigger("uploadComplete",c)}),d.push(a))},_popBlock:function(a){var b=f.inArray(a,this.pool);this.pool.splice(b,1),a.file.remaning--,this.remaning--},_startSend:function(b){var c,d=this,e=b.file;d.pool.push(b),d.remaning++,b.blob=1===b.chunks?e.source:e.source.slice(b.start,b.end),c=d.request("before-send",b,function(){e.getStatus()===h.PROGRESS?d._doSend(b):(d._popBlock(b),a.nextTick(d.__tick))}),c.fail(function(){1===e.remaning?d._finishFile(e).always(function(){b.percentage=1,d._popBlock(b),d.owner.trigger("uploadComplete",e),a.nextTick(d.__tick)}):(b.percentage=1,d._popBlock(b),a.nextTick(d.__tick))})},_doSend:function(b){var c=this,e=c.owner,g=c.options,i=b.file,j=new d(g),k=f.extend({},g.formData),l=f.extend({},g.headers);b.transport=j,j.on("destroy",function(){delete b.transport,c._popBlock(b),a.nextTick(c.__tick)}),j.on("progress",function(a){var c=0,d=0;c=b.percentage=a,b.chunks>1&&(f.each(i.blocks,function(a,b){d+=(b.percentage||0)*(b.end-b.start)}),c=d/i.size),e.trigger("uploadProgress",i,c||0)}),j.on("error",function(a){b.retried=b.retried||0,b.chunks>1&&~"http,abort".indexOf(a)&&b.retried<g.chunkRetry?(b.retried++,j.send()):(i.setStatus(h.ERROR,a),e.trigger("uploadError",i,a),e.trigger("uploadComplete",i))}),j.on("load",function(){var a,d,f=j.getResponseAsJson()||{};return f._raw=j.getResponse(),d=function(b){a=b},e.trigger("uploadAccept",b,f,d)||(a=a||"server"),a?(j.trigger("error",a),void 0):(1===i.remaning?c._finishFile(i,f):j.destroy(),void 0)}),k=f.extend(k,{id:i.id,name:i.name,type:i.type,lastModifiedDate:i.lastModifiedDate,size:i.size}),b.chunks>1&&f.extend(k,{chunks:b.chunks,chunk:b.chunk}),e.trigger("uploadBeforeSend",b,k,l),j.appendBlob(g.fileVal,b.blob,i.name),j.append(k),j.setRequestHeader(l),j.send()},_finishFile:function(a,b,c){var d=this.owner;return d.request("after-send-file",arguments,function(){a.setStatus(h.COMPLETE),d.trigger("uploadSuccess",a,b,c)}).fail(function(b){a.getStatus()===h.PROGRESS&&a.setStatus(h.ERROR,b),d.trigger("uploadError",a,b)}).always(function(){d.trigger("uploadComplete",a)})}})}),c("widgets/validator",["base","uploader","file","widgets/widget"],function(a,b,c){var d,e=a.$,f={};return d={addValidator:function(a,b){f[a]=b},removeValidator:function(a){delete f[a]}},b.register({init:function(){var a=this;e.each(f,function(){this.call(a.owner)})}}),d.addValidator("fileNumLimit",function(){var a=this,b=a.options,c=0,d=b.fileNumLimit>>0,e=!0;d&&(a.on("beforeFileQueued",function(){return c>=d&&e&&(e=!1,this.trigger("error","Q_EXCEED_NUM_LIMIT",d),setTimeout(function(){e=!0},1)),c>=d?!1:!0}),a.on("fileQueued",function(){c++}),a.on("fileDequeued",function(){c--}))}),d.addValidator("fileSizeLimit",function(){var a=this,b=a.options,c=0,d=b.fileSizeLimit>>0,e=!0;d&&(a.on("beforeFileQueued",function(a){var b=c+a.size>d;return b&&e&&(e=!1,this.trigger("error","Q_EXCEED_SIZE_LIMIT",d),setTimeout(function(){e=!0},1)),b?!1:!0}),a.on("fileQueued",function(a){c+=a.size}),a.on("fileDequeued",function(a){c-=a.size}))}),d.addValidator("fileSingleSizeLimit",function(){var a=this,b=a.options,d=b.fileSingleSizeLimit;d&&a.on("fileQueued",function(a){a.size>d&&a.setStatus(c.Status.INVALID,"exceed_size")})}),d.addValidator("duplicate",function(){function a(a){for(var b,c=0,d=0,e=a.length;e>d;d++)b=a.charCodeAt(d),c=b+(c<<6)+(c<<16)-c;return c}var b=this,c=b.options,d={};c.duplicate||(b.on("beforeFileQueued",function(b){var c=a(b.name+b.size+b.lastModifiedDate);return d[c]?!1:void 0}),b.on("fileQueued",function(b){var c=a(b.name+b.size+b.lastModifiedDate);d[c]=!0}),b.on("fileDequeued",function(b){var c=a(b.name+b.size+b.lastModifiedDate);delete d[c]}))}),d}),function(b){var c,d,e,f,g,h,i=function(a){return a&&a.charAt(0).toUpperCase()+a.substr(1)},j="WebUploader",k=b.base;for(c in b)if(d=k,b.hasOwnProperty(c)){for(e=c.split("/"),g=i(e.pop());f=i(e.shift());)d[f]=d[f]||{},d=d[f];
+d[g]=b[c]}"object"==typeof module&&"object"==typeof module.exports?module.exports=k:a.define&&a.define.amd?a.define("../build/outro",j,k):(h=a[j],a[j]=k,a[j].noConflict=function(){a[j]=h})}(b.modules)}(this);
\ No newline at end of file
diff --git a/static/js/project/announcementList/announcementDetail.js b/static/js/project/announcementList/announcementDetail.js
index a1625c0..298de76 100644
--- a/static/js/project/announcementList/announcementDetail.js
+++ b/static/js/project/announcementList/announcementDetail.js
@@ -13,7 +13,7 @@ define(['jquery', "template", "Tools", "announApi", "paging"], function ($, temp
     module.init = function (page) {
 
         //成交公告
-        tools.doGet(announDetail+'/'+getQueryVariable('id'), {}, module.announInformation);
+        tools.doGet(announDetail+'/'+getQueryVariable('id'), {}, module.announInformation,true);
 
     };
 
@@ -37,13 +37,13 @@ define(['jquery', "template", "Tools", "announApi", "paging"], function ($, temp
             var announcementInformationData = template('announcementInformationData', module.data);
             $("#announcementInformationContent").html(announcementInformationData);
             //流转方向字典
-            tools.doGet(Dictionaries+'/rollout_type', {}, module.circulationDictionaries);
+            tools.doGet(Dictionaries+'/rollout_type', {}, module.circulationDictionaries,true);
             //交易方式字典
-            tools.doGet(Dictionaries+'/deal_type', {}, module.transactionDictionaries);
+            tools.doGet(Dictionaries+'/deal_type', {}, module.transactionDictionaries,true);
             //面积单位字典
-            tools.doGet(Dictionaries+'/area_unit', {}, module.areaDictionaries);
+            tools.doGet(Dictionaries+'/area_unit', {}, module.areaDictionaries,true);
             //成交价格字典
-            tools.doGet(Dictionaries+'/price_unit', {}, module.unitDictionaries);
+            tools.doGet(Dictionaries+'/price_unit', {}, module.unitDictionaries,true);
         }
     }
 
diff --git a/static/js/project/announcementList/announcementList.js b/static/js/project/announcementList/announcementList.js
index ffa9aec..c913fee 100644
--- a/static/js/project/announcementList/announcementList.js
+++ b/static/js/project/announcementList/announcementList.js
@@ -26,10 +26,10 @@ define(['jquery', "template", "Tools", "announApi", "paging"], function ($, temp
     module.init = function (page) {
 
         //成交公告
-        tools.doGet(announList, {deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.announInformation);
+        tools.doGet(announList, {deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.announInformation,true);
 
         //鉴证公告
-        tools.doGet(attestationList, {deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.attestationInformation);
+        tools.doGet(attestationList, {deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.attestationInformation,true);
 
 
     };
@@ -109,10 +109,10 @@ define(['jquery', "template", "Tools", "announApi", "paging"], function ($, temp
     turnThePage = function (pageNum) {
         module.data.pageNum = pageNum ;
         if(module.data.clickType == 'attestation'){
-            tools.doGet(attestationList, {deptId:100,pageNum:pageNum,pageSize:module.data.pageSize}, module.attestationInformation);
+            tools.doGet(attestationList, {deptId:100,pageNum:pageNum,pageSize:module.data.pageSize}, module.attestationInformation,true);
         }
         if(module.data.clickType == 'announcement'){
-            tools.doGet(announList, {deptId:100,pageNum:pageNum,pageSize:module.data.pageSize}, module.announInformation);
+            tools.doGet(announList, {deptId:100,pageNum:pageNum,pageSize:module.data.pageSize}, module.announInformation,true);
         }
     }
     return module;
diff --git a/static/js/project/announcementList/attestation.js b/static/js/project/announcementList/attestation.js
index c01c74d..5b20dfb 100644
--- a/static/js/project/announcementList/attestation.js
+++ b/static/js/project/announcementList/attestation.js
@@ -13,7 +13,7 @@ define(['jquery', "template", "Tools", "announApi", "paging"], function ($, temp
     module.init = function (page) {
 
         //鉴证公告
-        tools.doGet(attestationDetail+'/'+getQueryVariable('id'), {}, module.announInformation);
+        tools.doGet(attestationDetail+'/'+getQueryVariable('id'), {}, module.announInformation,true);
 
     };
 
@@ -37,15 +37,15 @@ define(['jquery', "template", "Tools", "announApi", "paging"], function ($, temp
             var announcementInformationData = template('announcementInformationData', module.data);
             $("#announcementInformationContent").html(announcementInformationData);
             //公司性质字典
-            tools.doGet(Dictionaries+'/company_nature', {}, module.companyDictionaries);
+            tools.doGet(Dictionaries+'/company_nature', {}, module.companyDictionaries,true);
             //流转方向字典
-            tools.doGet(Dictionaries+'/rollout_type', {}, module.circulationDictionaries);
+            tools.doGet(Dictionaries+'/rollout_type', {}, module.circulationDictionaries,true);
             //交易方式字典
-            tools.doGet(Dictionaries+'/deal_type', {}, module.transactionDictionaries);
+            tools.doGet(Dictionaries+'/deal_type', {}, module.transactionDictionaries,true);
             //面积单位字典
-            tools.doGet(Dictionaries+'/area_unit', {}, module.areaDictionaries);
+            tools.doGet(Dictionaries+'/area_unit', {}, module.areaDictionaries,true);
             //成交价格字典
-            tools.doGet(Dictionaries+'/price_unit', {}, module.unitDictionaries);
+            tools.doGet(Dictionaries+'/price_unit', {}, module.unitDictionaries,true);
         }
     }
 
diff --git a/static/js/project/bidding/biddingList.js b/static/js/project/bidding/biddingList.js
index d71f138..e32566e 100644
--- a/static/js/project/bidding/biddingList.js
+++ b/static/js/project/bidding/biddingList.js
@@ -26,13 +26,13 @@ define(['jquery', "template", "Tools", "biddingApi", "paging"], function ($, tem
     module.init = function (page) {
 
         //新闻资讯
-        tools.doGet(biddingList, {deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.biddingList);
+        tools.doGet(biddingList, {deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.biddingList,true);
 
         //标的物类型
-        tools.doGet(webDeptType+"/project_type", {}, module.deptType);
+        tools.doGet(webDeptType+"/project_type", {}, module.deptType,true);
 
         //标的物所在地
-        tools.doGet(webDept + '/0', {}, module.deptLocation);
+        tools.doGet(webDept + '/0', {}, module.deptLocation,true);
     };
 
     //挂牌项目列表
@@ -93,7 +93,7 @@ define(['jquery', "template", "Tools", "biddingApi", "paging"], function ($, tem
 
     turnThePage = function (pageNum) {
         module.data.pageNum = pageNum ;
-        tools.doGet(itemsList, {deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.itemList);
+        tools.doGet(itemsList, {deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.itemList,true);
     }
     return module;
 });
\ No newline at end of file
diff --git a/static/js/project/demand/demand.js b/static/js/project/demand/demand.js
index f7929fe..983cab2 100644
--- a/static/js/project/demand/demand.js
+++ b/static/js/project/demand/demand.js
@@ -36,7 +36,7 @@ define(['jquery', "template", "Tools", "demandApi", "paging"], function ($, temp
                 pageSize:module.data.pageSize,
                 supplyDemandType:1
             },
-            module.supplyInformation
+            module.supplyInformation,true
         );
 
         //个人需求
@@ -48,7 +48,7 @@ define(['jquery', "template", "Tools", "demandApi", "paging"], function ($, temp
                 pageSize:module.data.pageSize,
                 supplyDemandType:2
             },
-            module.demandInformation
+            module.demandInformation,true
         );
 
     };
@@ -130,7 +130,7 @@ define(['jquery', "template", "Tools", "demandApi", "paging"], function ($, temp
                     pageSize:module.data.pageSize,
                     supplyDemandType:1
                 },
-                module.supplyInformation
+                module.supplyInformation,true
             );
         }
         if(module.data.clickType == 'demand'){
@@ -143,7 +143,7 @@ define(['jquery', "template", "Tools", "demandApi", "paging"], function ($, temp
                     pageSize:module.data.pageSize,
                     supplyDemandType:2
                 },
-                module.demandInformation
+                module.demandInformation,true
             );
         }
     }
diff --git a/static/js/project/index.js b/static/js/project/index.js
index 60c7d2c..b5a4ce9 100644
--- a/static/js/project/index.js
+++ b/static/js/project/index.js
@@ -97,55 +97,55 @@ define(['jquery', "template", "Tools", "echarts", 'swiper'], function ($, templa
 
     module.init = function (page) {
         //获取焦点图信息
-        tools.doGet(websiteNew + '/1/0/4', {}, module.focusNews);
+        tools.doGet(websiteNew + '/1/0/4', {}, module.focusNews , true);
 
         //新闻资讯
-        tools.doGet(websiteNew + '/2/0/6', {}, module.NewsInformation);
+        tools.doGet(websiteNew + '/2/0/6', {}, module.NewsInformation , true);
 
         //政策法规
-        tools.doGet(websiteNew + '/3/0/6', {}, module.policiesRegulations);
+        tools.doGet(websiteNew + '/3/0/6', {}, module.policiesRegulations , true);
 
         //交易规则
-        tools.doGet(websiteNew + '/4/0/6', {}, module.tradingRules);
+        tools.doGet(websiteNew + '/4/0/6', {}, module.tradingRules , true);
 
         //资料下载
-        tools.doGet(websiteNew + '/5/0/6', {}, module.dataDownload);
+        tools.doGet(websiteNew + '/5/0/6', {}, module.dataDownload, true);
 
         //标的物所在地
-        tools.doGet(webDept + '/0', {}, module.deptLocation);
+        tools.doGet(webDept + '/0', {}, module.deptLocation , true);
 
         //标的物类型
-        tools.doGet(webDeptType+"/project_type", {}, module.deptType);
+        tools.doGet(webDeptType+"/project_type", {}, module.deptType, true);
 
         //网站配置信息（网站名称 底部联系方式 公安备案号 网站备案号）
-        tools.doGet(webConfig, {}, module.webConfigInformation);
+        tools.doGet(webConfig, {}, module.webConfigInformation, true);
 
         //底部友情链接
-        tools.doGet(friendsLinks, {}, module.bottomFriendsLinks);
+        tools.doGet(friendsLinks, {}, module.bottomFriendsLinks, true);
 
         //土地
-        tools.doGet(webListing + '/1,2,3/0/3', {}, module.landList);
+        tools.doGet(webListing + '/1,2,3/0/3', {}, module.landList, true);
 
         //集体资产
-        tools.doGet(webListing + '/4/0/3', {}, module.collectiveAssets);
+        tools.doGet(webListing + '/4/0/3', {}, module.collectiveAssets, true);
 
         //农业生产设备
-        tools.doGet(webListing + '/5/0/3', {}, module.productionEquipment);
+        tools.doGet(webListing + '/5/0/3', {}, module.productionEquipment, true);
 
         //小型水利设施
-        tools.doGet(webListing + '/6/0/3', {}, module.waterConservancyFacilities);
+        tools.doGet(webListing + '/6/0/3', {}, module.waterConservancyFacilities, true);
 
         //查询挂牌项目浏览总次数
-        tools.doGet(allViewCount + '/100', {}, module.allViewCount);
+        tools.doGet(allViewCount + '/100', {}, module.allViewCount, true);
 
         //查询挂牌项目浏览总次数
-        tools.doGet(announcementList + '/0/4', {}, module.announcementList);
+        tools.doGet(announcementList + '/0/4', {}, module.announcementList, true);
 
         //查询挂牌项目浏览总次数
-        tools.doGet(biddingHallList + '/0/10', {}, module.biddingHallList);
+        tools.doGet(biddingHallList + '/0/10', {}, module.biddingHallList, true);
 
         //查询挂牌项目浏览总次数
-        tools.doGet(attestationList + '/0/5', {}, module.attestationList);
+        tools.doGet(attestationList + '/0/5', {}, module.attestationList, true);
 
         //竞价大厅-滚动
         //module.hallRolling();
diff --git a/static/js/project/interact/interact.js b/static/js/project/interact/interact.js
index e04f2c5..8578978 100644
--- a/static/js/project/interact/interact.js
+++ b/static/js/project/interact/interact.js
@@ -22,7 +22,7 @@ define(['jquery', "template", "Tools", "interactApi", "paging"], function ($, te
     module.init = function (page) {
 
         //互动交流
-        tools.doGet(interactList, {deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.interactInformation);
+        tools.doGet(interactList, {deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.interactInformation,true);
 
 
     };
@@ -57,7 +57,7 @@ define(['jquery', "template", "Tools", "interactApi", "paging"], function ($, te
 
     turnThePage = function (pageNum) {
         module.data.pageNum = pageNum ;
-        tools.doGet(interactList, {deptId:100,pageNum:pageNum,pageSize:module.data.pageSize}, module.interactInformation);
+        tools.doGet(interactList, {deptId:100,pageNum:pageNum,pageSize:module.data.pageSize}, module.interactInformation,true);
     }
     return module;
 });
\ No newline at end of file
diff --git a/static/js/project/listingItems/items.js b/static/js/project/listingItems/items.js
index 8f78eb1..5361d69 100644
--- a/static/js/project/listingItems/items.js
+++ b/static/js/project/listingItems/items.js
@@ -13,16 +13,16 @@ define(['jquery', "template", "Tools", 'swiper', 'itemsApi'], function ($, templ
     module.init = function (page) {
 
         //项目基本信息
-        tools.doGet(outProject + '/id/'+getQueryVariable('id'), {}, module.outProjectInformation);
+        tools.doGet(outProject + '/id/'+getQueryVariable('id'), {}, module.outProjectInformation,true);
 
         //焦点图
         module.swiperBanner();
 
         //项目基本信息
-        tools.doGet(showImg + '/'+getQueryVariable('id'), {}, module.showImgInformation);
+        tools.doGet(showImg + '/'+getQueryVariable('id'), {}, module.showImgInformation,true);
 
         //挂牌项目竞价记录
-        tools.doGet(biddinglist, {projectId:getQueryVariable('id')}, module.biddinglistInformation);
+        tools.doGet(biddinglist, {projectId:getQueryVariable('id')}, module.biddinglistInformation,true);
 
     };
 
@@ -48,37 +48,37 @@ define(['jquery', "template", "Tools", 'swiper', 'itemsApi'], function ($, templ
 
 
             //挂牌价格字典
-            tools.doGet(Dictionaries+'/price_unit', {}, module.unitDictionaries);
+            tools.doGet(Dictionaries+'/price_unit', {}, module.unitDictionaries,true);
 
             //经济类型字典
-            tools.doGet(Dictionaries+'/economic_type', {}, module.economicTypeDictionaries);
+            tools.doGet(Dictionaries+'/economic_type', {}, module.economicTypeDictionaries,true);
 
             //项目类型字典
-            tools.doGet(Dictionaries+'/project_type', {}, module.projectNumberDictionaries);
+            tools.doGet(Dictionaries+'/project_type', {}, module.projectNumberDictionaries,true);
 
             //农地性质字典
-            tools.doGet(Dictionaries+'/sub_object_type', {}, module.projectTypeDictionaries);
+            tools.doGet(Dictionaries+'/sub_object_type', {}, module.projectTypeDictionaries,true);
 
             //前次转出方式
-            tools.doGet(Dictionaries+'/rollout_type', {}, module.oneoutDictionaries);
+            tools.doGet(Dictionaries+'/rollout_type', {}, module.oneoutDictionaries,true);
 
             //面积单位字典
-            tools.doGet(Dictionaries+'/area_unit', {}, module.areaDictionaries);
+            tools.doGet(Dictionaries+'/area_unit', {}, module.areaDictionaries,true);
 
             //支付方式字典
-            tools.doGet(Dictionaries+'/payment_type', {}, module.paymentTypeDictionaries);
+            tools.doGet(Dictionaries+'/payment_type', {}, module.paymentTypeDictionaries,true);
 
             //缴纳形式字典
-            tools.doGet(Dictionaries+'/deposit_payment_type', {}, module.depositPaymentTypeDictionaries);
+            tools.doGet(Dictionaries+'/deposit_payment_type', {}, module.depositPaymentTypeDictionaries,true);
 
             //交易方式字典
-            tools.doGet(Dictionaries+'/deal_type', {}, module.transactionDictionaries);
+            tools.doGet(Dictionaries+'/deal_type', {}, module.transactionDictionaries,true);
 
             //竞价方式字典
-            tools.doGet(Dictionaries+'/bidding_type', {}, module.biddingTypeDictionaries);
+            tools.doGet(Dictionaries+'/bidding_type', {}, module.biddingTypeDictionaries,true);
 
             //期满处理字典
-            tools.doGet(Dictionaries+'/expire_type', {}, module.expireTypeDictionaries);
+            tools.doGet(Dictionaries+'/expire_type', {}, module.expireTypeDictionaries,true);
 
         }
     }
diff --git a/static/js/project/listingItems/itemsList.js b/static/js/project/listingItems/itemsList.js
index bac588d..29ec012 100644
--- a/static/js/project/listingItems/itemsList.js
+++ b/static/js/project/listingItems/itemsList.js
@@ -20,13 +20,15 @@ define(['jquery', "template", "Tools", "itemsApi", "paging"], function ($, templ
             //页码集合
             pageList: [],
             //每页数量
-            pageSize: 50,
+            pageSize: 1,
             //总页数
             pageCount:0,
             //标的物集合长度
             deptSize:24,
             //标的物选中项id
-            deptId:''
+            deptId:'',
+            //标的所在地选中
+            secondDeptId:''
         },
     };
     var tools = new Tools();
@@ -34,13 +36,13 @@ define(['jquery', "template", "Tools", "itemsApi", "paging"], function ($, templ
     module.init = function (page) {
 
         //新闻资讯
-        tools.doGet(itemsList, {deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.itemList);
+        tools.doGet(itemsList, {deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.itemList, true);
 
         //标的物类型
-        tools.doGet(webDeptType+"/project_type", {}, module.deptType);
+        tools.doGet(webDeptType+"/project_type", {}, module.deptType, true);
 
         //标的物所在地
-        tools.doGet(webDept + '/0', {}, module.deptLocation);
+        tools.doGet(webDept, {deptId:''}, module.deptLocation, true);
     };
 
     //挂牌项目列表
@@ -80,6 +82,7 @@ define(['jquery', "template", "Tools", "itemsApi", "paging"], function ($, templ
             for (var i = 0 ; i < 4 ; i++){
                 content[i] = data.data[i];
             }
+            console.log(content)
             module.data.deptTypeList = content;
             var deptTypeData = template('deptTypeData', module.data);
             $("#deptTypeContent").html(deptTypeData);
@@ -89,15 +92,7 @@ define(['jquery', "template", "Tools", "itemsApi", "paging"], function ($, templ
     //标的物所在地
     module.deptLocation = function (data) {
         if (data.code == 200) {
-            var content = [] ;
-            console.log(module.data.deptSize)
-            var deptSize = module.data.deptSize;
-            if (deptSize>24){
-                deptSize = data.data.length
-            }
-            for (var i = 0 ; i < deptSize ; i++){
-                content[i] = data.data[i];
-            }
+            var content = data.data ;
             module.data.deptLocationList = content;
             var deptLocationData = template('deptLocationData', module.data);
             $("#deptLocationContent").html(deptLocationData);
@@ -126,30 +121,44 @@ define(['jquery', "template", "Tools", "itemsApi", "paging"], function ($, templ
         console.log(deptId)
         module.data.deptId = deptId;
         for (var i = 0 ; i < module.data.deptLocationList.length ; i++){
-            console.log(i)
-            document.getElementById('locInfoall'+(100+i)).className = 'auction_hall_table_tab auction_loc'
+            document.getElementById('locInfoall'+(101+i)).className = 'auction_hall_table_tab auction_loc'
         }
         document.getElementById('locInfoall'+deptId).className = 'auction_hall_table_tab auction_loc auction_hall_table_tab_select'
-        tools.doGet(webDept + '/' + deptId, {}, module.deptSecondLocation);
+        tools.doGet(webDept, {deptId:deptId}, module.deptSecondLocation, true);
+    }
+
+    secondCheck = function(id,secondDeptId){
+        document.getElementById('locInfoSecondall').className = 'auction_hall_table_tab  auction_loc'
+        for (var i = 0 ; i < module.data.deptSecondLocationList.length ; i++){
+            document.getElementById('locInfoall'+i).className = 'auction_hall_table_tab  auction_loc'
+        }
+        console.log(id)
+        if(id == '' && secondDeptId == ''){
+            document.getElementById('locInfoSecondall').className = 'auction_hall_table_tab  auction_loc auction_hall_table_tab_select'
+            module.data.secondDeptId = secondDeptId;
+        }else{
+            document.getElementById('locInfoall'+id).className = 'auction_hall_table_tab auction_loc auction_hall_table_tab_select'
+        }
+        module.data.secondDeptId = secondDeptId;
     }
 
     allDept = function (){
         module.data.deptSize = 30
         document.getElementById('allDept').innerHTML = "<i class='sanjiao-top'></i>";
         document.getElementById('allDept').onclick = upDept;
-        tools.doGet(webDept + '/0', {}, module.deptLocation);
+        tools.doGet(webDept + '/0', {}, module.deptLocation, true);
     }
 
     upDept = function (){
         module.data.deptSize = 24
         document.getElementById('allDept').innerHTML = "<i class='sanjiao-bottom'></i>";
         document.getElementById('allDept').onclick = allDept;
-        tools.doGet(webDept + '/0', {}, module.deptLocation);
+        tools.doGet(webDept + '/0', {}, module.deptLocation, true);
     }
 
     turnThePage = function (pageNum) {
         module.data.pageNum = pageNum ;
-        tools.doGet(itemsList, {deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.itemList);
+        tools.doGet(itemsList, {deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.itemList, true);
     }
     return module;
 });
\ No newline at end of file
diff --git a/static/js/project/new/new.js b/static/js/project/new/new.js
index 2bc0cda..5764804 100644
--- a/static/js/project/new/new.js
+++ b/static/js/project/new/new.js
@@ -22,7 +22,7 @@ define(['jquery', "template", "Tools", "newApi", "paging"], function ($, templat
     module.init = function (page) {
 
         //新闻资讯
-        tools.doGet(newList, {number:2,deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.NewsInformation);
+        tools.doGet(newList, {number:2,deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.NewsInformation,true);
 
 
     };
@@ -56,7 +56,7 @@ define(['jquery', "template", "Tools", "newApi", "paging"], function ($, templat
 
     turnThePage = function (pageNum) {
         module.data.pageNum = pageNum ;
-        tools.doGet(newList, {number:2,deptId:100,pageNum:pageNum,pageSize:module.data.pageSize}, module.NewsInformation);
+        tools.doGet(newList, {number:2,deptId:100,pageNum:pageNum,pageSize:module.data.pageSize}, module.NewsInformation,true);
     }
     return module;
 });
\ No newline at end of file
diff --git a/static/js/project/new/newDetail.js b/static/js/project/new/newDetail.js
index 9ad24f8..04a7fe1 100644
--- a/static/js/project/new/newDetail.js
+++ b/static/js/project/new/newDetail.js
@@ -14,7 +14,7 @@ define(['jquery', "template", "Tools", "newApi"], function ($, template, Tools )
 
         console.log(getQueryVariable('id'))
         //新闻资讯
-        tools.doGet(newDetail + '/'+getQueryVariable('id'), {}, module.NewsInformation);
+        tools.doGet(newDetail + '/'+getQueryVariable('id'), {}, module.NewsInformation,true);
 
     };
 
diff --git a/static/js/project/policy/policy.js b/static/js/project/policy/policy.js
index 97e3f3b..dc9c6fe 100644
--- a/static/js/project/policy/policy.js
+++ b/static/js/project/policy/policy.js
@@ -26,13 +26,13 @@ define(['jquery', "template", "Tools", "policyApi", "paging"], function ($, temp
     module.init = function (page) {
 
         //政策法规
-        tools.doGet(newList, {number:3,deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.policyInformation);
+        tools.doGet(newList, {number:3,deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.policyInformation,true);
 
         //交易规则
-        tools.doGet(newList, {number:4,deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.ruleInformation);
+        tools.doGet(newList, {number:4,deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.ruleInformation,true);
 
         //资料下载
-        tools.doGet(newList, {number:5,deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.downloadInformation);
+        tools.doGet(newList, {number:5,deptId:100,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.downloadInformation,true);
 
 
     };
@@ -142,13 +142,13 @@ define(['jquery', "template", "Tools", "policyApi", "paging"], function ($, temp
     turnThePage = function (pageNum) {
         module.data.pageNum = pageNum ;
         if(module.data.clickType == 'policy'){
-            tools.doGet(newList, {number:3,deptId:100,pageNum:pageNum,pageSize:module.data.pageSize}, module.policyInformation);
+            tools.doGet(newList, {number:3,deptId:100,pageNum:pageNum,pageSize:module.data.pageSize}, module.policyInformation,true);
         }
         if(module.data.clickType == 'rule'){
-            tools.doGet(newList, {number:4,deptId:100,pageNum:pageNum,pageSize:module.data.pageSize}, module.ruleInformation);
+            tools.doGet(newList, {number:4,deptId:100,pageNum:pageNum,pageSize:module.data.pageSize}, module.ruleInformation,true);
         }
         if(module.data.clickType == 'download'){
-            tools.doGet(newList, {number:5,deptId:100,pageNum:pageNum,pageSize:module.data.pageSize}, module.downloadInformation);
+            tools.doGet(newList, {number:5,deptId:100,pageNum:pageNum,pageSize:module.data.pageSize}, module.downloadInformation,true);
         }
     }
     return module;
diff --git a/static/js/project/user/index.js b/static/js/project/user/index.js
index ea04af8..cf3d5fe 100644
--- a/static/js/project/user/index.js
+++ b/static/js/project/user/index.js
@@ -1,17 +1,40 @@
 /**
  * Created by Administrator on 2021/4/5.
  */
-define(['jquery', "template", "Tools", "echarts", 'swiper'], function ($, template, Tools, echarts, swiper) {
+define(['jquery', "template", "Tools", "user", "paging"], function ($, template, Tools) {
     //数据存储
     var module = {
         data: {
+            userInformationDetail:[],
+            userSupplyInformationList:'',
+            consultingInformationList:'',
+            biddingInformationList:'',
+            //页码
+            pageNum: 1,
+            //页码集合
+            pageList: [],
+            //每页数量
+            pageSize: 1,
+            //总页数
+            pageCount:0,
+            //用户ID
+            memberId:0,
+            //用户资料form
+            form:{
 
+            }
         },
     };
     var tools = new Tools();
 
     module.init = function (page) {
 
+        //用户资料
+        tools.doGet(userData, {}, module.userData);
+
+        //用户资料
+        //tools.doPut(userData, {id:}, module.userData,true);
+
         //用户资料鼠标悬浮
         module.userHover();
 
@@ -19,6 +42,204 @@ define(['jquery', "template", "Tools", "echarts", 'swiper'], function ($, templa
         module.userListHover();
     };
 
+    //个人中心用户信息
+    module.userData = function(data){
+        if (data.code == 200) {
+            var content = data.user;
+            console.log(content)
+            tools.doGet(userMember+'/'+content.userId, {}, module.userMember);//memberType 1个人 2单位
+        }
+    }
+
+    //个人中心用户资料
+    module.userMember = function(data){
+        if (data.code == 200) {
+            var content = data.data;
+            console.log(data)
+            module.data.userInformationDetail = content;
+            module.data.memberType = content.memberType;
+            if(content.memberType == '1'){
+                document.getElementById('companyInformationContent').style.display = 'none';
+                document.getElementById('userInformationContent').style.display = 'block';
+                var userInformationData = template('userInformationData', module.data);
+                $("#userInformationContent").html(userInformationData);
+            }else{
+                document.getElementById('companyInformationContent').style.display = 'block';
+                document.getElementById('userInformationContent').style.display = 'none';
+                var companyInformationData = template('companyInformationData', module.data);
+                $("#companyInformationContent").html(companyInformationData);
+            }
+            document.getElementById('bankAddress').value = content.bankAddress;
+            document.getElementById('bankCardName').value = content.bankCardName;
+            document.getElementById('bankCardNum').value = content.bankCardNum;
+            document.getElementById('phone').innerHTML = content.phone;
+            module.data.memberId = content.id;
+            console.log(content.memberType)
+
+            //我的供求
+            tools.doGet(userSupply, {memberId:content.id,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.userSupply);
+            //我的咨询
+            tools.doGet(userConsulting, {memberId:content.id,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.consulting);
+            //我的竞价
+            tools.doGet(userBidding, {memberId:content.id,pageNum:module.data.pageNum,pageSize:module.data.pageSize}, module.bidding);
+        }
+    }
+
+    //个人中心我的供求
+    module.userSupply = function(data){
+        console.log(data)
+        if (data.code == 200) {
+            var content = data.rows;
+            console.log(data)
+            var pageCount = (data.total/module.data.pageSize).toFixed(0);
+            if (pageCount < 1){
+                pageCount = 1;
+            }
+            if(module.data.userSupplyInformationList == '') {
+                // 初始化 分页器
+                var page_s1 = createPage('.page_s1');
+                // 设置分页
+                setPage(page_s1, {
+                    pageTotal: data.total, // 数据总条数
+                    pageSize: module.data.pageSize,    // 每页显示条数
+                    pageCurrent: 1,  //  当前页
+                    maxBtnNum: 5,   // 最多按钮个数  （最少5个）
+                })
+                $('#page_s1').html('共' + pageCount + '页')
+            }
+            module.data.userSupplyInformationList = content;
+            var userSupplyInformationData = template('userSupplyInformationData', module.data);
+            $("#userSupplyInformationContent").html(userSupplyInformationData);
+        }
+    }
+
+    //个人中心我的咨询
+    module.consulting = function(data){
+        if (data.code == 200) {
+            var content = data.rows;
+            var pageCount = (data.total/module.data.pageSize).toFixed(0);
+            if (pageCount < 1){
+                pageCount = 1;
+            }
+            if(module.data.consultingInformationList == '') {
+                // 初始化 分页器
+                var page_s1 = createPage('.page_s2');
+                // 设置分页
+                setPage(page_s1, {
+                    pageTotal: data.total, // 数据总条数
+                    pageSize: module.data.pageSize,    // 每页显示条数
+                    pageCurrent: 1,  //  当前页
+                    maxBtnNum: 5,   // 最多按钮个数  （最少5个）
+                })
+            }
+            module.data.consultingInformationList = content;
+            $('#page_s2').html('共'+pageCount+'页')
+            var consultingInformationData = template('consultingInformationData', module.data);
+            $("#consultingInformationContent").html(consultingInformationData);
+        }
+    }
+
+    //个人中心我的竞价
+    module.bidding = function(data){
+        if (data.code == 200) {
+            var content = data.rows;
+            console.log(content)
+            var pageCount = (data.total/module.data.pageSize).toFixed(0);
+            if (pageCount < 1){
+                pageCount = 1;
+            }
+            if(module.data.biddingInformationList == '') {
+                // 初始化 分页器
+                var page_s1=createPage('.page_s3');
+                // 设置分页
+                setPage(page_s1, {
+                    pageTotal: data.total, // 数据总条数
+                    pageSize: module.data.pageSize,    // 每页显示条数
+                    pageCurrent: 1,  //  当前页
+                    maxBtnNum: 5,   // 最多按钮个数  （最少5个）
+                })
+                $('#page_s3').html('共' + pageCount + '页')
+            }
+            module.data.biddingInformationList = content;
+            var biddingInformationData = template('biddingInformationData', module.data);
+            $("#biddingInformationContent").html(biddingInformationData);
+        }
+    }
+
+    tabCheck = function(type){
+        document.getElementById('user').className = '';
+        document.getElementById('bank').className = '';
+        document.getElementById(type).className = 'active';
+
+        console.log(type)
+        document.getElementById('userInformationContent').style.display = 'none';
+        document.getElementById('companyInformationContent').style.display = 'none';
+        document.getElementById('bankInformationContent').style.display = 'none';
+        document.getElementById('phoneInformationContent').style.display = 'none';
+        if (module.data.memberType == '2' && type == 'user'){
+            document.getElementById('companyInformationContent').style.display = 'block';
+        }else if (module.data.memberType == '1' && type == 'user'){
+            document.getElementById('userInformationContent').style.display = 'block';
+        }else{
+            document.getElementById(type+'InformationContent').style.display = 'block';
+        }
+
+    }
+
+    phoneUpdate = function(type){
+        document.getElementById(type+'InformationContent').style.display = 'none';
+        document.getElementById('phoneInformationContent').style.display = 'block';
+    }
+
+    tabLeftCheck = function(type){
+        for (var i = 1 ; i < 5 ; i++){
+            document.getElementById('icon-list'+i).className = '';
+        }
+        document.getElementById(type).className = 'active';
+        document.getElementById('userInformation').style.display = 'none';
+        document.getElementById('supplyInformation').style.display = 'none';
+        document.getElementById('consultingInformation').style.display = 'none';
+        document.getElementById('biddingInformation').style.display = 'none';
+        if(type == 'icon-list1'){
+            document.getElementById('userInformation').style.display = 'block';
+        }
+        if(type == 'icon-list2'){
+            document.getElementById('supplyInformation').style.display = 'block';
+            module.data.clickType = 'supply';
+        }
+        if(type == 'icon-list3'){
+            document.getElementById('consultingInformation').style.display = 'block';
+            module.data.clickType = 'consulting';
+        }
+        if(type == 'icon-list4'){
+            document.getElementById('biddingInformation').style.display = 'block';
+            module.data.clickType = 'bidding';
+        }
+        module.data.pageNum = 1 ;
+    }
+
+    //翻页
+    turnThePage = function (pageNum) {
+        module.data.pageNum = pageNum ;
+        if(module.data.clickType == 'supply'){
+            tools.doGet(userSupply, {memberId:module.data.memberId,pageNum:pageNum,pageSize:module.data.pageSize}, module.userSupply);
+        }
+        if(module.data.clickType == 'consulting'){
+            tools.doGet(userConsulting, {memberId:module.data.memberId,pageNum:pageNum,pageSize:module.data.pageSize}, module.consulting);
+        }
+        if(module.data.clickType == 'bidding'){
+            tools.doGet(userBidding, {memberId:module.data.memberId,pageNum:pageNum,pageSize:module.data.pageSize}, module.bidding);
+        }
+    }
+
+    //个人用户资料修改
+    formAction = function (name,value){
+        console.log(name+'-------'+value)
+        return;
+        module.data.form.name = value ;
+        console.log(module.data.form)
+    }
+
     //个人中心选项卡鼠标悬浮
     module.userListHover = function(){
         document.getElementById('icon-list1').onmouseout = function(){
diff --git a/view/listingItems/itemsList.html b/view/listingItems/itemsList.html
index fed9f9c..d7026ee 100644
--- a/view/listingItems/itemsList.html
+++ b/view/listingItems/itemsList.html
@@ -78,7 +78,7 @@
                             <script id="deptTypeData" type="text/html">
                                 <div class="auction_hall_table_tab auction_hall_table_tab_select" id="standardTypeAll">全部</div>
                                 {{each deptTypeList as value i}}
-                                    <div class="auction_hall_table_tab" id="standardType">{{value.dictLabel}}</div>
+                                    <div class="auction_hall_table_tab" id="standardType" onclick="typeCheck()">{{value.dictLabel}}</div>
                                 {{/each}}
                             </script>
                             <div class="auction_all_one2" id="deptTypeContent"></div>
@@ -99,13 +99,12 @@
                                 <div class="clear"></div>
                             </script>
                             <div class="auction_all_one" id="deptLocationContent"></div>
-                            <div class="clickBtm" onclick="allDept()" id="allDept"><i id="sanjiao" class="sanjiao-bottom"></i></div>
                             <!-- 市 -->
                             <div class="auction_add_area auction_add_area_one" id="secondDept" style="display: none;">
                                 <script id="deptSecondLocationData" type="text/html">
-                                    <div class="auction_hall_table_tab auction_hall_table_tab_select">全部</div>
+                                    <div class="auction_hall_table_tab auction_hall_table_tab_select" id="locInfoSecondall" onclick="secondCheck('','')">全部</div>
                                     {{each deptSecondLocationList as value i}}
-                                    <div class="auction_hall_table_tab  auction_loc">{{value.deptName}}</div>
+                                        <div class="auction_hall_table_tab  auction_loc" id="locInfoall{{i}}" onclick="secondCheck({{i}},{{value.deptId}})">{{value.deptName}}</div>
                                     {{/each}}
                                     <div class="clear"></div>
                                 </script>
diff --git a/view/login/login.html b/view/login/login.html
index 125eca8..20db935 100644
--- a/view/login/login.html
+++ b/view/login/login.html
@@ -27,7 +27,7 @@
             <div class="fr">
                 <img src="../../static/images/user_tips.png" class="block fl m-r-10" style="margin-top: 21px" alt=""/>
                 <img src="../../static/images/member.png" class="block fl m-r-10" style="margin-top: 21px" alt=""/>
-                <p class="fl userName" id="userName">Sherry</p>
+                <p class="fl userName" id="userName2">Sherry</p>
                 <div class="clear"></div>
             </div>
             <div class="headHover" id="headHover" style="display: none;">
@@ -82,16 +82,16 @@
                 <table id="loginTab" style="display: block;">
                     <tr>
                         <td width="25%">手机号码</td>
-                        <td colspan="2"><input type="text" placeholder="请输入手机号"/></td>
+                        <td colspan="2"><input type="text" id="username" placeholder="请输入手机号"/></td>
                     </tr>
                     <tr>
                         <td>密<i style="margin-left: 2em;"></i>码</td>
-                        <td colspan="2"><input type="password" placeholder="请输入密码"/></td>
+                        <td colspan="2"><input type="password" id="password" placeholder="请输入密码"/></td>
                     </tr>
                     <tr>
                         <td>图形验证</td>
-                        <td width="40%"><input type="text" placeholder="请输入验证码"/></td>
-                        <td><img src="../../static/images/banner.jpg" alt=""/></td>
+                        <td width="40%"><input type="text" id="code" placeholder="请输入验证码"/></td>
+                        <td><img id="graphicImg" alt=""/></td>
                     </tr>
                 </table>
                 <table id="phoneTab" style="display: none;">
@@ -113,7 +113,7 @@
                 <div class="remberPsw">
                     <input type="checkbox"/>记住密码
                 </div>
-                <input type="button" value="登录" class="loginBtn"/>
+                <input type="button" value="登录" id="login-submit" class="loginBtn"/>
                 <input type="button" value="注册" class="registerBtn"/>
             </div>
         </div>
diff --git a/view/user/user.html b/view/user/user.html
index f7f6328..e5b626c 100644
--- a/view/user/user.html
+++ b/view/user/user.html
@@ -4,7 +4,7 @@
 
 <head>
     <meta charset="utf-8">
-    <title>农燊高科-新闻列表</title>
+    <title>农燊高科-个人中心</title>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="keywords" content="" />
@@ -13,6 +13,7 @@
     <link href="../../static/css/index.css" rel="stylesheet" type="text/css" />
     <link href="../../static/css/user/user.css" rel="stylesheet" type="text/css" />
     <link href="../../static/css/interact/interact.css" rel="stylesheet" type="text/css" />
+    <link href="../../static/css/page_common.css" rel="stylesheet" type="text/css" />
 </head>
 
 <body>
@@ -108,22 +109,22 @@
     <div class="w-1200 m-t-20">
         <div class="leftList fl">
             <ul>
-                <li class="active" id="icon-list1">
+                <li class="active" id="icon-list1" onclick="tabLeftCheck('icon-list1')">
                     <img src="../../static/images/user_index_icon1.png" id="icon1" alt="" class="fl"/>
                     <p class="fl">我的资料</p>
                     <div class="clear"></div>
                 </li>
-                <li id="icon-list2">
+                <li id="icon-list2" onclick="tabLeftCheck('icon-list2')">
                     <img src="../../static/images/user_index_icon2.png" id="icon2" alt="" class="fl"/>
                     <p class="fl">我的供求</p>
                     <div class="clear"></div>
                 </li>
-                <li id="icon-list3">
+                <li id="icon-list3" onclick="tabLeftCheck('icon-list3')">
                     <img src="../../static/images/user_index_icon3.png" id="icon3" alt="" class="fl"/>
                     <p class="fl">我的咨询</p>
                     <div class="clear"></div>
                 </li>
-                <li id="icon-list4">
+                <li id="icon-list4" onclick="tabLeftCheck('icon-list4')">
                     <img src="../../static/images/user_index_icon4.png" id="icon4" alt="" class="fl"/>
                     <p class="fl">我的竞价</p>
                     <div class="clear"></div>
@@ -131,129 +132,128 @@
             </ul>
         </div>
 
-        <!--  我的资料 — 公司      -->
-        <div class="fl userTable" style="display: none;">
-            <input type="button" value="用户资料"/>
-            <input type="button" value="银行账户信息"/>
-            <table width="100%">
+        <!--  我的资料 — 个人 — 公司     -->
+        <div class="fl userTable" id="userInformation">
+            <input type="button" id="user" onclick="tabCheck('user')" class="active" value="用户资料"/>
+            <input type="button" id="bank" onclick="tabCheck('bank')" value="银行账户信息"/>
+
+            <script id="userInformationData" type="text/html">
+                <tr>
+                    <td style="border: none;"><span>*</span>手机号码:</td>
+                    <td style="border: none;"><p class="m-l-10 m-r-10 fl">{{userInformationDetail.phone}}</p><span onclick="phoneUpdate('user')">修改手机号</span></td>
+                </tr>
                 <tr>
-                    <td><span>*</span>手机号码:</td>
-                    <td><p class="m-l-10 m-r-10 fl">15314031621</p><span>修改手机号</span></td>
                     <td><span>*</span>密码:</td>
-                    <td><input type="text"/></td>
+                    <td><input type="text" value="" class="p-l-10" style="width: 30%"/></td>
                 </tr>
                 <tr>
-                    <td><span>*</span>负责人姓名:</td>
-                    <td><input type="text"/></td>
-                    <td>社会信用代码:</td>
-                    <td><input type="text"/></td>
+                    <td style="border-bottom: 1px solid #e3e3e3;height: 0;padding: 0;"></td>
+                    <td style="border-bottom: 1px solid #e3e3e3;height: 0;padding: 0;"></td>
                 </tr>
                 <tr>
-                    <td>企业性质:</td>
-                    <td><input type="text"/></td>
-                    <td>经营范围:</td>
-                    <td><input type="text"/></td>
+                    <td><span>*</span>姓名:</td>
+                    <td><input type="text" value="{{userInformationDetail.realname}}" class="p-l-10" style="width: 30%"/></td>
                 </tr>
                 <tr>
-                    <td>经营期限:</td>
-                    <td><input type="text"/></td>
-                    <td>成立时间:</td>
-                    <td><input type="text"/></td>
+                    <td><span>*</span>身份证号码:</td>
+                    <td><input type="text" value="{{userInformationDetail.idCardNum}}" class="p-l-10" style="width: 30%"/></td>
                 </tr>
                 <tr>
-                    <td>注册资金:</td>
-                    <td><input type="text"/></td>
-                    <td>营业执照号:</td>
-                    <td><input type="text"/></td>
+                    <td>联系住址:</td>
+                    <td><input type="text" value="{{userInformationDetail.address}}" class="p-l-10" style="width: 30%"/></td>
                 </tr>
                 <tr>
-                    <td>联系地址:</td>
-                    <td><input type="text"/></td>
                     <td>上传相关附件:</td>
-                    <td><img src="../../static/images/upload.png" alt="" class="m-l-10"/></td>
+                    <td>
+                        <img src="../../static/images/upload.png" alt="" class="m-l-10"/><br/>
+                        <span>*身份证照片、本人和身份证的合影</span>
+                    </td>
                 </tr>
                 <tr>
                     <td></td>
-                    <td><input type="button" value="保存"/></td>
+                    <td><input type="button" value="保存" style="width: 30%"/></td>
                 </tr>
-            </table>
-        </div>
+            </script>
+            <table width="100%" id="userInformationContent"></table>
 
-        <!--  我的资料 — 个人      -->
-        <div class="fl userTable">
-            <input type="button" value="用户资料"/>
-            <input type="button" value="银行账户信息"/>
-            <table width="100%">
+            <script id="companyInformationData" type="text/html">
                 <tr>
-                    <td style="border: none;"><span>*</span>手机号码:</td>
-                    <td style="border: none;"><p class="m-l-10 m-r-10 fl">15314031621</p><span>修改手机号</span></td>
+                    <td><span>*</span>手机号码:</td>
+                    <td><p class="m-l-10 m-r-10 fl">{{userInformationDetail.phone}}</p><span onclick="phoneUpdate('company')">修改手机号</span></td>
+                    <td><span>*</span>密码:</td>
+                    <td><input type="text"/></td>
                 </tr>
                 <tr>
-                    <td><span>*</span>密码:</td>
-                    <td><input type="text" style="width: 30%"/></td>
+                    <td><span>*</span>公司名称:</td>
+                    <td><input type="text" value="{{userInformationDetail.companyName}}" onchange="formAction('companyName')"/></td>
+                    <td><span>*</span>身份证号:</td>
+                    <td><input type="text" value="{{userInformationDetail.idCardNum}}" onchange="formAction('idCardNum')"/></td>
                 </tr>
                 <tr>
-                    <td style="border-bottom: 1px solid #e3e3e3;height: 0;padding: 0;"></td>
-                    <td style="border-bottom: 1px solid #e3e3e3;height: 0;padding: 0;"></td>
+                    <td><span>*</span>负责人姓名:</td>
+                    <td><input type="text" value="{{userInformationDetail.realname}}"/></td>
+                    <td>社会信用代码:</td>
+                    <td><input type="text" value="{{userInformationDetail.companyCode}}"/></td>
                 </tr>
                 <tr>
-                    <td><span>*</span>姓名:</td>
-                    <td><input type="text" style="width: 30%"/></td>
+                    <td>企业性质:</td>
+                    <td><input type="text" value="{{userInformationDetail.companyNature}}"/></td>
+                    <td>经营范围:</td>
+                    <td><input type="text" value="{{userInformationDetail.companyScope}}"/></td>
                 </tr>
                 <tr>
-                    <td><span>*</span>身份证号码:</td>
-                    <td><input type="text" style="width: 30%"/></td>
+                    <td>经营期限:</td>
+                    <td><input type="text" value="{{userInformationDetail.companyTimeLimit}}"/></td>
+                    <td>成立时间:</td>
+                    <td><input type="text" value="{{userInformationDetail.companySetupTime}}"/></td>
                 </tr>
                 <tr>
-                    <td>联系住址:</td>
-                    <td><input type="text" style="width: 30%"/></td>
+                    <td>注册资金:</td>
+                    <td><input type="text" value="{{userInformationDetail.companyCapital}}"/></td>
+                    <td>营业执照号:</td>
+                    <td><input type="text" value="{{userInformationDetail.companyLicense}}"/></td>
                 </tr>
                 <tr>
-                    <td>上传相关附件:</td>
+                    <td>联系地址:</td>
+                    <td><input type="text" value="{{userInformationDetail.companyLicense}}"/></td>
+                    <td><span>*</span>上传相关附件:</td>
                     <td>
-                        <img src="../../static/images/upload.png" alt="" class="m-l-10"/><br/>
-                        <span>*身份证照片、本人和身份证的合影</span>
+                        <img src="../../static/images/upload.png" alt="" class="m-l-10"/>
                     </td>
                 </tr>
                 <tr>
                     <td></td>
-                    <td><input type="button" value="保存" style="width: 30%"/></td>
+                    <td><input type="button" value="保存"/></td>
                 </tr>
-            </table>
-        </div>
+            </script>
+            <table width="100%" id="companyInformationContent"></table>
 
-        <!--  我的资料 — 银行账户信息      -->
-        <div class="fl userTable" style="display: none;">
-            <input type="button" value="用户资料"/>
-            <input type="button" value="银行账户信息"/>
-            <table width="100%">
+            <!--  我的资料 — 银行账户信息      -->
+            <table width="100%" id="bankInformationContent" style="display: none;">
                 <tr>
                     <td style="border: none;"><span>*</span>开户银行:</td>
-                    <td style="border: none;"><input type="text" style="width: 30%"/></td>
+                    <td style="border: none;"><input type="text" id="bankAddress" class="p-l-10" style="width: 30%"/></td>
                 </tr>
                 <tr>
                     <td><span>*</span>开户姓名:</td>
-                    <td><input type="text" style="width: 30%"/></td>
+                    <td><input type="text" id="bankCardName" class="p-l-10" style="width: 30%"/></td>
                 </tr>
                 <tr>
                     <td><span>*</span>开户账号:</td>
-                    <td><input type="text" style="width: 30%"/></td>
+                    <td><input type="text" id="bankCardNum" class="p-l-10" style="width: 30%"/></td>
                 </tr>
                 <tr>
                     <td></td>
                     <td><input type="button" value="保存" style="width: 30%"/></td>
                 </tr>
             </table>
-        </div>
 
-        <!--  我的资料 — 更换手机号      -->
-        <div class="fl userTable" style="display: none;">
-            <input type="button" value="用户资料"/>
-            <input type="button" value="银行账户信息"/>
-            <table width="100%">
+
+            <!--  我的资料 — 更换手机号      -->
+            <table width="100%" id="phoneInformationContent" style="display: none;">
                 <tr>
                     <td style="border: none;"><span>*</span>当前号码:</td>
-                    <td style="border: none;"><p class="m-l-10">15314031621</p></td>
+                    <td style="border: none;"><p class="m-l-10" id="phone">15314031621</p></td>
                 </tr>
                 <tr>
                     <td><span>*</span>新手机号:</td>
@@ -261,7 +261,7 @@
                 </tr>
                 <tr>
                     <td><span>*</span>验证码:</td>
-                    <td><input type="text" style="width: 30%" class="fl"/><p class="m-l-10 fl" style="line-height: 36px;">免费获取短信动态码</p></td>
+                    <td><input type="text" style="width: 30%" class="fl"/><p class="m-l-10 fl" style="line-height: 36px;color:#007b76;cursor: pointer;">免费获取短信动态码</p></td>
                 </tr>
                 <tr>
                     <td></td>
@@ -271,10 +271,10 @@
         </div>
 
         <!--  我的供求     -->
-        <div class="fl supplyTable" style="display: none;">
+        <div class="fl supplyTable" id="supplyInformation" style="display: none;">
             <input type="button" value="发布供求"/>
             <div class="clear"></div>
-            <table width="100%" cellspacing="0" cellpadding="0">
+            <script id="userSupplyInformationData" type="text/html">
                 <tr>
                     <td>序号</td>
                     <td>供/求</td>
@@ -284,13 +284,20 @@
                     <td>是否审核</td>
                     <td>操作</td>
                 </tr>
+                {{each userSupplyInformationList as value i}}
                 <tr>
-                    <td>1</td>
+                    <td>{{i+1}}</td>
                     <td>供</td>
-                    <td>出租济南市莱芜区方下街道龙口东村229亩土地经营权</td>
-                    <td>2021-03-02</td>
-                    <td>15563425122</td>
-                    <td>是</td>
+                    <td width="400">{{value.projectName}}</td>
+                    <td>{{value.logintime}}</td>
+                    <td>{{value.phone}}</td>
+                    <td>
+                        {{if value.phone == Y}}
+                            是
+                        {{else}}
+                            否
+                        {{/if}}
+                    </td>
                     <td>
                         <div class="fl">
                             <img src="../../static/images/modify.png" alt="" class="fl"/>
@@ -305,27 +312,14 @@
                         <div class="clear"></div>
                     </td>
                 </tr>
-                <tr>
-                    <td>2</td>
-                    <td>供</td>
-                    <td>出租济南市莱芜区方下街道龙口东村229亩土地经营权</td>
-                    <td>2021-03-02</td>
-                    <td>15563425122</td>
-                    <td>是</td>
-                    <td></td>
-                </tr>
-            </table>
-            <ul class="pageNum">
-                <li class="active">1</li>
-                <li>2</li>
-                <li>3</li>
-                <li>4</li>
-                <li>5</li>
-                <p>...</p>
-                <li>10</li>
-                <p> >> </p>
-                <p>共10页</p>
-            </ul>
+                {{/each}}
+            </script>
+            <table width="100%" cellspacing="0" cellpadding="0" id="userSupplyInformationContent"></table>
+
+            <div class="pageNum" id="supplyNum">
+                <div style="display: inline-block;margin: 0 auto;" class="page_s1"></div>
+                <p style="display: inline-block;margin: 0 auto;" id="page_s1"></p>
+            </div>
         </div>
 
         <!--  我的供求 - 发布     -->
@@ -371,7 +365,7 @@
         </div>
 
         <!--  我的咨询     -->
-        <div class="fl releaseSupply" style="display: none;">
+        <div class="fl releaseSupply" id="consultingInformation" style="display: none;">
             <div class="searchCriteria" style="padding-top: 0;">
                 <p class="fl m-r-5">标题:</p>
                 <input type="text" class="fl m-r-25"/>
@@ -382,60 +376,31 @@
                 <div class="clear"></div>
             </div>
             <div class="interactList">
-                <ul>
+                <script id="consultingInformationData" type="text/html">
+                    {{each consultingInformationList as value i}}
                     <li>
                         <div class="m-b-20">
                             <img src="../../static/images/questions.png" alt="" class="fl m-r-20"/>
-                            <p class="fl">1. 没拍到钱怎么退回？</p>
-                            <p class="fr">03-11 15:02</p>
+                            <p class="fl wid80">{{i+1}}. {{value.content}}</p>
+                            <p class="fr">{{value.logintime}}</p>
                             <div class="clear"></div>
                         </div>
                         <div>
                             <img src="../../static/images/answer.png" alt="" class="fl m-r-20"/>
-                            <p class="fl">
-                                如果报名后未出价或者未竞价成功，保证金会在拍卖结束后的24小时内解冻。<br/>
-                                钱款需要退回银行卡方法如下：<br/>
-                                通过银行专用款项交保，请在支付宝app搜索“银行专用款项”，点击转出自行提现，无需手续费；<br/>
-                                通过网银交保，保证金会在1-3个工作日内自动退回您的银行卡；<br/>
-                                通过余额宝交保，请在支付宝app找到余额宝，点击转出；<br/>
-                                通过余额交保，如果钱款是通过银行卡充值到余额的，请在自充值之日起30天内点击“免费退回”申请免手续费退回银行卡。<br/>
-                            </p>
+                            <p class="fl wid80">{{value.reply}}</p>
+                            <p class="fr">{{value.replyTime}}</p>
                             <div class="clear"></div>
                         </div>
                     </li>
-                    <li>
-                        <div class="m-b-20">
-                            <img src="../../static/images/questions.png" alt="" class="fl m-r-20"/>
-                            <p class="fl">1. 没拍到钱怎么退回？</p>
-                            <p class="fr">03-11 15:02</p>
-                            <div class="clear"></div>
-                        </div>
-                        <div>
-                            <img src="../../static/images/answer.png" alt="" class="fl m-r-20"/>
-                            <p class="fl">
-                                如果报名后未出价或者未竞价成功，保证金会在拍卖结束后的24小时内解冻。<br/>
-                                钱款需要退回银行卡方法如下：<br/>
-                                通过银行专用款项交保，请在支付宝app搜索“银行专用款项”，点击转出自行提现，无需手续费；<br/>
-                                通过网银交保，保证金会在1-3个工作日内自动退回您的银行卡；<br/>
-                                通过余额宝交保，请在支付宝app找到余额宝，点击转出；<br/>
-                                通过余额交保，如果钱款是通过银行卡充值到余额的，请在自充值之日起30天内点击“免费退回”申请免手续费退回银行卡。<br/>
-                            </p>
-                            <div class="clear"></div>
-                        </div>
-                    </li>
-                </ul>
+                    {{/each}}
+                </script>
+                <ul id="consultingInformationContent"></ul>
+            </div>
+
+            <div class="pageNum" id="consultingNum">
+                <div style="display: inline-block;margin: 0 auto;" class="page_s2"></div>
+                <p style="display: inline-block;margin: 0 auto;" id="page_s2"></p>
             </div>
-            <ul class="pageNum">
-                <li class="active">1</li>
-                <li>2</li>
-                <li>3</li>
-                <li>4</li>
-                <li>5</li>
-                <p>...</p>
-                <li>10</li>
-                <p> >> </p>
-                <p>共10页</p>
-            </ul>
         </div>
 
         <!--  我的咨询 - 发布     -->
@@ -468,8 +433,8 @@
         </div>
 
         <!--  我的竞价     -->
-        <div class="fl supplyTable" style="display: none;">
-            <table width="100%" cellspacing="0" cellpadding="0">
+        <div class="fl supplyTable" id="biddingInformation" style="display: none;">
+            <script id="biddingInformationData" type="text/html">
                 <tr>
                     <td>序号</td>
                     <td>项目编号</td>
@@ -480,40 +445,27 @@
                     <td>项目状态</td>
                     <td>操作</td>
                 </tr>
-                <tr>
-                    <td>1</td>
-                    <td>供</td>
-                    <td>出租济南市莱芜区方下街道龙口东村229亩土地经营权</td>
-                    <td>2021-03-02</td>
-                    <td>15563425122</td>
-                    <td>是</td>
-                    <td>进行中</td>
-                    <td>
-                        <input type="button" value="我要竞价" class="iWanna"/>
-                    </td>
-                </tr>
-                <tr>
-                    <td>2</td>
-                    <td>供</td>
-                    <td>出租济南市莱芜区方下街道龙口东村229亩土地经营权</td>
-                    <td>2021-03-02</td>
-                    <td>15563425122</td>
-                    <td>是</td>
-                    <td>进行中</td>
-                    <td></td>
-                </tr>
-            </table>
-            <ul class="pageNum">
-                <li class="active">1</li>
-                <li>2</li>
-                <li>3</li>
-                <li>4</li>
-                <li>5</li>
-                <p>...</p>
-                <li>10</li>
-                <p> >> </p>
-                <p>共10页</p>
-            </ul>
+                {{each biddingInformationList as value i}}
+                    <tr>
+                        <td>1</td>
+                        <td>供</td>
+                        <td>出租济南市莱芜区方下街道龙口东村229亩土地经营权</td>
+                        <td>2021-03-02</td>
+                        <td>15563425122</td>
+                        <td>是</td>
+                        <td>进行中</td>
+                        <td>
+                            <input type="button" value="我要竞价" class="iWanna"/>
+                        </td>
+                    </tr>
+                {{/each}}
+            </script>
+            <table width="100%" cellspacing="0" cellpadding="0" id="biddingInformationContent"></table>
+
+            <div class="pageNum" id="biddingNum">
+                <div style="display: inline-block;margin: 0 auto;" class="page_s3"></div>
+                <p style="display: inline-block;margin: 0 auto;" id="page_s3"></p>
+            </div>
         </div>
 
         <div class="clear"></div>