var porPaginaFotosZoom = 7;
var cantidadFotosZoom = 0;
var paginaFotosZoom = 0;
var actualFotoZoom = 0;
var timeoutRotadorZoom = 0;
var arrayFotosZoom1 = new Array(20);
var arrayFotosZoom2 = new Array(20);
var arrayFotosZoom3 = new Array(20);

var armoFuncionZoom = false;

//variable estatica fea
var imagenActual = "";
var imagenesGrandes = new Array(20);

// Clasificados Usados Zoom

function CargarIFrameZoom(imageSource) {
    imagenActual = imageSource;
    var iframe = document.getElementById('frameImagenZoom');
    //var iframeSource = "/Autos/FrameImagenZoom.aspx";

    var iframeSource = "";
    iframeSource = jQuery.url.setUrl(document.location).attr("path");
    iframeSource = iframeSource.replace(jQuery.url.setUrl(document.location).attr("file"), jQuery.url.setUrl(imageSource).attr("file"));
    iframeSource = iframeSource.replace('/autos/usados', '/autos/usados/imageneszoom');
    iframeSource = iframeSource.replace('/autos/nuevos', '/autos/nuevos/imageneszoom');
    iframeSource = iframeSource.replace('/autos/catalogo', '/autos/catalogo/imagenes');
    iframeSource = iframeSource.toLowerCase().replace('.jpg', '');

    iframe.width = 624;
    iframe.height = 468;
    iframe.scrolling = 'no';

    if (navigator.userAgent.indexOf('MSIE') != -1) {
        iframe.location = iframeSource; // ie
        iframe.src = iframeSource;
    }
    else {
        iframe.src = iframeSource; // firefox & chrome
    }
}

function preloadImage(path) {
    nuevaImagen = new Image;
    nuevaImagen.src = path;
    return nuevaImagen;
}

//callback de la pagina interior del iframe.
function CargarImagenZoomEnIFrame() 
{
    var iframe = document.getElementById('frameImagenZoom');
    var image;
    if (navigator.userAgent.indexOf('MSIE') != -1)
    {
        image = iframe.contentWindow.document.getElementById('imagen'); // ie
    }
    else 
    {
        image = iframe.contentDocument.getElementById('imagen'); // ff y chrome
    }
    
    image.src = imagenActual;
}

function PosicionarZoom(_divPrincipal, _divBarra, _idClasificado, _pathResources, _idImagenClick)
{
    var zoomDiv = document.getElementById(_divPrincipal);
    var zoomDivImagenes = document.getElementById(_divBarra);
    var iframeZoom = $get('iframezoom');

    if (zoomDiv == null) return;

    findTamVentanaPopUp(zoomDiv);

    zoomDiv.style.display = '';

    PosScrollCentradoPopUp(zoomDivImagenes, false, 538, 0);

    if (iframeZoom != null) 
    {
        iframeZoom.style.display = '';
        iframeZoom.style.width = zoomDiv.style.width;
        iframeZoom.style.height = zoomDiv.style.height;
    }

    TraerFotosZoom(_idClasificado, _pathResources, _idImagenClick);
}

function LimpiarIFrame()
{
    imagenActual = "";
    CargarIFrameZoom();
}

function SacarPosicionarZoom(_divPrincipal) 
{
    LimpiarIFrame();

    var divGrande = document.getElementById('divImagenGrandeZoom');
    var divChicas = document.getElementById('divImagenesZoomSlider');

//    while (divGrande.childNodes[0]) {
//        divGrande.removeChild(divGrande.childNodes[0]);
//    }

    while (divChicas.childNodes[0]) {
        divChicas.removeChild(divChicas.childNodes[0]);
    }

    var zoomDiv = document.getElementById(_divPrincipal);
    var iframeZoom = $get('iframezoom');

    zoomDiv.style.display = 'none';
    iframeZoom.style.display = 'none';

    SacarTimeOutZoom();
    DefinirTimeOutImagenClasificado();
}

function TraerFotosZoom(_idClasificado, _pathResources, _idImagenClick)
{
    makeRequestZoom(_idClasificado, _pathResources, _idImagenClick);
}

function makeRequestZoom(_idClasificado, _pathResources, _idImagenClick) {
    try {

        var url = _pathResources + "Webservices/Clasificados/Imagenes.aspx?id=" + _idClasificado;

        http_request = false;
        if (window.XMLHttpRequest) { // Mozilla, Safari,...
            http_request = new XMLHttpRequest();
            if (http_request.overrideMimeType) {
                http_request.overrideMimeType('text/xml');
            }
        } else if (window.ActiveXObject) { // IE
            try {
                http_request = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                    http_request = new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e) { }
            }
        }

        if (!http_request) return false;
        
        http_request.open('GET', url, false);
        http_request.send(null);
        ArmarZoom(_idClasificado, _idImagenClick, http_request.responseXML);
    }
    catch (ex) {
        var error = ex;
    }

}

function ArmarZoom(_idClasificado, _idImagenClick, Xml) 
{
    SacarTimeOutImagenClasificado();

    //var imgClick = document.getElementById(_idImagenClick);
    var imgClick = imagenID;

    var divGrande = document.getElementById('divImagenGrandeZoom');
    var divChicas = document.getElementById('divImagenesZoomSlider');

    cantidadFotosZoom = 0;
    paginaFotosZoom = 1;
    actualFotoZoom = 0;


    
    for (i = 0; i < Xml.getElementsByTagName("imagen").length; i++) 
    {
        var _titulo = DarValorXML(Xml.getElementsByTagName("titulo")[i]);
        var _large = DarValorXML(Xml.getElementsByTagName("large")[i]);
        var _medium = DarValorXML(Xml.getElementsByTagName("medium")[i]);
        var _small = DarValorXML(Xml.getElementsByTagName("small")[i]);
        var _alto = DarValorXML(Xml.getElementsByTagName("alto")[i]);
        var _ancho = DarValorXML(Xml.getElementsByTagName("ancho")[i]);

        document.getElementById('tituloZoom').innerHTML = _titulo;

//        var imgPrincipal = document.createElement("IMG");
//        imgPrincipal.id = "idPrincipalZoom" + i;
//        imgPrincipal.style.display = "none";

//        divGrande.appendChild(imgPrincipal);

        imagenesGrandes[i] = preloadImage(_large);

        //asignarClasificadoZoom("idPrincipalZoom" + i, _large, _alto, _ancho, 468, 624)

//        if ((imgClick != null && imgClick.src == _medium) || (imgClick == null & i == 0))
        if ((imgClick != null && imgClick == _medium) || (imgClick == null & i == 0))
        {
            //changeClasificadoZoom("idPrincipalZoom" + i, -1, -1);
            changeClasificadoZoom(i, -1, -1);

            actualFotoZoom = i;
            if ((actualFotoZoom + 1) > porPaginaFotosZoom) {
                paginaFotosZoom = 2;
                moverImagenesZoom('divImagenesZoom', 1, 0.2);
            }
        }
            
        var imgChicha = document.createElement("IMG");
        imgChicha.id = "idChicaZoom" + i;
        //imgChicha.setAttribute('onclick', 'changeClasificadoZoom("idPrincipalZoom' + i + '",' + i + ', -1)');
        imgChicha.setAttribute('onclick', 'changeClasificadoZoom(' + i + ',' + i + ', -1)');

        divChicas.appendChild(imgChicha);

        asignarClasificadoZoom("idChicaZoom" + i, _small, _alto, _ancho, 53, 70)

        arrayFotosZoom1[i] = _large;
        arrayFotosZoom2[i] = _alto;
        arrayFotosZoom3[i] = _ancho;

        cantidadFotosZoom++;
    }

    var botonAnterior = document.getElementById('anteriorZoom');
    botonAnterior.className = botonAnterior.className.replace(' disabled', '');
    botonAnterior.className = botonAnterior.className + ' disabled';

    var botonSiguiente = document.getElementById('siguienteZoom');
    botonSiguiente.className = botonSiguiente.className.replace(' disabled', '');
    if (cantidadFotosZoom <= porPaginaFotosZoom)
        botonSiguiente.className = botonSiguiente.className + ' disabled';
    
    if (!armoFuncionZoom) {

        armoFuncionZoom = true;

        $clasificadosZoom.serialScroll({
            items: 'img',
            next: $clasificadosZoom, // the container itself will get bound
            duration: 1100,
            force: true,
            axis: 'x',
            step: 7, //scroll 1 news each time
            event: 'showNextZoom' //just a random event name
        });

        $clasificadosZoom.serialScroll({
            items: 'img',
            next: $clasificadosZoom, // the container itself will get bound
            duration: 1100,
            force: true,
            axis: 'x',
            step: -7, //scroll 1 news each time
            event: 'showPreviousZoom' //just a random event name
        });
    
    }

    DefinirTimeOutZoom();
}

var moverImagenDefecto = 310;

function moverImagenesZoom(idImagen, tipoMover, durationMover) {
    var divImagen = document.getElementById(idImagen);
    var divImagen2 = document.getElementById("divImagenesRepeater");

    if (tipoMover < 0) {
        moverImagen = moverImagenDefecto * (-1);
        accionMover = 'showPreviousZoom';
    }
    else {
        moverImagen = moverImagenDefecto;
        accionMover = 'showNextZoom';
    }

    var mover = false;
    if (tipoMover < 0 && divImagen.scrollLeft > 0) mover = true;
    if (tipoMover > 0 && divImagen.scrollLeft + moverImagen <= divImagen2.offsetWidth - 20) mover = true;

    if (mover) $clasificadosZoom.trigger(accionMover);        
}

function asignarClasificadoZoom(strImg, pIMG, altoImg, anchoImg, altoMax, anchoMax) {
    target = document.getElementById(strImg);
    if (target) {
        var alto = altoMax; /*468;*/
        var ancho = anchoMax; /*624;*/
        var nuevoWidth;
        var nuevoHeight;

        if (anchoImg / altoImg > ancho / alto) {
            nuevoWidth = ancho;
            nuevoHeight = Math.round((altoImg * ancho) / anchoImg);
        }
        else {
            nuevoHeight = alto;
            nuevoWidth = Math.round((anchoImg * alto) / altoImg);
        }
        target.style.width = "".concat(nuevoWidth, "px");
        target.style.height = "".concat(nuevoHeight, "px");
        //target.style.marginTop = "".concat((alto - this.height) / 2, "px");
        target.src = pIMG;        
    }
}

function changeClasificadoZoom(strImg, actual, anterior) {
    target = document.getElementById(strImg);
    if (target) {

        if (actual != -1 || anterior != -1) {
            if (anterior == -1) anterior = actualFotoZoom;
            var anteriorImg = document.getElementById("idPrincipalZoom" + anterior);
            anteriorImg.style.display = 'none';
        }

        CargarIFrameZoom(target.src);
        target.style.display = '';
        
        if (actual != -1) actualFotoZoom = actual;
    } else {
        CargarIFrameZoom(imagenesGrandes[strImg].src);
        if (actual != -1) actualFotoZoom = actual;
    
    }
}

function AnteriorZoom() 
{
    ZoomAnterior(true);
}

function SiguienteZoom() 
{
    ZoomSiguiente(true);
}

function SacarTimeOutZoom() {
    if (timeoutRotadorZoom != 0) {
        clearTimeout(timeoutRotadorZoom);
        timeoutRotadorZoom = 0;
    }
}

function DefinirTimeOutZoom() {
    timeoutRotadorZoom = setTimeout(function() { ZoomSiguiente(false) }, 10000);
}

function ZoomSiguiente(sacarTime) {
    if (timeoutRotadorZoom == 0 && !sacarTime) return;
    if (sacarTime) SacarTimeOutZoom();

    var anteriorZoom = actualFotoZoom;

    actualFotoZoom++;
    if (actualFotoZoom > (cantidadFotosZoom - 1)) {
        actualFotoZoom = anteriorZoom;
        return;
    }        

    var _large = arrayFotosZoom1[actualFotoZoom];
    var _alto = arrayFotosZoom2[actualFotoZoom];
    var _ancho = arrayFotosZoom3[actualFotoZoom];

    //changeClasificadoZoom("idPrincipalZoom" + actualFotoZoom, -1, anteriorZoom)
    changeClasificadoZoom(actualFotoZoom, -1, anteriorZoom)

    DefinirTimeOutZoom();

    if (anteriorZoom == (porPaginaFotosZoom - 1) && cantidadFotosZoom > porPaginaFotosZoom) {
        paginaFotosZoom = 2;
        moverImagenesZoom('divImagenesZoom', 1, 0.2);
    }

    if (paginaFotosZoom == 2) {
        var botonSiguiente = document.getElementById('siguienteZoom');
        botonSiguiente.className = botonSiguiente.className + ' disabled';
    }

    if (paginaFotosZoom > 1) {
        var botonAnterior = document.getElementById('anteriorZoom');
        botonAnterior.className = botonAnterior.className.replace(' disabled', '');
    }
}

function ZoomAnterior(sacarTime) {
    if (timeoutRotadorZoom == 0 && !sacarTime) return;
    if (sacarTime) SacarTimeOutZoom();

    var anteriorZoom = actualFotoZoom;

    actualFotoZoom--;
    if (actualFotoZoom < 0) {
        actualFotoZoom = anteriorZoom;
        return;
    }
            
    var _large = arrayFotosZoom1[actualFotoZoom];
    var _alto = arrayFotosZoom2[actualFotoZoom];
    var _ancho = arrayFotosZoom3[actualFotoZoom];

    //changeClasificadoZoom("idPrincipalZoom" + actualFotoZoom, -1, anteriorZoom)
    changeClasificadoZoom(actualFotoZoom, -1, anteriorZoom)

    DefinirTimeOutZoom();

    if (anteriorZoom == porPaginaFotosZoom && cantidadFotosZoom > porPaginaFotosZoom) {
        paginaFotosZoom = 1;
        moverImagenesZoom('divImagenesZoom', -1, 0.2);
    }

    if (paginaFotosZoom == 1) {
        var botonAnterior = document.getElementById('anteriorZoom');
        botonAnterior.className = botonAnterior.className + ' disabled';
    }

    if (paginaFotosZoom != 2) {
        var botonSiguiente = document.getElementById('siguienteZoom');
        botonSiguiente.className = botonSiguiente.className.replace(' disabled', '');
    }
}