var startPoint;
    var first = true;
    var maxPages;
    var pageCount; 
    var noDisplayClass = 'noDisplay';
    var lastClass = 'last';
       
    
    // Check to see which controls we can hide/show
    function clickLeft() {
        if (first) {
            startPoint = document.getElementById("startPoint").value;
            maxPages = document.getElementById("recordsCount").value; 
            pageCount = document.getElementById("paginationCount").value;
            first = false;
        }
        
        var initValue = parseInt(startPoint,10) - 1; //starting point
		 //the number of pages to show
		var upperLimit;
		
		//set the number of pages to show based
		if ((parseInt(initValue,10) + parseInt(pageCount,10)) > maxPages)
		{
		    upperLimit = maxPages;
		    initValue = parseInt(maxPages,10) - parseInt(pageCount,10);
		}
		else
		{
		    upperLimit = (parseInt(initValue,10) + parseInt(pageCount,10));
		}
		
		
		
        for (var i = initValue; i < upperLimit; i++) {
           var elemnt = document.getElementById('pageNumber'+i);
           if(hasClass(elemnt,noDisplayClass))
              removeClassName(elemnt,noDisplayClass); 
              
           if(parseInt(i,10) == (parseInt(upperLimit,10) - 1))
              setLastClass(elemnt);
        }
        hide(parseInt(initValue,10));
        startPoint--;
        
        showLeftRightArrows(parseInt(startPoint,10));
    }
    
     // Check to see which controls we can hide/show
    function clickRight() {
        if (first) {
            startPoint = document.getElementById("startPoint").value;
            maxPages = document.getElementById("recordsCount").value;
            pageCount = document.getElementById("paginationCount").value; 
            first = false;
        }
            
        var initValue = parseInt(startPoint,10) + 1;
        var upperLimit;
		
		if ((parseInt(initValue,10) + parseInt(pageCount,10)) > maxPages)
		{
		    upperLimit = maxPages;
		    initValue = parseInt(maxPages,10) - parseInt(pageCount,10);
		}
		else
		{
		    upperLimit = (parseInt(initValue,10) + parseInt(pageCount,10));  
		}
		  
		//set the number of pages to show
        for (var i = initValue; i < upperLimit; i++) {
           var elemnt = document.getElementById('pageNumber'+i);
           if(hasClass(elemnt,noDisplayClass))
              removeClassName(elemnt,noDisplayClass); 
              
           if(parseInt(i,10) == (parseInt(upperLimit,10) - 1))
              setLastClass(elemnt);
        }
        hide(parseInt(initValue,10));
        startPoint++;
        
        showLeftRightArrows(parseInt(startPoint,10));
    }
    
    function hide(initial){
    
        var initValue = initial;
        
        //set the page links before 'initial' to hidden.
        if(initValue > 0)
        {
            for(var j = 0; j < initValue; j++){
                var elemnt = document.getElementById('pageNumber'+j);
                if(!hasClass(elemnt,noDisplayClass))
                    addClass(elemnt,noDisplayClass);
            }
        }
        //set the page links after (initial + pageCount) to hidden.
        if((parseInt(initValue,10) + parseInt(pageCount,10)) <= maxPages)
        {
            for(var k = (parseInt(initValue,10)+parseInt(pageCount,10)); k < maxPages; k++){
                var elemnt = document.getElementById('pageNumber'+k);
                if(!hasClass(elemnt,noDisplayClass))
                    addClass(elemnt,noDisplayClass); 
            }
        }
    }
    
    function showLeftRightArrows(sp){
    
    var startValue = sp;
    
        //show/hide for the left arrow
         if(parseInt(startValue,10) <= 0)
         {
            document.getElementById('previousLink').style.visibility = 'hidden';
         }
         else
         {
            document.getElementById('previousLink').style.visibility = 'visible';
         }
                  
        //show/hide for the right arrow
        if((parseInt(startValue,10) + parseInt(pageCount,10)) >= maxPages)
        {
            document.getElementById('nextLink').style.visibility = 'hidden';
        }
        else
        {
            document.getElementById('nextLink').style.visibility = 'visible';
        }

    }
    
    // Set the last class for the given element
    function setLastClass(et){
    
        //first remove reference to 'last' class that any elements may have
        for (var i = 0; i < maxPages; i++) {
           var elemnt = document.getElementById('pageNumber'+i);
           if(hasClass(elemnt,lastClass))
              removeClassName(elemnt,lastClass); 
        }
        //now add the 'last' class to the given element
        if(!hasClass(et,lastClass))
              addClass(et,lastClass); 
    }
    
     // Check if a class is among the classes used by an element
    function hasClass(element, className) {
        var regEx = new RegExp('\\b' + className + '\\b', "i")
        return element.className.match(regEx);
    }
    
    // Add class to element (preserves any existing classes)
    function addClass(element, value) {
        element.className += (element.className) ? (' ' + value) : value;
    }
    
    //Removes a class from an element. e=element, t=class name
    function removeClassName(e,t) {
    if (typeof e == "string") {
        e = xGetElementById(e);
    }
    //code to change and replace strings
    var ec = ' ' + e.className.replace(/^s*|s*$/g,'') + ' ';
    var nc = ec;
    t = t.replace(/^s*|s*$/g,'');
    //check if not already there
    if (ec.indexOf(' '+t+' ') != -1) {
        //found, so lets remove it
        nc = ec.replace(' ' + t.replace(/^s*|s*$/g,'') + ' ',' ');
    }
    //return the changed text!
    e.className = nc.replace(/^s*|s*$/g,''); //trimmed whitespace
    return true;
}