imagequeue.js

网页上经常会用到的树状结构源代码,模拟文件夹方式,采用ajax方式动态加载数据,避免一次性加载带来的数据量过大的效率问题.

function _eventBanding(o, event, cb){
	if(o.addEventListener){
		o.addEventListener(event, cb, false);
	}
	else{
		o.attachEvent("on" + event, cb);
	}
}
function RayeImageQueue(timeOut){
	this.loadingImage = null;
	this.queue = Array();
	this.timeOut = timeOut || 2000;
	this.loading = false;
	this.current = -1;
	this.timeHandle = null;
	this.failure = false;
}
var __p = RayeImageQueue.prototype;
__p.start = function(){
	if(false == this.loading){
		if(this.current < this.queue.length - 1){
			this.current ++;
			this.loading = true;
			this.failure = false;
			this.loadingImage = new Image;
			var co = this.queue[this.current];
			var io = this.loadingImage;
			var oThis = this;
var lc = function(){
var tcb = function(w, h){
	if(null == co.param){
		co.cb(w, h);
	}
	else{
		co.cb(co.param, w, h);
	}
};
if(false == co.loaded){
	if(oThis.failure){
		tcb(-1, -1);
	}
	else{
		clearTimeout(oThis.timeHandle);
		tcb(io.width, io.height);
	}
	co.loaded = true;
}
delete io;
io = null;
oThis.loading = false;
setTimeout(function(){
	oThis.start();
}
, 100);
};
_eventBanding(this.loadingImage, "load", lc);
io.src = co.src;
this.timeHandle = setTimeout(function(){
	oThis.failure = true;
	lc();
}
,this.timeOut);
}
}
}
__p.clear = function(){
	this.queue = Array();
	this.loading = false;
	this.current = -1;
	clearTimeout(this.timeHandle);
	this.timeHandle = null;
}
__p.addQueue = function(src, cb, param){
	if(!/\:\/\//.test(src)){
	if(src.substr(0,1) == "/"){
		src = "http://" + location.host + src;
	}
	else{
		var p = location.href;
		p = p.substr(0, p.lastIndexOf("/") + 1);
		src = p + src;
	}
}
this.queue[this.queue.length] ={
	src:src, cb:cb, param:param || null, loaded:false
};
this.start();
}