/*作品一覧表示用*/



(function () {

    $.fn.infiniteCarousel = function () {

        PortfolioNum = ( PortfolioNum + 10 ) * 168;   //作品の個数　×　画像１枚当たりの幅(px)
        //※「12」は、画像クローン(clone)が12個自動生成されるため、追加している(contents2.css内にも記述変更する箇所があるので注意)

        function repeat(str, n) { return new Array(n + 1).join(str); } return this.each(function () {

            // magic!

            var $wrapper1 = $('> div', this).css('overflow', 'hidden'),

        $slider1 = $wrapper1.find('> ul').width(PortfolioNum),   //作品の個数　×　画像１枚当たりの幅(px)

        $items1 = $slider1.find('> li'),

        $single1 = $items1.filter(':first')

            singleWidth1 = $single1.outerWidth(),

        visible1 = Math.ceil($wrapper1.innerWidth() / singleWidth1),

        currentPage1 = 1,

        pages1 = Math.ceil($items1.length / 1);

            /* TASKS */

            // 1. pad the pages with empty element if required

            if ($items1.length % 1 != 0) {

                // pad

                $slider1.append(repeat('<li class="empty" />', visibl1e - ($items1.length % visible1)));

                $items1 = $slider1.find('> li');

            }

            // 2. create the carousel padding on left and right (cloned)

            $items1.filter(':first').before($items1.slice(-visible1).clone().addClass('cloned'));

            $items1.filter(':last').after($items1.slice(0, visible1).clone().addClass('cloned'));

            $items1 = $slider1.find('> li');

            // 3. reset scroll

            $wrapper1.scrollLeft(singleWidth1 * 1);

            // 4. paging function

            function gotoPage(page1) {

                var dir1 = page1 < currentPage1 ? -1 : 1,

        n1 = Math.abs(currentPage1 - page1),

        left1 = singleWidth1 * dir1 * 1 * n1;

                $wrapper1.filter(':not(:animated)').animate({

                    scrollLeft: '+=' + left1

                }, 500, function () {

                    // if page == last page - then reset position

                    if (page1 > pages1) {

                        $wrapper1.scrollLeft(singleWidth1 * 1); page1 = 1;

                    } else if (page1 == 0) { page1 = pages1; $wrapper1.scrollLeft(singleWidth1 * 1 * pages1); } currentPage1 = page1;

                });

            }

            // 5. insert the back and forward link

            $wrapper1.after('<a href="#" class="arrow back"></a><a href="#" class="arrow forward"></a>');

            // 6. bind the back and forward links

            $('a.back', this).click(function () {

                gotoPage(currentPage1 - 1);

                return false;

            });

            $('a.forward', this).click(function () {

                gotoPage(currentPage1 + 1);

                return false;

            });

            $(this).bind('goto', function (event, page1) {

                gotoPage(page1);

            });

            // THIS IS NEW CODE FOR THE AUTOMATIC INFINITE CAROUSEL

            $(this).bind('next', function () {

                gotoPage(currentPage1 + 1);

            });
        });
    };
})(jQuery); $(document).ready(function () {
    // THIS IS NEW CODE FOR THE AUTOMATIC INFINITE CAROUSEL
    var autoscrolling = true;
    $('.infiniteCarousel').infiniteCarousel().mouseover(function () {
        autoscrolling = false;
    }).mouseout(function () {
        autoscrolling = true;
    });

    setInterval(function () {
        if (autoscrolling) {
            $('.infiniteCarousel').trigger('next');
        }
    }, 5000);
});



/*クリエイター一覧表示用*/


    (function () {

        $.fn.infiniteCarousel2 = function () {

        CreatorNum = ( CreatorNum + 8 ) * 103;   //クリエイターの人数　×　画像１枚当たりの幅(px)
        //※「8」は、画像クローン(clone)が8個生成されるため追加(contents2.css内にも記述変更する箇所があるので注意)

            function repeat(str2, n2) { return new Array(n2 + 1).join(str2); } return this.each(function () {

                // magic!

                var $wrapper2 = $('> div', this).css('overflow', 'hidden'),

        $slider = $wrapper2.find('> ul').width(CreatorNum),   //クリエイター人数　×　画像１枚当たりの幅(px)

        $items = $slider.find('> li'),

        $single = $items.filter(':first')

                singleWidth2 = $single.outerWidth(),

        visible2 = Math.ceil($wrapper2.innerWidth() / singleWidth2),

        currentPage2 = 1,

        pages2 = Math.ceil($items.length / 1);

                /* TASKS */

                // 1. pad the pages with empty element if required

                if ($items.length % 1 != 0) {

                    // pad

                    $slider.append(repeat('<li class="empty" />', visible2 - ($items.length % visible2)));

                    $items = $slider.find('> li');

                }

                // 2. create the carousel padding on left and right (cloned)

                $items.filter(':first').before($items.slice(-visible2).clone().addClass('cloned'));

                $items.filter(':last').after($items.slice(0, visible2).clone().addClass('cloned'));

                $items = $slider.find('> li');

                // 3. reset scroll

                $wrapper2.scrollLeft(singleWidth2 * 1);

                // 4. paging function

                function gotoPage(page2) {

                    var dir = page2 < currentPage2 ? -1 : 1,

        n2 = Math.abs(currentPage2 - page2),

        left2 = singleWidth2 * dir * 1 * n2;

                    $wrapper2.filter(':not(:animated)').animate({

                        scrollLeft: '+=' + left2

                    }, 500, function () {

                        // if page == last page - then reset position

                        if (page2 > pages2) {

                            $wrapper2.scrollLeft(singleWidth2 * 1); page2 = 1;

                        } else if (page2 == 0) { page2 = pages2; $wrapper2.scrollLeft(singleWidth2 * 1 * pages2); } currentPage2 = page2;

                    });

                }

                // 5. insert the back and forward link

                $wrapper2.after('<a href="#" class="arrow back">&lt;</a><a href="#" class="arrow forward">&gt;</a>');

                // 6. bind the back and forward links

                $('a.back', this).click(function () {

                    gotoPage(currentPage2 - 1);

                    return false;

                });

                $('a.forward', this).click(function () {

                    gotoPage(currentPage2 + 1);

                    return false;

                });

                $(this).bind('goto', function (event2, page2) {

                    gotoPage(page2);

                });

                // THIS IS NEW CODE FOR THE AUTOMATIC INFINITE CAROUSEL

                $(this).bind('next', function () {

                    gotoPage(currentPage2 + 1);

                });
            });
        };
    })(jQuery); $(document).ready(function () {
        // THIS IS NEW CODE FOR THE AUTOMATIC INFINITE CAROUSEL
        var autoscrolling = true;
        $('.infiniteCarousel2').infiniteCarousel2().mouseover(function () {
            autoscrolling = false;
        }).mouseout(function () {
            autoscrolling = true;
        });

        setInterval(function () {
            if (autoscrolling) {
                $('.infiniteCarousel2').trigger('next');
            }
        }, 5000);
    });

