$(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>';
}