From dd16d02e0667e43f86d9c3344919844594ab352d Mon Sep 17 00:00:00 2001 From: glebkostin Date: Tue, 7 May 2024 13:20:01 +0300 Subject: [PATCH 01/87] =?UTF-8?q?HAR-126:=20=D0=9F=D0=BE=D0=BC=D0=B5=D0=BD?= =?UTF-8?q?=D1=8F=D0=BB=20=D1=81=D1=82=D0=B8=D0=BB=D0=B8=20=D0=B2=20=D1=80?= =?UTF-8?q?=D0=B5=D0=B3=D0=B8=D1=81=D1=82=D1=80=D0=B0=D1=86=D0=B8=D0=B8=20?= =?UTF-8?q?=D0=B8=20=D0=B4=D0=BE=D0=B1=D0=B0=D0=B2=D0=B8=D0=BB=20=D1=80?= =?UTF-8?q?=D0=B0=D0=B1=D0=BE=D1=87=D0=B8=D0=B9=20=D0=B3=D0=BB=D0=B0=D0=B7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../inputField/ui/inputField.handlebars | 3 +- source/entity/inputField/ui/inputField.js | 18 ++++-- source/entity/inputField/ui/inputField.scss | 17 ++++- source/pages/signup/ui/signupView.js | 62 +------------------ source/shared/static/eye_closed.svg | 1 + source/shared/styles/input/_input.scss | 4 +- 6 files changed, 36 insertions(+), 69 deletions(-) create mode 100644 source/shared/static/eye_closed.svg diff --git a/source/entity/inputField/ui/inputField.handlebars b/source/entity/inputField/ui/inputField.handlebars index ec28b371..c526d68b 100644 --- a/source/entity/inputField/ui/inputField.handlebars +++ b/source/entity/inputField/ui/inputField.handlebars @@ -2,7 +2,8 @@ {{#if isPassword}}
- + +
{{/if}}
diff --git a/source/entity/inputField/ui/inputField.js b/source/entity/inputField/ui/inputField.js index 5532defa..1bf701a8 100644 --- a/source/entity/inputField/ui/inputField.js +++ b/source/entity/inputField/ui/inputField.js @@ -13,11 +13,10 @@ export class InputField extends View { } render(blockID) { - this.root.innerHTML = inputFieldTemplate( - { + this.root.innerHTML = inputFieldTemplate({ field: this.field, isPassword: this.field.type === 'password', - }); + }); const input = this.root.querySelector('#' + this.field.inputField); if (this.field.hint) { const hint = this.root.querySelector('#' + this.field.hint); @@ -40,8 +39,19 @@ export class InputField extends View { }); if (this.field.type === 'password') { const eyeButton = this.root.querySelector('#eye'); + + const eyeOpen = document.querySelector('#eye-open'); + const eyeClosed = document.querySelector('#eye-closed'); eyeButton.addEventListener('click', () => { - eyeButton.classList.toggle('slash'); + if (input.type === 'password'){ + eyeOpen.classList.add('eye__visibility-hidden'); + eyeClosed.classList.remove('eye__visibility-hidden'); + input.type = 'text'; + } else { + eyeOpen.classList.remove('eye__visibility-hidden'); + eyeClosed.classList.add('eye__visibility-hidden'); + input.type = 'password'; + } }); } } diff --git a/source/entity/inputField/ui/inputField.scss b/source/entity/inputField/ui/inputField.scss index 6febc8a5..2f7927a9 100644 --- a/source/entity/inputField/ui/inputField.scss +++ b/source/entity/inputField/ui/inputField.scss @@ -2,7 +2,7 @@ .hint{ position: absolute; - border: 2px solid; + border: 1px solid; background-color: variables.$background-color; border-radius: variables.$element-border-radius; inset: 10% auto auto calc(100% + 35px); @@ -33,7 +33,7 @@ cursor: pointer; } -.eye::after{ +/*.eye::after{ content: ''; position: absolute; transform: rotate(45deg) scaleX(0); @@ -46,7 +46,7 @@ .slash::after{ transform: rotate(45deg) scaleX(1); -} +}*/ .eye-image{ font-size: 18px; @@ -54,3 +54,14 @@ height: 1.4em; display: block; } + +.eye-image-close{ + position: absolute; + inset: 0; + width: 100%; + height: 100%; +} + +.eye__visibility-hidden{ + visibility: hidden; +} diff --git a/source/pages/signup/ui/signupView.js b/source/pages/signup/ui/signupView.js index c2d19057..4abe84dd 100644 --- a/source/pages/signup/ui/signupView.js +++ b/source/pages/signup/ui/signupView.js @@ -12,6 +12,7 @@ import {NavbarView} from '../../../widgets/navbar/ui/navbar.js'; import {SignupAPI} from '../api/api.js'; import {ErrorWindowView} from '../../../entity/errorWindow/ui/errorWindow.js'; import WebSocketService from '../../../shared/api/WebSocket.js'; +import {UserFields} from '../../../features/userFields/index.js'; export class SignupView extends View { constructor(...args) { @@ -23,65 +24,8 @@ export class SignupView extends View { render() { this.root.innerHTML = signupTemplate({}); - const nicknameInput = this.root.querySelector(this.errFields.nickname.inputField); - const passwordInput = this.root.querySelector(this.errFields.password.inputField); - const emailInput = this.root.querySelector(this.errFields.email.inputField); - const repeatPasswordInput = this.root.querySelector(this.errFields.repPassword.inputField); - const nickHint = this.root.querySelector(this.errFields.nickname.hint); - const passHint = this.root.querySelector(this.errFields.password.hint); - - nicknameInput.addEventListener('focus', (event) => { - event.preventDefault(); - nickHint.style.visibility = 'visible'; - }); - - passwordInput.addEventListener('focus', (event) => { - event.preventDefault(); - passHint.style.visibility = 'visible'; - }); - - nicknameInput.addEventListener('focusout', (event) => { - event.preventDefault(); - // if (nicknameValidation(nicknameInput.value)) { - nickHint.style.visibility = 'hidden'; - // } - }); - - passwordInput.addEventListener('focusout', (event) => { - event.preventDefault(); - // if (passwordValidation(passwordInput.value)) { - passHint.style.visibility = 'hidden'; - // } - }); - - nicknameInput.addEventListener('input', (event) => { - event.preventDefault(); - const nickname = nicknameInput.value; - const check = debounce(this.inputValidate, debounceTimeout); - check(this.errFields.nickname, nickname); - }); - - emailInput.addEventListener('input', (event) => { - event.preventDefault(); - const email = emailInput.value; - const check = debounce(this.inputValidate, debounceTimeout); - check(this.errFields.email, email); - }); - - passwordInput.addEventListener('input', (event) => { - event.preventDefault(); - const password = passwordInput.value; - const check = debounce(this.inputValidate, debounceTimeout); - check(this.errFields.password, password); - }); - - repeatPasswordInput.addEventListener('input', (event) => { - event.preventDefault(); - const password = passwordInput.value; - const repPassword = repeatPasswordInput.value; - const check = debounce(this.inputValidate, debounceTimeout); - check(this.errFields.repPassword, password, repPassword); - }); + const signupFields = new UserFields('signup-fields'); + signupFields.render(); const api = new SignupAPI(); const signupButton = this.root.querySelector('#signup_enter_button'); diff --git a/source/shared/static/eye_closed.svg b/source/shared/static/eye_closed.svg new file mode 100644 index 00000000..2d81a742 --- /dev/null +++ b/source/shared/static/eye_closed.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/source/shared/styles/input/_input.scss b/source/shared/styles/input/_input.scss index 4628efed..f24c1c09 100644 --- a/source/shared/styles/input/_input.scss +++ b/source/shared/styles/input/_input.scss @@ -20,7 +20,7 @@ padding: 0 15px; height: 45px; font-size: variables.$focus-font-size; - border: 2px solid; + border: .5px solid; background-color: variables.$background-color; &::placeholder{ @@ -30,7 +30,7 @@ &:focus{ background-color: #ffffff; - outline-color: variables.$font-color; + outline: variables.$font-color solid 1px; } } From 3c38f456017fe537f0ce77363c2dcb4366d83f6f Mon Sep 17 00:00:00 2001 From: glebkostin Date: Tue, 7 May 2024 13:21:44 +0300 Subject: [PATCH 02/87] =?UTF-8?q?HAR-126:=20=D0=94=D0=BE=D0=B1=D0=B0=D0=B2?= =?UTF-8?q?=D0=B8=D0=BB=20outline:=20none=20=D0=B4=D0=BB=D1=8F=20=D0=BD?= =?UTF-8?q?=D0=B5=D0=B0=D0=B2=D1=82=D0=B8=D0=B2=D0=BD=D0=BE=D0=B3=D0=BE=20?= =?UTF-8?q?=D0=BF=D0=BE=D0=BB=D1=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/shared/styles/input/_input.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/source/shared/styles/input/_input.scss b/source/shared/styles/input/_input.scss index f24c1c09..55170b92 100644 --- a/source/shared/styles/input/_input.scss +++ b/source/shared/styles/input/_input.scss @@ -48,6 +48,6 @@ opacity: 0.5; &:focus{ background-color: variables.$window-color; - outline-color: inherit; + outline: none; } } From ed54aaa70bc3bf553a6ff9a0b4c5429136f21246 Mon Sep 17 00:00:00 2001 From: glebkostin Date: Tue, 7 May 2024 13:34:48 +0300 Subject: [PATCH 03/87] =?UTF-8?q?HAR-126:=20=D0=98=D0=B7=D0=BC=D0=B5=D0=BD?= =?UTF-8?q?=D0=B8=D0=BB=20=D0=B2=D1=8B=D1=81=D0=BE=D1=82=D1=83=20=D0=B8=20?= =?UTF-8?q?=D1=80=D0=B0=D0=BC=D0=BA=D0=B8=20=D0=B4=D0=BB=D1=8F=20outline?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/pages/chat/ui/chat.scss | 6 +++--- source/shared/styles/input/_input.scss | 1 + 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/source/pages/chat/ui/chat.scss b/source/pages/chat/ui/chat.scss index 89d93d15..56c4e429 100644 --- a/source/pages/chat/ui/chat.scss +++ b/source/pages/chat/ui/chat.scss @@ -29,21 +29,21 @@ @media screen and (max-width: 430px) { .chat-window { width: 100%; - height: -webkit-calc(100vh - 130px); + height: -webkit-calc(100dvh - 130px); position: relative; } .chat-list{ position: absolute; inset: 0; - height: -webkit-calc(100vh - 130px); + height: -webkit-calc(100dvh - 130px); width: 100%; } .chat-window__input{ position: absolute; inset: 0; - height: -webkit-calc(100vh - 130px); + height: -webkit-calc(100dvh - 130px); width: 100%; } diff --git a/source/shared/styles/input/_input.scss b/source/shared/styles/input/_input.scss index 55170b92..985baf1b 100644 --- a/source/shared/styles/input/_input.scss +++ b/source/shared/styles/input/_input.scss @@ -31,6 +31,7 @@ &:focus{ background-color: #ffffff; outline: variables.$font-color solid 1px; + -moz-outline-radius: variables.$input-border-radius; } } From 2a11853fe4b3684c47083af868d348aeabd78b16 Mon Sep 17 00:00:00 2001 From: glebkostin Date: Tue, 7 May 2024 16:51:40 +0300 Subject: [PATCH 04/87] =?UTF-8?q?HAR-126:=20=D0=9F=D1=80=D0=B0=D0=B2=D0=BA?= =?UTF-8?q?=D0=B8=20=D0=B2=20=D0=BF=D1=80=D0=BE=D1=84=D0=B8=D0=BB=D0=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../inputField/ui/inputField.handlebars | 2 +- source/entity/inputField/ui/inputField.js | 5 ++++ source/entity/inputField/ui/inputField.scss | 7 +++++ source/entity/pinPhoto/ui/pinPhoto.scss | 2 +- source/features/userFields/ui/userFields.js | 3 +- source/pages/login/ui/loginView.handlebars | 2 +- source/pages/profile/ui/profile.scss | 14 +++++++++ source/pages/signup/ui/signupView.scss | 7 ----- source/shared/styles/App.scss | 4 +-- .../profileFeed/ui/profileFeed.handlebars | 9 ++++-- source/widgets/profileFeed/ui/profileFeed.js | 30 +++++++++++++++++-- 11 files changed, 67 insertions(+), 18 deletions(-) diff --git a/source/entity/inputField/ui/inputField.handlebars b/source/entity/inputField/ui/inputField.handlebars index c526d68b..9eb71081 100644 --- a/source/entity/inputField/ui/inputField.handlebars +++ b/source/entity/inputField/ui/inputField.handlebars @@ -1,5 +1,5 @@ - + {{#if isPassword}}
diff --git a/source/entity/inputField/ui/inputField.js b/source/entity/inputField/ui/inputField.js index 1bf701a8..4eeab1f3 100644 --- a/source/entity/inputField/ui/inputField.js +++ b/source/entity/inputField/ui/inputField.js @@ -35,6 +35,11 @@ export class InputField extends View { event.preventDefault(); const value = input.value; const check = debounce(inputValidate, debounceTimeout); + if (this.field.repeat) { + const repeatInput = document.querySelector('#' + this.field.repeat); + check(this.field, value, repeatInput.value); + return; + } check(this.field, value); }); if (this.field.type === 'password') { diff --git a/source/entity/inputField/ui/inputField.scss b/source/entity/inputField/ui/inputField.scss index 2f7927a9..933d7554 100644 --- a/source/entity/inputField/ui/inputField.scss +++ b/source/entity/inputField/ui/inputField.scss @@ -65,3 +65,10 @@ .eye__visibility-hidden{ visibility: hidden; } + +@media screen and (max-width: 900px) { + .hint{ + inset: 100px auto auto 0; + z-index: 2; + } +} diff --git a/source/entity/pinPhoto/ui/pinPhoto.scss b/source/entity/pinPhoto/ui/pinPhoto.scss index e44107b6..56641c86 100644 --- a/source/entity/pinPhoto/ui/pinPhoto.scss +++ b/source/entity/pinPhoto/ui/pinPhoto.scss @@ -15,6 +15,6 @@ @media screen and (max-width: 430px) { .pin-photo__image{ - width: 100%; + width: 100vw; } } diff --git a/source/features/userFields/ui/userFields.js b/source/features/userFields/ui/userFields.js index d6f9cc0a..e2687709 100644 --- a/source/features/userFields/ui/userFields.js +++ b/source/features/userFields/ui/userFields.js @@ -73,6 +73,7 @@ export class UserFields extends View { 'repPassword': { label: 'Повторите пароль', type: 'password', + repeat: 'register_password', placeholder: 'Введите пароль повторно', value: '', errContent: 'signup_repeat_password_error', @@ -112,7 +113,7 @@ export class UserFields extends View { const inputCont = [this.root.querySelector('#' + value.inputField).value]; if (key === 'repPassword') { inputCont.push(this.root.querySelector('#' + - this.errFields.password.inputField).value); + this.errFields['password'].inputField).value); } if (!value.validationFunc(...inputCont)) { errContentChange(value, value.errText); diff --git a/source/pages/login/ui/loginView.handlebars b/source/pages/login/ui/loginView.handlebars index d512e851..7ac98ad6 100644 --- a/source/pages/login/ui/loginView.handlebars +++ b/source/pages/login/ui/loginView.handlebars @@ -1,6 +1,6 @@
-

Добро пожаловать в Harmonium!

+
Добро пожаловать в Harmonium!
+ {{#if user.is_owner}} +
+ +
+ {{/if}}
Созданные @@ -14,10 +19,10 @@ {{#if user.is_owner}}
-
+
Добавить пин
-
+
Добавить доску
diff --git a/source/pages/profile/ui/profile.js b/source/pages/profile/ui/profile.js index 10c5f75d..9945893c 100644 --- a/source/pages/profile/ui/profile.js +++ b/source/pages/profile/ui/profile.js @@ -11,6 +11,7 @@ import {Error} from '../../error/ui/error.js'; import {ModalListWindowView} from '../../../widgets/modalListWindow/ui/modalListWindow.js'; import {API} from '../../../shared/api/API.js'; import {UserListItemView} from '../../../entity/userListItem/ui/userListItem.js'; +import {BoardView} from '../../board/ui/boardView.js'; /** * Handle profile page @@ -77,6 +78,14 @@ export class Profile extends View { }); if (user.is_owner) { + const buttonLikes = document.querySelector('#profile-like-button'); + buttonLikes.addEventListener('click', async (event) => { + event.preventDefault(); + history.pushState(null, null, '/board/0'); + // const boardView = new BoardView(); + // await boardView.render(0); + }); + const pinAdd = document.querySelector('#profile-pin-add'); pinAdd.addEventListener('click', (event) => { event.preventDefault(); diff --git a/source/pages/profile/ui/profile.scss b/source/pages/profile/ui/profile.scss index 25a5ad95..2ba41086 100644 --- a/source/pages/profile/ui/profile.scss +++ b/source/pages/profile/ui/profile.scss @@ -10,25 +10,48 @@ width: auto; margin-top: 150px; display: flex; - justify-content: center; + justify-content: space-between; align-items: flex-end; + padding: 0 50px; } .add-block{ + width: 40px; display: flex; flex-direction: column; gap: 5px; align-items: end; - position: absolute; + //position: absolute; inset: auto 20px auto auto; } +.profile-popup-button{ + width: auto; + display: inline-block; + text-wrap: nowrap; +} + +.profile-like-button{ + height: 40px; + width: 40px; + border-radius: 50%; + display: flex; + justify-content: center; + align-items: center; + transition: .3s all; +} + +.profile-image-button__likes{ + width: 85%; + height: 85%; +} + .button-add{ transform: rotate(45deg); transition: all .3s; justify-self: end; - height: 35px; - width: 35px; + height: 40px; + width: 40px; border-radius: 50%; } @@ -43,6 +66,7 @@ flex-direction: column; gap: 5px; align-items: end; + width: fit-content; } .profile-pop-menu__closed{ @@ -72,6 +96,7 @@ @media screen and (max-width: 430px) { .profile-switcher{ margin-top: 50px; + padding: 0 30px; } .profile-pop-menu{ @@ -98,7 +123,7 @@ transform: translateY(60px); } - .profile-add-button{ + .profile-popup-button{ background-color: variables.$primary-button-color; } } From d75475ba96d915448c28e3560cf0642c7d9e937e Mon Sep 17 00:00:00 2001 From: glebkostin Date: Wed, 8 May 2024 22:38:48 +0300 Subject: [PATCH 10/87] =?UTF-8?q?HAR-126:=20=D0=92=D0=BD=D0=B5=D1=81=20?= =?UTF-8?q?=D0=BF=D1=80=D0=B0=D0=B2=D0=BA=D0=B8=20=D0=B2=20=D0=B4=D0=BE?= =?UTF-8?q?=D1=81=D0=BA=D1=83=20=D0=BB=D0=B0=D0=B9=D0=BA=D0=BE=D0=B2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/entity/boardPin/ui/boardPin.handlebars | 2 +- source/entity/boardPin/ui/boardPin.js | 22 ++++++++++--------- source/pages/board/ui/boardView.handlebars | 6 ++--- source/pages/board/ui/boardView.js | 2 +- source/pages/profile/ui/profile.scss | 18 ++++++++++----- 5 files changed, 30 insertions(+), 20 deletions(-) diff --git a/source/entity/boardPin/ui/boardPin.handlebars b/source/entity/boardPin/ui/boardPin.handlebars index 00f1ad92..cd0ae032 100644 --- a/source/entity/boardPin/ui/boardPin.handlebars +++ b/source/entity/boardPin/ui/boardPin.handlebars @@ -1,5 +1,5 @@
- + {{#if owner}} {{/if}} diff --git a/source/entity/boardPin/ui/boardPin.js b/source/entity/boardPin/ui/boardPin.js index 61ea3240..525729b0 100644 --- a/source/entity/boardPin/ui/boardPin.js +++ b/source/entity/boardPin/ui/boardPin.js @@ -40,15 +40,17 @@ export class BoardPinFeedView extends View { this.onClick(pin.pin_id); }); - const delBtn = document.querySelector('#pin-del-' + pin.pin_id); - delBtn.addEventListener('click', async (event) => { - event.preventDefault(); - const api = new API('/boards/' + board.board_id + '/pins/' + pin.pin_id); - const response = await api.delete(); - if (response.code) { - return; - } - this.root.remove(); - }); + if (board.is_owner) { + const delBtn = document.querySelector('#pin-del-' + pin.pin_id); + delBtn.addEventListener('click', async (event) => { + event.preventDefault(); + const api = new API('/boards/' + board.board_id + '/pins/' + pin.pin_id); + const response = await api.delete(); + if (response.code) { + return; + } + this.root.remove(); + }); + } } } diff --git a/source/pages/board/ui/boardView.handlebars b/source/pages/board/ui/boardView.handlebars index 2ff6540d..cab9b2be 100644 --- a/source/pages/board/ui/boardView.handlebars +++ b/source/pages/board/ui/boardView.handlebars @@ -15,9 +15,9 @@ Удалить
{{else}} -
- Подписаться -
+ + + {{/if}}
diff --git a/source/pages/board/ui/boardView.js b/source/pages/board/ui/boardView.js index 6a45ee88..b0f1d261 100644 --- a/source/pages/board/ui/boardView.js +++ b/source/pages/board/ui/boardView.js @@ -38,7 +38,7 @@ export class BoardView extends View { board = { title: 'Понравившиеся', description: 'Здесь появляются понравившиеся вам пины', - is_owner: true, + is_owner: false, }; pins = response.body.pins; } else { diff --git a/source/pages/profile/ui/profile.scss b/source/pages/profile/ui/profile.scss index 2ba41086..bea571df 100644 --- a/source/pages/profile/ui/profile.scss +++ b/source/pages/profile/ui/profile.scss @@ -10,19 +10,18 @@ width: auto; margin-top: 150px; display: flex; - justify-content: space-between; + justify-content: center; align-items: flex-end; padding: 0 50px; } .add-block{ - width: 40px; display: flex; flex-direction: column; gap: 5px; align-items: end; - //position: absolute; - inset: auto 20px auto auto; + position: absolute; + inset: auto 50px auto auto; } .profile-popup-button{ @@ -39,6 +38,8 @@ justify-content: center; align-items: center; transition: .3s all; + position: absolute; + inset: auto auto auto 50px; } .profile-image-button__likes{ @@ -96,7 +97,6 @@ @media screen and (max-width: 430px) { .profile-switcher{ margin-top: 50px; - padding: 0 30px; } .profile-pop-menu{ @@ -126,4 +126,12 @@ .profile-popup-button{ background-color: variables.$primary-button-color; } + + .add-block{ + inset: auto 30px auto auto; + } + + .profile-like-button{ + inset: auto auto auto 30px; + } } From 51d26d7427e7d919788832e8f789b9423f1e1d18 Mon Sep 17 00:00:00 2001 From: glebkostin Date: Thu, 9 May 2024 22:18:26 +0300 Subject: [PATCH 11/87] =?UTF-8?q?HAR-126:=20=D0=92=D0=BD=D0=B5=D1=81=20?= =?UTF-8?q?=D0=B8=D1=81=D0=BF=D1=80=D0=B0=D0=B2=D0=BB=D0=B5=D0=BD=D0=B8?= =?UTF-8?q?=D1=8F=20=D0=B2=20=D1=87=D0=B0=D1=82=20=D0=A1=D0=B4=D0=B5=D0=BB?= =?UTF-8?q?=D0=B0=D0=BB=20=D1=81=D0=BE=D1=85=D1=80=D0=B0=D0=BD=D0=B5=D0=BD?= =?UTF-8?q?=D0=B8=D1=8F=20=D1=81=D0=BE=D0=BE=D0=B1=D1=89=D0=B5=D0=BD=D0=B8?= =?UTF-8?q?=D0=B9=20=D0=B2=20=D0=BE=D0=B4=D0=BD=D0=BE=D0=B9=20=D0=B2=D0=BA?= =?UTF-8?q?=D0=BB=D0=B0=D0=B4=D0=BA=D0=B5,=20=D0=B8=D0=B7=D0=BC=D0=B5?= =?UTF-8?q?=D0=BD=D0=B8=D0=BB=20=D0=BE=D1=82=D1=81=D1=82=D1=83=D0=BF=D1=8B?= =?UTF-8?q?=20=D0=B8=20=D0=BF=D0=BE=D0=BF=D1=80=D0=B0=D0=B2=D0=B8=D0=BB=20?= =?UTF-8?q?=D1=82=D0=B5=D0=BA=D1=81=D1=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/features/messagesFeed/ui/messagesFeed.scss | 1 + source/pages/chat/ui/chat.js | 3 +++ source/pages/chat/ui/chat.scss | 5 +++-- source/widgets/chatWindow/ui/chatWindow.handlebars | 2 +- source/widgets/chatWindow/ui/chatWindow.scss | 13 +++++-------- 5 files changed, 13 insertions(+), 11 deletions(-) diff --git a/source/features/messagesFeed/ui/messagesFeed.scss b/source/features/messagesFeed/ui/messagesFeed.scss index a1a9c2f2..b32432c2 100644 --- a/source/features/messagesFeed/ui/messagesFeed.scss +++ b/source/features/messagesFeed/ui/messagesFeed.scss @@ -26,5 +26,6 @@ } .message-text{ + word-wrap: break-word; white-space: pre-line; } diff --git a/source/pages/chat/ui/chat.js b/source/pages/chat/ui/chat.js index 540a2e0d..a7fe2ac1 100644 --- a/source/pages/chat/ui/chat.js +++ b/source/pages/chat/ui/chat.js @@ -36,6 +36,9 @@ export class ChatView extends View { const chatElem = document.querySelector(`#chat-${chat.user_id}`); chatElem.addEventListener('click', async (event) => { event.preventDefault(); + if (this.currentChat){ + this.currentChat['inputValue'] = document.querySelector('#chat-input').value; + } if (!this.currentChat || this.currentChat.user_id !== chat.user_id) { await window.render(chat); this.currentChat = chat; diff --git a/source/pages/chat/ui/chat.scss b/source/pages/chat/ui/chat.scss index 3854c978..b3abdd8c 100644 --- a/source/pages/chat/ui/chat.scss +++ b/source/pages/chat/ui/chat.scss @@ -1,8 +1,10 @@ @use "../../../shared/styles/variables"; .chat-window{ + margin: 0 auto 0 auto; height: -webkit-calc(100dvh - 150px); width: 75vw; + height: calc(100dvh - 130px); display: flex; flex-direction: row; border-radius: variables.$element-border-radius; @@ -21,7 +23,7 @@ .chat-window__input{ flex-grow: 1; height: auto; - width: auto; + width: 65vw; display: grid; grid-template-rows: 70px 1fr 90px; } @@ -68,7 +70,6 @@ @media screen and (max-width: 1024px) and (min-width: 431px) { .chat-window{ - height: 87dvh; width: 90vw; } } diff --git a/source/widgets/chatWindow/ui/chatWindow.handlebars b/source/widgets/chatWindow/ui/chatWindow.handlebars index b0aaa149..63047694 100644 --- a/source/widgets/chatWindow/ui/chatWindow.handlebars +++ b/source/widgets/chatWindow/ui/chatWindow.handlebars @@ -13,7 +13,7 @@
- +
diff --git a/source/widgets/chatWindow/ui/chatWindow.scss b/source/widgets/chatWindow/ui/chatWindow.scss index ea2bce24..89f5acef 100644 --- a/source/widgets/chatWindow/ui/chatWindow.scss +++ b/source/widgets/chatWindow/ui/chatWindow.scss @@ -12,13 +12,8 @@ .chat__selected-avatar{ display: block; - height: 60px; - width: 60px; -} - -.chat-content{ - font-size: 24px; - align-content: center; + height: 54px; + width: 54px; } .chat-input{ @@ -62,10 +57,12 @@ .chat-content{ overflow-y: scroll; - padding: 10px 0; + padding: 10px 20px; display: flex; flex-direction: column-reverse; gap: 20px; + font-size: 24px; + align-content: center; } .chat-back-button{ From 1b25d1bcdc188bf3a8b970d4a2f9f474cc743eab Mon Sep 17 00:00:00 2001 From: glebkostin Date: Thu, 9 May 2024 22:23:27 +0300 Subject: [PATCH 12/87] =?UTF-8?q?HAR-126:=20=D0=9B=D0=B8=D0=BD=D1=82=D0=B5?= =?UTF-8?q?=D1=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/entity/errorWindow/ui/errorWindow.js | 2 +- source/pages/board/ui/boardView.js | 2 +- source/pages/chat/ui/chat.js | 2 +- source/pages/profile/ui/profile.js | 1 - 4 files changed, 3 insertions(+), 4 deletions(-) diff --git a/source/entity/errorWindow/ui/errorWindow.js b/source/entity/errorWindow/ui/errorWindow.js index d504d776..26f3be70 100644 --- a/source/entity/errorWindow/ui/errorWindow.js +++ b/source/entity/errorWindow/ui/errorWindow.js @@ -21,7 +21,7 @@ export class ErrorWindowView extends View { * @param {string} message - Error message entity. */ render(message) { - if (!message){ + if (!message) { message = errors['oops']; } this.root.innerHTML = errorViewTemplate({message}); diff --git a/source/pages/board/ui/boardView.js b/source/pages/board/ui/boardView.js index b0f1d261..19ca5c8f 100644 --- a/source/pages/board/ui/boardView.js +++ b/source/pages/board/ui/boardView.js @@ -32,7 +32,7 @@ export class BoardView extends View { if (boardID <= 0) { const api = new API('/favorites'); const response = await api.get(); - if(response.code){ + if (response.code) { return; } board = { diff --git a/source/pages/chat/ui/chat.js b/source/pages/chat/ui/chat.js index a7fe2ac1..b19da9f7 100644 --- a/source/pages/chat/ui/chat.js +++ b/source/pages/chat/ui/chat.js @@ -36,7 +36,7 @@ export class ChatView extends View { const chatElem = document.querySelector(`#chat-${chat.user_id}`); chatElem.addEventListener('click', async (event) => { event.preventDefault(); - if (this.currentChat){ + if (this.currentChat) { this.currentChat['inputValue'] = document.querySelector('#chat-input').value; } if (!this.currentChat || this.currentChat.user_id !== chat.user_id) { diff --git a/source/pages/profile/ui/profile.js b/source/pages/profile/ui/profile.js index 9945893c..9d63f72a 100644 --- a/source/pages/profile/ui/profile.js +++ b/source/pages/profile/ui/profile.js @@ -11,7 +11,6 @@ import {Error} from '../../error/ui/error.js'; import {ModalListWindowView} from '../../../widgets/modalListWindow/ui/modalListWindow.js'; import {API} from '../../../shared/api/API.js'; import {UserListItemView} from '../../../entity/userListItem/ui/userListItem.js'; -import {BoardView} from '../../board/ui/boardView.js'; /** * Handle profile page From 9ba158803f92cb5136922228fe5cfe47c948317b Mon Sep 17 00:00:00 2001 From: glebkostin Date: Fri, 10 May 2024 09:43:35 +0300 Subject: [PATCH 13/87] =?UTF-8?q?HAR-126:=20=D0=A3=D0=B1=D1=80=D0=B0=D0=BB?= =?UTF-8?q?=20scroll-bar=20=D1=83=20=D0=BD=D0=B8=D0=BA=D0=B0=20=D0=B2=20?= =?UTF-8?q?=D1=87=D0=B0=D1=82=D0=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/widgets/chatWindow/ui/chatWindow.handlebars | 2 +- source/widgets/chatWindow/ui/chatWindow.scss | 7 +++++-- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/source/widgets/chatWindow/ui/chatWindow.handlebars b/source/widgets/chatWindow/ui/chatWindow.handlebars index 63047694..faa9bb62 100644 --- a/source/widgets/chatWindow/ui/chatWindow.handlebars +++ b/source/widgets/chatWindow/ui/chatWindow.handlebars @@ -5,7 +5,7 @@
-
+
{{user.nickname}}
diff --git a/source/widgets/chatWindow/ui/chatWindow.scss b/source/widgets/chatWindow/ui/chatWindow.scss index 89f5acef..c51e54ce 100644 --- a/source/widgets/chatWindow/ui/chatWindow.scss +++ b/source/widgets/chatWindow/ui/chatWindow.scss @@ -10,6 +10,11 @@ border-bottom: variables.$border-color 1px solid; } +.chat-name{ + font-size: 24px; + align-content: center; +} + .chat__selected-avatar{ display: block; height: 54px; @@ -61,8 +66,6 @@ display: flex; flex-direction: column-reverse; gap: 20px; - font-size: 24px; - align-content: center; } .chat-back-button{ From 8b544691c51a6c1511c6ee1918f7b202174b9339 Mon Sep 17 00:00:00 2001 From: glebkostin Date: Sat, 11 May 2024 21:10:21 +0300 Subject: [PATCH 14/87] =?UTF-8?q?HAR-126:=20=D0=92=D0=B5=D1=80=D0=BD=D1=83?= =?UTF-8?q?=D0=BB=20=D0=BF=D0=BE=D0=B4=D0=BF=D0=B8=D1=81=D1=87=D0=B8=D0=BA?= =?UTF-8?q?=D0=BE=D0=B2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/entity/userListItem/ui/userListItem.handlebars | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/source/entity/userListItem/ui/userListItem.handlebars b/source/entity/userListItem/ui/userListItem.handlebars index 085c7b40..33c0e188 100644 --- a/source/entity/userListItem/ui/userListItem.handlebars +++ b/source/entity/userListItem/ui/userListItem.handlebars @@ -6,6 +6,6 @@ {{user.nickname}}
- + подписчиков {{user.subscribers_count}}
From 57e03f56a8461d109e0323ee098cbd14f56b6bf8 Mon Sep 17 00:00:00 2001 From: glebkostin Date: Sun, 12 May 2024 15:50:46 +0300 Subject: [PATCH 15/87] =?UTF-8?q?HAR-126:=20=D0=94=D0=BE=D0=B1=D0=B0=D0=B2?= =?UTF-8?q?=D0=B8=D0=BB=20=D0=BE=D1=87=D0=B8=D1=89=D0=B5=D0=BD=D0=B8=D0=B5?= =?UTF-8?q?=20=D0=BF=D0=BE=D0=B8=D1=81=D0=BA=D0=B0=20=D0=BF=D1=80=D0=B8=20?= =?UTF-8?q?=D0=BF=D0=B5=D1=80=D0=B5=D1=85=D0=BE=D0=B4=D0=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/app/Router.js | 2 ++ source/widgets/chatWindow/ui/chatWindow.scss | 2 +- source/widgets/navbar/ui/navbar.js | 5 +++++ 3 files changed, 8 insertions(+), 1 deletion(-) diff --git a/source/app/Router.js b/source/app/Router.js index 863fea1f..0edad6d5 100644 --- a/source/app/Router.js +++ b/source/app/Router.js @@ -100,6 +100,8 @@ export class Router { this.currentPage = errorView; errorView.render(); } + const ev = new Event('pageMovement'); + dispatchEvent(ev); } /** diff --git a/source/widgets/chatWindow/ui/chatWindow.scss b/source/widgets/chatWindow/ui/chatWindow.scss index c51e54ce..cc88db8f 100644 --- a/source/widgets/chatWindow/ui/chatWindow.scss +++ b/source/widgets/chatWindow/ui/chatWindow.scss @@ -6,7 +6,7 @@ justify-content: left; padding: 5px 20px; align-items: center; - gap: 10px; + gap: 20px; border-bottom: variables.$border-color 1px solid; } diff --git a/source/widgets/navbar/ui/navbar.js b/source/widgets/navbar/ui/navbar.js index 79b56f36..a9e3c023 100644 --- a/source/widgets/navbar/ui/navbar.js +++ b/source/widgets/navbar/ui/navbar.js @@ -72,5 +72,10 @@ export class NavbarView extends View { history.pushState(null, null, '/signup'); }); } + + addEventListener('pageMovement', (event) => { + event.preventDefault(); + searchInput.value = ''; + }); } } From 84edc92acfb7ee92c9a109b701c2aeac30b81720 Mon Sep 17 00:00:00 2001 From: glebkostin Date: Thu, 16 May 2024 14:01:25 +0300 Subject: [PATCH 16/87] =?UTF-8?q?HAR-126:=20=D0=94=D0=BE=D0=B1=D0=B0=D0=B2?= =?UTF-8?q?=D0=B8=D0=BB=20=D0=B7=D0=B0=D0=BA=D1=80=D1=8B=D1=82=D0=B8=D0=B5?= =?UTF-8?q?=20=D0=BE=D0=BA=D0=BD=D0=B0=20=D1=81=20=D0=BE=D1=88=D0=B8=D0=B1?= =?UTF-8?q?=D0=BA=D0=BE=D0=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../errorWindow/ui/errorWindow.handlebars | 3 ++ source/entity/errorWindow/ui/errorWindow.js | 11 +++++++ source/entity/errorWindow/ui/errorWindow.scss | 30 +++++++++++++++++++ 3 files changed, 44 insertions(+) diff --git a/source/entity/errorWindow/ui/errorWindow.handlebars b/source/entity/errorWindow/ui/errorWindow.handlebars index 50fb94b4..31ced6d9 100644 --- a/source/entity/errorWindow/ui/errorWindow.handlebars +++ b/source/entity/errorWindow/ui/errorWindow.handlebars @@ -3,4 +3,7 @@
+
+ +
diff --git a/source/entity/errorWindow/ui/errorWindow.js b/source/entity/errorWindow/ui/errorWindow.js index 26f3be70..280c90f9 100644 --- a/source/entity/errorWindow/ui/errorWindow.js +++ b/source/entity/errorWindow/ui/errorWindow.js @@ -26,10 +26,21 @@ export class ErrorWindowView extends View { } this.root.innerHTML = errorViewTemplate({message}); + const errorTimeLine = this.root.querySelector('#time-line'); + + errorTimeLine.classList.add("active"); + + const time1 = setTimeout(() => { + this.root.innerHTML = null; + errorTimeLine.classList.remove("active"); + }, 5000); + const cancelButton = document.querySelector('#error-cancel'); cancelButton.addEventListener('click', (event) => { event.preventDefault(); this.root.innerHTML = null; + clearTimeout(time1); }, {once: true}); + } } diff --git a/source/entity/errorWindow/ui/errorWindow.scss b/source/entity/errorWindow/ui/errorWindow.scss index 7b87885f..437be3d4 100644 --- a/source/entity/errorWindow/ui/errorWindow.scss +++ b/source/entity/errorWindow/ui/errorWindow.scss @@ -9,6 +9,7 @@ position: fixed; inset: auto 20px 60px auto; padding: 20px 35px 20px 20px; + overflow: hidden; } .error-window__cancel{ @@ -30,6 +31,35 @@ white-space: pre-line; } +.time-line:before { + content: ""; + position: absolute; + bottom: 0; + right: 0; + height: 15px; + width: 100%; + background-color: variables.$error-color; +} + +.time-line.active:before{ + animation: time-line 5s linear forwards; +} + +@keyframes time-line { + 100% { + right: 100%; + } +} + +//.time-line{ +// position: absolute; +// inset: auto 0 0 0; +// width: 100%; +// height: 20px; +// border-radius: 0 0 20px 20px; +// justify-content: left; +//} + @media screen and (max-width: 430px) { .error-window{ min-width: 100px; From 1ee742ef333d8c9f45ae9cb15d7e644dbe6483e5 Mon Sep 17 00:00:00 2001 From: glebkostin Date: Thu, 16 May 2024 14:01:45 +0300 Subject: [PATCH 17/87] =?UTF-8?q?HAR-126:=20=D0=98=D1=81=D0=BF=D1=80=D0=B0?= =?UTF-8?q?=D0=B2=D0=B8=D0=BB=20=D0=BE=D1=88=D0=B8=D0=B1=D0=BA=D1=83=20?= =?UTF-8?q?=D1=81=20=D0=BE=D1=82=D1=81=D1=83=D1=82=D1=81=D1=82=D0=B2=D0=B8?= =?UTF-8?q?=D0=B5=D0=BC=20=D1=80=D0=B5=D0=B4=D0=B8=D1=80=D0=B5=D0=BA=D1=82?= =?UTF-8?q?=D0=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/pages/pin/ui/pinView.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/source/pages/pin/ui/pinView.js b/source/pages/pin/ui/pinView.js index 6e7c399b..51374c50 100644 --- a/source/pages/pin/ui/pinView.js +++ b/source/pages/pin/ui/pinView.js @@ -88,7 +88,9 @@ export class PinView extends View { return; } - history.pushState(null, null, '/pin/' + pin.pin_id); + //TODO добавить сслыку на изменение + const newPin = new PinView(); + newPin.render(pin.pin_id); } }); } From 5c07558a5256810eebccf4f9da24abb2693d5679 Mon Sep 17 00:00:00 2001 From: glebkostin Date: Thu, 16 May 2024 14:18:13 +0300 Subject: [PATCH 18/87] =?UTF-8?q?HAR-126:=20=D0=94=D0=BE=D0=B1=D0=B0=D0=B2?= =?UTF-8?q?=D0=B8=D0=BB=20=D0=B7=D0=B0=D0=BA=D1=80=D1=8B=D1=82=D0=B8=D0=B5?= =?UTF-8?q?=20=D0=BC=D0=BE=D0=B4=D0=B0=D0=BB=D0=BA=D0=B8=20=D0=BF=D0=BE=20?= =?UTF-8?q?=D0=BA=D0=BB=D0=B8=D0=BA=D1=83=20=D0=B2=D0=BD=D0=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/widgets/modalListWindow/ui/modalListWindow.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/source/widgets/modalListWindow/ui/modalListWindow.js b/source/widgets/modalListWindow/ui/modalListWindow.js index 58946042..82880187 100644 --- a/source/widgets/modalListWindow/ui/modalListWindow.js +++ b/source/widgets/modalListWindow/ui/modalListWindow.js @@ -12,6 +12,12 @@ export class ModalListWindowView extends View { render(objects, RenderEntity) { this.root.innerHTML = modalListWindowTemplate({}); + this.root.addEventListener('mousedown', (event) => { + if (event.target === this.root){ + this.root.close(); + } + }) + const list = new ListBlockView('modal-list'); list.render(objects, RenderEntity); this.root.showModal(); From 46d13d5666cecad62f8e0f1e5bbe34ee5741755c Mon Sep 17 00:00:00 2001 From: glebkostin Date: Thu, 16 May 2024 14:21:09 +0300 Subject: [PATCH 19/87] =?UTF-8?q?HAR-126:=20=D0=A1=D0=B8=D0=BD=D1=82=D0=B0?= =?UTF-8?q?=D0=BA=D1=81=D0=B8=D1=87=D0=B5=D1=81=D0=BA=D0=B8=D0=B5=20=D0=BE?= =?UTF-8?q?=D1=88=D0=B8=D0=B1=D0=BA=D0=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/entity/errorWindow/ui/errorWindow.js | 7 +++---- source/pages/pin/ui/pinView.js | 2 +- source/widgets/modalListWindow/ui/modalListWindow.js | 4 ++-- 3 files changed, 6 insertions(+), 7 deletions(-) diff --git a/source/entity/errorWindow/ui/errorWindow.js b/source/entity/errorWindow/ui/errorWindow.js index 280c90f9..4b98322a 100644 --- a/source/entity/errorWindow/ui/errorWindow.js +++ b/source/entity/errorWindow/ui/errorWindow.js @@ -28,11 +28,11 @@ export class ErrorWindowView extends View { const errorTimeLine = this.root.querySelector('#time-line'); - errorTimeLine.classList.add("active"); + errorTimeLine.classList.add('active'); const time1 = setTimeout(() => { this.root.innerHTML = null; - errorTimeLine.classList.remove("active"); + errorTimeLine.classList.remove('active'); }, 5000); const cancelButton = document.querySelector('#error-cancel'); @@ -40,7 +40,6 @@ export class ErrorWindowView extends View { event.preventDefault(); this.root.innerHTML = null; clearTimeout(time1); - }, {once: true}); - + }, {once: true}); } } diff --git a/source/pages/pin/ui/pinView.js b/source/pages/pin/ui/pinView.js index 51374c50..0f642fad 100644 --- a/source/pages/pin/ui/pinView.js +++ b/source/pages/pin/ui/pinView.js @@ -88,7 +88,7 @@ export class PinView extends View { return; } - //TODO добавить сслыку на изменение + // TODO добавить сслыку на изменение const newPin = new PinView(); newPin.render(pin.pin_id); } diff --git a/source/widgets/modalListWindow/ui/modalListWindow.js b/source/widgets/modalListWindow/ui/modalListWindow.js index 82880187..e4487dc0 100644 --- a/source/widgets/modalListWindow/ui/modalListWindow.js +++ b/source/widgets/modalListWindow/ui/modalListWindow.js @@ -13,10 +13,10 @@ export class ModalListWindowView extends View { this.root.innerHTML = modalListWindowTemplate({}); this.root.addEventListener('mousedown', (event) => { - if (event.target === this.root){ + if (event.target === this.root) { this.root.close(); } - }) + }); const list = new ListBlockView('modal-list'); list.render(objects, RenderEntity); From 691a9726be48846419663a6b0020e3260bc83ce8 Mon Sep 17 00:00:00 2001 From: glebkostin Date: Thu, 16 May 2024 14:22:36 +0300 Subject: [PATCH 20/87] =?UTF-8?q?HAR-126:=20=D0=98=D1=81=D0=BF=D1=80=D0=B0?= =?UTF-8?q?=D0=B2=D0=B8=D0=BB=20=D0=BE=D0=BF=D0=B5=D1=87=D0=B0=D1=82=D0=BA?= =?UTF-8?q?=D1=83?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/widgets/chatWindow/ui/chatWindow.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/source/widgets/chatWindow/ui/chatWindow.js b/source/widgets/chatWindow/ui/chatWindow.js index 96e32d7f..9bc5f7eb 100644 --- a/source/widgets/chatWindow/ui/chatWindow.js +++ b/source/widgets/chatWindow/ui/chatWindow.js @@ -53,7 +53,7 @@ export class ChatWindow extends View { if (response.code) { const errorWindow = new ErrorWindowView(); - errorWindow.render('Возникла ошибка при отрпавке сообщения! ' + + errorWindow.render('Возникла ошибка при отправке сообщения! ' + 'Повторите позже.'); return; } From 9041eac57433d04090bfc3a04d61a7f173fc9c0a Mon Sep 17 00:00:00 2001 From: glebkostin Date: Sun, 19 May 2024 23:11:14 +0300 Subject: [PATCH 21/87] =?UTF-8?q?HAR-134:=20=D0=9C=D0=B8=D0=BD=D0=BE=D1=80?= =?UTF-8?q?=D0=BD=D1=8B=D0=B5=20=D0=B8=D0=B7=D0=BC=D0=B5=D0=BD=D0=B5=D0=BD?= =?UTF-8?q?=D0=B8=D1=8F=20=D0=A1=D0=B4=D0=B5=D0=BB=D0=B0=D0=BB=20=D0=BE?= =?UTF-8?q?=D0=B3=D1=80=D0=B0=D0=BD=D0=B8=D1=87=D0=B5=D0=BD=D0=B8=D1=8F=20?= =?UTF-8?q?=D0=BD=D0=B0=20=D0=B2=D0=B2=D0=BE=D0=B4=20=D0=B2=20=D1=87=D0=B0?= =?UTF-8?q?=D1=82=D0=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/widgets/chatWindow/ui/chatWindow.handlebars | 2 +- source/widgets/modalListWindow/ui/modalListWindow.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/source/widgets/chatWindow/ui/chatWindow.handlebars b/source/widgets/chatWindow/ui/chatWindow.handlebars index faa9bb62..34c5ac15 100644 --- a/source/widgets/chatWindow/ui/chatWindow.handlebars +++ b/source/widgets/chatWindow/ui/chatWindow.handlebars @@ -13,7 +13,7 @@
- +
diff --git a/source/widgets/modalListWindow/ui/modalListWindow.js b/source/widgets/modalListWindow/ui/modalListWindow.js index e4487dc0..094a175a 100644 --- a/source/widgets/modalListWindow/ui/modalListWindow.js +++ b/source/widgets/modalListWindow/ui/modalListWindow.js @@ -9,7 +9,7 @@ export class ModalListWindowView extends View { this.root = document.querySelector('#dialog-window'); } - render(objects, RenderEntity) { + render(objects, RenderEntity, blockView) { this.root.innerHTML = modalListWindowTemplate({}); this.root.addEventListener('mousedown', (event) => { From 0f118bcc66b8d2c1e1beb9eabc3f488cf418a272 Mon Sep 17 00:00:00 2001 From: glebkostin Date: Sun, 19 May 2024 23:45:18 +0300 Subject: [PATCH 22/87] =?UTF-8?q?HAR-134:=20=D0=94=D0=BE=D0=B1=D0=B0=D0=B2?= =?UTF-8?q?=D0=B8=D0=BB=20=D1=88=D0=B0=D0=B1=D0=BB=D0=BE=D0=BD=20=D0=BC?= =?UTF-8?q?=D0=BE=D0=B4=D0=B0=D0=BB=D0=BA=D0=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../{features => entity}/boardList/index.js | 6 +- .../boardList/ui/boardList.handlebars | 10 +-- source/entity/boardList/ui/boardList.js | 27 ++++++++ .../boardList/ui/boardList.scss | 0 source/features/boardList/api/api.js | 46 ------------- source/features/boardList/ui/boardList.js | 51 -------------- .../pinAddToBoard/ui/pinAddToBoard.handlebars | 0 .../pinAddToBoard/ui/pinAddToBoard.js | 56 +++++++++++++++ .../pinAddToBoard/ui/pinAddToBoard.scss | 68 +++++++++---------- .../ui/pinInformationBlock.js | 12 ---- source/pages/pin/ui/pinView.js | 12 ++++ source/pages/pinAddToBoard/api/api.js | 27 -------- .../pages/pinAddToBoard/ui/pinAddToBoard.js | 29 -------- source/pages/profile/ui/profile.js | 7 +- .../ui/modalListWindow.handlebars | 8 --- .../modalWindow/ui/modalWindow.handlebars | 8 +++ .../ui/modalWindow.js} | 11 ++- .../ui/modalWindow.scss} | 6 +- 18 files changed, 157 insertions(+), 227 deletions(-) rename source/{features => entity}/boardList/index.js (96%) rename source/{features => entity}/boardList/ui/boardList.handlebars (96%) create mode 100644 source/entity/boardList/ui/boardList.js rename source/{features => entity}/boardList/ui/boardList.scss (100%) delete mode 100644 source/features/boardList/api/api.js delete mode 100644 source/features/boardList/ui/boardList.js rename source/{pages => features}/pinAddToBoard/ui/pinAddToBoard.handlebars (100%) create mode 100644 source/features/pinAddToBoard/ui/pinAddToBoard.js rename source/{pages => features}/pinAddToBoard/ui/pinAddToBoard.scss (94%) delete mode 100644 source/pages/pinAddToBoard/api/api.js delete mode 100644 source/pages/pinAddToBoard/ui/pinAddToBoard.js delete mode 100644 source/widgets/modalListWindow/ui/modalListWindow.handlebars create mode 100644 source/widgets/modalWindow/ui/modalWindow.handlebars rename source/widgets/{modalListWindow/ui/modalListWindow.js => modalWindow/ui/modalWindow.js} (69%) rename source/widgets/{modalListWindow/ui/modalListWindow.scss => modalWindow/ui/modalWindow.scss} (79%) diff --git a/source/features/boardList/index.js b/source/entity/boardList/index.js similarity index 96% rename from source/features/boardList/index.js rename to source/entity/boardList/index.js index 77ce457e..f6dc8640 100644 --- a/source/features/boardList/index.js +++ b/source/entity/boardList/index.js @@ -1,3 +1,3 @@ -import {BoardListView} from './ui/boardList.js'; - -export {BoardListView}; +import {BoardListView} from './ui/boardList.js'; + +export {BoardListView}; diff --git a/source/features/boardList/ui/boardList.handlebars b/source/entity/boardList/ui/boardList.handlebars similarity index 96% rename from source/features/boardList/ui/boardList.handlebars rename to source/entity/boardList/ui/boardList.handlebars index 2f9794c4..d9a1c8b7 100644 --- a/source/features/boardList/ui/boardList.handlebars +++ b/source/entity/boardList/ui/boardList.handlebars @@ -1,5 +1,5 @@ -{{#each boards}} -
-
{{this.title}}
-
-{{/each}} +{{#each boards}} +
+
{{this.title}}
+
+{{/each}} diff --git a/source/entity/boardList/ui/boardList.js b/source/entity/boardList/ui/boardList.js new file mode 100644 index 00000000..96f97df1 --- /dev/null +++ b/source/entity/boardList/ui/boardList.js @@ -0,0 +1,27 @@ +import boardListTemplate from './boardList.handlebars'; +import './boardList.scss'; +import {View} from '../../../app/View.js'; + +/** Board list window view */ +export class BoardListView extends View { + /** + * Default view constructor. + * @constructor + * @param {...any} args - args for constructor of view. + */ + constructor(...args) { + super(...args); + this.root = document.querySelector('#boards-list'); + } + + /** + * Renders view by pin and boards. + * @param {object} boards - Boards entity. + * @param {object} pin - Pin entity. + */ + render(boards) { + if (boards) { + this.root.innerHTML = boardListTemplate({boards}); + } + } +} diff --git a/source/features/boardList/ui/boardList.scss b/source/entity/boardList/ui/boardList.scss similarity index 100% rename from source/features/boardList/ui/boardList.scss rename to source/entity/boardList/ui/boardList.scss diff --git a/source/features/boardList/api/api.js b/source/features/boardList/api/api.js deleted file mode 100644 index 796ab630..00000000 --- a/source/features/boardList/api/api.js +++ /dev/null @@ -1,46 +0,0 @@ -import {backendAPI} from '../../../shared/config.js'; -import {errCheck, fetchRequest} from '../../../shared/api/API.js'; - -/** Like api class */ -export class BoardListAPI { - /** - * Constructs url. - * @param {int} boardID - Id of board. - * @param {int} pinID - Id of pin. - */ - constructor(boardID, pinID) { - this.url = backendAPI + '/boards/' + boardID + '/pins/' + pinID; - } - - /** - * Makes post request to add pin to board. - * @async - * @return {object} - code of request status and body. - */ - async api() { - let response; - try { - const addOptions = { - method: 'POST', - }; - response = await fetch(this.url, { - ...fetchRequest, - ...addOptions, - }); - } catch (error) { - return errCheck(error); - } - if (!response.ok) { - const body = await response.json(); - return { - code: body.code, - }; - } - const body = await response.json(); - return { - code: 0, - body: body, - }; - } -} - diff --git a/source/features/boardList/ui/boardList.js b/source/features/boardList/ui/boardList.js deleted file mode 100644 index 8b83d0c7..00000000 --- a/source/features/boardList/ui/boardList.js +++ /dev/null @@ -1,51 +0,0 @@ -import boardListTemplate from './boardList.handlebars'; -import './boardList.scss'; -import {View} from '../../../app/View.js'; -import {BoardView} from '../../../pages/board/ui/boardView.js'; -import {BoardListAPI} from '../api/api.js'; -import {errors} from '../../../shared/config.js'; - -/** Board list window view */ -export class BoardListView extends View { - /** - * Default view constructor. - * @constructor - * @param {...any} args - args for constructor of view. - */ - constructor(...args) { - super(...args); - this.root = document.querySelector('#boards-list'); - } - - /** - * Renders view by pin and boards. - * @param {object} boards - Boards entity. - * @param {object} pin - Pin entity. - */ - render(boards, pin) { - if (boards) { - this.root.innerHTML = boardListTemplate({boards}); - for (const board of boards) { - const boardElem = document.querySelector('#board-' + board.board_id.toString()); - boardElem.addEventListener('click', async (event) => { - event.preventDefault(); - - const pinAdd = new BoardListAPI(board.board_id, pin.pin_id); - const response = await pinAdd.api(); - - if (response.code) { - const errorField = document.querySelector('#add-to-board-error'); - errorField.innerHTML = errors[response.code]; - return; - } - - const modal = document.querySelector('#dialog-window'); - modal.close(); - - const boardView = new BoardView(); - await boardView.render(board.board_id); - }); - } - } - } -} diff --git a/source/pages/pinAddToBoard/ui/pinAddToBoard.handlebars b/source/features/pinAddToBoard/ui/pinAddToBoard.handlebars similarity index 100% rename from source/pages/pinAddToBoard/ui/pinAddToBoard.handlebars rename to source/features/pinAddToBoard/ui/pinAddToBoard.handlebars diff --git a/source/features/pinAddToBoard/ui/pinAddToBoard.js b/source/features/pinAddToBoard/ui/pinAddToBoard.js new file mode 100644 index 00000000..94b4a2d5 --- /dev/null +++ b/source/features/pinAddToBoard/ui/pinAddToBoard.js @@ -0,0 +1,56 @@ +import {View} from '../../../app/View.js'; +import pinAddToBoardTemplate from './pinAddToBoard.handlebars'; +import './pinAddToBoard.scss'; +import {BoardListView} from '../../../entity/boardList/index.js'; +import {PinAddToBoardAPI} from '../api/api.js'; +import {errors} from '../../../shared/config.js'; +import {BoardView} from '../../../pages/board/ui/boardView.js'; +import {API} from '../../../shared/api/API.js'; + +export class PinAddToBoardView extends View { + constructor(elemID, ...args) { + super(...args); + this.root = document.querySelector('#' + elemID); + } + + async render(pin) { + this.root.innerHTML = pinAddToBoardTemplate({pin}); + const user = JSON.parse(localStorage.getItem('user')); + const pinToBoardAPI = new PinAddToBoardAPI(user.nickname); + const response = await pinToBoardAPI.api(); + + const boards = response.body.boards; + + const boardList = new BoardListView(); + boardList.render(boards, pin); + + for (const board of boards) { + const boardElem = document.querySelector('#board-' + board.board_id.toString()); + boardElem.addEventListener('click', async (event) => { + event.preventDefault(); + + const api = new API('/boards/' + board.board_id + '/pins/' + pin.pin_id); + const response = await api.post({}); + + if (response.code) { + const errorField = document.querySelector('#add-to-board-error'); + errorField.innerHTML = errors[response.code]; + return; + } + + const modal = document.querySelector('#dialog-window'); + modal.close(); + + const boardView = new BoardView(); + await boardView.render(board.board_id); + }); + } + + const backButton = document.querySelector('#pin-to-board-back'); + backButton.addEventListener('click', async (event) => { + event.preventDefault(); + const modal = document.querySelector('#dialog-window'); + modal.close(); + }); + } +} diff --git a/source/pages/pinAddToBoard/ui/pinAddToBoard.scss b/source/features/pinAddToBoard/ui/pinAddToBoard.scss similarity index 94% rename from source/pages/pinAddToBoard/ui/pinAddToBoard.scss rename to source/features/pinAddToBoard/ui/pinAddToBoard.scss index f5e6cef0..d5b7f279 100644 --- a/source/pages/pinAddToBoard/ui/pinAddToBoard.scss +++ b/source/features/pinAddToBoard/ui/pinAddToBoard.scss @@ -1,34 +1,34 @@ -@use "../../../shared/styles/variables"; - -.add-to-board__window{ - width: 500px; - display: flex; - flex-direction: column; - gap: 30px; - padding: 30px; -} - -.boards-list{ - display: flex; - flex-direction: column; - gap: 20px; -} - -.add-to-board-error{ - color: variables.$error-color; - height: 20px; -} - -.add-to-board__controller{ - display: flex; - flex-direction: column-reverse; - gap: 5px; -} - -@media screen and (max-width: 430px) { - .add-to-board__window{ - width: 80vw; - margin: 0; - padding: 5vw; - } -} +@use "../../../shared/styles/variables"; + +.add-to-board__window{ + width: 500px; + display: flex; + flex-direction: column; + gap: 30px; + padding: 30px; +} + +.boards-list{ + display: flex; + flex-direction: column; + gap: 20px; +} + +.add-to-board-error{ + color: variables.$error-color; + height: 20px; +} + +.add-to-board__controller{ + display: flex; + flex-direction: column-reverse; + gap: 5px; +} + +@media screen and (max-width: 430px) { + .add-to-board__window{ + width: 80vw; + margin: 0; + padding: 5vw; + } +} diff --git a/source/features/pinInformationBlock/ui/pinInformationBlock.js b/source/features/pinInformationBlock/ui/pinInformationBlock.js index 3047fbf2..3ed58e10 100644 --- a/source/features/pinInformationBlock/ui/pinInformationBlock.js +++ b/source/features/pinInformationBlock/ui/pinInformationBlock.js @@ -2,7 +2,6 @@ import pinInfoBlockTemplate from './pinInformationBlock.handlebars'; import './pinInformationBlock.scss'; import {View} from '../../../app/View.js'; import {Avatar} from '../../../entity/avatar/ui/avatar.js'; -import {PinAddToBoardView} from '../../../pages/pinAddToBoard/ui/pinAddToBoard.js'; /** * Handle information in pins page @@ -35,16 +34,5 @@ export class PinInformationBlock extends View { history.pushState(null, null, '/profile/' + pin.author.nickname); }, ); - - if (user) { - const boardAdd = document.querySelector('#pin-board-add'); - boardAdd.addEventListener('click', async (event) => { - event.preventDefault(); - const addPin = new PinAddToBoardView(); - await addPin.render(pin); - const modal = document.querySelector('#dialog-window'); - modal.showModal(); - }); - } } } diff --git a/source/pages/pin/ui/pinView.js b/source/pages/pin/ui/pinView.js index 0f642fad..fb8da9f3 100644 --- a/source/pages/pin/ui/pinView.js +++ b/source/pages/pin/ui/pinView.js @@ -9,6 +9,9 @@ import {errors} from '../../../shared/config.js'; import {Error} from '../../error/ui/error.js'; import {pinValidation} from '../../../shared/utils/validation.js'; import {Profile} from '../../profile/ui/profile.js'; +import {PinAddToBoardView} from '../../../features/pinAddToBoard/ui/pinAddToBoard.js'; +import {localStorageGetValue} from '../../../shared/utils/localStorage.js'; +import {ModalListWindowView} from '../../../widgets/modalWindow/ui/modalWindow.js'; /** * Handle pin page @@ -46,6 +49,15 @@ export class PinView extends View { const pinDesc = new PinDescription(); pinDesc.renderView(pin); + + if (localStorageGetValue('user')) { + const boardAdd = document.querySelector('#pin-board-add'); + boardAdd.addEventListener('click', async (event) => { + event.preventDefault(); + const addPin = new ModalListWindowView(); + addPin.render(PinAddToBoardView, pin); + }); + } } /** diff --git a/source/pages/pinAddToBoard/api/api.js b/source/pages/pinAddToBoard/api/api.js deleted file mode 100644 index 1de8730e..00000000 --- a/source/pages/pinAddToBoard/api/api.js +++ /dev/null @@ -1,27 +0,0 @@ -import {backendAPI} from '../../../shared/config.js'; -import {errCheck, fetchRequest} from '../../../shared/api/API.js'; - -export class PinAddToBoardAPI { - constructor(nickname) { - this.url = backendAPI + '/boards/created/' + nickname; - } - - async api() { - let response; - try { - response = await fetch(this.url, { - ...fetchRequest, - }); - } catch (error) { - return errCheck(error); - } - if (!response.ok) { - return errCheck(response); - } - const body = await response.json(); - return { - code: 0, - body: body, - }; - } -} diff --git a/source/pages/pinAddToBoard/ui/pinAddToBoard.js b/source/pages/pinAddToBoard/ui/pinAddToBoard.js deleted file mode 100644 index 841bd8b9..00000000 --- a/source/pages/pinAddToBoard/ui/pinAddToBoard.js +++ /dev/null @@ -1,29 +0,0 @@ -import {View} from '../../../app/View.js'; -import pinAddToBoardTemplate from './pinAddToBoard.handlebars'; -import './pinAddToBoard.scss'; -import {BoardListView} from '../../../features/boardList/index.js'; -import {PinAddToBoardAPI} from '../api/api.js'; - -export class PinAddToBoardView extends View { - constructor(...args) { - super(...args); - this.root = document.querySelector('#dialog-window'); - } - - async render(pin) { - this.root.innerHTML = pinAddToBoardTemplate({pin}); - const user = JSON.parse(localStorage.getItem('user')); - const pinToBoardAPI = new PinAddToBoardAPI(user.nickname); - const response = await pinToBoardAPI.api(); - - const boardList = new BoardListView(); - boardList.render(response.body.boards, pin); - - const backButton = document.querySelector('#pin-to-board-back'); - backButton.addEventListener('click', async (event) => { - event.preventDefault(); - const modal = document.querySelector('#dialog-window'); - modal.close(); - }); - } -} diff --git a/source/pages/profile/ui/profile.js b/source/pages/profile/ui/profile.js index 9d63f72a..3ba0a335 100644 --- a/source/pages/profile/ui/profile.js +++ b/source/pages/profile/ui/profile.js @@ -8,9 +8,10 @@ import {ProfileEdit} from '../../profileEdit/ui/profileEdit.js'; import {PinView} from '../../pin/ui/pinView.js'; import {BoardEdit} from '../../boardEdit/ui/boardEdit.js'; import {Error} from '../../error/ui/error.js'; -import {ModalListWindowView} from '../../../widgets/modalListWindow/ui/modalListWindow.js'; +import {ModalListWindowView} from '../../../widgets/modalWindow/ui/modalWindow.js'; import {API} from '../../../shared/api/API.js'; import {UserListItemView} from '../../../entity/userListItem/ui/userListItem.js'; +import {ListBlockView} from '../../../features/listBlock/ui/listBlock.js'; /** * Handle profile page @@ -59,7 +60,7 @@ export class Profile extends View { if (!subscribers) { return; } - modal.render(subscribers, UserListItemView); + modal.render(ListBlockView, subscribers, UserListItemView); }); const subs = document.querySelector('#profile-subscriptions'); @@ -73,7 +74,7 @@ export class Profile extends View { if (!subscriptions) { return; } - modal.render(subscriptions, UserListItemView); + modal.render(ListBlockView, subscriptions, UserListItemView); }); if (user.is_owner) { diff --git a/source/widgets/modalListWindow/ui/modalListWindow.handlebars b/source/widgets/modalListWindow/ui/modalListWindow.handlebars deleted file mode 100644 index bbbc4596..00000000 --- a/source/widgets/modalListWindow/ui/modalListWindow.handlebars +++ /dev/null @@ -1,8 +0,0 @@ -
- - -
diff --git a/source/widgets/modalWindow/ui/modalWindow.handlebars b/source/widgets/modalWindow/ui/modalWindow.handlebars new file mode 100644 index 00000000..8ff058b8 --- /dev/null +++ b/source/widgets/modalWindow/ui/modalWindow.handlebars @@ -0,0 +1,8 @@ +
+ +
+ diff --git a/source/widgets/modalListWindow/ui/modalListWindow.js b/source/widgets/modalWindow/ui/modalWindow.js similarity index 69% rename from source/widgets/modalListWindow/ui/modalListWindow.js rename to source/widgets/modalWindow/ui/modalWindow.js index 094a175a..91fda3f4 100644 --- a/source/widgets/modalListWindow/ui/modalListWindow.js +++ b/source/widgets/modalWindow/ui/modalWindow.js @@ -1,7 +1,6 @@ import {View} from '../../../app/View.js'; -import modalListWindowTemplate from './modalListWindow.handlebars'; -import './modalListWindow.scss'; -import {ListBlockView} from '../../../features/listBlock/ui/listBlock.js'; +import modalListWindowTemplate from './modalWindow.handlebars'; +import './modalWindow.scss'; export class ModalListWindowView extends View { constructor(...args) { @@ -9,7 +8,7 @@ export class ModalListWindowView extends View { this.root = document.querySelector('#dialog-window'); } - render(objects, RenderEntity, blockView) { + render(blockView, ...args) { this.root.innerHTML = modalListWindowTemplate({}); this.root.addEventListener('mousedown', (event) => { @@ -18,8 +17,8 @@ export class ModalListWindowView extends View { } }); - const list = new ListBlockView('modal-list'); - list.render(objects, RenderEntity); + const list = new blockView('modal-list'); + list.render(...args); this.root.showModal(); const close = document.querySelector('#modal-close'); diff --git a/source/widgets/modalListWindow/ui/modalListWindow.scss b/source/widgets/modalWindow/ui/modalWindow.scss similarity index 79% rename from source/widgets/modalListWindow/ui/modalListWindow.scss rename to source/widgets/modalWindow/ui/modalWindow.scss index 96f2e5f8..a50e9b84 100644 --- a/source/widgets/modalListWindow/ui/modalListWindow.scss +++ b/source/widgets/modalWindow/ui/modalWindow.scss @@ -1,10 +1,10 @@ @use "../../../shared/styles/variables"; .modal-window{ - padding: 25px 10px 0 10px; + padding: 25px 10px; width: fit-content; height: fit-content; - min-height: 500px; + min-height: 200px; } .modal-close{ @@ -12,7 +12,7 @@ width: 35px; height: 35px; position: absolute; - inset: 5px 5px auto auto; + inset: 7px 7px auto auto; } .modal-close-image{ From 12429556610325f21a3ed61b002115ce315da695 Mon Sep 17 00:00:00 2001 From: glebkostin Date: Sun, 19 May 2024 23:47:24 +0300 Subject: [PATCH 23/87] =?UTF-8?q?HAR-134:=20=D0=9F=D0=BE=D0=BF=D1=80=D0=B0?= =?UTF-8?q?=D0=B2=D0=B8=D0=BB=20=D1=83=D0=B4=D0=B0=D0=BB=D0=B5=D0=BD=D0=B8?= =?UTF-8?q?=D0=B5=20=D0=B4=D0=BE=D1=81=D0=BA=D0=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/pages/board/ui/boardView.js | 1 + 1 file changed, 1 insertion(+) diff --git a/source/pages/board/ui/boardView.js b/source/pages/board/ui/boardView.js index 19ca5c8f..be232eae 100644 --- a/source/pages/board/ui/boardView.js +++ b/source/pages/board/ui/boardView.js @@ -61,6 +61,7 @@ export class BoardView extends View { const deleteButton = document.querySelector('#board-delete-button'); deleteButton.addEventListener('click', async (event) => { event.preventDefault(); + const boardAPI = new BoardAPI(boardID); const response = await boardAPI.apiDELETE(); if (response.code) { From c03297ea7efc36c076e8debb4c7bc9a5efb82487 Mon Sep 17 00:00:00 2001 From: glebkostin Date: Mon, 20 May 2024 00:10:05 +0300 Subject: [PATCH 24/87] =?UTF-8?q?HAR-134:=20=D0=A1=D0=B4=D0=B5=D0=BB=D0=B0?= =?UTF-8?q?=D0=BB=20=D0=B5=D0=BC=D0=BF=D1=82=D0=B8=D1=81=D0=BF=D0=B5=D0=B9?= =?UTF-8?q?=D1=81=20=D0=B4=D0=BB=D1=8F=20=D0=B4=D0=BE=D0=B1=D0=B0=D0=B2?= =?UTF-8?q?=D0=BB=D0=B5=D0=BD=D0=B8=D1=8F=20=D0=BF=D0=B8=D0=BD=D0=BE=D0=B2?= =?UTF-8?q?=20=D0=BD=D0=B0=20=D0=B4=D0=BE=D1=81=D0=BA=D1=83?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../entity/boardList/ui/boardList.handlebars | 14 ++++-- source/entity/boardList/ui/boardList.js | 17 ++++--- source/entity/boardList/ui/boardList.scss | 5 ++ .../pinAddToBoard/ui/pinAddToBoard.js | 48 ++++++++++--------- .../pinAddToBoard/ui/pinAddToBoard.scss | 2 +- source/pages/pin/ui/pinView.js | 2 +- source/widgets/modalWindow/ui/modalWindow.js | 4 +- 7 files changed, 52 insertions(+), 40 deletions(-) diff --git a/source/entity/boardList/ui/boardList.handlebars b/source/entity/boardList/ui/boardList.handlebars index d9a1c8b7..6205338d 100644 --- a/source/entity/boardList/ui/boardList.handlebars +++ b/source/entity/boardList/ui/boardList.handlebars @@ -1,5 +1,11 @@ -{{#each boards}} -
-
{{this.title}}
+{{#if boardsNotEmpty}} + {{#each boards}} +
+
{{this.title}}
+
+ {{/each}} +{{else}} +
+ Нет доступных досок
-{{/each}} +{{/if}} diff --git a/source/entity/boardList/ui/boardList.js b/source/entity/boardList/ui/boardList.js index 96f97df1..da9520df 100644 --- a/source/entity/boardList/ui/boardList.js +++ b/source/entity/boardList/ui/boardList.js @@ -5,13 +5,14 @@ import {View} from '../../../app/View.js'; /** Board list window view */ export class BoardListView extends View { /** - * Default view constructor. - * @constructor - * @param {...any} args - args for constructor of view. - */ - constructor(...args) { + * Default view constructor. + * @constructor + * @param elemID - element ID + * @param {...any} args - args for constructor of view. + */ + constructor(elemID, ...args) { super(...args); - this.root = document.querySelector('#boards-list'); + this.root = document.querySelector('#' + elemID); } /** @@ -20,8 +21,6 @@ export class BoardListView extends View { * @param {object} pin - Pin entity. */ render(boards) { - if (boards) { - this.root.innerHTML = boardListTemplate({boards}); - } + this.root.innerHTML = boardListTemplate({boards, boardsNotEmpty: boards?.length > 0}); } } diff --git a/source/entity/boardList/ui/boardList.scss b/source/entity/boardList/ui/boardList.scss index 4fcbfe14..632f4a33 100644 --- a/source/entity/boardList/ui/boardList.scss +++ b/source/entity/boardList/ui/boardList.scss @@ -9,3 +9,8 @@ .board-item:hover{ cursor: pointer; } + +.board-list-message{ + display: flex; + justify-content: center; +} diff --git a/source/features/pinAddToBoard/ui/pinAddToBoard.js b/source/features/pinAddToBoard/ui/pinAddToBoard.js index 94b4a2d5..464176ee 100644 --- a/source/features/pinAddToBoard/ui/pinAddToBoard.js +++ b/source/features/pinAddToBoard/ui/pinAddToBoard.js @@ -21,29 +21,31 @@ export class PinAddToBoardView extends View { const boards = response.body.boards; - const boardList = new BoardListView(); - boardList.render(boards, pin); - - for (const board of boards) { - const boardElem = document.querySelector('#board-' + board.board_id.toString()); - boardElem.addEventListener('click', async (event) => { - event.preventDefault(); - - const api = new API('/boards/' + board.board_id + '/pins/' + pin.pin_id); - const response = await api.post({}); - - if (response.code) { - const errorField = document.querySelector('#add-to-board-error'); - errorField.innerHTML = errors[response.code]; - return; - } - - const modal = document.querySelector('#dialog-window'); - modal.close(); - - const boardView = new BoardView(); - await boardView.render(board.board_id); - }); + const boardList = new BoardListView('boards-list'); + boardList.render(boards); + + if (boards) { + for (const board of boards) { + const boardElem = document.querySelector('#board-' + board.board_id.toString()); + boardElem.addEventListener('click', async (event) => { + event.preventDefault(); + + const api = new API('/boards/' + board.board_id + '/pins/' + pin.pin_id); + const response = await api.post({}); + + if (response.code) { + const errorField = document.querySelector('#add-to-board-error'); + errorField.innerHTML = errors[response.code]; + return; + } + + const modal = document.querySelector('#dialog-window'); + modal.close(); + + const boardView = new BoardView(); + await boardView.render(board.board_id); + }); + } } const backButton = document.querySelector('#pin-to-board-back'); diff --git a/source/features/pinAddToBoard/ui/pinAddToBoard.scss b/source/features/pinAddToBoard/ui/pinAddToBoard.scss index d5b7f279..5bf9a8e3 100644 --- a/source/features/pinAddToBoard/ui/pinAddToBoard.scss +++ b/source/features/pinAddToBoard/ui/pinAddToBoard.scss @@ -5,7 +5,7 @@ display: flex; flex-direction: column; gap: 30px; - padding: 30px; + padding: 0 30px; } .boards-list{ diff --git a/source/pages/pin/ui/pinView.js b/source/pages/pin/ui/pinView.js index fb8da9f3..74347279 100644 --- a/source/pages/pin/ui/pinView.js +++ b/source/pages/pin/ui/pinView.js @@ -55,7 +55,7 @@ export class PinView extends View { boardAdd.addEventListener('click', async (event) => { event.preventDefault(); const addPin = new ModalListWindowView(); - addPin.render(PinAddToBoardView, pin); + await addPin.render(PinAddToBoardView, pin); }); } } diff --git a/source/widgets/modalWindow/ui/modalWindow.js b/source/widgets/modalWindow/ui/modalWindow.js index 91fda3f4..43a70913 100644 --- a/source/widgets/modalWindow/ui/modalWindow.js +++ b/source/widgets/modalWindow/ui/modalWindow.js @@ -8,7 +8,7 @@ export class ModalListWindowView extends View { this.root = document.querySelector('#dialog-window'); } - render(blockView, ...args) { + async render(blockView, ...args) { this.root.innerHTML = modalListWindowTemplate({}); this.root.addEventListener('mousedown', (event) => { @@ -18,7 +18,7 @@ export class ModalListWindowView extends View { }); const list = new blockView('modal-list'); - list.render(...args); + await list.render(...args); this.root.showModal(); const close = document.querySelector('#modal-close'); From 31c07355550a9d0390b72daa08b15a92c66a62bf Mon Sep 17 00:00:00 2001 From: glebkostin Date: Mon, 20 May 2024 16:21:31 +0300 Subject: [PATCH 25/87] =?UTF-8?q?HAR-134:=20=D0=98=D1=81=D0=BF=D1=80=D0=B0?= =?UTF-8?q?=D0=B2=D0=B8=D0=BB=20=D0=BA=D0=BD=D0=BE=D0=BF=D0=BA=D1=83=20?= =?UTF-8?q?=D1=81=D0=BE=D0=B7=D0=B4=D0=B0=D0=BD=D0=B8=D0=B5=20=D0=B4=D0=BE?= =?UTF-8?q?=D1=81=D0=BA=D0=B8=20=D0=B2=20=D0=BF=D1=80=D0=BE=D1=84=D0=B8?= =?UTF-8?q?=D0=BB=D0=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../pinAddToBoard/ui/pinAddToBoard.js | 5 +- source/pages/profile/ui/profile.js | 8 ++- .../profileFeed/ui/profileFeed.handlebars | 2 + source/widgets/profileFeed/ui/profileFeed.js | 49 ++++++++++++------- 4 files changed, 39 insertions(+), 25 deletions(-) diff --git a/source/features/pinAddToBoard/ui/pinAddToBoard.js b/source/features/pinAddToBoard/ui/pinAddToBoard.js index 464176ee..02795b0f 100644 --- a/source/features/pinAddToBoard/ui/pinAddToBoard.js +++ b/source/features/pinAddToBoard/ui/pinAddToBoard.js @@ -42,8 +42,9 @@ export class PinAddToBoardView extends View { const modal = document.querySelector('#dialog-window'); modal.close(); - const boardView = new BoardView(); - await boardView.render(board.board_id); + history.pushState(null, null, '/board/' + board.board_id) + // const boardView = new BoardView(); + // await boardView.render(board.board_id); }); } } diff --git a/source/pages/profile/ui/profile.js b/source/pages/profile/ui/profile.js index 3ba0a335..481fcfd5 100644 --- a/source/pages/profile/ui/profile.js +++ b/source/pages/profile/ui/profile.js @@ -45,7 +45,7 @@ export class Profile extends View { this.profileUserInfo = new ProfileUserInfo(); const profileFeed = new ProfileFeed(); this.profileUserInfo.render(user); - await profileFeed.renderFeed(user.user); + await profileFeed.renderFeed(user); const modal = new ModalListWindowView(); @@ -82,8 +82,6 @@ export class Profile extends View { buttonLikes.addEventListener('click', async (event) => { event.preventDefault(); history.pushState(null, null, '/board/0'); - // const boardView = new BoardView(); - // await boardView.render(0); }); const pinAdd = document.querySelector('#profile-pin-add'); @@ -125,13 +123,13 @@ export class Profile extends View { const boardButton = document.querySelector('#profile-content-boards'); boardButton.addEventListener('click', (event) =>{ event.preventDefault(); - profileFeed.renderBoards(user.user); + profileFeed.renderBoards(user); }); const feedButton = document.querySelector('#profile-content-pins'); feedButton.addEventListener('click', (event) => { event.preventDefault(); - profileFeed.renderFeed(user.user); + profileFeed.renderFeed(user); }); }; } diff --git a/source/widgets/profileFeed/ui/profileFeed.handlebars b/source/widgets/profileFeed/ui/profileFeed.handlebars index f2fc928a..2781882d 100644 --- a/source/widgets/profileFeed/ui/profileFeed.handlebars +++ b/source/widgets/profileFeed/ui/profileFeed.handlebars @@ -4,9 +4,11 @@
Здесь ничего нет
+ {{#if isOwner}}
+ {{/if}}
{{else}}
diff --git a/source/widgets/profileFeed/ui/profileFeed.js b/source/widgets/profileFeed/ui/profileFeed.js index e212533d..79419ec4 100644 --- a/source/widgets/profileFeed/ui/profileFeed.js +++ b/source/widgets/profileFeed/ui/profileFeed.js @@ -8,6 +8,7 @@ import {API} from '../../../shared/api/API.js'; import {ButtonView} from '../../../entity/button/ui/button.js'; import {PinView} from '../../../pages/pin/ui/pinView.js'; import {BoardEdit} from '../../../pages/boardEdit/ui/boardEdit.js'; +import {localStorageGetValue} from '../../../shared/utils/localStorage.js'; /** * Class for handle profile feed @@ -26,14 +27,18 @@ export class ProfileFeed extends View { /** * Render profile feed widget * @function renderFeed - * @param {Array} user – user info + * @param {Array} userObject – user info */ - async renderFeed(user) { + async renderFeed(userObject) { + const user = userObject.user; + const feedAPI = new API('/pins/created/' + user.nickname); const response = await feedAPI.get(); const pins = response.body.pins; - this.feed.innerHTML = profileFeedTemplate({pins}); + const isOwner = userObject.is_owner; + + this.feed.innerHTML = profileFeedTemplate({pins, isOwner}); if (pins) { const feed = new FeedBlockView('profile_feed'); @@ -43,24 +48,30 @@ export class ProfileFeed extends View { const newPinButton = new ButtonView('message__button'); newPinButton.render('Создайте первый пин!', ['primary-button'], 'new-pin-button'); - newPinButton.root.addEventListener('click', (event) => { - event.preventDefault(); - const newPin = new PinView(); - newPin.renderPinCreate(); - }); + if (isOwner) { + newPinButton.root.addEventListener('click', (event) => { + event.preventDefault(); + const newPin = new PinView(); + newPin.renderPinCreate(); + }); + } } /** * Function to render boards feed - * @param {json} user – info about user + * @param {json} userObject – info about user * @return {Promise} */ - async renderBoards(user) { + async renderBoards(userObject) { + const user = userObject.user; + const feedAPI = new API('/boards/created/' + user.nickname); const response = await feedAPI.get(); const boards = response.body.boards; - this.feed.innerHTML = profileFeedTemplate({pins: boards}); + const isOwner = userObject.is_owner; + + this.feed.innerHTML = profileFeedTemplate({pins: boards, isOwner}); if (boards) { const feed = new FeedBlockView('profile_feed'); @@ -68,13 +79,15 @@ export class ProfileFeed extends View { return; } - const newBoardButton = new ButtonView('message__button'); - newBoardButton.render('Создайте первую доску!', ['primary-button'], 'new-board-button'); + if (isOwner) { + const newBoardButton = new ButtonView('message__button'); + newBoardButton.render('Создайте первую доску!', ['primary-button'], 'new-board-button'); - newBoardButton.root.addEventListener('click', (event) => { - event.preventDefault(); - const newBoard = new BoardEdit(); - newBoard.renderCreateBoard(); - }); + newBoardButton.root.addEventListener('click', (event) => { + event.preventDefault(); + const newBoard = new BoardEdit(); + newBoard.renderCreateBoard(); + }); + } } } From 159485bace5b1d36aa50fe9f5f824bd5178f96f7 Mon Sep 17 00:00:00 2001 From: glebkostin Date: Mon, 20 May 2024 16:32:03 +0300 Subject: [PATCH 26/87] =?UTF-8?q?HAR-134:=20=D0=A1=D0=B4=D0=B5=D0=BB=D0=B0?= =?UTF-8?q?=D0=BB=20=D0=B2=20=D0=BF=D0=B8=D0=BD=D0=B5=20=D0=BA=D0=BB=D0=B8?= =?UTF-8?q?=D0=BA=D0=B0=D0=B1=D0=B5=D0=BB=D1=8C=D0=BD=D1=8B=D0=BC=20=D0=B2?= =?UTF-8?q?=D1=81=D0=B5=D0=B3=D0=BE=20=D0=BF=D0=BE=D0=BB=D1=8C=D0=B7=D0=BE?= =?UTF-8?q?=D0=B2=D0=B0=D1=82=D0=B5=D0=BB=D1=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ui/pinInformationBlock.handlebars | 12 +++++++----- .../ui/pinInformationBlock.js | 4 ++-- .../ui/pinInformationBlock.scss | 17 +++++++++++++++++ 3 files changed, 26 insertions(+), 7 deletions(-) diff --git a/source/features/pinInformationBlock/ui/pinInformationBlock.handlebars b/source/features/pinInformationBlock/ui/pinInformationBlock.handlebars index f71653c2..735b48a5 100644 --- a/source/features/pinInformationBlock/ui/pinInformationBlock.handlebars +++ b/source/features/pinInformationBlock/ui/pinInformationBlock.handlebars @@ -4,12 +4,14 @@
{{pin.description}}
-