hw6, hw7
- Redis / Celery / Celery Beat - кэширование популярных тегов и лучших участников - асинхронные уведомления в Centrifugo - отправка email-уведомлений через Celery - полнотекстовый поиск и подсказки - Docker Compose инфраструктура
This commit is contained in:
1 parent
becfbeb070
commit
4bc5fcef7a
154 files changed
+33164
-198
No files matched your search
Vendored
+6
@@ -0,0 +1,6 @@
|
||||
@charset "UTF-8";/*!
|
||||
* Bootstrap v5.3.8 (https://getbootstrap.com/)
|
||||
* Copyright 2011-2025 The Bootstrap Authors
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||
*/:root,[data-bs-theme=light]{--bs-blue:#0d6efd;--bs-indigo:#6610f2;--bs-purple:#6f42c1;--bs-pink:#d63384;--bs-red:#dc3545;--bs-orange:#fd7e14;--bs-yellow:#ffc107;--bs-green:#198754;--bs-teal:#20c997;--bs-cyan:#0dcaf0;--bs-black:#000;--bs-white:#fff;--bs-gray:#6c757d;--bs-gray-dark:#343a40;--bs-gray-100:#f8f9fa;--bs-gray-200:#e9ecef;--bs-gray-300:#dee2e6;--bs-gray-400:#ced4da;--bs-gray-500:#adb5bd;--bs-gray-600:#6c757d;--bs-gray-700:#495057;--bs-gray-800:#343a40;--bs-gray-900:#212529;--bs-primary:#0d6efd;--bs-secondary:#6c757d;--bs-success:#198754;--bs-info:#0dcaf0;--bs-warning:#ffc107;--bs-danger:#dc3545;--bs-light:#f8f9fa;--bs-dark:#212529;--bs-primary-rgb:13,110,253;--bs-secondary-rgb:108,117,125;--bs-success-rgb:25,135,84;--bs-info-rgb:13,202,240;--bs-warning-rgb:255,193,7;--bs-danger-rgb:220,53,69;--bs-light-rgb:248,249,250;--bs-dark-rgb:33,37,41;--bs-primary-text-emphasis:#052c65;--bs-secondary-text-emphasis:#2b2f32;--bs-success-text-emphasis:#0a3622;--bs-info-text-emphasis:#055160;--bs-warning-text-emphasis:#664d03;--bs-danger-text-emphasis:#58151c;--bs-light-text-emphasis:#495057;--bs-dark-text-emphasis:#495057;--bs-primary-bg-subtle:#cfe2ff;--bs-secondary-bg-subtle:#e2e3e5;--bs-success-bg-subtle:#d1e7dd;--bs-info-bg-subtle:#cff4fc;--bs-warning-bg-subtle:#fff3cd;--bs-danger-bg-subtle:#f8d7da;--bs-light-bg-subtle:#fcfcfd;--bs-dark-bg-subtle:#ced4da;--bs-primary-border-subtle:#9ec5fe;--bs-secondary-border-subtle:#c4c8cb;--bs-success-border-subtle:#a3cfbb;--bs-info-border-subtle:#9eeaf9;--bs-warning-border-subtle:#ffe69c;--bs-danger-border-subtle:#f1aeb5;--bs-light-border-subtle:#e9ecef;--bs-dark-border-subtle:#adb5bd;--bs-white-rgb:255,255,255;--bs-black-rgb:0,0,0;--bs-font-sans-serif:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--bs-font-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--bs-gradient:linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));--bs-body-font-family:var(--bs-font-sans-serif);--bs-body-font-size:1rem;--bs-body-font-weight:400;--bs-body-line-height:1.5;--bs-body-color:#212529;--bs-body-color-rgb:33,37,41;--bs-body-bg:#fff;--bs-body-bg-rgb:255,255,255;--bs-emphasis-color:#000;--bs-emphasis-color-rgb:0,0,0;--bs-secondary-color:rgba(33, 37, 41, 0.75);--bs-secondary-color-rgb:33,37,41;--bs-secondary-bg:#e9ecef;--bs-secondary-bg-rgb:233,236,239;--bs-tertiary-color:rgba(33, 37, 41, 0.5);--bs-tertiary-color-rgb:33,37,41;--bs-tertiary-bg:#f8f9fa;--bs-tertiary-bg-rgb:248,249,250;--bs-heading-color:inherit;--bs-link-color:#0d6efd;--bs-link-color-rgb:13,110,253;--bs-link-decoration:underline;--bs-link-hover-color:#0a58ca;--bs-link-hover-color-rgb:10,88,202;--bs-code-color:#d63384;--bs-highlight-color:#212529;--bs-highlight-bg:#fff3cd;--bs-border-width:1px;--bs-border-style:solid;--bs-border-color:#dee2e6;--bs-border-color-translucent:rgba(0, 0, 0, 0.175);--bs-border-radius:0.375rem;--bs-border-radius-sm:0.25rem;--bs-border-radius-lg:0.5rem;--bs-border-radius-xl:1rem;--bs-border-radius-xxl:2rem;--bs-border-radius-2xl:var(--bs-border-radius-xxl);--bs-border-radius-pill:50rem;--bs-box-shadow:0 0.5rem 1rem rgba(0, 0, 0, 0.15);--bs-box-shadow-sm:0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);--bs-box-shadow-lg:0 1rem 3rem rgba(0, 0, 0, 0.175);--bs-box-shadow-inset:inset 0 1px 2px rgba(0, 0, 0, 0.075);--bs-focus-ring-width:0.25rem;--bs-focus-ring-opacity:0.25;--bs-focus-ring-color:rgba(13, 110, 253, 0.25);--bs-form-valid-color:#198754;--bs-form-valid-border-color:#198754;--bs-form-invalid-color:#dc3545;--bs-form-invalid-border-color:#dc3545}[data-bs-theme=dark]{color-scheme:dark;--bs-body-color:#dee2e6;--bs-body-color-rgb:222,226,230;--bs-body-bg:#212529;--bs-body-bg-rgb:33,37,41;--bs-emphasis-color:#fff;--bs-emphasis-color-rgb:255,255,255;--bs-secondary-color:rgba(222, 226, 230, 0.75);--bs-secondary-color-rgb:222,226,230;--bs-secondary-bg:#343a40;--bs-secondary-bg-rgb:52,58,64;--bs-tertiary-color:rgba(222, 226, 230, 0.5);--bs-tertiary-color-rgb:222,226,230;--bs-tertiary-bg:#2b3035;--bs-tertiary-bg-rgb:43,48,53;--bs-primary-text-emphasis:#6ea8fe;--bs-secondary-text-emphasis:#a7acb1;--bs-success-text-emphasis:#75b798;--bs-info-text-emphasis:#6edff6;--bs-warning-text-emphasis:#ffda6a;--bs-danger-text-emphasis:#ea868f;--bs-light-text-emphasis:#f8f9fa;--bs-dark-text-emphasis:#dee2e6;--bs-primary-bg-subtle:#031633;--bs-secondary-bg-subtle:#161719;--bs-success-bg-subtle:#051b11;--bs-info-bg-subtle:#032830;--bs-warning-bg-subtle:#332701;--bs-danger-bg-subtle:#2c0b0e;--bs-light-bg-subtle:#343a40;--bs-dark-bg-subtle:#1a1d20;--bs-primary-border-subtle:#084298;--bs-secondary-border-subtle:#41464b;--bs-success-border-subtle:#0f5132;--bs-info-border-subtle:#087990;--bs-warning-border-subtle:#997404;--bs-danger-border-subtle:#842029;--bs-light-border-subtle:#495057;--bs-dark-border-subtle:#343a40;--bs-heading-color:inherLine truncated
|
||||
/*# sourceMappingURL=bootstrap.min.css.map */
|
||||
@@ -0,0 +1,438 @@
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background: linear-gradient(135deg, #e8f0f7 0%, #f7f7f7 100%);
|
||||
color: #1f2d3a;
|
||||
font-family: Verdana, Arial, sans-serif;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #1d57d4;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.page {
|
||||
width: 96%;
|
||||
max-width: 60rem;
|
||||
margin: 3vh auto;
|
||||
background: #ffffff;
|
||||
border: 0.125rem solid #1f2d3a;
|
||||
border-radius: 0.9rem;
|
||||
box-shadow: 0 0.75rem 1.5rem rgba(20, 40, 60, 0.12);
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: calc(100vh - 6vh);
|
||||
}
|
||||
|
||||
.site-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 1rem 1.25rem;
|
||||
border-bottom: 0.125rem solid #1f2d3a;
|
||||
gap: 1rem;
|
||||
flex-wrap: wrap;
|
||||
background: #f2f7f7;
|
||||
}
|
||||
|
||||
.logo {
|
||||
font-size: 1.6rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.03rem;
|
||||
font-family: Verdana, Arial, sans-serif;
|
||||
}
|
||||
|
||||
.search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.6rem;
|
||||
flex: 1;
|
||||
min-width: 40%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.search input {
|
||||
flex: 1;
|
||||
min-width: 45%;
|
||||
padding: 0.4rem 0.75rem;
|
||||
border: 0.125rem solid #1f2d3a;
|
||||
border-radius: 1.5rem;
|
||||
background: #fff;
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.button {
|
||||
border: 0.125rem solid #1f2d3a;
|
||||
background: #fff;
|
||||
padding: 0.35rem 0.9rem;
|
||||
font-weight: 700;
|
||||
cursor: pointer;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.04rem;
|
||||
}
|
||||
|
||||
.button--ask {
|
||||
background: #ff8a00;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.user-block {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.6rem;
|
||||
}
|
||||
|
||||
.user-links {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.2rem;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.user-links a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.user-auth {
|
||||
display: flex;
|
||||
gap: 0.6rem;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.content {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 28%;
|
||||
gap: 1.5rem;
|
||||
padding: 1.1rem 1.25rem 1.5rem;
|
||||
}
|
||||
|
||||
.main-title {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
gap: 1rem;
|
||||
margin: 0 0 0.8rem;
|
||||
}
|
||||
|
||||
.main-title h1 {
|
||||
margin: 0;
|
||||
font-size: 1.5rem;
|
||||
font-family: Verdana, Arial, sans-serif;
|
||||
}
|
||||
|
||||
.card {
|
||||
border: 0.125rem solid #1f2d3a;
|
||||
padding: 0.75rem;
|
||||
display: grid;
|
||||
grid-template-columns: 18% 1fr;
|
||||
gap: 0.75rem;
|
||||
margin-bottom: 1rem;
|
||||
background: #fcfcfc;
|
||||
box-shadow: 0.25rem 0.25rem 0 rgba(31, 45, 58, 0.08);
|
||||
}
|
||||
|
||||
.avatar-box {
|
||||
width: 4.4rem;
|
||||
height: 4.4rem;
|
||||
border: 0.125rem solid #1f2d3a;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 0.75rem;
|
||||
text-transform: uppercase;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.avatar-box.small {
|
||||
width: 2.9rem;
|
||||
height: 2.9rem;
|
||||
font-size: 0.65rem;
|
||||
}
|
||||
|
||||
.vote-box {
|
||||
margin-top: 0.5rem;
|
||||
border: 0.125rem solid #1f2d3a;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.4rem;
|
||||
padding: 0.25rem 0.4rem;
|
||||
width: fit-content;
|
||||
background: #f2f7f7;
|
||||
}
|
||||
|
||||
.vote-arrows {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 0.65rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.question-title {
|
||||
font-size: 1.1rem;
|
||||
font-weight: 700;
|
||||
margin-bottom: 0.3rem;
|
||||
display: inline-block;
|
||||
color: #2b7a78;
|
||||
}
|
||||
|
||||
.meta {
|
||||
margin-top: 0.4rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.tag {
|
||||
color: #1d57d4;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
background: #f2f7f7;
|
||||
border: 0.125rem solid #1f2d3a;
|
||||
padding: 0.75rem;
|
||||
height: fit-content;
|
||||
box-shadow: 0.25rem 0.25rem 0 rgba(31, 45, 58, 0.08);
|
||||
}
|
||||
|
||||
.not-underlined {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.sidebar h2 {
|
||||
margin: 0 0 0.5rem;
|
||||
font-size: 1.25rem;
|
||||
font-family: Verdana, Arial, sans-serif;
|
||||
}
|
||||
|
||||
.sidebar-section {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.search-suggestions {
|
||||
position: absolute;
|
||||
background: #ffffff;
|
||||
border: 1px solid #1f2d3a;
|
||||
border-radius: 0.5rem;
|
||||
width: calc(100% - 2rem);
|
||||
max-height: 18rem;
|
||||
overflow: auto;
|
||||
display: none;
|
||||
z-index: 100;
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
|
||||
.search-suggestion {
|
||||
display: block;
|
||||
padding: 0.6rem 0.9rem;
|
||||
color: #1f2d3a;
|
||||
text-decoration: none;
|
||||
border-bottom: 1px solid #e8f0f7;
|
||||
}
|
||||
|
||||
.search-suggestion:hover {
|
||||
background: #f0f7ff;
|
||||
}
|
||||
|
||||
.best-members {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.best-members li {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.tag-cloud {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.tag-cloud .tag-red {
|
||||
color: #d4332f;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.tag-cloud .tag-green {
|
||||
color: #2f9e44;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.tag-cloud .tag-orange {
|
||||
color: #e67a2f;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.member-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.form {
|
||||
display: grid;
|
||||
gap: 0.6rem;
|
||||
max-width: 32rem;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
display: grid;
|
||||
grid-template-columns: 30% 1fr;
|
||||
gap: 0.6rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.form input,
|
||||
.form textarea {
|
||||
padding: 0.4rem 0.6rem;
|
||||
border: 0.125rem solid #1f2d3a;
|
||||
font-family: inherit;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.form textarea {
|
||||
min-height: 9rem;
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
.error {
|
||||
color: #d4332f;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.pagination {
|
||||
display: flex;
|
||||
gap: 0.6rem;
|
||||
margin: 0.6rem 0 1rem;
|
||||
}
|
||||
|
||||
.page-link {
|
||||
border: 0.125rem solid #1f2d3a;
|
||||
padding: 0.2rem 0.5rem;
|
||||
min-width: 1.6rem;
|
||||
text-align: center;
|
||||
color: #111;
|
||||
text-decoration: none;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.answer-card {
|
||||
border: 0.125rem solid #1f2d3a;
|
||||
padding: 0.6rem;
|
||||
display: grid;
|
||||
grid-template-columns: 16% 1fr;
|
||||
gap: 0.75rem;
|
||||
margin-bottom: 1rem;
|
||||
background: #fcfcfc;
|
||||
box-shadow: 0.25rem 0.25rem 0 rgba(31, 45, 58, 0.08);
|
||||
}
|
||||
|
||||
.answer-controls {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.4rem;
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
|
||||
.current-tag {
|
||||
display: inline-block;
|
||||
border: 0.125rem solid #1f2d3a;
|
||||
background: #f2f7f7;
|
||||
padding: 0.25rem 0.6rem;
|
||||
margin-bottom: 0.6rem;
|
||||
font-size: 0.85rem;
|
||||
box-shadow: 0.2rem 0.2rem 0 rgba(31, 45, 58, 0.08);
|
||||
}
|
||||
|
||||
.current-tag span {
|
||||
color: #1d57d4;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.footer {
|
||||
border-top: 0.125rem solid #1f2d3a;
|
||||
padding: 0.6rem 1.1rem;
|
||||
background: #f2f7f7;
|
||||
text-align: center;
|
||||
font-size: 0.85rem;
|
||||
margin-top: auto;
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.content {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
order: 2;
|
||||
}
|
||||
|
||||
.search {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 375px) {
|
||||
.site-header {
|
||||
padding: 0.8rem;
|
||||
gap: 0.6rem;
|
||||
}
|
||||
|
||||
.logo {
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
.search {
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
.search input {
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 0.8rem;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.card,
|
||||
.answer-card {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.avatar-box,
|
||||
.avatar-box.small {
|
||||
width: 3.2rem;
|
||||
height: 3.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.page {
|
||||
max-width: 72rem;
|
||||
}
|
||||
|
||||
.content {
|
||||
grid-template-columns: 1fr 24%;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.logo {
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
@@ -0,0 +1,169 @@
|
||||
function getCookie(name) {
|
||||
let cookieValue = null;
|
||||
if (document.cookie && document.cookie !== '') {
|
||||
const cookies = document.cookie.split(';');
|
||||
for (let cookie of cookies) {
|
||||
cookie = cookie.trim();
|
||||
if (cookie.startsWith(name + '=')) {
|
||||
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
return cookieValue;
|
||||
}
|
||||
|
||||
const csrftoken = getCookie('csrftoken');
|
||||
const searchInput = document.getElementById('search-input');
|
||||
const searchSuggestions = document.getElementById('search-suggestions');
|
||||
let searchTimeout = null;
|
||||
|
||||
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,
|
||||
type: 'POST',
|
||||
headers: {
|
||||
'X-CSRFToken': csrftoken
|
||||
},
|
||||
data,
|
||||
success: onSuccess,
|
||||
error: function (xhr) {
|
||||
if (xhr.responseJSON) {
|
||||
alert(xhr.responseJSON.error);
|
||||
} else {
|
||||
alert('Server error');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$(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');
|
||||
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');
|
||||
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');
|
||||
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);
|
||||
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