From bebd8288e54fe9b223a8c70a689b6baefa177b0d Mon Sep 17 00:00:00 2001
From: Ashurov Georgy <ashurov1308@mail.ru>
Date: Mon, 16 Dec 2024 15:09:24 +0300
Subject: [PATCH] Update room modal

---
 public/components/CoWatchBlock/CoWatchBlock.ts        |  5 ++++-
 public/components/CreateRoomModal/CreateRoomModal.hbs |  6 ++----
 public/components/CreateRoomModal/CreateRoomModal.ts  | 11 +++++++++--
 public/pages/RoomPage/RoomPage.ts                     |  6 +++++-
 public/store/RoomPageStore.ts                         |  6 +++++-
 5 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/public/components/CoWatchBlock/CoWatchBlock.ts b/public/components/CoWatchBlock/CoWatchBlock.ts
index cf8891d..fd2c932 100644
--- a/public/components/CoWatchBlock/CoWatchBlock.ts
+++ b/public/components/CoWatchBlock/CoWatchBlock.ts
@@ -25,7 +25,10 @@ export class CoWatchBlock {
 
     if (createRoomButton) {
       createRoomButton.addEventListener('click', () => {
-        const modal = new CreateRoomModal();
+        const modal = new CreateRoomModal(
+          'Создание комнаты',
+          'Воспользуйтесь поиском, чтобы найти нужный фильм и создать комнату для совместного просмотра',
+        );
         modal.render();
       });
     }
diff --git a/public/components/CreateRoomModal/CreateRoomModal.hbs b/public/components/CreateRoomModal/CreateRoomModal.hbs
index c07779b..aafea0a 100644
--- a/public/components/CreateRoomModal/CreateRoomModal.hbs
+++ b/public/components/CreateRoomModal/CreateRoomModal.hbs
@@ -6,12 +6,10 @@
       src='/assets/icons/closeNoShadowIcon.svg'
       alt=''
     />
-    <h1 class='create-room-modal__content_title'>Создание комнаты</h1>
+    <h1 class='create-room-modal__content_title'>{{title}}</h1>
     <div class='create-room-modal__content_search'>
       <div class='create-room-modal__content_search_area'>
-        <span class='create-room-modal__content_search_desc'>Воспользуйтесь
-          поиском, чтобы найти нужный фильм и создать комнату для совместного
-          просмотра</span>
+        <span class='create-room-modal__content_search_desc'>{{text}}</span>
         <input
           autocomplete='off'
           id='create-room-search-movie-input'
diff --git a/public/components/CreateRoomModal/CreateRoomModal.ts b/public/components/CreateRoomModal/CreateRoomModal.ts
index 2f9f9c7..d03d1f2 100644
--- a/public/components/CreateRoomModal/CreateRoomModal.ts
+++ b/public/components/CreateRoomModal/CreateRoomModal.ts
@@ -15,12 +15,16 @@ export class CreateRoomModal {
   #inputValueEmmitter: Emitter<string>;
   #isModalOpen: boolean;
   #onClick;
+  #title;
+  #text;
 
-  constructor(onClick?: (id: number) => void) {
+  constructor(title: string, text: string, onClick?: (id: number) => void) {
     this.#isModalOpen = false;
     this.#inputValue = '';
     this.#inputValueEmmitter = new Emitter<string>('');
     this.#onClick = onClick;
+    this.#title = title;
+    this.#text = text;
 
     const userLoadingListener = searchBlockStore.movEm$.addListener(() => {
       this.renderMoviesList(searchBlockStore.getMovies(), this.#inputValue);
@@ -88,7 +92,10 @@ export class CreateRoomModal {
   render() {
     const root = document.getElementById('root');
     if (root) {
-      root.insertAdjacentHTML('beforeend', template());
+      root.insertAdjacentHTML(
+        'beforeend',
+        template({ title: this.#title, text: this.#text }),
+      );
       root.style.overflow = 'hidden';
     }
 
diff --git a/public/pages/RoomPage/RoomPage.ts b/public/pages/RoomPage/RoomPage.ts
index 7cf410d..398f4ed 100644
--- a/public/pages/RoomPage/RoomPage.ts
+++ b/public/pages/RoomPage/RoomPage.ts
@@ -171,7 +171,11 @@ export class RoomPage {
   }
 
   handleChangeMovieClick() {
-    const modal = new CreateRoomModal((id: number) => Actions.changeMovie(id));
+    const modal = new CreateRoomModal(
+      'Изменение фильма',
+      'Воспользуйтесь поиском, чтобы найти нужный фильм',
+      (id: number) => Actions.changeMovie(id),
+    );
     const createRoomButton = document.getElementById(
       'change-movie-btn',
     ) as HTMLElement;
diff --git a/public/store/RoomPageStore.ts b/public/store/RoomPageStore.ts
index 9987c59..d7fbc5a 100644
--- a/public/store/RoomPageStore.ts
+++ b/public/store/RoomPageStore.ts
@@ -190,7 +190,11 @@ class RoomPageStore {
             }
             break;
           case 'change_movie':
-            if (this.#room && messageData['movie'].id !== this.#room.movie.id) {
+            if (
+              this.#room &&
+              messageData['movie'] &&
+              messageData['movie'].id !== this.#room.movie.id
+            ) {
               this.#room.movie = serializeMovieDetailed(messageData['movie']);
               if (this.#room.movie.seasons && this.#room.movie.seasons.length) {
                 roomPage.renderVideo(