$(document).ready(function() {
    var offsetNotes = 0,
        lastNotes = false;

    // Индикатор ajax-запросов
    $(document).ajaxStart(function() {
        $('.loader').show();
    }).ajaxStop(function() {
        window.setTimeout(function() {
            $('.loader').hide();
        }, 2000);
    });

    // Основная подкрузка записей
    $.ajax({
        method: "POST",
        url: "/extras/notes.php",
        data: {offset: offsetNotes},
        dataType: "json"
    }).done(function(response) {
        $('.arrow,.arrow .down').show();
        $('.notes').html(showNotes(response));
        offsetNotes++;
        lastNotes = false;
    });

    // Переход вверх
    $('body').on('click', '.arrow .up', function() {
        $('html,body').animate({scrollTop: 0});
        return false;
    });

    // Переход вниз
    $('body').on('click', '.arrow .down', function() {
        $('html,body').animate({scrollTop: $(document).height() - $(window).height()});
        return false;
    });

    // Закрытие поиска и отправки сообщения
    $('body').on('click', '.close', function() {
        if ($(this).data('toggle') == 'comment') {
            $('.box,.close,.box .content button').hide();
            $('.box .content textarea').val('');
        }

        if ($(this).data('toggle') == 'search') {
            $('.search-form,.close').hide();
            $('.search-form input').val('');

            offsetNotes = 0;

            // Подкрузка записей после закрытия поиска
            $.ajax({
                method: "POST",
                url: "/extras/notes.php",
                data: {offset: offsetNotes},
                dataType: "json"
            }).done(function(response) {
                $('.notes').html(showNotes(response));
                offsetNotes++;
                lastNotes = false;
            });
        }

        $('.logo').fadeIn();
        $('.arrow,.arrow .down').show();
        $('body').css('overflow', 'auto');
        $(window).scrollTop(0);
    });

    // Вывод поля для поиска
    $('body').on('click', '.icons .search', function() {
        $('.logo').hide();
        $('.search-form,.close').show();
        $('.search-form input').focus();
        $('.arrow,.arrow .up,.arrow .down').hide();
        $('.close').data('toggle','search');

        return false;
    });

    // Выполнение поиска в записях
    $('body').on('keypress', '.search-form input', function() {
        var searchInput = $(this);

        $(window).scrollTop(0);

        setTimeout(function() {
            searchQuery = searchInput.val();

            if (searchQuery.length > 4) {
                $.ajax({
                    method: "POST",
                    url: "/extras/notes.php",
                    data: {offset: offsetNotes, query: searchQuery},
                    dataType: "json"
                }).done(function (response) {
                    if (response.length) {
                        if (response.length > 3) {
                            $('.arrow,.arrow .down').show();
                        }

                        $('.notes').html(showNotes(response));
                    } else {
                        $('.notes').html(showMessage('Ничего не найдено'));
                    }
                });
            } else {
                $('.notes').html(showMessage('Введите в поиске больше 4 символов'));
            }
        }, 0);
    });

    // Вывод отправки ссобщения
    $('body').on('click', '.icons .comment', function() {

        $.ajax({
            method: 'POST',
            url: '/extras/comment.php',
            data: {content: true},
            dataType: 'json'
        }).done(function(response) {
            $('.box .content').html(response.content);
            $('.box,.close').show();
            $('.box .content textarea').focus();
            $('.box .content textarea').on('keypress', function() {
                $('.box .content button').fadeIn();
            });
        });

        $('.arrow,.arrow .up,.arrow .down').hide();
        $('body').css('overflow', 'hidden');
        $('.close').data('toggle','comment');

        $('body').on('click', '.box .content button', function() {
            var textMessage = 'Hello';
            $.ajax({
                method: 'POST',
                url: '/extras/comment.php',
                data: {message: textMessage},
                dataType: 'json'
            }).done(function(response) {
                if (response.sending) {
                    $('.box .content').html(showMessage('Сообщение отправлено :)'));
                } else {
                    $('.box .content').html(showMessage('Сообщение не может быть отправленно. Попробуйте позже!'));
                }
            });
        });

        return false;
    });

    // Автоподгрузка записей
    $(window).scroll(function() {
        if ($(window).scrollTop() == 0) {
            $('.arrow,.arrow .up').hide();
            $('.arrow,.arrow .down').show();
        } else if ($(window).scrollTop() > 600) {
            $('.arrow,.arrow .down').hide();
            $('.arrow,.arrow .up').show();
        }

        // Подгрузка записей при скролинке до конца документа
        if (($(window).scrollTop() + $(window).height()) == $(document).height() && !$('.search-form input').val()) {
            if (!lastNotes) {
                $.ajax({
                    method: "POST",
                    url: "/extras/notes.php",
                    data: {offset: offsetNotes},
                    dataType: "json"
                }).done(function (response) {
                    if (response.length) {
                        $('.notes').append(showNotes(response));
                        offsetNotes++;
                    } else {
                        lastNotes = true;
                    }
                });
            }
        }
    });
});

function showNotes(data) {
    var output = '';
    for (i = 0; i < data.length; i++) {
        output += '<div class="entry">';
        output += '<h1 class="title"><span>' + data[i].id + '</span>' + data[i].title + '</h1>';
        output += '<div class="text">' + data[i].shortnote + '</div>';
        output += '<div class="bottom">';
        output += '<span><i class="fa fa-calendar"></i> ' + data[i].date + '</span>';
        output += '<span><i class="fa fa-eye"></i> ' + data[i].view + '</span>';
        output += '</div></div>';
    }

    return output;
}

function showMessage(message) {
    return '<div class="message">' + message + '</div>';
}