* @fileOverview 让内部各个部件的代码可以用[amd](https://github.com/amdjs/amdjs-api/wiki/AMD)模块定义方式组织起来。
*
* AMD API 内部的简单不完全实现,请忽略。只有当WebUploader被合并成一个文件的时候才会引入。
*/
(function( root, factory ) {
var modules = {},
_require = function( deps, callback ) {
var args, len, i;
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 = function( id, deps, factory ) {
if ( arguments.length === 2 ) {
factory = deps;
deps = null;
}
_require( deps || [], function() {
setModule( id, factory, arguments );
});
},
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;
},
getModule = function( id ) {
var module = modules[ id ] || root[ id ];
if ( !module ) {
throw new Error( '`' + id + '` is undefined' );
}
return module;
},
exportsTo = function( obj ) {
var key, host, parts, part, last, ucFirst;
ucFirst = function( str ) {
return str && (str.charAt( 0 ).toUpperCase() + str.substr( 1 ));
};
for ( key in modules ) {
host = obj;
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 ];
}
},
exports = factory( root, _define, _require ),
origin;
exportsTo( exports );
if ( typeof module === 'object' && typeof module.exports === 'object' ) {
module.exports = exports;
} else if ( typeof define === 'function' && define.amd ) {
define([], exports );
} else {
origin = root.WebUploader;
root.WebUploader = exports;
root.WebUploader.noConflict = function() {
root.WebUploader = origin;
};
}
})( this, function( window, define, require ) {
* @fileOverview jQuery or Zepto
*/
define('dollar-third',[],function() {
return window.jQuery || window.Zepto;
});
* @fileOverview Dom 操作相关
*/
define('dollar',[
'dollar-third'
], function( _ ) {
return _;
});
* @fileOverview 使用jQuery的Promise
*/
define('promise-third',[
'dollar'
], function( $ ) {
return {
Deferred: $.Deferred,
when: $.when,
isPromise: function( anything ) {
return anything && typeof anything.then === 'function';
}
};
});
* @fileOverview Promise/A+
*/
define('promise',[
'promise-third'
], function( _ ) {
return _;
});
* @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',[
'dollar',
'promise'
], function( $, promise ) {
var noop = function() {},
call = Function.call;
function uncurryThis( fn ) {
return function() {
return call.apply( fn, arguments );
};
}
function bindFn( fn, context ) {
return 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.2',
* @property {jQuery|Zepto} $ 引用依赖的jQuery或者Zepto对象。
*/
$: $,
Deferred: promise.Deferred,
isPromise: promise.isPromise,
when: promise.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\.]+)/ ) ||
ua.match(/(?:trident)(?:.*rv:([\w.]+))?/i),
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 ),
* @description 操作系统检查结果。
*
* * `android` 如果在android浏览器环境下,此值为对应的android版本号,否则为`undefined`。
* * `ios` 如果在ios浏览器环境下,此值为对应的ios版本号,否则为`undefined`。
* @property {Object} [os]
*/
os: (function( ua ) {
var ret = {},
android = ua.match( /(?:Android);?[\s\/]+([\d.]+)?/ ),
ios = ua.match( /(?:iPad|iPod|iPhone).*OS\s([\d_]+)/ );
android && (ret.android = parseFloat( android[ 1 ] ));
ios && (ret.ios = parseFloat( ios[ 1 ].replace( /_/g, '.' ) ));
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 || {} );
child.__super__ = Super.prototype;
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 );
};
})(),
* 被[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;
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 ) {
$.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 );
}
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',
sort: 'sort-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',
reset: 'reset'
}, 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;
if ( arguments.length > 1 ) {
if ( $.isPlainObject( val ) &&
$.isPlainObject( opts[ key ] ) ) {
$.extend( opts[ key ], val );
} else {
opts[ key ] = val;
}
} else {
return key ? opts[ key ] : opts;
}
},
* 获取文件统计信息。返回一个包含一下信息的对象。
* * `successNum` 上传成功的文件数
* * `uploadFailNum` 上传失败的文件数
* * `cancelNum` 被删除的文件数
* * `invalidNum` 无效的文件数
* * `queueNum` 还在队列中的文件数
* @method getStats
* @grammar getStats() => Object
*/
getStats: function() {
var stats = this.request('get-stats');
return {
successNum: stats.numOfSuccess,
cancelNum: stats.numOfCancel,
invalidNum: stats.numOfInvalid,
uploadFailNum: stats.numOfUploadFailed,
queueNum: stats.numOfQueue
};
},
trigger: function( type ) {
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 ||
$.isFunction( opts[ name ] ) &&
opts[ name ].apply( this, args ) === false ||
$.isFunction( this[ name ] ) &&
this[ name ].apply( this, args ) === false ||
Mediator.trigger.apply( Mediator,
[ this, type ].concat( args ) ) === false ) {
return false;
}
return true;
},
request: Base.noop
});
* 创建Uploader实例,等同于new Uploader( opts );
* @method create
* @class Base
* @static
* @grammar Base.create( opts ) => Uploader
*/
Base.create = Uploader.create = function( opts ) {
return new Uploader( opts );
};
Base.Uploader = Uploader;
return Uploader;
});
* @fileOverview Runtime管理器,负责Runtime的选择, 连接
*/
define('runtime/runtime',[
'base',
'mediator'
], function( Base, Mediator ) {
var $ = Base.$,
factories = {},
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;
cache = (function() {
var obj = {};
return {
add: function( runtime ) {
obj[ runtime.uid ] = runtime;
},
get: function( ruid, standalone ) {
var i;
if ( ruid ) {
return obj[ ruid ];
}
for ( i in obj ) {
if ( standalone && obj[ i ].__standalone ) {
continue;
}
return obj[ i ];
}
return null;
},
remove: function( runtime ) {
delete obj[ runtime.uid ];
}
};
})();
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 ) {
throw new Error('already connected!');
}
deferred.done( cb );
if ( typeof opts === 'string' && cache.get( opts ) ) {
runtime = cache.get( opts );
}
runtime = runtime || cache.get( null, standalone );
if ( !runtime ) {
runtime = Runtime.create( opts, opts.runtimeOrder );
runtime.__promise = deferred.promise();
runtime.once( 'ready', deferred.resolve );
runtime.init();
cache.add( runtime );
runtime.__client = 1;
} else {
Base.$.extend( runtime.options, opts );
runtime.__promise.then( deferred.resolve );
runtime.__client++;
}
standalone && (runtime.__standalone = standalone);
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 错误信息
*/
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: false
};
Base.inherits( RuntimeClent, {
constructor: DragAndDrop,
init: function() {
var me = this;
me.connectRuntime( me.options, function() {
me.exec('init');
me.trigger('ready');
});
},
destroy: function() {
this.disconnectRuntime();
}
});
Mediator.installTo( DragAndDrop.prototype );
return DragAndDrop;
});
* @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,
invoke: function( apiName, args ) {
{
'make-thumb': 'makeThumb'
}
*/
var map = this.responseMap;
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 );
}
});
$.extend( Uploader.prototype, {
_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, promise, key;
args = isArrayLike( args ) ? args : [ args ];
for ( ; i < len; i++ ) {
widget = widgets[ i ];
rlt = widget.invoke( apiName, args );
if ( rlt !== IGNORE ) {
if ( Base.isPromise( rlt ) ) {
dfds.push( rlt );
} else {
rlts.push( rlt );
}
}
}
if ( callback || dfds.length ) {
promise = Base.when.apply( Base, dfds );
key = promise.pipe ? 'pipe' : 'then';
return promise[ key ](function() {
var deferred = Base.Deferred(),
args = arguments;
setTimeout(function() {
deferred.resolve.apply( deferred, args );
}, 1 );
return deferred.promise();
})[ key ]( 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 DragAndDrop Widget。
*/
define('widgets/filednd',[
'base',
'uploader',
'lib/dnd',
'widgets/widget'
], function( Base, Uploader, Dnd ) {
var $ = Base.$;
Uploader.options.dnd = '';
* @property {Selector} [dnd=undefined] 指定Drag And Drop拖拽的容器,如果不指定,则不启动。
* @namespace options
* @for Uploader
*/
* @event dndAccept
* @param {DataTransferItemList} items DataTransferItem
* @description 阻止此事件可以拒绝某些类型的文件拖入进来。目前只有 chrome 提供这样的 API,且只能通过 mime-type 验证。
* @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({}, {
disableGlobalDnd: opts.disableGlobalDnd,
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.on( 'accept', function( items ) {
return me.owner.trigger( 'dndAccept', items );
});
dnd.init();
return deferred.promise();
}
});
});
* @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');
me.trigger('ready');
});
},
destroy: function() {
this.exec('destroy');
this.disconnectRuntime();
this.off();
}
});
Mediator.installTo( FilePaste.prototype );
return FilePaste;
});
* @fileOverview 组件基类。
*/
define('widgets/filepaste',[
'base',
'uploader',
'lib/filepaste',
'widgets/widget'
], function( Base, Uploader, FilePaste ) {
var $ = Base.$;
* @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 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;
});
* 为了统一化Flash的File和HTML5的File而存在。
* 以至于要调用Flash里面的File,也可以像调用HTML5版本的File一下。
* @fileOverview File
*/
define('lib/file',[
'base',
'lib/blob'
], function( Base, Blob ) {
var uid = 1,
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 ( !ext && this.type ) {
ext = /\/(jpg|jpeg|png|gif|bmp)$/i.exec( this.type ) ?
RegExp.$1.toLowerCase() : '';
this.name += '.' + ext;
}
if ( !this.type && ~'jpg,jpeg,png,gif,bmp'.indexOf( ext ) ) {
this.type = 'image/' + (ext === 'jpg' ? 'jpeg' : 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.innerHTML = opts.innerHTML || opts.label ||
opts.container.html() || '';
opts.button = $( opts.button || document.createElement('div') );
opts.button.html( opts.innerHTML );
opts.container.html( opts.button );
RuntimeClent.call( this, 'FilePicker', true );
}
FilePicker.options = {
button: null,
container: null,
label: null,
innerHTML: null,
multiple: true,
accept: null,
name: 'file'
};
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 ) {
file = new File( me.getRuid(), file );
file._refer = opts.container;
return file;
}), opts.container );
break;
}
});
me.connectRuntime( opts, function() {
me.refresh();
me.exec( 'init', opts );
me.trigger('ready');
});
$( window ).on( 'resize', function() {
me.refresh();
});
},
refresh: function() {
var shimContainer = this.getRuntime().getContainer(),
button = this.options.button,
width = button.outerWidth ?
button.outerWidth() : button.width(),
height = button.outerHeight ?
button.outerHeight() : button.height(),
pos = button.offset();
width && height && shimContainer.css({
bottom: 'auto',
right: 'auto',
width: width + 'px',
height: height + 'px'
}).offset( pos );
},
enable: function() {
var btn = this.options.button;
btn.removeClass('webuploader-pick-disable');
this.refresh();
},
disable: function() {
var btn = this.options.button;
this.getRuntime().getContainer().css({
top: '-99999px'
});
btn.addClass('webuploader-pick-disable');
},
destroy: function() {
if ( this.runtime ) {
this.exec('destroy');
this.disconnectRuntime();
}
}
});
return FilePicker;
});
* @fileOverview 文件选择相关
*/
define('widgets/filepicker',[
'base',
'uploader',
'lib/filepicker',
'widgets/widget'
], function( Base, Uploader, FilePicker ) {
var $ = Base.$;
$.extend( Uploader.options, {
* @property {Selector | Object} [pick=undefined]
* @namespace options
* @for Uploader
* @description 指定选择文件的按钮容器,不指定则不创建按钮。
*
* * `id` {Seletor} 指定选择文件的按钮容器,不指定则不创建按钮。
* * `label` {String} 请采用 `innerHTML` 代替
* * `innerHTML` {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',
disable: 'disable',
enable: 'enable'
}, {
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',
* innerHTML: '选择文件'
* });
*/
addButton: function( pick ) {
var me = this,
opts = me.options,
accept = opts.accept,
options, picker, deferred;
if ( !pick ) {
return;
}
deferred = Base.Deferred();
$.isPlainObject( pick ) || (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();
},
disable: function() {
$.each( this.pickers, function() {
this.disable();
});
},
enable: function() {
$.each( this.pickers, function() {
this.enable();
});
}
});
});
* @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
};
Base.inherits( RuntimeClient, {
constructor: Image,
info: function( val ) {
if ( val ) {
this._info = val;
return this;
}
return this._info;
},
meta: function( val ) {
if ( val ) {
this._meta = val;
return this;
}
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 图片操作, 负责预览图片和上传前压缩图片
*/
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`。
* 通常情况在图片加入队里后调用此方法来生成预览图以增强交互效果。
*
* `callback`中可以接收到两个参数。
* * 第一个为error,如果生成缩略图有错误,此error将为真。
* * 第二个为ret, 缩略图的Data URL值。
*
* **注意**
* Date URL在IE6/7中不支持,所以不用调用此方法了,直接显示一张暂不支持预览图片好了。
*
*
* @method makeThumb
* @grammar makeThumb( file, callback ) => undefined
* @grammar makeThumb( file, callback, 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 );
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;
try {
blob = image.getAsBlob( opts.type );
size = file.size;
if ( blob.size < size ) {
file.source = blob;
file.size = blob.size;
file.trigger( 'resize', blob.size, size );
}
file._compressed = true;
deferred.resolve();
} catch ( e ) {
deferred.resolve();
}
});
file._info && image.info( file._info );
file._meta && image.meta( file._meta );
image.loadFromBlob( file.source );
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 'application'
*/
this.type = source.type || 'application';
* 文件最后修改日期
* @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('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;
},
* 对队列进行排序,能够控制文件上传顺序。
* @grammar sort( fn ) => undefined
* @method sort
* @param {Function} fn 排序方法
*/
sort: function( fn ) {
if ( typeof fn === 'function' ) {
this._queue.sort( fn );
}
},
* 获取指定类型的文件列表, 列表中每一个成员为[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 队列
*/
define('widgets/queue',[
'base',
'uploader',
'queue',
'file',
'lib/file',
'runtime/client',
'widgets/widget'
], function( Base, Uploader, Queue, WUFile, File, RuntimeClient ) {
var $ = Base.$,
rExt = /\.\w+$/,
Status = WUFile.Status;
return Uploader.register({
'sort-files': 'sortFiles',
'add-file': 'addFiles',
'get-file': 'getFile',
'fetch-file': 'fetchFile',
'get-stats': 'getStats',
'get-files': 'getFiles',
'remove-file': 'removeFile',
'retry': 'retry',
'reset': 'reset',
'accept-file': 'acceptFile'
}, {
init: function( opts ) {
var me = this,
deferred, len, i, item, arr, accept, runtime;
if ( $.isPlainObject( opts.accept ) ) {
opts.accept = [ opts.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, '.*' ) + '$';
}
me.accept = new RegExp( accept, 'i' );
}
me.queue = new Queue();
me.stats = me.queue.stats;
if ( this.request('predict-runtime-type') !== 'html5' ) {
return;
}
deferred = Base.Deferred();
runtime = new RuntimeClient('Placeholder');
runtime.connectRuntime({
runtimeOrder: 'html5'
}, function() {
me._ruid = runtime.getRuid();
deferred.resolve();
});
return deferred.promise();
},
_wrapFile: function( file ) {
if ( !(file instanceof WUFile) ) {
if ( !(file instanceof File) ) {
if ( !this._ruid ) {
throw new Error('Can\'t add external files.');
}
file = new File( this._ruid, file );
}
file = new WUFile( file );
}
return file;
},
acceptFile: function( file ) {
var invalid = !file || file.size < 6 || this.accept &&
rExt.exec( file.name ) && !this.accept.test( file.name );
return !invalid;
},
* @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;
file = me._wrapFile( file );
if ( !me.owner.trigger( 'beforeFileQueued', file ) ) {
return;
}
if ( !me.acceptFile( file ) ) {
me.owner.trigger( 'error', 'Q_TYPE_DENIED', 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
*/
* @method addFiles
* @grammar addFiles( file ) => undefined
* @grammar addFiles( [file1, file2 ...] ) => undefined
* @param {Array of File or File} [files] Files 对象 数组
* @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');
},
* @method sort
* @grammar sort( fn ) => undefined
* @description 排序队列中的文件,在上传之前调整可以控制上传顺序。
* @for Uploader
*/
sortFiles: function() {
return this.queue.sort.apply( this.queue, arguments );
},
* @method reset
* @grammar reset() => undefined
* @description 重置uploader。目前只重置了队列。
* @for Uploader
* @example
* uploader.reset();
*/
reset: function() {
this.queue = new Queue();
this.stats = this.queue.stats;
}
});
});
* @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 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',
withCredentials: false,
fileVal: 'file',
timeout: 2 * 60 * 1000,
formData: {},
headers: {},
sendAsBinary: false
};
$.extend( Transport.prototype, {
appendBlob: function( key, blob, filename ) {
var me = this,
opts = me.options;
if ( me.getRuid() ) {
me.disconnectRuntime();
}
me.connectRuntime( blob.ruid, function() {
me.exec('init');
});
me._blob = blob;
opts.fileVal = key || opts.fileVal;
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 );
}
});
Mediator.installTo( Transport.prototype );
return Transport;
});
* @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,
* @property {Object} [formData]
* @namespace options
* @for Uploader
* @description 文件上传请求的参数表,每次发送都会发送此对象中的参数。
*/
formData: null
* @property {Object} [fileVal='file']
* @namespace options
* @for Uploader
* @description 设置文件上传域的name。
*/
* @property {Object} [method='POST']
* @namespace options
* @for Uploader
* @description 文件上传方式,`POST`或者`GET`。
*/
* @property {Object} [sendAsBinary=false]
* @namespace options
* @for Uploader
* @description 是否已二进制的流的方式发送文件,这样整个上传内容`php://input`都为文件内容,
* 其他参数在$_GET数组中。
*/
});
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: chunkSize ? (start + len) : total,
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;
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;
$.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;
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;
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 ) {
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();
};
return isPromise( next ) ?
next[ next.pipe ? 'pipe' : 'then']( done ) :
done( next );
}
},
* @event uploadStart
* @param {File} file File对象
* @description 某个文件开始上传前触发,一个文件只会触发一次。
* @for Uploader
*/
_prepareNextFile: function() {
var me = this,
file = me.request('fetch-file'),
pending = me.pending,
promise;
if ( file ) {
promise = me.request( 'before-send-file', file, function() {
if ( file.getStatus() === Status.QUEUED ) {
me.owner.trigger( 'uploadStart', file );
file.setStatus( Status.PROGRESS );
return file;
}
return me._finishFile( file );
});
promise.done(function() {
var idx = $.inArray( promise, pending );
~idx && pending.splice( idx, 1, file );
});
promise.fail(function( reason ) {
file.setStatus( Status.ERROR, reason );
me.owner.trigger( 'uploadError', file, reason );
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--;
},
_startSend: function( block ) {
var me = this,
file = block.file,
promise;
me.pool.push( block );
me.remaning++;
block.blob = block.chunks === 1 ? file.source :
file.source.slice( block.start, block.end );
promise = me.request( 'before-send', block, function() {
if ( file.getStatus() === Status.PROGRESS ) {
me._doSend( block );
} else {
me._popBlock( block );
Base.nextTick( me.__tick );
}
});
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 uploadBeforeSend
* @param {Object} object
* @param {Object} data 默认的上传参数,可以扩展此对象来控制上传参数。
* @description 当某个文件的分块在发送前触发,主要用来询问是否要添加附带参数,大文件在开起分片上传的前提下此事件可能会触发多次。
* @for Uploader
*/
* @event uploadAccept
* @param {Object} object
* @param {Object} ret 服务端的返回数据,json格式,如果服务端不是json格式,从ret._raw中取数据,自行解析。
* @description 当某个文件上传到服务端响应后,会派送此事件来询问服务端响应是否有效。如果此事件handler返回值为`false`, 则此文件将派送`server`类型的`uploadError`事件。
* @for Uploader
*/
* @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对象
* @param {Object} response 服务端返回的数据
* @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 ),
requestAccept, ret;
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;
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 );
});
requestAccept = function( reject ) {
var fn;
ret = tr.getResponseAsJson() || {};
ret._raw = tr.getResponse();
fn = function( value ) {
reject = value;
};
if ( !owner.trigger( 'uploadAccept', block, ret, fn ) ) {
reject = reject || 'server';
}
return reject;
};
tr.on( 'error', function( type, flag ) {
block.retried = block.retried || 0;
if ( block.chunks > 1 && ~'http,abort'.indexOf( type ) &&
block.retried < opts.chunkRetry ) {
block.retried++;
tr.send();
} else {
if ( !flag && type === 'server' ) {
type = requestAccept( type );
}
file.setStatus( Status.ERROR, type );
owner.trigger( 'uploadError', file, type );
owner.trigger( 'uploadComplete', file );
}
});
tr.on( 'load', function() {
var reason;
if ( (reason = requestAccept()) ) {
tr.trigger( 'error', reason, true );
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 ) {
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;
* @event error
* @param {String} type 错误类型。
* @description 当validate不通过时,会以派送错误事件的形式通知调用者。通过`upload.on('error', handler)`可以捕获到此类错误,目前有以下错误会在特定的情况下派送错来。
*
* * `Q_EXCEED_NUM_LIMIT` 在设置了`fileNumLimit`且尝试给`uploader`添加的文件数量超出这个值时派送。
* * `Q_EXCEED_SIZE_LIMIT` 在设置了`Q_EXCEED_SIZE_LIMIT`且尝试给`uploader`添加的文件总大小超出这个值时派送。
* @for Uploader
*/
api = {
addValidator: function( type, cb ) {
validators[ type ] = cb;
},
removeValidator: function( type ) {
delete validators[ type ];
}
};
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( file ) {
if ( count >= max && flag ) {
flag = false;
this.trigger( 'error', 'Q_EXCEED_NUM_LIMIT', max, file );
setTimeout(function() {
flag = true;
}, 1 );
}
return count >= max ? false : true;
});
uploader.on( 'fileQueued', function() {
count++;
});
uploader.on( 'fileDequeued', function() {
count--;
});
uploader.on( 'uploadFinished', function() {
count = 0;
});
});
* @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, file );
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;
});
uploader.on( 'uploadFinished', function() {
count = 0;
});
});
* @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( 'beforeFileQueued', function( file ) {
if ( file.size > max ) {
file.setStatus( WUFile.Status.INVALID, 'exceed_size' );
this.trigger( 'error', 'F_EXCEED_SIZE', file );
return false;
}
});
});
* @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 = file.__hash || (file.__hash = hashString( file.name +
file.size + file.lastModifiedDate ));
if ( mapping[ hash ] ) {
this.trigger( 'error', 'F_DUPLICATE', file );
return false;
}
});
uploader.on( 'fileQueued', function( file ) {
var hash = file.__hash;
hash && (mapping[ hash ] = true);
});
uploader.on( 'fileDequeued', function( file ) {
var hash = file.__hash;
hash && (delete mapping[ hash ]);
});
});
return api;
});
* @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 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;
me.exec = function( comp, fn) {
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() {
return destory && destory.apply( this, arguments );
};
}
Base.inherits( Runtime, {
constructor: Html5Runtime,
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;
};
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.$,
prefix = 'webuploader-dnd-';
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 );
this.dndOver = false;
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 ) {
var me = this,
denied = me._denied || false,
items;
e = e.originalEvent || e;
if ( !me.dndOver ) {
me.dndOver = true;
items = e.dataTransfer.items;
if ( items && items.length ) {
me._denied = denied = !me.trigger( 'accept', items );
}
me.elem.addClass( prefix + 'over' );
me.elem[ denied ? 'addClass' :
'removeClass' ]( prefix + 'denied' );
}
e.dataTransfer.dropEffect = denied ? 'none' : 'copy';
return false;
},
_dragOverHandler: function( e ) {
var parentElem = this.elem.parent().get( 0 );
if ( parentElem && !$.contains( parentElem, e.currentTarget ) ) {
return false;
}
clearTimeout( this._leaveTimer );
this._dragEnterHandler.call( this, e );
return false;
},
_dragLeaveHandler: function() {
var me = this,
handler;
handler = function() {
me.dndOver = false;
me.elem.removeClass( prefix + 'over ' + prefix + 'denied' );
};
clearTimeout( me._leaveTimer );
me._leaveTimer = setTimeout( handler, 100 );
return false;
},
_dropHandler: function( e ) {
var me = this,
ruid = me.getRuid(),
parentElem = me.elem.parent().get( 0 );
if ( parentElem && !$.contains( parentElem, e.currentTarget ) ) {
return false;
}
me._getTansferFiles( e, function( results ) {
me.trigger( 'drop', $.map( results, function( file ) {
return new File( ruid, file );
}) );
});
me.dndOver = false;
me.elem.removeClass( prefix + 'over' );
return false;
},
_getTansferFiles: function( e, callback ) {
var results = [],
promises = [],
items, files, dataTransfer, file, item, i, len, canAccessFolder;
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 ];
item = items && items[ i ];
if ( canAccessFolder && item.webkitGetAsEntry().isDirectory ) {
promises.push( this._traverseDirectoryTree(
item.webkitGetAsEntry(), results ) );
} else {
results.push( file );
}
}
Base.when.apply( Base, promises ).done(function() {
if ( !results.length ) {
return;
}
callback( results );
});
},
_traverseDirectoryTree: function( entry, results ) {
var deferred = Base.Deferred(),
me = this;
if ( entry.isFile ) {
entry.file(function( file ) {
results.push( file );
deferred.resolve();
});
} 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();
}, 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;
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(),
items, item, blob, i, len;
e = e.originalEvent || e;
items = e.clipboardData.items;
for ( i = 0, len = items.length; i < len; i++ ) {
item = items[ i ];
if ( item.kind !== 'file' || !(blob = item.getAsFile()) ) {
continue;
}
allowed.push( new File( ruid, blob ) );
}
if ( allowed.length ) {
e.preventDefault();
e.stopPropagation();
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.attr( 'name', opts.name );
input.addClass('webuploader-element-invisible');
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' );
}
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;
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() {
}
});
});
* Terms:
*
* Uint8Array, FileReader, BlobBuilder, atob, ArrayBuffer
* @fileOverview Image控件
*/
define('runtime/html5/util',[
'base'
], function( Base ) {
var urlAPI = window.createObjectURL && window ||
window.URL && URL.revokeObjectURL && URL ||
window.webkitURL,
createObjectURL = Base.noop,
revokeObjectURL = createObjectURL;
if ( urlAPI ) {
createObjectURL = function() {
return urlAPI.createObjectURL.apply( urlAPI, arguments );
};
revokeObjectURL = function() {
return urlAPI.revokeObjectURL.apply( urlAPI, arguments );
};
}
return {
createObjectURL: createObjectURL,
revokeObjectURL: 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 this.arrayBufferToBlob( ab, 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 ) {
var builder = window.BlobBuilder || window.WebKitBlobBuilder,
bb;
if ( builder ) {
bb = new builder();
bb.append( buffer );
return bb.getBlob( type );
}
return new Blob([ buffer ], type ? { type: type } : {} );
},
canvasToDataUrl: function( canvas, type, quality ) {
return canvas.toDataURL( type, quality / 100 );
},
parseMeta: function( blob, callback ) {
callback( false, {});
},
updateImageHead: function( data ) {
return data;
}
};
});
* 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 {
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;
}
};
Util.parseMeta = function() {
return api.parse.apply( api, arguments );
};
Util.updateImageHead = function() {
return api.updateImageHead.apply( api, arguments );
};
return api;
});
* 代码来自于:https://github.com/blueimp/JavaScript-Load-Image
* 暂时项目中只用了orientation.
*
* 去除了 Exif Sub IFD Pointer, GPS Info IFD Pointer, Exif Thumbnail.
* @fileOverview EXIF解析
*/
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 = {
1: {
getValue: function( dataView, dataOffset ) {
return dataView.getUint8( dataOffset );
},
size: 1
},
2: {
getValue: function( dataView, dataOffset ) {
return String.fromCharCode( dataView.getUint8( dataOffset ) );
},
size: 1,
ascii: true
},
3: {
getValue: function( dataView, dataOffset, littleEndian ) {
return dataView.getUint16( dataOffset, littleEndian );
},
size: 2
},
4: {
getValue: function( dataView, dataOffset, littleEndian ) {
return dataView.getUint32( dataOffset, littleEndian );
},
size: 4
},
5: {
getValue: function( dataView, dataOffset, littleEndian ) {
return dataView.getUint32( dataOffset, littleEndian ) /
dataView.getUint32( dataOffset + 4, littleEndian );
},
size: 8
},
9: {
getValue: function( dataView, dataOffset, littleEndian ) {
return dataView.getInt32( dataOffset, littleEndian );
},
size: 4
},
10: {
getValue: function( dataView, dataOffset, littleEndian ) {
return dataView.getInt32( dataOffset, littleEndian ) /
dataView.getInt32( dataOffset + 4, littleEndian );
},
size: 8
}
};
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;
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 = '';
for ( i = 0; i < values.length; i += 1 ) {
c = values[ i ];
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 ),
dataView.getUint32( offset + 4, littleEndian ),
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,
littleEndian, data );
}
return dataView.getUint32( dirEndOffset, littleEndian );
};
EXIF.parseExifData = function( dataView, offset, length, data ) {
var tiffOffset = offset + 10,
littleEndian, dirOffset;
if ( dataView.getUint32( offset + 4 ) !== 0x45786966 ) {
return;
}
if ( tiffOffset + 8 > dataView.byteLength ) {
Base.log('Invalid Exif data: Invalid segment size.');
return;
}
if ( dataView.getUint16( offset + 8 ) !== 0x0000 ) {
Base.log('Invalid Exif data: Missing byte alignment offset.');
return;
}
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;
}
if ( dataView.getUint16( tiffOffset + 2, littleEndian ) !== 0x002A ) {
Base.log('Invalid Exif data: Missing TIFF marker.');
return;
}
dirOffset = dataView.getUint32( tiffOffset + 4, littleEndian );
data.exif = new EXIF.ExifMap();
dirOffset = EXIF.parseExifTags( dataView, tiffOffset,
tiffOffset + dirOffset, littleEndian, data );
};
ImageMeta.parsers[ 0xffe1 ].push( EXIF.parseExifData );
return EXIF;
});
* 这个方式性能不行,但是可以解决android里面的toDataUrl的bug
* android里面toDataUrl('image/jpege')得到的结果却是png.
*
* 所以这里没辙,只能借助这个工具
* @fileOverview jpeg encoder
*/
define('runtime/html5/jpegencoder',[], function( require, exports, module ) {
Copyright (c) 2008, Adobe Systems Incorporated
All rights reserved.
Redistribution and use in source and binary forms, with or without
modification, are permitted provided that the following conditions are
met:
* Redistributions of source code must retain the above copyright notice,
this list of conditions and the following disclaimer.
* Redistributions in binary form must reproduce the above copyright
notice, this list of conditions and the following disclaimer in the
documentation and/or other materials provided with the distribution.
* Neither the name of Adobe Systems Incorporated nor the names of its
contributors may be used to endorse or promote products derived from
this software without specific prior written permission.
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS
IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR
CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF
LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*/
JPEG encoder ported to JavaScript and optimized by Andreas Ritter, www.bytestrom.eu, 11/2009
Basic GUI blocking jpeg encoder
*/
function JPEGEncoder(quality) {
var self = this;
var fround = Math.round;
var ffloor = Math.floor;
var YTable = new Array(64);
var UVTable = new Array(64);
var fdtbl_Y = new Array(64);
var fdtbl_UV = new Array(64);
var YDC_HT;
var UVDC_HT;
var YAC_HT;
var UVAC_HT;
var bitcode = new Array(65535);
var category = new Array(65535);
var outputfDCTQuant = new Array(64);
var DU = new Array(64);
var byteout = [];
var bytenew = 0;
var bytepos = 7;
var YDU = new Array(64);
var UDU = new Array(64);
var VDU = new Array(64);
var clt = new Array(256);
var RGB_YUV_TABLE = new Array(2048);
var currentQuality;
var ZigZag = [
0, 1, 5, 6,14,15,27,28,
2, 4, 7,13,16,26,29,42,
3, 8,12,17,25,30,41,43,
9,11,18,24,31,40,44,53,
10,19,23,32,39,45,52,54,
20,22,33,38,46,51,55,60,
21,34,37,47,50,56,59,61,
35,36,48,49,57,58,62,63
];
var std_dc_luminance_nrcodes = [0,0,1,5,1,1,1,1,1,1,0,0,0,0,0,0,0];
var std_dc_luminance_values = [0,1,2,3,4,5,6,7,8,9,10,11];
var std_ac_luminance_nrcodes = [0,0,2,1,3,3,2,4,3,5,5,4,4,0,0,1,0x7d];
var std_ac_luminance_values = [
0x01,0x02,0x03,0x00,0x04,0x11,0x05,0x12,
0x21,0x31,0x41,0x06,0x13,0x51,0x61,0x07,
0x22,0x71,0x14,0x32,0x81,0x91,0xa1,0x08,
0x23,0x42,0xb1,0xc1,0x15,0x52,0xd1,0xf0,
0x24,0x33,0x62,0x72,0x82,0x09,0x0a,0x16,
0x17,0x18,0x19,0x1a,0x25,0x26,0x27,0x28,
0x29,0x2a,0x34,0x35,0x36,0x37,0x38,0x39,
0x3a,0x43,0x44,0x45,0x46,0x47,0x48,0x49,
0x4a,0x53,0x54,0x55,0x56,0x57,0x58,0x59,
0x5a,0x63,0x64,0x65,0x66,0x67,0x68,0x69,
0x6a,0x73,0x74,0x75,0x76,0x77,0x78,0x79,
0x7a,0x83,0x84,0x85,0x86,0x87,0x88,0x89,
0x8a,0x92,0x93,0x94,0x95,0x96,0x97,0x98,
0x99,0x9a,0xa2,0xa3,0xa4,0xa5,0xa6,0xa7,
0xa8,0xa9,0xaa,0xb2,0xb3,0xb4,0xb5,0xb6,
0xb7,0xb8,0xb9,0xba,0xc2,0xc3,0xc4,0xc5,
0xc6,0xc7,0xc8,0xc9,0xca,0xd2,0xd3,0xd4,
0xd5,0xd6,0xd7,0xd8,0xd9,0xda,0xe1,0xe2,
0xe3,0xe4,0xe5,0xe6,0xe7,0xe8,0xe9,0xea,
0xf1,0xf2,0xf3,0xf4,0xf5,0xf6,0xf7,0xf8,
0xf9,0xfa
];
var std_dc_chrominance_nrcodes = [0,0,3,1,1,1,1,1,1,1,1,1,0,0,0,0,0];
var std_dc_chrominance_values = [0,1,2,3,4,5,6,7,8,9,10,11];
var std_ac_chrominance_nrcodes = [0,0,2,1,2,4,4,3,4,7,5,4,4,0,1,2,0x77];
var std_ac_chrominance_values = [
0x00,0x01,0x02,0x03,0x11,0x04,0x05,0x21,
0x31,0x06,0x12,0x41,0x51,0x07,0x61,0x71,
0x13,0x22,0x32,0x81,0x08,0x14,0x42,0x91,
0xa1,0xb1,0xc1,0x09,0x23,0x33,0x52,0xf0,
0x15,0x62,0x72,0xd1,0x0a,0x16,0x24,0x34,
0xe1,0x25,0xf1,0x17,0x18,0x19,0x1a,0x26,
0x27,0x28,0x29,0x2a,0x35,0x36,0x37,0x38,
0x39,0x3a,0x43,0x44,0x45,0x46,0x47,0x48,
0x49,0x4a,0x53,0x54,0x55,0x56,0x57,0x58,
0x59,0x5a,0x63,0x64,0x65,0x66,0x67,0x68,
0x69,0x6a,0x73,0x74,0x75,0x76,0x77,0x78,
0x79,0x7a,0x82,0x83,0x84,0x85,0x86,0x87,
0x88,0x89,0x8a,0x92,0x93,0x94,0x95,0x96,
0x97,0x98,0x99,0x9a,0xa2,0xa3,0xa4,0xa5,
0xa6,0xa7,0xa8,0xa9,0xaa,0xb2,0xb3,0xb4,
0xb5,0xb6,0xb7,0xb8,0xb9,0xba,0xc2,0xc3,
0xc4,0xc5,0xc6,0xc7,0xc8,0xc9,0xca,0xd2,
0xd3,0xd4,0xd5,0xd6,0xd7,0xd8,0xd9,0xda,
0xe2,0xe3,0xe4,0xe5,0xe6,0xe7,0xe8,0xe9,
0xea,0xf2,0xf3,0xf4,0xf5,0xf6,0xf7,0xf8,
0xf9,0xfa
];
function initQuantTables(sf){
var YQT = [
16, 11, 10, 16, 24, 40, 51, 61,
12, 12, 14, 19, 26, 58, 60, 55,
14, 13, 16, 24, 40, 57, 69, 56,
14, 17, 22, 29, 51, 87, 80, 62,
18, 22, 37, 56, 68,109,103, 77,
24, 35, 55, 64, 81,104,113, 92,
49, 64, 78, 87,103,121,120,101,
72, 92, 95, 98,112,100,103, 99
];
for (var i = 0; i < 64; i++) {
var t = ffloor((YQT[i]*sf+50)/100);
if (t < 1) {
t = 1;
} else if (t > 255) {
t = 255;
}
YTable[ZigZag[i]] = t;
}
var UVQT = [
17, 18, 24, 47, 99, 99, 99, 99,
18, 21, 26, 66, 99, 99, 99, 99,
24, 26, 56, 99, 99, 99, 99, 99,
47, 66, 99, 99, 99, 99, 99, 99,
99, 99, 99, 99, 99, 99, 99, 99,
99, 99, 99, 99, 99, 99, 99, 99,
99, 99, 99, 99, 99, 99, 99, 99,
99, 99, 99, 99, 99, 99, 99, 99
];
for (var j = 0; j < 64; j++) {
var u = ffloor((UVQT[j]*sf+50)/100);
if (u < 1) {
u = 1;
} else if (u > 255) {
u = 255;
}
UVTable[ZigZag[j]] = u;
}
var aasf = [
1.0, 1.387039845, 1.306562965, 1.175875602,
1.0, 0.785694958, 0.541196100, 0.275899379
];
var k = 0;
for (var row = 0; row < 8; row++)
{
for (var col = 0; col < 8; col++)
{
fdtbl_Y[k] = (1.0 / (YTable [ZigZag[k]] * aasf[row] * aasf[col] * 8.0));
fdtbl_UV[k] = (1.0 / (UVTable[ZigZag[k]] * aasf[row] * aasf[col] * 8.0));
k++;
}
}
}
function computeHuffmanTbl(nrcodes, std_table){
var codevalue = 0;
var pos_in_table = 0;
var HT = new Array();
for (var k = 1; k <= 16; k++) {
for (var j = 1; j <= nrcodes[k]; j++) {
HT[std_table[pos_in_table]] = [];
HT[std_table[pos_in_table]][0] = codevalue;
HT[std_table[pos_in_table]][1] = k;
pos_in_table++;
codevalue++;
}
codevalue*=2;
}
return HT;
}
function initHuffmanTbl()
{
YDC_HT = computeHuffmanTbl(std_dc_luminance_nrcodes,std_dc_luminance_values);
UVDC_HT = computeHuffmanTbl(std_dc_chrominance_nrcodes,std_dc_chrominance_values);
YAC_HT = computeHuffmanTbl(std_ac_luminance_nrcodes,std_ac_luminance_values);
UVAC_HT = computeHuffmanTbl(std_ac_chrominance_nrcodes,std_ac_chrominance_values);
}
function initCategoryNumber()
{
var nrlower = 1;
var nrupper = 2;
for (var cat = 1; cat <= 15; cat++) {
for (var nr = nrlower; nr<nrupper; nr++) {
category[32767+nr] = cat;
bitcode[32767+nr] = [];
bitcode[32767+nr][1] = cat;
bitcode[32767+nr][0] = nr;
}
for (var nrneg =-(nrupper-1); nrneg<=-nrlower; nrneg++) {
category[32767+nrneg] = cat;
bitcode[32767+nrneg] = [];
bitcode[32767+nrneg][1] = cat;
bitcode[32767+nrneg][0] = nrupper-1+nrneg;
}
nrlower <<= 1;
nrupper <<= 1;
}
}
function initRGBYUVTable() {
for(var i = 0; i < 256;i++) {
RGB_YUV_TABLE[i] = 19595 * i;
RGB_YUV_TABLE[(i+ 256)>>0] = 38470 * i;
RGB_YUV_TABLE[(i+ 512)>>0] = 7471 * i + 0x8000;
RGB_YUV_TABLE[(i+ 768)>>0] = -11059 * i;
RGB_YUV_TABLE[(i+1024)>>0] = -21709 * i;
RGB_YUV_TABLE[(i+1280)>>0] = 32768 * i + 0x807FFF;
RGB_YUV_TABLE[(i+1536)>>0] = -27439 * i;
RGB_YUV_TABLE[(i+1792)>>0] = - 5329 * i;
}
}
function writeBits(bs)
{
var value = bs[0];
var posval = bs[1]-1;
while ( posval >= 0 ) {
if (value & (1 << posval) ) {
bytenew |= (1 << bytepos);
}
posval--;
bytepos--;
if (bytepos < 0) {
if (bytenew == 0xFF) {
writeByte(0xFF);
writeByte(0);
}
else {
writeByte(bytenew);
}
bytepos=7;
bytenew=0;
}
}
}
function writeByte(value)
{
byteout.push(clt[value]);
}
function writeWord(value)
{
writeByte((value>>8)&0xFF);
writeByte((value )&0xFF);
}
function fDCTQuant(data, fdtbl)
{
var d0, d1, d2, d3, d4, d5, d6, d7;
var dataOff=0;
var i;
var I8 = 8;
var I64 = 64;
for (i=0; i<I8; ++i)
{
d0 = data[dataOff];
d1 = data[dataOff+1];
d2 = data[dataOff+2];
d3 = data[dataOff+3];
d4 = data[dataOff+4];
d5 = data[dataOff+5];
d6 = data[dataOff+6];
d7 = data[dataOff+7];
var tmp0 = d0 + d7;
var tmp7 = d0 - d7;
var tmp1 = d1 + d6;
var tmp6 = d1 - d6;
var tmp2 = d2 + d5;
var tmp5 = d2 - d5;
var tmp3 = d3 + d4;
var tmp4 = d3 - d4;
var tmp10 = tmp0 + tmp3;
var tmp13 = tmp0 - tmp3;
var tmp11 = tmp1 + tmp2;
var tmp12 = tmp1 - tmp2;
data[dataOff] = tmp10 + tmp11;
data[dataOff+4] = tmp10 - tmp11;
var z1 = (tmp12 + tmp13) * 0.707106781;
data[dataOff+2] = tmp13 + z1;
data[dataOff+6] = tmp13 - z1;
tmp10 = tmp4 + tmp5;
tmp11 = tmp5 + tmp6;
tmp12 = tmp6 + tmp7;
var z5 = (tmp10 - tmp12) * 0.382683433;
var z2 = 0.541196100 * tmp10 + z5;
var z4 = 1.306562965 * tmp12 + z5;
var z3 = tmp11 * 0.707106781;
var z11 = tmp7 + z3;
var z13 = tmp7 - z3;
data[dataOff+5] = z13 + z2;
data[dataOff+3] = z13 - z2;
data[dataOff+1] = z11 + z4;
data[dataOff+7] = z11 - z4;
dataOff += 8;
}
dataOff = 0;
for (i=0; i<I8; ++i)
{
d0 = data[dataOff];
d1 = data[dataOff + 8];
d2 = data[dataOff + 16];
d3 = data[dataOff + 24];
d4 = data[dataOff + 32];
d5 = data[dataOff + 40];
d6 = data[dataOff + 48];
d7 = data[dataOff + 56];
var tmp0p2 = d0 + d7;
var tmp7p2 = d0 - d7;
var tmp1p2 = d1 + d6;
var tmp6p2 = d1 - d6;
var tmp2p2 = d2 + d5;
var tmp5p2 = d2 - d5;
var tmp3p2 = d3 + d4;
var tmp4p2 = d3 - d4;
var tmp10p2 = tmp0p2 + tmp3p2;
var tmp13p2 = tmp0p2 - tmp3p2;
var tmp11p2 = tmp1p2 + tmp2p2;
var tmp12p2 = tmp1p2 - tmp2p2;
data[dataOff] = tmp10p2 + tmp11p2;
data[dataOff+32] = tmp10p2 - tmp11p2;
var z1p2 = (tmp12p2 + tmp13p2) * 0.707106781;
data[dataOff+16] = tmp13p2 + z1p2;
data[dataOff+48] = tmp13p2 - z1p2;
tmp10p2 = tmp4p2 + tmp5p2;
tmp11p2 = tmp5p2 + tmp6p2;
tmp12p2 = tmp6p2 + tmp7p2;
var z5p2 = (tmp10p2 - tmp12p2) * 0.382683433;
var z2p2 = 0.541196100 * tmp10p2 + z5p2;
var z4p2 = 1.306562965 * tmp12p2 + z5p2;
var z3p2 = tmp11p2 * 0.707106781;
var z11p2 = tmp7p2 + z3p2;
var z13p2 = tmp7p2 - z3p2;
data[dataOff+40] = z13p2 + z2p2;
data[dataOff+24] = z13p2 - z2p2;
data[dataOff+ 8] = z11p2 + z4p2;
data[dataOff+56] = z11p2 - z4p2;
dataOff++;
}
var fDCTQuant;
for (i=0; i<I64; ++i)
{
fDCTQuant = data[i]*fdtbl[i];
outputfDCTQuant[i] = (fDCTQuant > 0.0) ? ((fDCTQuant + 0.5)|0) : ((fDCTQuant - 0.5)|0);
}
return outputfDCTQuant;
}
function writeAPP0()
{
writeWord(0xFFE0);
writeWord(16);
writeByte(0x4A);
writeByte(0x46);
writeByte(0x49);
writeByte(0x46);
writeByte(0);
writeByte(1);
writeByte(1);
writeByte(0);
writeWord(1);
writeWord(1);
writeByte(0);
writeByte(0);
}
function writeSOF0(width, height)
{
writeWord(0xFFC0);
writeWord(17);
writeByte(8);
writeWord(height);
writeWord(width);
writeByte(3);
writeByte(1);
writeByte(0x11);
writeByte(0);
writeByte(2);
writeByte(0x11);
writeByte(1);
writeByte(3);
writeByte(0x11);
writeByte(1);
}
function writeDQT()
{
writeWord(0xFFDB);
writeWord(132);
writeByte(0);
for (var i=0; i<64; i++) {
writeByte(YTable[i]);
}
writeByte(1);
for (var j=0; j<64; j++) {
writeByte(UVTable[j]);
}
}
function writeDHT()
{
writeWord(0xFFC4);
writeWord(0x01A2);
writeByte(0);
for (var i=0; i<16; i++) {
writeByte(std_dc_luminance_nrcodes[i+1]);
}
for (var j=0; j<=11; j++) {
writeByte(std_dc_luminance_values[j]);
}
writeByte(0x10);
for (var k=0; k<16; k++) {
writeByte(std_ac_luminance_nrcodes[k+1]);
}
for (var l=0; l<=161; l++) {
writeByte(std_ac_luminance_values[l]);
}
writeByte(1);
for (var m=0; m<16; m++) {
writeByte(std_dc_chrominance_nrcodes[m+1]);
}
for (var n=0; n<=11; n++) {
writeByte(std_dc_chrominance_values[n]);
}
writeByte(0x11);
for (var o=0; o<16; o++) {
writeByte(std_ac_chrominance_nrcodes[o+1]);
}
for (var p=0; p<=161; p++) {
writeByte(std_ac_chrominance_values[p]);
}
}
function writeSOS()
{
writeWord(0xFFDA);
writeWord(12);
writeByte(3);
writeByte(1);
writeByte(0);
writeByte(2);
writeByte(0x11);
writeByte(3);
writeByte(0x11);
writeByte(0);
writeByte(0x3f);
writeByte(0);
}
function processDU(CDU, fdtbl, DC, HTDC, HTAC){
var EOB = HTAC[0x00];
var M16zeroes = HTAC[0xF0];
var pos;
var I16 = 16;
var I63 = 63;
var I64 = 64;
var DU_DCT = fDCTQuant(CDU, fdtbl);
for (var j=0;j<I64;++j) {
DU[ZigZag[j]]=DU_DCT[j];
}
var Diff = DU[0] - DC; DC = DU[0];
if (Diff==0) {
writeBits(HTDC[0]);
} else {
pos = 32767+Diff;
writeBits(HTDC[category[pos]]);
writeBits(bitcode[pos]);
}
var end0pos = 63;
for (; (end0pos>0)&&(DU[end0pos]==0); end0pos--) {};
if ( end0pos == 0) {
writeBits(EOB);
return DC;
}
var i = 1;
var lng;
while ( i <= end0pos ) {
var startpos = i;
for (; (DU[i]==0) && (i<=end0pos); ++i) {}
var nrzeroes = i-startpos;
if ( nrzeroes >= I16 ) {
lng = nrzeroes>>4;
for (var nrmarker=1; nrmarker <= lng; ++nrmarker)
writeBits(M16zeroes);
nrzeroes = nrzeroes&0xF;
}
pos = 32767+DU[i];
writeBits(HTAC[(nrzeroes<<4)+category[pos]]);
writeBits(bitcode[pos]);
i++;
}
if ( end0pos != I63 ) {
writeBits(EOB);
}
return DC;
}
function initCharLookupTable(){
var sfcc = String.fromCharCode;
for(var i=0; i < 256; i++){
clt[i] = sfcc(i);
}
}
this.encode = function(image,quality)
{
if(quality) setQuality(quality);
byteout = new Array();
bytenew=0;
bytepos=7;
writeWord(0xFFD8);
writeAPP0();
writeDQT();
writeSOF0(image.width,image.height);
writeDHT();
writeSOS();
var DCY=0;
var DCU=0;
var DCV=0;
bytenew=0;
bytepos=7;
this.encode.displayName = "_encode_";
var imageData = image.data;
var width = image.width;
var height = image.height;
var quadWidth = width*4;
var tripleWidth = width*3;
var x, y = 0;
var r, g, b;
var start,p, col,row,pos;
while(y < height){
x = 0;
while(x < quadWidth){
start = quadWidth * y + x;
p = start;
col = -1;
row = 0;
for(pos=0; pos < 64; pos++){
row = pos >> 3;
col = ( pos & 7 ) * 4;
p = start + ( row * quadWidth ) + col;
if(y+row >= height){
p-= (quadWidth*(y+1+row-height));
}
if(x+col >= quadWidth){
p-= ((x+col) - quadWidth +4)
}
r = imageData[ p++ ];
g = imageData[ p++ ];
b = imageData[ p++ ];
YDU[pos]=((( 0.29900)*r+( 0.58700)*g+( 0.11400)*b))-128; //-0x80
UDU[pos]=(((-0.16874)*r+(-0.33126)*g+( 0.50000)*b));
VDU[pos]=((( 0.50000)*r+(-0.41869)*g+(-0.08131)*b));
*/
YDU[pos] = ((RGB_YUV_TABLE[r] + RGB_YUV_TABLE[(g + 256)>>0] + RGB_YUV_TABLE[(b + 512)>>0]) >> 16)-128;
UDU[pos] = ((RGB_YUV_TABLE[(r + 768)>>0] + RGB_YUV_TABLE[(g + 1024)>>0] + RGB_YUV_TABLE[(b + 1280)>>0]) >> 16)-128;
VDU[pos] = ((RGB_YUV_TABLE[(r + 1280)>>0] + RGB_YUV_TABLE[(g + 1536)>>0] + RGB_YUV_TABLE[(b + 1792)>>0]) >> 16)-128;
}
DCY = processDU(YDU, fdtbl_Y, DCY, YDC_HT, YAC_HT);
DCU = processDU(UDU, fdtbl_UV, DCU, UVDC_HT, UVAC_HT);
DCV = processDU(VDU, fdtbl_UV, DCV, UVDC_HT, UVAC_HT);
x+=32;
}
y+=8;
}
if ( bytepos >= 0 ) {
var fillbits = [];
fillbits[1] = bytepos+1;
fillbits[0] = (1<<(bytepos+1))-1;
writeBits(fillbits);
}
writeWord(0xFFD9);
var jpegDataUri = 'data:image/jpeg;base64,' + btoa(byteout.join(''));
byteout = [];
return jpegDataUri
}
function setQuality(quality){
if (quality <= 0) {
quality = 1;
}
if (quality > 100) {
quality = 100;
}
if(currentQuality == quality) return
var sf = 0;
if (quality < 50) {
sf = Math.floor(5000 / quality);
} else {
sf = Math.floor(200 - quality*2);
}
initQuantTables(sf);
currentQuality = quality;
}
function init(){
if(!quality) quality = 50;
initCharLookupTable()
initHuffmanTbl();
initCategoryNumber();
initRGBYUVTable();
setQuality(quality);
}
init();
};
JPEGEncoder.encode = function( data, quality ) {
var encoder = new JPEGEncoder( quality );
return encoder.encode( data );
}
return JPEGEncoder;
});
* @fileOverview Fix android canvas.toDataUrl bug.
*/
define('runtime/html5/androidpatch',[
'runtime/html5/util',
'runtime/html5/jpegencoder',
'base'
], function( Util, encoder, Base ) {
var origin = Util.canvasToDataUrl,
supportJpeg;
Util.canvasToDataUrl = function( canvas, type, quality ) {
var ctx, w, h, fragement, parts;
if ( !Base.os.android ) {
return origin.apply( null, arguments );
}
if ( type === 'image/jpeg' && typeof supportJpeg === 'undefined' ) {
fragement = origin.apply( null, arguments );
parts = fragement.split(',');
if ( ~parts[ 0 ].indexOf('base64') ) {
fragement = atob( parts[ 1 ] );
} else {
fragement = decodeURIComponent( parts[ 1 ] );
}
fragement = fragement.substring( 0, 2 );
supportJpeg = fragement.charCodeAt( 0 ) === 255 &&
fragement.charCodeAt( 1 ) === 216;
}
if ( type === 'image/jpeg' && !supportJpeg ) {
w = canvas.width;
h = canvas.height;
ctx = canvas.getContext('2d');
return encoder.encode( ctx.getImageData( 0, 0, w, h ), quality );
}
return origin.apply( null, arguments );
};
});
* @fileOverview Image
*/
define('runtime/html5/image',[
'base',
'runtime/html5/runtime',
'runtime/html5/util'
], function( Base, Html5Runtime, Util ) {
var BLANK = 'data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs%3D';
return Html5Runtime.register( 'Image', {
modified: false,
init: function() {
var me = this,
img = new Image();
img.onload = function() {
me._info = {
type: me.type,
width: this.width,
height: this.height
};
if ( !me._metas && 'image/jpeg' === me.type ) {
Util.parseMeta( 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;
if ( this.modified || this.type !== type ) {
canvas = this._canvas;
if ( type === 'image/jpeg' ) {
blob = Util.canvasToDataUrl( canvas, 'image/jpeg',
opts.quality );
if ( opts.preserveHeaders && this._metas &&
this._metas.imageHead ) {
blob = Util.dataURL2ArrayBuffer( blob );
blob = Util.updateImageHead( blob,
this._metas.imageHead );
blob = Util.arrayBufferToBlob( blob, type );
return blob;
}
} else {
blob = Util.canvasToDataUrl( canvas, type );
}
blob = Util.dataURL2Blob( blob );
}
return blob;
},
getAsDataUrl: function( type ) {
var opts = this.options;
type = type || this.type;
if ( type === 'image/jpeg' ) {
return Util.canvasToDataUrl( this._canvas, type, opts.quality );
} else {
return this._canvas.toDataURL( type );
}
},
getOrientation: function() {
return this._metas && this._metas.exif &&
this._metas.exif.get('Orientation') || 1;
},
info: function( val ) {
if ( val ) {
this._info = val;
return this;
}
return this._info;
},
meta: function( val ) {
if ( val ) {
this._meta = val;
return this;
}
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;
}
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;
if ( ~[ 5, 6, 7, 8 ].indexOf( orientation ) ) {
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._rotate2Orientaion( cvs, orientation );
this._renderImageToCanvas( cvs, img, x, y, w, h );
},
_rotate2Orientaion: 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:
ctx.translate( width, 0 );
ctx.scale( -1, 1 );
break;
case 3:
ctx.translate( width, height );
ctx.rotate( Math.PI );
break;
case 4:
ctx.translate( 0, height );
ctx.scale( 1, -1 );
break;
case 5:
ctx.rotate( 0.5 * Math.PI );
ctx.scale( 1, -1 );
break;
case 6:
ctx.rotate( 0.5 * Math.PI );
ctx.translate( 0, -height );
break;
case 7:
ctx.rotate( 0.5 * Math.PI );
ctx.translate( width, -height );
ctx.scale( -1, 1 );
break;
case 8:
ctx.rotate( -0.5 * Math.PI );
ctx.translate( -width, 0 );
break;
}
},
_renderImageToCanvas: (function() {
if ( !Base.os.ios ) {
return function( canvas, img, x, y, w, h ) {
canvas.getContext('2d').drawImage( img, x, y, w, h );
};
}
* 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'),
ctx = canvas.getContext('2d'),
sy = 0,
ey = ih,
py = ih,
data, alpha, ratio;
canvas.width = 1;
canvas.height = ih;
ctx.drawImage( img, 0, 0 );
data = ctx.getImageData( 0, 0, 1, ih ).data;
while ( py > sy ) {
alpha = data[ (py - 1) * 4 + 3 ];
if ( alpha === 0 ) {
ey = py;
} else {
sy = py;
}
py = (ey + sy) >> 1;
}
ratio = (py / ih);
return (ratio === 0) ? 1 : ratio;
}
if ( Base.os.ios >= 7 ) {
return function( canvas, img, x, y, w, h ) {
var iw = img.naturalWidth,
ih = img.naturalHeight,
vertSquashRatio = detectVerticalSquash( img, iw, ih );
return canvas.getContext('2d').drawImage( img, 0, 0,
iw * vertSquashRatio, ih * vertSquashRatio,
x, y, w, h );
};
}
* 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,
canvas, ctx;
if ( iw * ih > 1024 * 1024 ) {
canvas = document.createElement('canvas');
canvas.width = canvas.height = 1;
ctx = canvas.getContext('2d');
ctx.drawImage( img, -iw + 1, 0 );
return ctx.getImageData( 0, 0, 1, 1 ).data[ 3 ] === 0;
} else {
return false;
}
}
return function( canvas, img, x, y, width, height ) {
var iw = img.naturalWidth,
ih = img.naturalHeight,
ctx = canvas.getContext('2d'),
subsampled = detectSubsampling( img ),
doSquash = this.type === 'image/jpeg',
d = 1024,
sy = 0,
dy = 0,
tmpCanvas, tmpCtx, vertSquashRatio, dw, dh, sx, dx;
if ( subsampled ) {
iw /= 2;
ih /= 2;
}
ctx.save();
tmpCanvas = document.createElement('canvas');
tmpCanvas.width = tmpCanvas.height = d;
tmpCtx = tmpCanvas.getContext('2d');
vertSquashRatio = doSquash ?
detectVerticalSquash( img, iw, ih ) : 1;
dw = Math.ceil( d * width / iw );
dh = Math.ceil( d * height / ih / vertSquashRatio );
while ( sy < ih ) {
sx = 0;
dx = 0;
while ( sx < iw ) {
tmpCtx.clearRect( 0, 0, d, d );
tmpCtx.drawImage( img, -sx, -sy );
ctx.drawImage( tmpCanvas, 0, 0, d, d,
x + dx, y + dy, dw, dh );
sx += d;
dx += dw;
}
sy += d;
dy += dh;
}
ctx.restore();
tmpCanvas = tmpCtx = null;
};
})()
});
});
* @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, fr;
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.fileVal, 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 );
if ( binary ) {
xhr.overrideMimeType('application/octet-stream');
if ( Base.os.android ) {
fr = new FileReader();
fr.onload = function() {
xhr.send( this.result );
fr = fr.onload = null;
};
fr.readAsArrayBuffer( binary );
} else {
xhr.send( binary );
}
} else {
xhr.send( 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;
me._status = xhr.status;
if ( xhr.status >= 200 && xhr.status < 300 ) {
me._response = xhr.responseText;
return me.trigger('load');
} else if ( xhr.status >= 500 && xhr.status < 600 ) {
me._response = xhr.responseText;
return me.trigger( 'error', 'server' );
}
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 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;
me.exec = function( comp, fn ) {
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 handler( evt, obj ) {
var type = evt.type || evt,
parts, uid;
parts = type.split('::');
uid = parts[ 0 ];
type = parts[ 1 ];
if ( type === 'Ready' && uid === me.uid ) {
me.trigger('ready');
} else if ( clients[ uid ] ) {
clients[ uid ].trigger( type.toLowerCase(), evt, obj );
}
}
window[ jsreciver ] = function() {
var args = arguments;
setTimeout(function() {
handler.apply( null, args );
}, 1 );
};
this.jsreciver = jsreciver;
this.destory = function() {
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 );
};
}
Base.inherits( Runtime, {
constructor: FlashRuntime,
init: function() {
var container = this.getContainer(),
opts = this.options,
html;
container.css({
position: 'absolute',
top: '-8px',
left: '-8px',
width: '9px',
height: '9px',
overflow: 'hidden'
});
html = '<object id="' + this.uid + '" type="application/' +
'x-shockwave-flash" data="' + opts.swf + '" ';
if ( Base.browser.ie ) {
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({
flashExec: function() {
var owner = this.owner,
runtime = this.getRuntime();
return runtime.flashExec.apply( owner, arguments );
}
}, component ) );
return component;
};
if ( getFlashVersion() >= 11.4 ) {
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 ),
len, i;
len = copy.accept && copy.accept.length;
for ( i = 0; i < len; i++ ) {
if ( !copy.accept[ i ].title ) {
copy.accept[ i ].title = 'Files';
}
}
delete copy.button;
delete copy.container;
this.flashExec( 'FilePicker', 'init', copy );
},
destroy: function() {
}
});
});
* @fileOverview 图片压缩
*/
define('runtime/flash/image',[
'runtime/flash/runtime'
], function( FlashRuntime ) {
return FlashRuntime.register( 'Image', {
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 ) {
var $ = Base.$;
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,
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.fileVal, 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');
xhr.on( 'uploadprogress progress', function( e ) {
return me.trigger( 'progress', e.loaded / e.total );
});
xhr.on( 'load', function() {
var status = xhr.exec('getStatus'),
err = '';
xhr.off();
me._xhr = null;
if ( status >= 200 && status < 300 ) {
me._response = xhr.exec('getResponse');
me._responseJson = xhr.exec('getResponseAsJson');
} else if ( status >= 500 && status < 600 ) {
me._response = xhr.exec('getResponse');
me._responseJson = xhr.exec('getResponseAsJson');
err = 'server';
} else {
err = 'http';
}
xhr.destroy();
xhr = null;
return err ? me.trigger( 'error', err ) : me.trigger('load');
});
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 完全版本。
*/
define('preset/all',[
'base',
'widgets/filednd',
'widgets/filepaste',
'widgets/filepicker',
'widgets/image',
'widgets/queue',
'widgets/runtime',
'widgets/upload',
'widgets/validator',
'runtime/html5/blob',
'runtime/html5/dnd',
'runtime/html5/filepaste',
'runtime/html5/filepicker',
'runtime/html5/imagemeta/exif',
'runtime/html5/androidpatch',
'runtime/html5/image',
'runtime/html5/transport',
'runtime/flash/filepicker',
'runtime/flash/image',
'runtime/flash/transport'
], function( Base ) {
return Base;
});
define('webuploader',[
'preset/all'
], function( preset ) {
return preset;
});
return require('webuploader');
});