//Define Kpw object only if it's not already defined
if ("undefined" == typeof Kpw) { Kpw = {}; }
$(document).ready(function() { Kpw.MediaCarousal.init(); });


//Kpw MediaCarousal Object
Kpw.MediaCarousal = {
    init: function() {
        Kpw.MediaCarousal.Buttons.init();
        Kpw.MediaCarousal.Filter.init();
        Kpw.MediaCarousal.Photos.init();
        Kpw.MediaCarousal.Photos.Tray.init(true);
    },
    Buttons: {
        init: function() {
            //initialize button hover
            //            $("a.ui-button").hover(function() {
            //                $(this).addClass("ui-state-hover");
            //            }, function() {
            //                $(this).removeClass("ui-state-hover");
            //            });

        $(".button").button();
        $(".button-disk").button({ icons: { primary: 'ui-icon-disk'} });
        $(".button-image").button({ icons: { primary: 'ui-icon-image'} });

            //initialize scroll button hover
            $("a.scrollLeft").hover(function() {
                $(this).children("span")
					    .addClass("ui-icon-circle-arrow-w")
					    .removeClass("ui-icon-arrowthick-1-w");
            }, function() {
                $(this).children("span")
					    .addClass("ui-icon-arrowthick-1-w")
					    .removeClass("ui-icon-circle-arrow-w");
            });
            $("a.scrollRight").hover(function() {
                $(this).children("span")
					    .addClass("ui-icon-circle-arrow-e")
					    .removeClass("ui-icon-arrowthick-1-e");
            }, function() {
                $(this).children("span")
					    .addClass("ui-icon-arrowthick-1-e")
					    .removeClass("ui-icon-circle-arrow-e");
            });
        }
    },
    Filter: {
        clear: function() {
            $("input.carousalFilter").attr("value", "");
            $("ul.thumbnails li.thumbnail").show();
            $("ul.thumbnails").css("height", "");
        },
        init: function() {
            $("input.carousalFilter").attr("value", "");
            $("input.carousalFilter").keyup(function() {
                var filter = $(this).val();
                //filter
                $("ul.thumbnails li span input.title:not([value*='" + filter + "'])").parents("li.thumbnail").hide();
                $("ul.thumbnails li span input.title[value*='" + filter + "']").parents("li.thumbnail").show();
            });
        }
    },
    Photos: {
        init: function() {
            // there's the gallery and the trash
            var $thumbnails = $("div.photoTray ul.thumbnails");

            //If this variable flag exists we won't enable carousal drag
            var cancelDrag = $('.disableCarousalDrag');

            if (cancelDrag.length === 0) {
                // let the gallery items be draggable
                $('li', $thumbnails).draggable({
                    cancel: 'a.ui-icon',
                    revert: 'invalid',
                    helper: 'clone',
                    appendTo: 'body',
                    zIndex: '99',
                    cursor: 'move'
                });
            }

        },
        Tray: {
            init: function(setLeft) {
                //debugger;

                //set width of widget bar
                var menuWidth;
                var menu;
                var thumbnails;
                var thumbnailClone;
                var oneEm;
                var buffer;
                var photoItemWidth = 0;

                //get em size and set buffer
                oneEm = $("body").css("font-size").replace(/px/g, "");
                buffer = oneEm;

                //get thumbnails
                $("li.thumbnail:first").addClass("thumbnailFirst");
                $("li.thumbnail:last").addClass("thumbnailLast");
                thumbnails = $("li.thumbnail");
                thumbnailClone = $("li.thumbnail:first").clone();
                $("body").prepend(thumbnailClone);
                thumbnailClone
					.css("position", "absolute")
					.css("left", "-10000px")
					.css("display", "block");

                if (thumbnails.length === 0) {
                    menuWidth = 52 + buffer;
                } else {
                    thumbnailWidth = parseInt(thumbnailClone.outerWidth(true));
                    menuWidth = (thumbnails.length + 2) * thumbnailWidth;
                }

                thumbnailClone.remove();

                menu = $("div.photoTray ul.thumbnails");
                menu.css("width", menuWidth);
                if (setLeft)
                    menu.css("left", menuWidth + "px");
            },
            Scroll: {
                left: function() {
                    var thumbnails = $("ul.thumbnails");
                    var thumbnailsWidth = parseInt(thumbnails.width());
                    var thumbnailsWrapperWidth = parseInt(thumbnails.parent().width());
                    var left = parseInt(thumbnails.css("left").replace(/px/g, ""));  //remove the "px"
                    var thumbnailsRightEdge = thumbnailsWidth + left;

                    left = left + (left <= -Kpw.MediaCarousal.Photos.Tray.slideDistance ? Kpw.MediaCarousal.Photos.Tray.slideDistance : -left);
                    var newLeft = left + "px";
                    thumbnails.animate({ left: newLeft });
                },
                right: function() {
                    var thumbnails = $("ul.thumbnails");
                    var thumbnailsWidth = parseInt(thumbnails.width());
                    var thumbnailsWrapperWidth = parseInt(thumbnails.parent().width());
                    var left = parseInt(thumbnails.css("left").replace(/px/g, ""));  //remove the "px"
                    var thumbnailsRightEdge = thumbnailsWidth + left;

                    if (thumbnailsRightEdge > thumbnailsWrapperWidth)
                        left = left - (thumbnailsRightEdge > thumbnailsWrapperWidth + Kpw.MediaCarousal.Photos.Tray.slideDistance ? Kpw.MediaCarousal.Photos.Tray.slideDistance : (thumbnailsWidth - thumbnailsWrapperWidth) + left);
                    var newLeft = left + "px";
                    thumbnails.animate({ left: newLeft });
                }
            },
            slideDistance: 500,
            toggle: function() {
                var tray = $("div.photoTray");
                var filter = $("div.tools p.buttons span.carousalFilterWrapper");
                var thumbnailList = tray.find("ul.thumbnails")
                if (tray.is(":hidden")) {
                    tray.slideDown("fast", function() {
                        tray.find("p.scrollWrapper a").fadeIn("fast");
                        thumbnailList.animate({ left: "0" });
                        filter.fadeIn();
                        tray.css("height", tray.height() + "px");
                    });
                } else {
                    var tray = $("div.photoTray");
                    var thumbnailList = tray.find("ul.thumbnails");
                    filter.fadeOut();
                    thumbnailList.animate({ left: parseInt(thumbnailList.outerWidth(true)) }, function() {
                        tray.slideUp("fast");
                    });
                }

            },
            disableDrag: function() {
                var $thumbnails = $("div.photoTray ul.thumbnails")
                $('li', $thumbnails).draggable('destroy');
            }
        }
    }

}