define(function(require, exports, module) {
var $ = require('jquery');
var Class = require('./class');
function isFunc(f) {
return Object.prototype.toString.apply(f) === '[object Function]';
}
/**
* 這個(gè)基類(lèi)可以讓普通的類(lèi)具備事件驅(qū)動(dòng)的能力
* 提供類(lèi)似jq的on off trigger方法，不考慮one方法，也不考慮命名空間
* 舉例：
* var e = new EventBase();
* e.on('load', function(){
* console.log('loaded');
* });
* e.trigger('load');//loaded
* e.off('load');
*/
var EventBase = Class({
instanceMembers: {
init: function () {
this.events = {};
//把$.Callbacks的flag設(shè)置成一個(gè)實(shí)例屬性，以便子類(lèi)可以覆蓋
this.CALLBACKS_FLAG = 'unique';
},
on: function (type, callback) {
type = $.trim(type);
//如果type或者callback參數(shù)無(wú)效則不處理
if (!(type && isFunc(callback))) return;
var event = this.events[type];
if (!event) {
//定義一個(gè)新的jq隊(duì)列，且該隊(duì)列不能添加重復(fù)的回調(diào)
event = this.events[type] = $.Callbacks(this.CALLBACKS_FLAG);
}
//把callback添加到這個(gè)隊(duì)列中，這個(gè)隊(duì)列可以通過(guò)type來(lái)訪問(wèn)
event.add(callback);
},
off: function (type, callback) {
type = $.trim(type);
if (!type) return;
var event = this.events[type];
if (!event) return;
if (isFunc(callback)) {
//如果同時(shí)傳遞type跟callback，則將callback從type對(duì)應(yīng)的隊(duì)列中移除
event.remove(callback);
} else {
//否則就移除整個(gè)type對(duì)應(yīng)的隊(duì)列
delete this.events[type];
}
},
trigger: function () {
var args = [].slice.apply(arguments),
type = args[0];//第一個(gè)參數(shù)轉(zhuǎn)為type
type = $.trim(type);
if (!type) return;
var event = this.events[type];
if (!event) return;
//用剩下的參數(shù)來(lái)觸發(fā)type對(duì)應(yīng)的回調(diào)
//同時(shí)把回調(diào)的上下文設(shè)置成當(dāng)前實(shí)例
event.fireWith(this, args.slice(1));
}
}
});
return EventBase;
});

define(function(require, exports, module) {
var $ = require('jquery');
var Class = require('./class');
var EventBase = require('./eventBase');
var DEFAULTS = {
data: [], //要展示的數(shù)據(jù)列表，列表元素必須是object類(lèi)型的，如[{url: 'xxx.png'},{url: 'yyyy.png'}]
sizeLimit: 0, //用來(lái)限制BaseView中的展示的元素個(gè)數(shù)，為0表示不限制
readonly: false, //用來(lái)控制BaseView中的元素是否允許增加和刪除
onBeforeRender: $.noop, //對(duì)應(yīng)beforeRender事件，在render方法調(diào)用前觸發(fā)
onRender: $.noop, //對(duì)應(yīng)render事件，在render方法調(diào)用后觸發(fā)
onBeforeAppend: $.noop, //對(duì)應(yīng)beforeAppend事件，在append方法調(diào)用前觸發(fā)
onAppend: $.noop, //對(duì)應(yīng)append事件，在append方法調(diào)用后觸發(fā)
onBeforeRemove: $.noop, //對(duì)應(yīng)beforeRemove事件，在remove方法調(diào)用前觸發(fā)
onRemove: $.noop //對(duì)應(yīng)remove事件，在remove方法調(diào)用后觸發(fā)
};
/**
* 數(shù)據(jù)解析，給每個(gè)元素的添加一個(gè)唯一標(biāo)識(shí)_uuid，方便查找
*/
function resolveData(ctx, data){
var time = new Date().getTime();
return $.map(data, function(d){
d._uuid = '_uuid' + time + Math.floor(Math.random() * 100000);
});
}
var FileUploadBaseView = Class({
instanceMembers: {
init: function (options) {
this.base();
this.options = this.getOptions(options);
},
getOptions: function(options) {
return $.extend({}, DEFAULTS, options);
},
render: function(){
},
append: function(data){
},
remove: function(prop){
}
},
extend: EventBase
});
return FileUploadBaseView;
});

define(function(require, exports, module) {
var $ = require('jquery');
var Class = require('./class');
/**
* 這個(gè)基類(lèi)可以讓普通的類(lèi)具備jquery對(duì)象的事件管理能力
*/
var EventBase = Class({
instanceMembers: {
init: function (_jqObject) {
this._jqObject = _jqObject && _jqObject instanceof $ && _jqObject || $({});
},
on: function(){
return $.fn.on.apply(this._jqObject, arguments);
},
one: function(){
return $.fn.one.apply(this._jqObject, arguments);
},
off: function(){
return $.fn.off.apply(this._jqObject, arguments);
},
trigger: function(){
return $.fn.trigger.apply(this._jqObject, arguments);
}
}
});
return EventBase;
});

define(function(require, exports, module) {
var $ = require('jquery');
var Class = require('mod/class');
var EventBase = require('mod/eventBase');
var Demo = window.demo = Class({
instanceMembers: {
init: function (element,options) {
this.$element = $(element);
this.base(this.$element);
//添加監(jiān)聽(tīng)
this.on('beforeRender', $.proxy(options.onBeforeRender, this));
this.on('render', $.proxy(options.onRender, this));
},
render: function () {
//觸發(fā)beforeRender事件
var e = $.Event('beforeRender');
this.trigger(e);
if(e.isDefaultPrevented())return;
//主要邏輯代碼
console.log('render complete!');
//觸發(fā)render事件
this.trigger('render');
}
},
extend: EventBase
});
var demo = new Demo('#demo', {
onBeforeRender: function(e) {
console.log('beforeRender event triggered!');
},
onRender: function(e) {
console.log('render event triggered!');
}
});
demo.render();
});

define(function(require, exports, module) {
var $ = require('jquery');
var Class = require('mod/class');
var EventBase = require('mod/eventBase');
var Demo = window.demo = Class({
instanceMembers: {
init: function (element,options) {
this.$element = $(element);
this.base(this.$element);
//添加監(jiān)聽(tīng)
this.on('beforeRender', $.proxy(options.onBeforeRender, this));
this.on('render', $.proxy(options.onRender, this));
},
render: function () {
//觸發(fā)beforeRender事件
var e = $.Event('beforeRender');
this.trigger(e);
if(e.isDefaultPrevented())return;
//主要邏輯代碼
console.log('render complete!');
//觸發(fā)render事件
this.trigger('render');
}
},
extend: EventBase
});
var demo = new Demo('#demo', {
onBeforeRender: function(e) {
console.log('beforeRender event triggered!');
},
onRender: function(e) {
console.log('render event triggered!');
}
});
demo.on('beforeRender', function(e) {
e.preventDefault();
console.log('beforeRender event triggered 2!');
});
demo.on('beforeRender', function(e) {
console.log('beforeRender event triggered 3!');
});
demo.render();
});

define(function(require, exports, module) {
var $ = require('jquery');
var Class = require('mod/class');
var EventBase = require('mod/eventBase');
var Demo = window.demo = Class({
instanceMembers: {
init: function (options) {
this.base();
//添加監(jiān)聽(tīng)
this.on('beforeRender', $.proxy(options.onBeforeRender, this));
this.on('render', $.proxy(options.onRender, this));
},
render: function () {
//觸發(fā)beforeRender事件
var e = $.Event('beforeRender');
this.trigger(e);
if(e.isDefaultPrevented())return;
//主要邏輯代碼
console.log('render complete!');
//觸發(fā)render事件
this.trigger('render');
}
},
extend: EventBase
});
var demo = new Demo({
onBeforeRender: function(e) {
console.log('beforeRender event triggered!');
},
onRender: function(e) {
console.log('render event triggered!');
}
});
demo.render();
});

define(function(require, exports, module) {
var $ = require('jquery');
var Class = require('mod/class');
var EventBase = require('mod/eventBase');
var Demo = window.demo = Class({
instanceMembers: {
init: function (options) {
this.base();
//添加監(jiān)聽(tīng)
this.on('beforeRender', $.proxy(options.onBeforeRender, this));
this.on('render', $.proxy(options.onRender, this));
},
render: function () {
//觸發(fā)beforeRender事件
var e = $.Event('beforeRender');
this.trigger(e);
if(e.isDefaultPrevented())return;
//主要邏輯代碼
console.log('render complete!');
//觸發(fā)render事件
this.trigger('render');
}
},
extend: EventBase
});
var demo = new Demo({
onBeforeRender: function(e) {
console.log('beforeRender event triggered!');
},
onRender: function(e) {
console.log('render event triggered!');
}
});
demo.on('beforeRender', function(e) {
e.preventDefault();
console.log('beforeRender event triggered 2!');
});
demo.on('beforeRender', function(e) {
console.log('beforeRender event triggered 3!');
});
demo.render();
});