var NonAcrobatViewer = {
    Display: function() { 
        var private = {
            preload: [], 
            pages: [], 
            pageWidth: 100, 
            pageHeight: 100, 
            currentPage: 0, 
            scrollUpdateTimeout: null
        };
        
        var public = {
            AddPage: function(url) { 
                private.pages[private.pages.length] = url;
            }, 
            
            SetPageSize: function(width, height) { 
                private.pageWidth = width;
                private.pageHeight = height;
            }, 
            
            RenderInto: function(container) { 
                container = Get(container);
                var closureThis = this;
                
                // render to toolbar
                var toolbarContainer = document.createElement("div");
                toolbarContainer.style.height = "36px";
                toolbarContainer.style.border = "1px solid #666666";
                toolbarContainer.style.borderWidth = "1px 0";
                toolbarContainer.style.background = "#000000 url(/images/samples/toolbar.gif) repeat-x scroll center top";
                toolbarContainer.style.textAlign = "center";
                toolbarContainer.style.fontSize = "15px";
                toolbarContainer.style.lineHeight = "35px";
                
                var pageNumberDisplay = document.createElement("span");
                
                var nextButton = document.createElement("img");
                nextButton.src = "/images/spacer.gif";
                nextButton.width = 24;
                nextButton.height = 24;
                nextButton.align = "absmiddle";
                nextButton.style.margin = "0 0 2px 25px";
                nextButton.style.verticalAlign = "middle";
                
                var prevButton = document.createElement("img");
                prevButton.src = "/images/spacer.gif";
                prevButton.width = 24;
                prevButton.height = 24;
                prevButton.align = "absmiddle";
                prevButton.style.margin = "0 25px 2px 0";
                prevButton.style.verticalAlign = "middle";
                
                toolbarContainer.appendChild(prevButton);
                toolbarContainer.appendChild(pageNumberDisplay);
                toolbarContainer.appendChild(nextButton);
                
                container.appendChild(toolbarContainer);
                
                // render the small version of the images for navigation
                var pagesContainer = document.createElement("div");
                var tooltipsContainer = document.createElement("div");
                tooltipsContainer.style.width = "200px";
                tooltipsContainer.style.padding = "7px 10px";
                tooltipsContainer.style.height = (container.offsetHeight - 32) + "px";
                tooltipsContainer.style.overflow = "auto";
                tooltipsContainer.style.backgroundColor = "#262626";
                tooltipsContainer.style.borderRight = "1px solid #666666";
                tooltipsContainer.style.textAlign = "center";
                if (typeof(tooltipsContainer.style.cssFloat) != "undefined") tooltipsContainer.style.cssFloat = "left";
                else tooltipsContainer.style.styleFloat = "left";
                
                for (var p=0, page; page = private.pages[p]; p++) { 
                    var pageImage = document.createElement("img");
                    pageImage.id = "ImgTooltip_" + p;
                    pageImage.src = page;
                    pageImage.width = 160;
                    pageImage.height = Math.ceil(160 * (private.pageHeight / private.pageWidth));
                    pageImage.style.display = "block";
                    pageImage.style.margin = "0 auto 7px auto";
                    pageImage.style.background = "#FFFFFF url(/images/ajax-loader.gif) no-repeat scroll center center";
                    pageImage.style.cursor = "pointer";
                    pageImage.style.cursor = "hand";
                    pageImage.style.border = "3px solid #262626";
                    pageImage.onclick = function(pageNumber) { return function() {  closureThis.GoToPage(pagesContainer, tooltipsContainer, pageNumberDisplay, nextButton, prevButton, pageNumber); }; }(p);
                    tooltipsContainer.appendChild(pageImage);
                }
                
                container.appendChild(tooltipsContainer);
                
                // render the page images
                pagesContainer.style.height = (container.offsetHeight - 28) + "px";
                pagesContainer.style.overflow = "auto";
                pagesContainer.style.textAlign = "center";
                pagesContainer.style.padding = "10px 10px 0 10px";
                
                for (var p=0, page; page = private.pages[p]; p++) { 
                    var pageImage = document.createElement("img");
                    pageImage.id = "ImgPage_" + p;
                    pageImage.src = page;
                    pageImage.width = private.pageWidth;
                    pageImage.height = private.pageHeight;
                    pageImage.style.display = "block";
                    pageImage.style.margin = "0 auto 10px auto";
                    pageImage.style.background = "#FFFFFF url(/images/ajax-loader.gif) no-repeat scroll center center";
                    pagesContainer.appendChild(pageImage);
                }
                
                container.appendChild(pagesContainer);
                
                // block right click on the viewer
                if (document.getElementById && !document.all) container.oncontextmenu = function(e) { closureThis.BlockRightClick(e); };
                else container.onmousedown = function(e) { closureThis.BlockRightClick(e); };
                
                this.SetActivePageDisplay(pagesContainer, tooltipsContainer, pageNumberDisplay, nextButton, prevButton);
                pagesContainer.onscroll = function(e) { 
                        if (!private.scrollUpdateTimeout)
                            private.scrollUpdateTimeout = setTimeout(function() { closureThis.SetActivePageDisplay(pagesContainer, tooltipsContainer, pageNumberDisplay, nextButton, prevButton); }, 150); 
                    };
            }, 
            
            GoToPage: function(pagesContainer, tooltipsContainer, pageNumberDisplay, nextButton, prevButton, pageNumber) { 
                pagesContainer.scrollTop = findPosY(Get("ImgPage_" + pageNumber)) - findPosY(pagesContainer) - 10;
                this.SetActivePageDisplay(pagesContainer, tooltipsContainer, pageNumberDisplay, nextButton, prevButton);
            }, 
            
            SetActivePageDisplay: function(pagesContainer, tooltipsContainer, pageNumberDisplay, nextButton, prevButton) { 
                clearTimeout(private.scrollUpdateTimeout);
                private.scrollUpdateTimeout = null;
            
                // detect the current page number
                var newPage = Math.floor(((private.pageHeight / 3) + pagesContainer.scrollTop) / (private.pageHeight + 10));
                
                // update the tooltips and focus the active page
                var newPageTooltip = Get("ImgTooltip_" + newPage);
                var tooltipPosition = findPosY(newPageTooltip) - findPosY(tooltipsContainer);
                Get("ImgTooltip_" + private.currentPage).style.borderColor = "#262626";
                newPageTooltip.style.borderColor = "#8EB2FE";
                
                if (tooltipsContainer.scrollTop + tooltipsContainer.offsetHeight < tooltipPosition + newPageTooltip.offsetHeight)
                    tooltipsContainer.scrollTop = tooltipPosition - tooltipsContainer.offsetHeight + newPageTooltip.offsetHeight + 10;
                else if (tooltipsContainer.scrollTop > tooltipPosition)
                    tooltipsContainer.scrollTop = tooltipPosition - 10;
                
                // update the toolbar
                ClearChildNodes(pageNumberDisplay);
                pageNumberDisplay.appendChild(document.createTextNode("Page " + (newPage + 1) + " of " + private.pages.length));
                
                // set the next/prev button actions and toggle them on/off as needed
                var closureThis = this;
                
                if (newPage == 0) { 
                    prevButton.src = "/images/spacer.gif";
                    prevButton.style.cursor = "default";
                    prevButton.onclick = function() {  };
                    prevButton.onmouseover = function() {  };
                    prevButton.onmouseout = function() {  };
                }
                else { 
                    if (prevButton.src.indexOf("spacer.gif") > 0) { 
                        prevButton.src = "/images/samples/btn_left_off.gif";
                        prevButton.style.cursor = "pointer";
                        prevButton.style.cursor = "hand";
                        prevButton.onmouseover = function() { this.src = "/images/samples/btn_left_on.gif"; };
                        prevButton.onmouseout = function() { this.src = "/images/samples/btn_left_off.gif"; };
                    }
                    prevButton.onclick = function() { closureThis.GoToPage(pagesContainer, tooltipsContainer, pageNumberDisplay, nextButton, prevButton, newPage - 1); };

                }
                
                if (newPage == private.pages.length - 1) { 
                    nextButton.src = "/images/spacer.gif";
                    nextButton.style.cursor = "default";
                    nextButton.onclick = function() {  };
                    nextButton.onmouseover = function() {  };
                    nextButton.onmouseout = function() {  };
                } 
                else { 
                    if (nextButton.src.indexOf("spacer.gif") > 0) { 
                        nextButton.src = "/images/samples/btn_right_off.gif";
                        nextButton.style.cursor = "pointer";
                        nextButton.style.cursor = "hand";
                        nextButton.onmouseover = function() { this.src = "/images/samples/btn_right_on.gif"; };
                        nextButton.onmouseout = function() { this.src = "/images/samples/btn_right_off.gif"; };
                    }
                    nextButton.onclick = function() { closureThis.GoToPage(pagesContainer, tooltipsContainer, pageNumberDisplay, nextButton, prevButton, newPage + 1); this.onmouseover(); };
                }
                
                private.currentPage = newPage;
            }, 
            
            BlockRightClick: function(e) {
	            if ((document.all && (event.button == 2 || event.button == 3)) || (!document.all && (document.layers || document.getElementById) && e.which == 3)) {
		            alert("We're sorry, but right clicking is disabled on this sample lease preview.");
                    if (e && e.preventDefault != null && typeof(e.preventDefault) == "function") e.preventDefault();
		            return false;
	            }
            }
        };
        
        private.preload[private.preload.push(new Image()) - 1].src = "/images/spacer.gif";
        private.preload[private.preload.push(new Image()) - 1].src = "/images/ajax-loader.gif";
        private.preload[private.preload.push(new Image()) - 1].src = "/images/samples/btn_left_off.gif";
        private.preload[private.preload.push(new Image()) - 1].src = "/images/samples/btn_left_on.gif";
        private.preload[private.preload.push(new Image()) - 1].src = "/images/samples/btn_right_off.gif";
        private.preload[private.preload.push(new Image()) - 1].src = "/images/samples/btn_right_on.gif";
        
        return public;
    }
};