var textoBarra='Cargando...ĦEspere por favor!';
var imgGif='./imagenes/loaderb64.gif';
var fadeInSpeed = 20;                       // content fade-in speed (0 - 30; 0 = no fading)*
var contentOpacity = 20;                    // content opacity during loading (0 - 100)*
var fin=0;
var cnt2=0;



function LOADER() {
    this.bar, this.iv, this.timer;
    this.imgAll = 0;
    this.opacity = contentOpacity;
    this.opName = '';
    this.limite=0;
    this.tope_limite=50;

    this.getObj = function(id) {
        var obj;
        if(document.getElementById) obj = document.getElementById(id);
        else if(document.all) obj = document.all[id];
        return obj;
    }

    this.hasOpacity = function(obj) {
        if(obj) {
            if(typeof(obj.style.opacity) != 'undefined') return 'opacity';
            if(typeof(obj.style.MozOpacity) != 'undefined') return 'MozOpacity';
            if(typeof(obj.style.KhtmlOpacity) != 'undefined') return 'KhtmlOpacity';
            if(typeof(obj.style.filter) != 'undefined') return 'filter';
        }
        return false;
    }

    this.setOpacity = function(obj, opacity) {
        if(obj && !document.layers) {
            if(this.opName == 'filter') {
                obj.style.filter = 'alpha(opacity=' + opacity + ')';
            }
            else if(this.opName) {
                obj.style[this.opName] = opacity / 100;
            }
        }
    }

    this.fadeIn = function(id) {
        var obj = this.getObj(id);
        if(obj) {
            if(document.all) obj.style.position = 'absolute';
            obj.style.visibility = 'visible';
            if(fadeInSpeed && this.opacity < 100) {
                this.opacity += fadeInSpeed;
                if(this.opacity > 100) this.opacity = 100;
                this.setOpacity(obj, this.opacity);
                if(this.timer) clearTimeout(this.timer);
                this.timer = setTimeout("loader.fadeIn('" + id + "')", 1);
            }
            else {
                this.opacity = 100;
                this.setOpacity(obj, 100);
            }
        }
    }

    this.setBar = function() {
        this.limite = this.limite +1;
        if(this.imgAll < document.images.length) this.imgAll = document.images.length;
        for(var i = cnt = 0; (i < this.imgAll && this.limite< this.tope_limite); i++) {
            if(document.images[i] && document.images[i].complete) cnt++;
            else if(document.images[i].complete == null) cnt++;
        }
        if(this.limite>= this.tope_limite)
            cnt=this.imgAll;
        var mul = 200 / this.imgAll;
        var len = Math.round(cnt * mul);
        if(len > 200) len = 200;
        this.bar.style.width = len + 'px';
        window.status = cnt + ' / ' + this.imgAll;
        //alert('total de imagenes '+this.imgAll);
        if(cnt >= this.imgAll) {
            if(this.iv) clearInterval(this.iv);
            setTimeout('loader.loaded()', 100);
        }
    }

    this.init = function() {
        //alert('total de imagenes '+this.imgAll + ' document: '+document.images.length);
        fadeInSpeed = 20;
        contentOpacity = 20;
        var content = this.getObj('barraContenido');
        this.opName = this.hasOpacity(content);
        if(contentOpacity < 0) contentOpacity = 0;
        else if(contentOpacity > 100) contentOpacity = 100;
        this.setOpacity(content, contentOpacity);
        if(contentOpacity == 100 || (this.opName && contentOpacity)) {
            content.style.visibility = 'visible';
        }
        this.bar = this.getObj('divBar');
        if(document.images && document.images.length) {
            if(this.iv) clearInterval(this.iv);
            this.iv = setInterval('loader.setBar()', 100);
        }
        else this.loaded();
    }

    this.mostrar = function() {
        fadeInSpeed = 20;
        contentOpacity = 20;
        fin=0;
        cnt2=0;
        var content = this.getObj('barraContenido');
        this.opName = this.hasOpacity(content);
        if(contentOpacity < 0) contentOpacity = 0;
        else if(contentOpacity > 100) contentOpacity = 100;
        this.setOpacity(content, contentOpacity);
        if(contentOpacity == 100 || (this.opName && contentOpacity)) {
            content.style.visibility = 'visible';
        }
        this.bar = this.getObj('divBar');
        if(fin==0) {
            if(this.iv) clearInterval(this.iv);
            this.iv = setInterval('loader.setMostrarBar()', 100);
        }
    }
    
    this.setMostrarBar = function() {
        cnt2++;
        var mul = 200 / this.imgAll;
        var len = Math.round(cnt2 * mul);

        if(len > 200 && cnt2<200) len = 200%(200-cnt2);
        else if (len>200 && cnt2==200) len = 200;
        this.bar.style.width = len + 'px';
        if(fin!=0) {
            if(this.iv) clearInterval(this.iv);
        }
    }
    

    this.loaded = function() {
        this.fadeIn('barraContenido');
        var obj = this.getObj('divBarraCarga');
        obj.style.visibility = 'hidden';
    }
}

document.write('<div id="divBarraCarga" class="clsBox">' +
    '<table border=0 cellspacing=0 cellpadding=0><tr>' +
    '<td width=250px height=100px align=center>' +
    '<p class="clsTextSup" align=center>'+textoBarra+'</p>' +
    '<p class="clsImgBar" align=center>&nbsp;</p>' +
     //'<p align=center><img src="'+imgGif+'" alt=""></p>' +
    '<p class="clsTextInf" align=center>'+textoBarra+'</p>' +
    '<table border=0 cellspacing=0 cellpadding=0><tr><td width=200px>' +
    '<div id="divBarBG" class="clsBarBG"><div id="divBar" class="clsBar"></div></div>' +
    '</td></tr></table>' +
    '</td></tr></table></div>' +
    '<div id="barraContenido" style="width:100%; visibility:hidden">');

/*
document.write('<div id="divBarraCarga" class="clsBox">' +
    '<table border=0 cellspacing=0 cellpadding=0><tr>' +
    '<td width=250px height=100px align=center>' +
    '<p class="clsText" align=center>'+textoBarra+'</p>' +
    '<table border=0 cellspacing=0 cellpadding=0><tr><td width=200px>' +
    '<div id="divBarBG" class="clsBarBG"><div id="divBar" class="clsBar"></div></div>' +
    '</td></tr></table>' +
    '</td></tr></table></div>' +
    '<div id="barraContenido" style="width:100%; visibility:hidden">');
 */


var loader = new LOADER();
//loader.mostrar();


function esperar(){
    fin=0;
    cnt2=0;
    delete loader;
    loader = new LOADER();
    
    fadeIn('divBarraCarga');

    loader.mostrar();

}

function terminarEsperar(){
    fin=1;
    cnt2=0;
    loader.loaded();
}