Posters = {
    randomPoster: null,

    init: function () {
        Posters.wire_events();
        $("#cats").buttonset();
    },

    highlight_random_poster: function () {
        this.randomPoster = $("a.polaroid").eq([Math.floor(Math.random() * $("a.polaroid").length)]);
        this.randomPoster.css({
            "-webkit-transform": 'rotate(' + (Math.floor(Math.random() * 10) - 5) + 'deg) scale(1.2)',
            "-moz-transform": 'rotate(' + (Math.floor(Math.random() * 10) - 5) + 'deg) scale(1.2)'
        });


        setTimeout("Posters.restore_poster()", 500)
    },

    restore_poster: function (poster) {
        Posters.randomPoster.css({
            "-webkit-transform": 'rotate(' + (Math.floor(Math.random() * 10) - 5) + 'deg) scale(1)',
            "-moz-transform": 'rotate(' + (Math.floor(Math.random() * 10) - 5) + 'deg) scale(1)'
        });
    },

    build_show_manga_cinemas_url: function (manga_id, tab_id) {
        return "/mangas/cinemas/" + manga_id + "/city/" + tab_id;
    },

    build_show_manga_url: function (manga_id, manga_title) {        
        url = "/manga/{manga_title}/";
        url = url.replace("{manga_title}", manga_title.replace(/ /g, "_"));
        return url;
    },

    wire_events: function () {
        $("#cats").
				change(
					function () {
					    Tabs.filter_posters($(".tabs .active a:first").attr('tab_id'), $("input[@name='cats']:checked").val());
					});

        /* hover on a poster will scale and rotate it */
        if ($.browser.msie) {

            $("a.polaroid ").each(function () {
                $(this).hover(function () {
                    $(this).css({ 'z-index': '10' }); /*Add a higher z-index value so this image stays on top*/
                    $(this).find('img').addClass("hover").stop() /* Add class of "hover", then stop animation queue buildup*/
							.animate({
							    marginTop: '0px', /* The next 4 lines will vertically align this image */
							    marginLeft: '0px',
							    top: '50%',
							    left: '50%',
							    width: '130', /* Set new width */
							    height: '193px', /* Set new height */
							    padding: '0px'
							}, 200); /* this value of "200" is the speed of how fast/slow this hover animates */

                    $(this).addClass("hover").stop() /* Add class of "hover", then stop animation queue buildup*/
								.animate({
								    marginTop: '-5px', /* The next 4 lines will vertically align this image */
								    marginLeft: '-5px',
								    top: '50%',
								    left: '50%'
								}, 200); /* this value of "200" is the speed of how fast/slow this hover animates */

                },
							function () {
							    $(this).css({ 'z-index': '0' }); /* Set z-index back to 0 */
							    $(this).find('img').removeClass("hover").stop()  /* Remove the "hover" class , then stop animation queue buildup*/
									.animate({
									    marginTop: '0', /* Set alignment back to default */
									    marginLeft: '0',
									    top: '0',
									    left: '0',
									    width: '121px', /* Set width back to default */
									    height: '178px', /* Set height back to default */
									    padding: '0px'
									}, 400);
							    $(this).addClass("hover").stop() /* Add class of "hover", then stop animation queue buildup*/
										.animate({
										    marginTop: '+5px', /* The next 4 lines will vertically align this image */
										    marginLeft: '+5px',
										    top: '0',
										    left: '0'
										}, 200); /* this value of "200" is the speed of how fast/slow this hover animates */

							});
            });
        } else {

            $("a.polaroid").each(function () {
                $(this)
			            .css({
			                "-webkit-transform": 'rotate(' + (Math.floor(Math.random() * 10) - 5) + 'deg)',
			                "-moz-transform": 'rotate(' + (Math.floor(Math.random() * 10) - 5) + 'deg)'
			            })
			            .hover(function () {
			                $(this).css({
			                    "-webkit-transform": 'rotate(' + (Math.floor(Math.random() * 10) - 5) + 'deg) scale(1.2)',
			                    "-moz-transform": 'rotate(' + (Math.floor(Math.random() * 10) - 5) + 'deg) scale(1.2)'
			                })
			            }, function () {
			                $(this).css({
			                    "-webkit-transform": 'rotate(' + (Math.floor(Math.random() * 10) - 5) + 'deg) scale(1)',
			                    "-moz-transform": 'rotate(' + (Math.floor(Math.random() * 10) - 5) + 'deg) scale(1)'
			                })
			            });
            });
        }

        /* click on a manga poster will 
        1. display manga info side bar
        2. populate the manga info side bar with the selected manga
        */
        $(".poster").click(
				 function () {

				     // scroll to top of the page in case out of page boundries to display manga information
				     $(document).scrollTop(0);

				     // effect
				     if (!$('#mangaposters').hasClass('effect-23')) {
				         $('#mangaposters').addClass('effect-23');
				         $('#mangainfo').addClass('effect-1');
				     }

				     //populate the manga details sidebar
				     var mangaPoster = $(this).children("a:first");
				     //id
				     $("#manga_id").attr("value", mangaPoster.attr("manga_id"));
				     //cinemas icon
				     $("#icon_cinemas").attr("href", Posters.build_show_manga_cinemas_url(mangaPoster.attr("manga_id"), Tabs.get_selected_tab_id()));
				     //trailer icon
				     $("#icon_trailer").attr("href", mangaPoster.attr("trailer"));
				     //show manga info page
				     $("#manga_detail_show").attr("href", Posters.build_show_manga_url(mangaPoster.attr("manga_id"), mangaPoster.attr("title")));

				     //title
				     $("#manga_title").html(mangaPoster.attr("title"));
				     //homepage
				     $("#manga_title a").attr("href", mangaPoster.attr("mangapage"));
				     //poster
				     $("#manga_poster").attr("src", mangaPoster.children("img").attr("src"));
				     //plot
				     $("#manga_plot").html(mangaPoster.attr("plot"));

				     // show the manga info sidebar
				     if (!$.browser.msie) {
				         $('#mangainfo').hide();
				         $('#mangainfo').fadeIn();
				     } else {
				         $('#mangainfo').show();
				     }

				 }
			);
    }
}

