﻿var pager = new function() {
    var imageBaseUrl = "http://site.photoframesplus.com/images/"; //"images/";
    var itemCount = 0;
    var itemTotalCount = 0;
    var itemsPerPage = 0;
    var pageCount = 0
    var currentPage = 1
    var originalItemCount = 0;
    var originalItemsPerPage = 0;
    var sortIndex = 0;
    var isCategory = false;
    var items = new Array();
    var item = function() {
        this.sequence = 0;
        this.id = "";
        this.name = "";
        this.price = 0;
        this.rank = 0;
        this.freeShipping = false;
        this.freePersonalization = false;
        this.personalized = false;
        this.image = "";
        this.html = "";
    }

    this.showPages = false;
    this.pagerIdTop = "pagerTop";
    this.pagerIdBottom = "pagerBottom";
    this.pagerIdDetails = "pagerDetails";

    this.initialize = function(numOfItems, numItemsPerPage, numOfTotalItems, isCategory) {
        itemCount = numOfItems;
        itemsPerPage = numItemsPerPage;
        itemTotalCount = numOfTotalItems;
        pageCount = Math.round(numOfItems / numItemsPerPage);
        pageCount += ((pageCount * itemsPerPage >= itemCount) ? 0 : 1);

        this.isCategory = isCategory;
        this.showPager(false);
        this.getItems();

        common.addEvent(window, "load", this.turnToPage(1));

        (this.isCategory == true) ? this.sortBy("nameA", 1) : this.sortBy("popularity", sortIndex);
    }

    this.hasPersonalizedItems = function() { for (c = 0; c <= items.length - 1; c++) { if (items[c].personalized || items[c].freePersonalization) { return true; } } return false; }
    this.hasFreeShippingItems = function() { for (c = 0; c <= items.length - 1; c++) { if (items[c].freeShipping) { return true } } return false; }

    this.reset = function(numOfItems, numItemsPerPage) {
        itemCount = numOfItems;
        itemsPerPage = numItemsPerPage;
        pageCount = Math.round(numOfItems / numItemsPerPage);
        pageCount += ((pageCount * itemsPerPage >= itemCount) ? 0 : 1);

        this.showPager(false);
        this.turnToPage(1);
    }

    this.showPager = function(copy) {
        var apostrophe = String.fromCharCode(39);
        var navigation = "";
        if (pageCount > 1) {
            if (this.showPages == true) { navigation += '<div ' + ((copy == false) ? 'id="pageCount"' : '') + ' class="pageTextLeft">Page ' + currentPage + ' of ' + pageCount + '</div>'; }
            navigation += '<div class="pagerNavigator" style="width:9px;height:17px;margin-right: 3px;"><img id="previousPage" src="http://site.photoframesplus.com/images/arrow-previous.gif" alt="Previous page" class="' + ((currentPage == 1) ? "pagerNavigatorHide" : "pagerNavigator") + '" onclick="javascript:pager.previousPage();" /></div>';

            for (c = 1; c <= pageCount; c++) {
                var cssClass = (c == currentPage) ? 'pagerNumbersActive' : 'pagerNumbersInActive';
                navigation += '<a ' + ((copy == false) ? 'id="p' + c + '"' : '') + ' style="font-size: 16px;" class="pagerNumbers ' + cssClass + '" onclick="javascript:pager.turnToPage(' + c + ');" href="#top" onmouseover="javascript:window.status=' + apostrophe + 'turn page' + apostrophe + '" >' + c + '</a>';
            }
            navigation += '<div class="pagerNavigator"><a href="#top"><img id="nextPage" src="http://site.photoframesplus.com/images/arrow-next.gif" alt="Next page" border="0" class="' + ((currentPage == pageCount) ? "pagerNavigatorHide" : "pagerNavigator") + '" onclick="javascript:pager.nextPage();" /></a></div>';
        }

        navigation += '<div class="pagerLinks" style="float: right;">';

        if (itemCount > itemsPerPage || originalItemsPerPage != 0) {
            navigation += '<a ' + ((copy == false) ? 'id="pagerViewAll"' : '') + ' class="pagerViewAll" href="#top" onclick="javascript:pager.' + ((pageCount == 1) ? 'viewReturnToPaged' : 'viewAll') + '();">' + ((pageCount == 1) ? 'Return To Paged View' : 'View All') + '</a><span class="pagerSpacer">|</span>';
        }

        navigation += '<div class="pagerSortTitle">SORT BY:&nbsp;</div>';
        navigation += '<select ' + ((copy == false) ? 'id="sortBy"' : 'id="copySortBy"') + ' class="pagerSortBy" onchange="javascript:pager.sortBy(this.options[this.selectedIndex].value,this.selectedIndex);">';
        navigation += (this.isCategory == false) ? '<option value="popularity">Popularity</option>' : '';
        navigation += '<option value="nameA">Name - A to Z</option>';
        navigation += '<option value="nameZ">Name - Z to A</option>';
        navigation += (this.isCategory == false) ? '<option value="priceL">Price - Low to High</option>' : '';
        navigation += (this.isCategory == false) ? '<option value="priceH">Price - High to Low</option>' : '';

        navigation += (this.isCategory == false && this.hasFreeShippingItems() == true) ? '<option value="freeShipping">Free Shipping</option>' : '';
        navigation += (this.isCategory == false && this.hasPersonalizedItems() == true) ? '<option value="personalized">Personalized</option>' : '';

        navigation += '</select>';
        navigation += '</div><div style="clear: both;"></div>';

        if (copy == true) {
            $(this.pagerIdBottom).innerHTML = navigation;
            $("copySortBy").selectedIndex = sortIndex;
        } else {
            $(this.pagerIdTop).innerHTML = navigation;
        }
        $("sortBy").selectedIndex = sortIndex;
    }

    this.turnToPage = function(page) {
        var previousPage = currentPage;

        currentPage = page;
        this.viewPage(previousPage, false);
        this.viewPage(currentPage, true);

        if (this.showPages == true) {
            if (pageCount > 1) {
                $('pageCount').innerHTML = 'Page ' + currentPage + ' of ' + pageCount
            }
        }

        if (itemCount > itemsPerPage || originalItemsPerPage != 0) {
            var details = "";
            if (itemCount < itemTotalCount) {
                details = '<a name="top" /><h3 style="clear: both; padding-top: 5px; margin-bottom: 5px;">Top ' + itemCount + ' Best Sellers</h3>'
            }
            details += '<div class="pagerItemCounter">Showing items ' + ((currentPage == 1) ? '1' : (itemsPerPage * (currentPage - 1) + 1)) + ' - ' + ((currentPage == 1) ? itemsPerPage : (itemsPerPage * currentPage) > itemCount ? itemCount : (itemsPerPage * currentPage)) + ' of ' + itemCount + '</div>'

            $(this.pagerIdDetails).innerHTML = details;
        }

        this.showPager(false);
        this.showPager(true);
    }
    this.nextPage = function() { this.turnToPage(currentPage + 1) }
    this.previousPage = function() { this.turnToPage(currentPage - 1) }

    this.viewReturnToPaged = function() {
        this.showHideItems(1, originalItemCount);
        this.reset(originalItemCount, originalItemsPerPage);
    }

    this.viewAll = function() {
        originalItemCount = itemCount;
        originalItemsPerPage = itemsPerPage;
        this.reset(itemCount, itemCount);
    }

    this.viewPage = function(page, show) {
        var start = (page == 1) ? 1 : ((page - 1) * itemsPerPage) + 1;
        var length = (start + itemsPerPage) - 1;

        length = (length > itemCount) ? itemCount : length;
        this.showHideItems(start, length, show);
    }

    this.showHideItems = function(start, length, show) {
        for (c = start; c <= (length); c++) {
            var item = items[c - 1];
            if ($("i" + c) != null) {
                $("i" + c).style.display = (show == true) ? "block" : "none";
                $("ii" + item.sequence).src = item.image;
            }
        }
    }

    this.sortBy = function(value, index) {
        sortIndex = index;
        switch (value) {
            case "popularity": items.sort(sortByPopularity); break;
            case "nameA": items.sort(sortByNameAscending); break;
            case "nameZ": items.sort(sortByNameDescending); break;
            case "priceL": items.sort(sortByPriceAscending); break;
            case "priceH": items.sort(sortByPriceDescending); break;
            case "freeShipping": items.sort(sortByPersonalized); items.sort(sortByFreeShipping); break;
            case "personalized": items.sort(sortByFreeShipping); items.sort(sortByPersonalized); break;

        }
        for (c = 1; c <= itemCount; c++) {
            if ($("i" + c) != null) {
                $("i" + c).innerHTML = items[c - 1].html;
            }
        }
        this.turnToPage(1);

        this.createImage = function(src) {
            var img = document.createElement("img");
            img.src = imageBaseUrl + src;
            img.className = "pIP";
            $("ia" + item.sequence).insertBefore(img, $("in" + item.sequence));
        }

        for (c = 1; c <= itemCount; c++) {
            var item = items[c - 1];
            if ($("ia" + item.sequence) != null) {
                $("ia" + item.sequence).title = "Click to view " + item.name;

                if (item.freeShipping) { this.createImage("free-shipping-175x175.gif"); }
                if (item.freePersonalization) { this.createImage("free-personalization-175x17.gif"); }
                if (item.personalized && !item.freePersonalization) { this.createImage("personalized-175x175.gif"); }

                if (item.freeShipping || item.freePersonalization || item.personalized) {
                    $("ia" + item.sequence).style.position = "relative";
                    $("ii" + item.sequence).className = "pI pIP";

                    var div = document.createElement("div");
                    div.className = "iC";
                    $("ia" + item.sequence).insertBefore(div, $("ii" + item.sequence));
                }
            }
        }
    }

    this.getItems = function() {
        for (c = 1; c <= itemCount; c++) {
            try {
                if ($("in" + c) != null) {
                    var i = new item();
                    i.sequence = c;
                    i.id = "i" + c;
                    i.name = $("in" + c).innerText;
                    i.price = $(i.id).getAttribute("ip");
                    i.rank = $(i.id).getAttribute("ir");
                    i.image = $(i.id).getAttribute("ii");
                    i.freeShipping = toBoolean($(i.id).getAttribute("pfs"));
                    i.freePersonalization = toBoolean($(i.id).getAttribute("pfp"));
                    i.personalized = toBoolean($(i.id).getAttribute("pp"));
                    i.html = $(i.id).innerHTML
                    items[(c - 1)] = i;
                } else {
                    items[(c - 1)] = items[(c - 2)];
                }
            }
            catch (err)
                { alert(err); }
        }
        return items;
    }

    function sortByNameAscending(a, b) {
        var x = a.name.toLowerCase();
        var y = b.name.toLowerCase();
        return ((x < y) ? -1 : ((x > y) ? 1 : 0));
    }

    function sortByNameDescending(a, b) {
        var x = b.name.toLowerCase();
        var y = a.name.toLowerCase();
        return ((x < y) ? -1 : ((x > y) ? 1 : 0));
    }

    function sortByPriceAscending(a, b) { return a.price - b.price; }
    function sortByPriceDescending(a, b) { return b.price - a.price; }
    function sortByPopularity(a, b) { return b.rank - a.rank; }
    function sortByFreeShipping(a, b) { return b.freeShipping - a.freeShipping; }
    function sortByPersonalized(a, b) {
        return (b.personalized - a.personalized) + ((b.freePersonalization - a.freePersonalization) * 2);
    }
    function toBoolean(value) { return (value == 1) ? true : false; }
}
