(function ($) {
    $.ajax({
        url: 'https://cms.atlus.co.jp/pch/get_tweet.php',
        success: function(response) {

            var tweets = response,
                $tweetList = $('.tweet-list'),
                html = [],
                i, length;

            for (i = 0, length = tweets.length; i < length; i++) {
                html.push([
                    '<li class="item">',
                    '<a href="' + tweets[i].url + '" target="_blank">' + tweets[i].text + '</a>',
                    '</li>'
                ].join(''))
            }
            $tweetList.html(html.join(''));

            var animationObject = [],
                currentIndex = 0;
            $tweetList.find('li').each(function(index, element) {
                var $element = $(element),
                    $a = $element.find('a'),
                    width = $a.width();
                animationObject.push({
                    $element: $element,
                    $child: $a,
                    width: width,
                    diff: $element.width() - width - 25,
                    index: index
                });
            });

            runAnimation(animationObject[currentIndex]);

            function runAnimation(item) {
                (function() {
                    var deferred = $.Deferred();

                    item.$element.one('animationend webkitAnimationEnd oanimationend MSAnimationEnd', function() {
                        deferred.resolve();
                    });

                    item.$element.css('z-index', 1).addClass('fadeInDown').addClass('run');

                    return deferred.promise();
                })().then(function() {
                    var deferred = $.Deferred();

                    setTimeout(function() {
                        deferred.resolve();
                    }, 1000);

                    return deferred.promise();
                }).then(function() {

                    var deferred = $.Deferred();
                    if (item.diff > 0) {
                        deferred.resolve();
                        return deferred.promise();
                    }

                    item.$child.one('oTransitionEnd mozTransitionEnd webkitTransitionEnd transitionend', function() {
                        deferred.resolve();
                    });

                    item.$child.css({
                        transform:  'translate3d(' + item.diff + 'px, 0, 0)',
                        'transition-duration': Math.abs(item.diff / 100) + 's'
                    });

                    return deferred.promise();
                }).then(function() {
                    var deferred = $.Deferred();

                    setTimeout(function() {
                        deferred.resolve();
                    }, 5000);

                    return deferred.promise();

                }).then(function() {
                    var deferred = $.Deferred();

                    item.$element.one('animationend webkitAnimationEnd oanimationend MSAnimationEnd', function() {
                        deferred.resolve();
                    });

                    item.$element.addClass('fadeOutDown').addClass('run');

                    return deferred.promise();
                }).then(function() {
                    item.$element.css('z-index', 0).removeClass('run fadeInDown fadeOutDown');
                    item.$child.css('transform', 'none');

                    currentIndex++;
                    if (currentIndex === animationObject.length) {
                        currentIndex = 0;
                    }

                    runAnimation(animationObject[currentIndex]);
                });
            }
        }
    });

    const mediaQuery = window.matchMedia('(max-width: 640px)');
    // calendar
    $.ajax({
        url: '/wp-content/calendar.json',
        dataType: 'json',
        success: function (data) {
            var items = data.items,
                pcHtml = [],
                item;
            var calendarRange = 4;
            if (mediaQuery.matches) {
                calendarRange = 3;
            }

            var $topCalendar = $('.top-calendar');
            var date = new Date();
            date.setDate(date.getDate() - calendarRange);
            // var nowYear = today.getFullYear();
            // var nowMonth = today.getMonth() + 1;
            // var nowDate = today.getDate();
            const months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
            const dayOfWeek = ['【日】', '【月】', '【火】', '【水】', '【木】', '【金】', '【土】'];
            var $calendars = $topCalendar.find('li');
            const startCalendarIndex = 4;
            if (mediaQuery.matches) {
                // $($calendars[0]).addClass('disable');
                // $($calendars[6]).addClass('disable');
                // startCalendarIndex = 3;
            }

            var monthLabel = '';
            for (var i = -calendarRange; i < calendarRange; i++) {
                const targetLi = $($calendars[startCalendarIndex + i]);
                const targetA = $(targetLi.find('a'));
                const monthStr = ('0' + (date.getMonth()+1)).slice(-2);
                const dateStr = ('0' + date.getDate()).slice(-2);
                const formatDate = `${date.getFullYear()}/${monthStr}/${dateStr}`;
                targetA.append(`<p class='date bebase-neue'>${dateStr}<span class="small noto-sans">${dayOfWeek[date.getDay()]}</span></p>`);

                // 月 最初の日付にはラベルをつけない
                if (i !== -calendarRange && monthLabel !== monthStr) {
                    monthLabel = monthStr;
                    targetLi.append(`<p class="month-label bebase-neue">${monthLabel}<span class="small">${months[date.getMonth()].toUpperCase()}</span></p>`);
                }
                if (formatDate in items) {
                    console.log(targetA);
                    if (items[formatDate].url !== '') {
                        targetA.attr('href', items[formatDate].url);
                    }

                    if (items[formatDate].image) {
                        targetLi.css('background-image',`url(${items[formatDate].image})`);
                    }
                    if (items[formatDate].text !== '') {
                        targetA.append(`<p class='text'>${items[formatDate].text}</p>`);
                    }
                }
                date.setDate(date.getDate() + 1);
            }

            function lowerThanDateOnly(date1, date2) {
                console.log('in');
                var year1 = date1.getFullYear();
                var month1 = date1.getMonth() + 1;
                var day1 = date1.getDate();

                var year2 = date2.getFullYear();
                var month2= date2.getMonth() + 1;
                var day2 = date2.getDate();

                if (year1 == year2) {
                    if (month1 == month2) {
                        return day1 < day2;
                    }
                    else {
                        return month1 < month2;
                    }
                } else {
                    return year1 < year2;
                }
            }

            // footer付近までスクロールしたら定位置に固定
            setTimeout(() => {
                $('.top-calendar').waypoint({
                    handler: () => {
                            $($topCalendar.find('ul')[0]).addClass('visible');
                            Cookies.set('animated', new Date().getTime(), {
                                expires: 1,
                            });
                            setTimeout(() => {
                                $($topCalendar.find('ul')[0]).addClass('slide');
                            },1000);
                    },
                    offset: '80%',
                });
            }, 200);
            // const cookieDate = Cookies.get('animated');
            // if (!cookieDate ||
            //     (cookieDate && lowerThanDateOnly(new Date(Number(cookieDate)), new Date()))) {
            //     setTimeout(() => {
            //         $($topCalendar.find('ul')[0]).addClass('visible');
            //         Cookies.set('animated', new Date().getTime(), {
            //             expires: 1,
            //         });
            //     }, 1000);
            // } else {
            //     $($topCalendar.find('ul')[0]).addClass('animated');
            // }
        }
    })

    $('[data-fancybox]').fancybox({
        infobar: false,
        toolbar: true,
        buttons: [
            'close'
        ],
        arrows: false,
        touch: true,
        loop: true,
        hash: false,
        animationEffect: 'fade',
        idleTime: 0
    });

})(jQuery);