日期:2014-05-16 浏览次数:20414 次
//(function(){ var LoadManager=function() { this.resource; this.loaded=0; this.total; this.finish=false; this.percent=0; this.image=[]; //存储载入的所有图片,其下表为其ID号 this.audio=[]; this.img; //用于临时存储图片 this.ado; this.id; }; LoadManager.prototype._load=function(props){ var id,type,size,src; for(i in props) { if(i=="id") this.id=id=props[i]; if(i=="type") type=props[i]; if(i=="size") size=props[i]; if(i=="src") src=props[i]; } if(type=="img") { this.img = new Image(); this.img.addEventListener("loaded", this._imgLoadedCallBack, false); this.img.src=src; } else if(type=="audio") { this.ado = new Audio(src); this.ado.addEventListener("canplay", this._audioCanplayCallBack, false); this.ado.addEventListener("error", this._audioErrorCallBack, false); this.ado.load(); } }; LoadManager.prototype._imgLoadedCallBack=function(){ this.image[this.id]=this.img; this.loaded++; this.percent=this.loaded/this.total*100; if(this.percent==100) this.finish=true; }; LoadManager.prototype._audioCanplayCallBack=function(){ this.audio[this.id]=this.ado; this.imgLoadedCallBack(); }; LoadManager.prototype.loadAll=function(r){ //此处要求传入一个对象数组 其结构为 id type size src ,id号是所有资源的唯一标识 this.resource=r; this.total=this.resource.length; for(var i=0;i<this.resource.length;i++) { this._load(this.resource[i]); } };
(function(){ var ImageLoader = function(images,loading,complete){ /* * images数据格式如下[{id:img1,src:image1.jpg,size:34},{id:img2,src:image2.jpg,size:50}] */ this.countTotal = images.length; this.img = []; this.images = images; this.loading = loading; this.complete = complete; for(var i = 0;i < this.countTotal;i++){ var imgObj = new Image(); this.img.push(imgObj); } this.loadingIndex = 0; } ImageLoader.prototype.startLoader = function(){ this._loadNext(this.loadingIndex); } ImageLoader.prototype._loadNext = function(index){ this.img[index].src = this.images[index].src; var self = this; this.img[index].onload = function(){ self.loading(this); if(self.loadingIndex < self.countTotal-1){ self.loadingIndex++; self._loadNext(self.loadingIndex); }else{ self.complete(); } } } window['ImageLoader'] = ImageLoader; }());