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);
}

//juan roman
var urlfoto = "";

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;':'')+'">';
                        
                        //png cerrar ventana:
//                        html += '<img src="'+this.scriptPath+'/visor_close.png" onClick="'+this.name+'.close()" /></div>';
                        html += '</div>';

                        //Botones AVANCE
                        html +='<div id="botonizq" class="conteBoton" style="left:0px;">';
                            html +='<div id="'+this.name+'_previo" class="avanceBoton" style="background-image:url(img/icons/botonAvance-izq.png);"></div>';
                        html +='</div>';
                         html +='<div id="botondcha" class="conteBoton" style="right:0px;">';
                            html +='<div id="'+this.name+'_siguiente" class="avanceBoton" style="background-image:url(img/icons/botonAvance-dcha.png);"></div>';
                        html +='</div>';
                        
                        //Muestracuadros adelante / atras:
                        //ATRAS
                       html += '<div id="izq" class="avance" onmouseover="jspopviewer.avance(\'previo\',\'mostrar\');" onmouseout="jspopviewer.avance(\'previo\',\'ocultar\');"></div>';
                       //ADELANTE
                       html += '<div id="dcha" class="avance" style="right:0px;" onmouseover="jspopviewer.avance(\'siguiente\',\'mostrar\');" onmouseout="jspopviewer.avance(\'siguiente\',\'ocultar\');"></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) {
        urlfoto = obj;
        var nFoto = jspopviewer.open.arguments[1];
        if(nFoto == 'fotoUnica'){
            _oid('izq').style.display = 'none';
            _oid('dcha').style.display = 'none';
            _oid(this.name+'_previo').style.display = 'none';
            _oid(this.name+'_siguiente').style.display = 'none';
            _oid('botonizq').style.display = 'none';
            _oid('botondcha').style.display = 'none';
        }else{
            _oid('izq').style.display = 'block';
            _oid('dcha').style.display = 'block';
            _oid('botonizq').style.display = 'block';
            _oid('botondcha').style.display = 'block';
        }

        _oid(this.name+'_previo').style.display = 'none';
        _oid(this.name+'_siguiente').style.display = 'none';

        if(nFoto == 'primera'){
            _oid('izq').style.display = 'none';
        }
        if(nFoto == 'ultima'){
            _oid('dcha').style.display = 'none';
        }
        
	var url = obj;

	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; }
	//Juan Roman:
	fondOscuro('abre');
        this.colocAvances(urlfoto);
}

//juan roman
JSPopViewer.prototype.colocAvances = function(urlf) {
    _oid('izq').innerHTML = '<div id="" style="position:relative;left:0px;top:0px;width:150px;height:100%;background-color:#000;" onclick="avanzaFoto(\''+urlf+'\',-1);"></div>';
    _oid('dcha').innerHTML = '<div id="" style="position:relative;left:0px;top:0px;width:150px;height:100%;background-color:#000;" onclick="avanzaFoto(\''+urlf+'\',1);"></div>';
}

JSPopViewer.prototype.close = function() {
	this.visible = false;
	this.url = "";
	//Juan Roman:
	fondOscuro('cierra');
}

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 (Close)";
		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.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; }

////JUAN ROMAN
JSPopViewer.prototype.avance = function(x,y) {
    switch (x){
        case 'previo':
            if(this.ie&&this.ie<7){
                (y == 'mostrar')? document.all[this.name+'_previo'].style.display = 'block' : document.all[this.name+'_previo'].style.display = 'none';
                break;
            } else {
                (y == 'mostrar')? _oid(this.name+'_previo').style.display = 'block' : _oid(this.name+'_previo').style.display = 'none';
                break;
            }
        case 'siguiente':
            if(this.ie&&this.ie<7){
                (y == 'mostrar')? document.all[this.name+'_previo'].style.display = 'block' : document.all[this.name+'_previo'].style.display = 'none';
                break;
            } else {
                (y == 'mostrar')?  _oid(this.name+'_siguiente').style.display = 'block' : _oid(this.name+'_siguiente').style.display = 'none';
                break;
            }
    }
}

