function JSPopViewer(_name, path) {

	this.ie = false;
	this.name = _name;
	
	// Animation
	this.fps = 20;
	this.velocity = 0.3;
	this.bounceX = 0.3;
	this.bounceY = 0.3;
	
	this.scriptPath = path;
	
	this.visible = false;
	this.loading = false;
	this.itsvisible = false;
	this.drag = false;
	
	this.shadows = new Array();
	this.window = null;
	this.view = null;
	this.content = null;
	this.image = null;
	this.preimage = null;
	this.b_close = null;
	this.url = "";
	
	this.x = 0;
	this.y = 0;
	this.w = this.vw = 0;
	this.h = this.vh = 0;
	this.o = 0;
	this.dw = 0;
	this.dh = 0;
	
	this.nextFrame = null;
	
	this.getScreenDimensions();
	
	if (document.all) this.ie = parseFloat(navigator.appVersion.split(";")[1].split("MSIE").join(""));
	else this.ie = false;
	
	this.createWindow();
	this.start();
}

JSPopViewer.prototype.start = function() {
	this.stop();
	this.intervalId = setInterval(this.name+".move()", 1000/this.fps);
}
	
JSPopViewer.prototype.stop = function() {
	if (this.intervalId) clearInterval(this.intervalId);
}
	
JSPopViewer.prototype.createWindow = function() {

		// CSS load
		document.write('<link rel=stylesheet href="'+this.scriptPath+'/JSPopViewer.css">');
		
		var html =  '<div id="'+this.name+'" class="JSPopViewer" style="display:none">';
			html += '<div id="'+this.name+'_close" class="JSPopViewer_close" style="'+(this.ie&&this.ie<7?'top:26px':'')+'"><img src="'+this.scriptPath+'/visor_close.png" onClick="'+this.name+'.close()"></div>';
		
		if (!this.ie || this.ie > 6) {
			html += '<div class="JSPopViewer_shadow0">';
			html += '<div class="JSPopViewer_shadow1">';
			html += '<div class="JSPopViewer_shadow2">';
			html += '<div class="JSPopViewer_shadow3">';
			html += '<div class="JSPopViewer_shadow4">';
			html += '<div class="JSPopViewer_shadow5">';
			html += '<div class="JSPopViewer_shadow6">';
			html += '<div class="JSPopViewer_shadow7">';
		}

		html += '<div id="'+this.name+'_content" class="JSPopViewer_content"><img style="display:none" id="'+this.name+'_img" onClick="'+this.name+'.close()"><div id="'+this.name+'_loading" class="JSPopViewer_preloader"><img src="'+this.scriptPath+'/preload.gif">Cargando imagen</div></div>';
		
		if (!this.ie || this.ie > 6) html += '</div></div></div></div></div></div></div></div>';
		
		html += '</div><img style="visibility:hidden;position:absolute;top:0px;left:0px;" id="'+this.name+'_preimg" onLoad="'+this.name+'.loadComplete()">';
		
		//Incrustamos el codigo
		document.getElementsByTagName("body")[0].innerHTML += html;
		
		if (this.ie) { 
			this.window = document.all[this.name];
			this.content = document.all[this.name+"_content"];
			this.image = document.all[this.name+"_img"];
			this.preimage = document.all[this.name+"_preimg"];
			this.preloader = document.all[this.name+"_loading"];
			this.b_close = document.all[this.name+"_close"];
		} else {
			this.window = document.getElementById(this.name);
			this.content = document.getElementById(this.name+"_content");
			this.image = document.getElementById(this.name+"_img");
			this.preimage = document.getElementById(this.name+"_preimg");
			this.preloader = document.getElementById(this.name+"_loading");
			this.b_close = document.getElementById(this.name+"_close");
		}
		
		this.window.style.display = "none";
				
	}

JSPopViewer.prototype.open = function(obj) {

	var url;
	
	if (typeof(obj) == "string") url = obj;
	else url = obj.src;

	if (url != this.url) {
	
		this.getScreenDimensions();

		this.window.style.display = "block";
		this.visible = true;
		this.loading = true;
		this.url = url;
		this.preloader.style.display = "block";
		if (!this.itsvisible) {
			this.image.style.display = "none";
			this.w = this.content.offsetWidth;
			this.h = this.content.offsetHeight;
			this.vw = this.vh = 0;
			this.b_close.style.display = "none";
		} else {
			this.image.style.opacity = .5;
			//this.window.style.filter="alpha(opacity:50)";
		}
		this.dw = this.content.offsetWidth;
		this.dh = this.content.offsetHeight;
		this.itsvisible = true;
		
	}
	// IE necesita esperar
	this.nextFrame = function() { this.preimage.src = this.url; }
}
	
JSPopViewer.prototype.close = function() {
	this.visible = false;
	this.url = "";
}

JSPopViewer.prototype.getScreenDimensions = function() {
	this.stageWidth = window.innerWidth || document.body.offsetWidth;
	this.stageHeight = window.innerHeight || document.body.offsetHeight;
	this.middleWidth = (this.ie?document.body.scrollLeft:window.pageXOffset) + this.stageWidth/2;
	this.middleHeight = (this.ie?document.body.scrollTop:window.pageYOffset) + this.stageHeight/2;
}
	
JSPopViewer.prototype.loadComplete = function() {

		this.loading = false;
			
		this.getScreenDimensions();

		this.dw = this.preimage.width || this.preimage.offsetWidth;
		this.dh = this.preimage.height || this.preimage.offsetHeight;
		
		this.image.src = this.url;
		this.image.style.opacity = 1;
		//this.window.style.filter="alpha(opacity:100)";
		this.image.style.display = "";
		this.image.alt = this.image.title = "Pinche para cerrar la imagen.";
		this.b_close.style.display = "block";
		
		this.preloader.style.display = "none";
		
	}
	
JSPopViewer.prototype.selectImageTag = function(ext) {
		if (this.ie) this.image = document.all[this.name+"_"+ext];
		else this.image = document.getElementById(this.name+"_"+ext);
	}
	
JSPopViewer.prototype.startDrag = function() {
	this.drag = true;
}

JSPopViewer.prototype.stopDrag = function() {
	this.drag = false;
	this.close();
}
	
JSPopViewer.prototype.move = function() {

	// POSICION Y ESCALA
	if (this.window && this.itsvisible) {
					
		if (!this.loading) {
			//this.w += (this.dw - this.w) / this.velocity;
			//this.h += (this.dh - this.h) / this.velocity;
		
			this.vw = this.vw * this.velocity + (this.dw - this.w) * this.bounceX;
			this.vh = this.vh * this.velocity + (this.dh - this.h) * this.bounceY;
		
			this.w += Math.round(this.vw);
			this.h += Math.round(this.vh);
			
			this.image.style.width = Math.round(this.w)+"px";
			this.image.style.height = Math.round(this.h)+"px";
		} 
		
		this.x = this.middleWidth - this.w/2;
		this.y = Math.max(10, this.middleHeight - this.h/2);
		this.window.style.left = Math.round(this.x)+"px";
		this.window.style.top = Math.round(this.y)+"px";
		
		// OPACIDAD
		if (this.visible) {
			this.itsvisible = true;
			if (this.o < 1) {
				this.o += .2;
				this.window.style.display = "block";
				if (!this.ie) this.window.style.opacity=this.o;
				//else this.window.style.filter="alpha(opacity:"+Math.round(this.o*100)+")";
			}
		} else {
			if (this.o > 0 && !this.ie) {
				this.o -= .2;
				if (!this.ie) this.window.style.opacity=this.o;
				//else this.window.style.filter="alpha(opacity:"+Math.round(this.o*100)+")";
			} else {
				// CIERRE
				this.itsvisible = false;
				this.image.src = null;
				this.preimage.src = null;
				this.image.style.width = "0px";
				this.image.style.height = "0px";
				this.image.style.display = "none";
				this.preloader.style.display = "block";
				this.window.style.display = "none";
				this.w = 0;
				this.h = 0;
			}
		}
	}
	
	if (typeof(this.nextFrame) == "function") { this.nextFrame(); this.nextFrame = null; }
}

JSPopViewer.prototype.getName = function() { return this.name; }