hw6, hw7
- Redis / Celery / Celery Beat - кэширование популярных тегов и лучших участников - асинхронные уведомления в Centrifugo - отправка email-уведомлений через Celery - полнотекстовый поиск и подсказки - Docker Compose инфраструктура
This commit is contained in:
redtea committed
1 parent
becfbeb070
commit
4bc5fcef7a
154 files changed
+33164
-198
No files matched your search
+117
-130
@@ -5,9 +5,7 @@ function getCookie(name) {
|
||||
for (let cookie of cookies) {
|
||||
cookie = cookie.trim();
|
||||
if (cookie.startsWith(name + '=')) {
|
||||
cookieValue = decodeURIComponent(
|
||||
cookie.substring(name.length + 1)
|
||||
);
|
||||
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
|
||||
break;
|
||||
}
|
||||
}
|
||||
@@ -16,29 +14,56 @@ function getCookie(name) {
|
||||
}
|
||||
|
||||
const csrftoken = getCookie('csrftoken');
|
||||
const searchInput = document.getElementById('search-input');
|
||||
const searchSuggestions = document.getElementById('search-suggestions');
|
||||
let searchTimeout = null;
|
||||
|
||||
$(document).on('click', '.question-like', function () {
|
||||
const btn = $(this);
|
||||
const questionId = btn.data('id');
|
||||
function setSearchSuggestions(results) {
|
||||
if (!searchSuggestions) return;
|
||||
if (!results.length) {
|
||||
searchSuggestions.innerHTML = '';
|
||||
searchSuggestions.style.display = 'none';
|
||||
return;
|
||||
}
|
||||
searchSuggestions.innerHTML = results.map(item => `
|
||||
<a class="search-suggestion" href="${item.url}">${item.title}</a>
|
||||
`).join('');
|
||||
searchSuggestions.style.display = 'block';
|
||||
}
|
||||
|
||||
if (searchInput) {
|
||||
searchInput.addEventListener('input', function () {
|
||||
const query = this.value.trim();
|
||||
clearTimeout(searchTimeout);
|
||||
if (!query) {
|
||||
setSearchSuggestions([]);
|
||||
return;
|
||||
}
|
||||
searchTimeout = setTimeout(function () {
|
||||
fetch(`/search?q=${encodeURIComponent(query)}`)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
setSearchSuggestions(data.results || []);
|
||||
})
|
||||
.catch(() => setSearchSuggestions([]));
|
||||
}, 250);
|
||||
});
|
||||
document.addEventListener('click', function (event) {
|
||||
if (!searchSuggestions.contains(event.target) && event.target !== searchInput) {
|
||||
searchSuggestions.style.display = 'none';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function postReaction(url, data, onSuccess) {
|
||||
$.ajax({
|
||||
url: '/ajax/question/react/',
|
||||
url,
|
||||
type: 'POST',
|
||||
headers: {
|
||||
'X-CSRFToken': csrftoken
|
||||
},
|
||||
data: {
|
||||
question_id: questionId,
|
||||
type: 'like'
|
||||
},
|
||||
success: function (response) {
|
||||
$('#question-rating-' + questionId)
|
||||
.text(response.rating);
|
||||
btn.remove();
|
||||
$('.question-dislike[data-id="' + questionId + '"]')
|
||||
.remove();
|
||||
$('#question-rating-' + questionId)
|
||||
.after('<span> voted </span>');
|
||||
},
|
||||
data,
|
||||
success: onSuccess,
|
||||
error: function (xhr) {
|
||||
if (xhr.responseJSON) {
|
||||
alert(xhr.responseJSON.error);
|
||||
@@ -47,136 +72,98 @@ $(document).on('click', '.question-like', function () {
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$(document).on('click', '.question-like', function () {
|
||||
const btn = $(this);
|
||||
const questionId = btn.data('id');
|
||||
postReaction('/ajax/question/react/', {question_id: questionId, type: 'like'}, function (response) {
|
||||
$('#question-rating-' + questionId).text(response.rating);
|
||||
btn.remove();
|
||||
$('.question-dislike[data-id="' + questionId + '"]').remove();
|
||||
$('#question-rating-' + questionId).after('<span> voted </span>');
|
||||
});
|
||||
});
|
||||
|
||||
$(document).on('click', '.question-dislike', function () {
|
||||
const btn = $(this);
|
||||
const questionId = btn.data('id');
|
||||
$.ajax({
|
||||
url: '/ajax/question/react/',
|
||||
type: 'POST',
|
||||
headers: {
|
||||
'X-CSRFToken': csrftoken
|
||||
},
|
||||
data: {
|
||||
question_id: questionId,
|
||||
type: 'dislike'
|
||||
},
|
||||
success: function (response) {
|
||||
$('#question-rating-' + questionId)
|
||||
.text(response.rating);
|
||||
btn.remove();
|
||||
$('.question-like[data-id="' + questionId + '"]')
|
||||
.remove();
|
||||
$('#question-rating-' + questionId)
|
||||
.after('<span> voted </span>');
|
||||
}
|
||||
error: function (xhr) {
|
||||
if (xhr.responseJSON) {
|
||||
alert(xhr.responseJSON.error);
|
||||
} else {
|
||||
alert('Server error');
|
||||
}
|
||||
}
|
||||
postReaction('/ajax/question/react/', {question_id: questionId, type: 'dislike'}, function (response) {
|
||||
$('#question-rating-' + questionId).text(response.rating);
|
||||
btn.remove();
|
||||
$('.question-like[data-id="' + questionId + '"]').remove();
|
||||
$('#question-rating-' + questionId).after('<span> voted </span>');
|
||||
});
|
||||
});
|
||||
|
||||
$(document).on('click', '.answer-like', function () {
|
||||
const btn = $(this);
|
||||
const answerId = btn.data('id');
|
||||
$.ajax({
|
||||
url: '/ajax/answer/react/',
|
||||
type: 'POST',
|
||||
headers: {
|
||||
'X-CSRFToken': csrftoken
|
||||
},
|
||||
data: {
|
||||
answer_id: answerId,
|
||||
type: 'like'
|
||||
}
|
||||
success: function (response) {
|
||||
$('#answer-rating-' + answerId)
|
||||
.text(response.rating);
|
||||
btn.remove();
|
||||
$('.answer-dislike[data-id="' + answerId + '"]')
|
||||
.remove();
|
||||
$('#answer-rating-' + answerId)
|
||||
.after('<span> voted </span>');
|
||||
},
|
||||
error: function (xhr) {
|
||||
if (xhr.responseJSON) {
|
||||
alert(xhr.responseJSON.error);
|
||||
} else {
|
||||
alert('Server error');
|
||||
}
|
||||
}
|
||||
postReaction('/ajax/answer/react/', {answer_id: answerId, type: 'like'}, function (response) {
|
||||
$('#answer-rating-' + answerId).text(response.rating);
|
||||
btn.remove();
|
||||
$('.answer-dislike[data-id="' + answerId + '"]').remove();
|
||||
$('#answer-rating-' + answerId).after('<span> voted </span>');
|
||||
});
|
||||
});
|
||||
|
||||
$(document).on('click', '.answer-dislike', function () {
|
||||
const btn = $(this);
|
||||
const answerId = btn.data('id');
|
||||
$.ajax({
|
||||
url: '/ajax/answer/react/',
|
||||
type: 'POST',
|
||||
headers: {
|
||||
'X-CSRFToken': csrftoken
|
||||
},
|
||||
data: {
|
||||
answer_id: answerId,
|
||||
type: 'dislike'
|
||||
},
|
||||
success: function (response) {
|
||||
$('#answer-rating-' + answerId)
|
||||
.text(response.rating);
|
||||
btn.remove();
|
||||
$('.answer-like[data-id="' + answerId + '"]')
|
||||
.remove();
|
||||
|
||||
$('#answer-rating-' + answerId)
|
||||
.after('<span> voted </span>');
|
||||
},
|
||||
|
||||
error: function (xhr) {
|
||||
|
||||
if (xhr.responseJSON) {
|
||||
alert(xhr.responseJSON.error);
|
||||
} else {
|
||||
alert('Server error');
|
||||
}
|
||||
}
|
||||
postReaction('/ajax/answer/react/', {answer_id: answerId, type: 'dislike'}, function (response) {
|
||||
$('#answer-rating-' + answerId).text(response.rating);
|
||||
btn.remove();
|
||||
$('.answer-like[data-id="' + answerId + '"]').remove();
|
||||
$('#answer-rating-' + answerId).after('<span> voted </span>');
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
$(document).on('click', '.correct-answer-btn', function () {
|
||||
const btn = $(this);
|
||||
$.ajax({
|
||||
url: '/ajax/answer/correct/',
|
||||
type: 'POST',
|
||||
headers: {
|
||||
'X-CSRFToken': csrftoken
|
||||
},
|
||||
data: {
|
||||
question_id: btn.data('question'),
|
||||
answer_id: btn.data('answer')
|
||||
},
|
||||
success: function (response) {
|
||||
$('.correct-label').remove();
|
||||
$('#answer-' + response.correct_answer_id)
|
||||
.find('.answer-controls')
|
||||
.html(`
|
||||
<span class="correct-label">
|
||||
✔ Correct
|
||||
</span>
|
||||
`);
|
||||
},
|
||||
error: function (xhr) {
|
||||
if (xhr.responseJSON) {
|
||||
alert(xhr.responseJSON.error);
|
||||
} else {
|
||||
alert('Server error');
|
||||
}
|
||||
}
|
||||
postReaction('/ajax/answer/correct/', {
|
||||
question_id: btn.data('question'),
|
||||
answer_id: btn.data('answer')
|
||||
}, function (response) {
|
||||
$('.correct-label').remove();
|
||||
$('#answer-' + response.correct_answer_id).find('.answer-controls').html(`
|
||||
<span class="correct-label">
|
||||
✔ Correct
|
||||
</span>
|
||||
`);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
(function () {
|
||||
try {
|
||||
if (window.ASK_QUESTION_ID) {
|
||||
const host = location.hostname;
|
||||
const protocol = location.protocol === 'https:' ? 'wss' : 'ws';
|
||||
const centrifugoWs = protocol + '://' + host + ':8001/connection/websocket';
|
||||
|
||||
const centrifuge = new Centrifuge(centrifugoWs);
|
||||
centrifuge.on('connect', function (ctx) {
|
||||
console.log('centrifuge connected', ctx);
|
||||
});
|
||||
|
||||
const channel = 'question_' + window.ASK_QUESTION_ID;
|
||||
centrifuge.subscribe(channel, function (message) {
|
||||
const data = message.data;
|
||||
const answerHtml = `\n<article class="answer-card" id="answer-${data.id}">\n <div>\n <div class="avatar-box">avatar</div>\n <div class="vote-box"><span id="answer-rating-${data.id}">0</span></div>\n </div>\n <div>\n <p>${data.body}</p>\n <div class="answer-controls"></div>\n </div>\n</article>\n`;
|
||||
const answers = document.querySelectorAll('.answer-card');
|
||||
if (answers.length) {
|
||||
answers[answers.length - 1].insertAdjacentHTML('afterend', answerHtml);
|
||||
} else {
|
||||
const questionArticle = document.querySelector('article.card');
|
||||
if (questionArticle) {
|
||||
questionArticle.insertAdjacentHTML('afterend', answerHtml);
|
||||
} else {
|
||||
location.reload();
|
||||
}
|
||||
}
|
||||
});
|
||||
centrifuge.connect();
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('centrifuge init error', e);
|
||||
}
|
||||
})();
|
||||
Reference in new issue
Block a user