if(!SAPO.Widget || typeof(SAPO.Widget) == 'undefined') {
    SAPO.namespace('Widget');
}

SAPO.Widget.NavVideos = function(element, dataObject, options)
{
    this.init(element, dataObject, options);
};

SAPO.Widget.NavVideos.prototype = {

    init: function(element, dataObject)
    {
        var options = Object.extend({
                lines: 2,
                columns: 3,
                jump: false,
                navLeft: false,
                navRight: false,
                template: false,
                callback: false,
                pagesDiv: false,
                pagesDesc: false,
                ajaxData: false,
                countTotal: false
                }, arguments[2] || {});

        try {
            this.options = options;

            this.element = document.getElementById(element);
            if(this.options.navLeft) {
              this.elmLeft = document.getElementById(this.options.navLeft);
            }
            if(this.options.navRight) {
              this.elmRight = document.getElementById(this.options.navRight);
            }

            this.dataObject = dataObject;
            if(this.options.template) {
                this.templating = new SAPO.Utility.Templating();
            }

            this.currentPage = 0;

            this.totalPerPage = Number(this.options.lines) * Number(this.options.columns);
            if(!this.options.jump) {
                this.options.jump = Number(this.totalPerPage);
            }

            if(typeof(this.options.pagesDiv)=='string'){
                this.options.pagesDiv = new Array(this.options.pagesDiv);
            }

            if(typeof(this.options.pagesDesc)=='string'){
                this.options.pagesDesc = new Array(this.options.pagesDesc);
            }

            if(this.options.pagesDiv) {
                this.pagesDiv = new Array(this.options.pagesDiv.length);
                for (var i = 0; i < this.options.pagesDiv.length; i++) {
                  this.pagesDiv[i] = document.getElementById(this.options.pagesDiv[i]);
                }
            } else {
                this.pagesDiv = false; 
            }

            if(this.options.pagesDesc) {
                this.pagesDesc = new Array(this.options.pagesDesc.length);
                for (var i = 0; i < this.options.pagesDesc.length; i++) {
                  this.pagesDesc[i] = document.getElementById(this.options.pagesDesc[i]);
                }
            } else {
                this.pagesDesc = false; 
            }

            this.setButtonEvents();
            this.verifyAjax(this.currentPage / this.totalPerPage);
            this.writeTemplate(this.currentPage); 
        } catch(e) {alert(e.message);}
    },

    setButtonEvents: function()
    {   
        if(this.elmLeft) {
          Event.observe(this.elmLeft, 'click', this.goLeft.bindAsEventListener(this));
        }
        if(this.elmRight) {
          Event.observe(this.elmRight, 'click', this.goRight.bindAsEventListener(this));
        }
    },

    writeTemplate: function(curPage)
    {
        this.clearElement();
        var start = curPage;

        var end = curPage + this.totalPerPage;
        if(this.options.ajaxData){
          end = this.dataObject.length;
        }
        if(end > this.dataObject.length) {
            end = this.dataObject.length;
        }
        if(curPage == 0 && this.elmLeft) {
            this.elmLeft.style.visibility = 'hidden';
        } else if(this.elmLeft){
            this.elmLeft.style.visibility = 'visible';
        }
        if(this.options.ajaxData){
             if((Math.ceil(curPage/ this.totalPerPage) == Math.ceil(this.options.countTotal / this.totalPerPage)-1
             || this.options.countTotal==0) && this.elmRight) {
                 this.elmRight.style.visibility = 'hidden';
             } else if(this.elmRight) {
                 this.elmRight.style.visibility = 'visible';
             }
       }else{
             if(end == this.dataObject.length && this.elmRight) {
                 this.elmRight.style.visibility = 'hidden';
             } else if(this.elmRight) {
                 this.elmRight.style.visibility = 'visible';
             }
        }
        var next = curPage;
        if(this.options.ajaxData){
           next = 0;
        }
        var source = false;
        do {
            var source = this.templating.gen(this.options.template, this.dataObject[next]);
            if(source) {
                this.element.innerHTML += source;
            }
            next++;
        } while(next < end);

        this.writePagination(); 
    },

    goLeft: function(e)
    {
        this.currentPage -= this.options.jump;
        if(this.currentPage >= 0) {
            this.verifyAjax(this.currentPage / this.totalPerPage);
            this.writeTemplate(this.currentPage);
            if(this.options.callback){
                eval(this.options.callback+'()');
            }
        } else {
            this.currentPage += this.options.jump;
        }
    },

    goRight: function(e)
    {
        var numPages = 0;
        if(this.options.ajaxData){
            numPages = Math.ceil(this.options.countTotal / this.totalPerPage);
        }else{
            numPages = Math.ceil(this.dataObject.length / this.totalPerPage);
        }
        this.currentPage += this.options.jump;
        if(this.currentPage < (this.totalPerPage * numPages)) {
            this.verifyAjax(this.currentPage / this.totalPerPage);
            this.writeTemplate(this.currentPage);
            if(this.options.callback){
                eval(this.options.callback+'()');
            }
        } else {
            this.currentPage -= this.options.jump;
        }

    },

    goPage: function(e)
    {
        var link = Event.findElement(e, 'a');
        var page = parseInt(link.href.substr(link.href.lastIndexOf('#')+1));
        this.currentPage = (page - 1) * this.totalPerPage;
        this.verifyAjax(page - 1);
        this.writeTemplate(this.currentPage);
        if(this.options.callback){
            eval(this.options.callback+'()');
        }
    },

    verifyAjax: function(page)
    {
        if(this.options.ajaxData){
            new Ajax.Request(this.options.ajaxData, {parameters:'rd='+Math.random()+'&page='+page, method:'get', asynchronous:false, onSuccess:this.verifyAjaxSuccess.bind(this)});
        }
    },
    
    verifyAjaxSuccess: function(req)
    {
        eval(req.responseText);
        this.dataObject = dados_videos;
    },
  
    writePagination: function(curPage)
    {
        var numPages = 0;
        var countElements = 0;
        if(this.options.ajaxData){
            countElements = this.options.countTotal;
            numPages = Math.ceil(this.options.countTotal / this.totalPerPage);
        }else{
            countElements = this.dataObject.length;
            numPages = Math.ceil(this.dataObject.length / this.totalPerPage);
        }
        var curPage = Math.floor(this.currentPage / this.totalPerPage);

        if(this.pagesDesc) {
          for (var my_curr = 0; my_curr < this.pagesDesc.length; my_curr++) {
            if(!this.pagesDesc[my_curr]){
              continue;
            }
            this.pagesDesc[my_curr].innerHTML = '';
            if(numPages > 1){
              var max = ((curPage+1)*this.totalPerPage);
              if(countElements<max){
                max = countElements;
              }
              this.pagesDesc[my_curr].innerHTML = ((curPage*this.totalPerPage)+1)+'-'+max+' de '+countElements;
            }
          }
        }
      
        if(this.pagesDiv) {
          for (var my_curr = 0; my_curr < this.pagesDiv.length; my_curr++) {
            if(!this.pagesDiv[my_curr]){
              continue;
            }
            var aCurPages = this.pagesDiv[my_curr].getElementsByTagName('a');
            for(var i=(aCurPages.length - 1); i >= 0; i--) {
                aCurPages[0].parentNode.removeChild(aCurPages[i]);
            }
            this.pagesDiv[my_curr].innerHTML = '';

            if(curPage > 4){
                var link = document.createElement('A');
                link.href = '#1';
                link.innerHTML = '<strong>|<</strong>';
                link.onclick = function(){return false;};
                link.title = 'Ir para a primeira';
                Event.observe(link, 'click', this.goPage.bindAsEventListener(this));
                this.pagesDiv[my_curr].appendChild(link);
                this.pagesDiv[my_curr].appendChild(document.createTextNode(' '));
                var link = document.createElement('A');
                link.href = '#'+(curPage-4);
                link.innerHTML = '<strong><<</strong>';
                link.onclick = function(){return false;};
                link.title = 'Recuar 5 p\341ginas';
                Event.observe(link, 'click', this.goPage.bindAsEventListener(this));
                this.pagesDiv[my_curr].appendChild(link);
                this.pagesDiv[my_curr].appendChild(document.createTextNode(' '));
            }
            if(numPages > 5 && curPage > 4){
                var link = document.createElement('A');
                link.href = '#'+(curPage);
                link.innerHTML = '<strong><</strong>';
                link.onclick = function(){return false;};
                link.title = 'Recuar 1 p\341gina';
                Event.observe(link, 'click', this.goPage.bindAsEventListener(this));
                this.pagesDiv[my_curr].appendChild(link);
                this.pagesDiv[my_curr].appendChild(document.createTextNode(' '));
            }
            for(var j=Math.floor(curPage/5)*5+1; j <= numPages && j <= Math.floor(curPage/5)*5+5 && numPages > 1; j++) {
                if(j != (curPage + 1)) {
                    var link = document.createElement('A');
                    link.href = '#'+j;
                    link.innerHTML = '<strong>'+j+'</strong>';
                    link.onclick = function(){return false;};
                    Event.observe(link, 'click', this.goPage.bindAsEventListener(this));
                    this.pagesDiv[my_curr].appendChild(link);
                } else {
                    var u = document.createElement('u');
                    var strong = document.createElement('strong');
                    u.appendChild(strong);
                    strong.appendChild(document.createTextNode(j));
                    this.pagesDiv[my_curr].appendChild(u);
                }
                if(j != numPages && j != Math.floor(curPage/5)*5+5) {
                    var span = document.createElement('span');
                    span.setAttribute('class', 'ftgreen');
                    span.appendChild(document.createTextNode(' | '));
                    this.pagesDiv[my_curr].appendChild(span);
                }
            }
            if(numPages > 5 && Math.floor(curPage/5)*5 < numPages - 5){
                var link = document.createElement('A');
                link.href = '#'+(curPage+2);
                link.innerHTML = '<strong>></strong>';
                link.onclick = function(){return false;};
                link.title = 'Avan\347ar 1 p\341gina';
                Event.observe(link, 'click', this.goPage.bindAsEventListener(this));
                this.pagesDiv[my_curr].appendChild(document.createTextNode(' '));
                this.pagesDiv[my_curr].appendChild(link);
            }
            if(curPage < numPages - 5){
                var link = document.createElement('A');
                link.href = '#'+(curPage+6);
                link.innerHTML = '<strong>>></strong>';
                link.onclick = function(){return false;};
                link.title = 'Avan\347ar 5 p\341ginas';
                Event.observe(link, 'click', this.goPage.bindAsEventListener(this));
                this.pagesDiv[my_curr].appendChild(document.createTextNode(' '));
                this.pagesDiv[my_curr].appendChild(link);
            }
            if(Math.floor(curPage/5)*5 < numPages - 5){
                var link = document.createElement('A');
                link.href = '#'+numPages;
                link.innerHTML = '<strong>>|</strong>';
                link.onclick = function(){return false;};
                link.title = 'Ir para a \372ltima';
                Event.observe(link, 'click', this.goPage.bindAsEventListener(this));
                this.pagesDiv[my_curr].appendChild(document.createTextNode(' '));
                this.pagesDiv[my_curr].appendChild(link);
            }
          }
        }
    },
    
    appendElement: function(source) 
    {
        this.element.innerHTML += source;
    }, 

    clearElement: function()
    {
        var elms = this.element.getElementsByTagName('*');
        for(var i = (elms.length - 1); i >= 0; i--) {
            elms[i].parentNode.removeChild(elms[i]);
        }
    },


    debug: function(txt)
    {
        //document.getElementById('debug').innerHTML += txt+'<br />';
    }
};