jQuery(document).ready(function () {
    jQuery(".portalpage2").animate({ opacity: "1" }, 500).fadeIn();

    function slidepage2(direction) {
        var peeker = jQuery("div[@id^=yespage2]");

        var classLength = jQuery(peeker).attr("class").length;

        // Change numpages var to the number of posters in the slider
        // and ensure that all the parent divs in the HTML have sequential id numbers from 1 to numpages value
        var numpages = 3

        if (direction == "left") {
            if (parseInt(peeker.attr("class").substring(9, classLength)) == (0)) {
                jQuery(peeker).attr("id", "nopage2");
                jQuery(".cellpage2" + numpages.toString).attr("id", "yespage2");
                jQuery(".tubepage2").animate({ top: "-=640" }, 500);
                jQuery(".tubepage2").animate({ left: "-=4230" }, "fast");
                jQuery(".tubepage2").animate({ top: "+=640" }, 500);
            }

            else {
                var classLength = jQuery(peeker).attr("class").length;

                var nextLeft = ".cellpage2" + (parseInt(jQuery(peeker).attr("class").substring(9, classLength)) - 1);
                jQuery(peeker).attr("id", "nopage21");
                jQuery(nextLeft).attr("id", "yespage20");
                jQuery(".tubepage2").animate({ left: "+=470" }, 500);
            }
        }

        if (direction == "right") {
            var peeker = jQuery("div[@id^=yespage20]");
            var classLength = jQuery(peeker).attr("class").length;
            var currentindex = parseInt(jQuery(peeker).attr("class").substring(9, classLength));

            if (currentindex == numpages) {
                currentindex == 1;
                jQuery(peeker).attr("id", "nopage20");
                jQuery(".cellpage20").attr("id", "yespage20");
                jQuery(".tubepage2").animate({ top: "-=640" }, 500);
                jQuery(".tubepage2").animate({ left: "+=4230" }, "fast");
                jQuery(".tubepage2").animate({ top: "+=640" }, 500);
            }

            else {
                var classLength = jQuery(peeker).attr("class").length;

                var nextRight = ".cellpage2" + (currentindex + 1);
                jQuery(peeker).attr("id", "nopage21");
                jQuery(nextRight).attr("id", "yespage20");
                jQuery(".tubepage2").animate({ left: "-=470" }, 500);
            }
        }
    }

    jQuery(".leftpage2").click(function () {
        slidepage2("left");
    });
    jQuery(".rightpage2").click(function () {
        slidepage2("right");
    });
});