From 0a0507124d347590be2398b65c5bbe90d6584c90 Mon Sep 17 00:00:00 2001
From: libknt <101494707+libknt@users.noreply.github.com>
Date: Sun, 20 Oct 2024 16:00:38 +0900
Subject: [PATCH 1/2] init
From 5abb6a4ca2af7c3056e909429c08793736c98334 Mon Sep 17 00:00:00 2001
From: libknt <101494707+libknt@users.noreply.github.com>
Date: Sun, 20 Oct 2024 16:15:26 +0900
Subject: [PATCH 2/2] =?UTF-8?q?fix:=20chat=20=E3=81=AElistener=E3=81=AE?=
=?UTF-8?q?=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../static/pong/components/ChatContainer.js | 19 +++-
.../pong/components/DirectoryContainer.js | 24 +++--
.../pong/components/MyRoomsContainer.js | 87 ++++++++++++-------
3 files changed, 90 insertions(+), 40 deletions(-)
diff --git a/pong/pong/static/pong/components/ChatContainer.js b/pong/pong/static/pong/components/ChatContainer.js
index 7bd87201..174ee2a5 100644
--- a/pong/pong/static/pong/components/ChatContainer.js
+++ b/pong/pong/static/pong/components/ChatContainer.js
@@ -47,9 +47,15 @@ export class ChatContainer extends Component {
displayRoom(select) {
const chatContainer = document.querySelector(".direct-message-content");
+ if (!chatContainer) {
+ return;
+ }
chatContainer.innerHTML = "";
const roomHeader = document.querySelector(".direct-message-header");
+ if (!roomHeader) {
+ return;
+ }
roomHeader.innerHTML = `${select.name}
`;
const messages = document.createElement("div");
@@ -90,11 +96,17 @@ export class ChatContainer extends Component {
);
const header = document.querySelector(".direct-message-header");
+ if (!header) {
+ return;
+ }
header.innerHTML = `${select.name}
`;
const leaveButton = document.querySelector(".leave-button");
+ if (!leaveButton) {
+ return;
+ }
this.eventListeners.leaveButtonClickListener = () =>
this.confirmLeaveRoom();
leaveButton.addEventListener(
@@ -103,6 +115,9 @@ export class ChatContainer extends Component {
);
const inviteButton = document.querySelector(".invite-button");
+ if (!inviteButton) {
+ return;
+ }
this.eventListeners.inviteButtonClickListener = () =>
this.inviteToGame(select.uuid);
inviteButton.addEventListener(
@@ -224,7 +239,9 @@ export class ChatContainer extends Component {
}
const header = document.querySelector(".direct-message-header");
- header.innerHTML = "ルームを選択してください";
+ if (header) {
+ header.innerHTML = "ルームを選択してください";
+ }
this.removeEventListeners();
this.render();
diff --git a/pong/pong/static/pong/components/DirectoryContainer.js b/pong/pong/static/pong/components/DirectoryContainer.js
index d875aa51..9cb677c4 100644
--- a/pong/pong/static/pong/components/DirectoryContainer.js
+++ b/pong/pong/static/pong/components/DirectoryContainer.js
@@ -39,14 +39,19 @@ export class DirectoryContainer extends Component {
if (searchBar) searchBar.removeEventListener("input", searchBarListener);
}
if (confirmJoinButtonListener) {
- document
- .getElementById("confirmJoinButton")
- .removeEventListener("click", confirmJoinButtonListener);
+ const confirmJoinButton = document.getElementById("confirmJoinButton");
+ if (confirmJoinButton) {
+ confirmJoinButton.removeEventListener(
+ "click",
+ confirmJoinButtonListener,
+ );
+ }
}
if (cancelJoinButtonListener) {
- document
- .getElementById("cancelJoinButton")
- .removeEventListener("click", cancelJoinButtonListener);
+ const cancelJoinButton = document.getElementById("cancelJoinButton");
+ if (cancelJoinButton) {
+ cancelJoinButton.removeEventListener("click", cancelJoinButtonListener);
+ }
}
if (modalClickListener) {
window.removeEventListener("click", modalClickListener);
@@ -64,7 +69,9 @@ export class DirectoryContainer extends Component {
refreshRoomMembers(users) {
const membersContainer = document.querySelector(".members-list");
- membersContainer.innerHTML = "";
+ if (membersContainer) {
+ membersContainer.innerHTML = "";
+ }
users.forEach((user) => {
const memberElement = document.createElement("div");
@@ -249,6 +256,9 @@ export class DirectoryContainer extends Component {
handleDOMContentLoaded() {
const searchBar = document.querySelector(".unjoined-search-bar input");
+ if (!searchBar) {
+ return;
+ }
this.eventListeners.searchBarListener = (event) => {
const query = event.target.value;
diff --git a/pong/pong/static/pong/components/MyRoomsContainer.js b/pong/pong/static/pong/components/MyRoomsContainer.js
index 4e8da558..a09e88c1 100644
--- a/pong/pong/static/pong/components/MyRoomsContainer.js
+++ b/pong/pong/static/pong/components/MyRoomsContainer.js
@@ -59,29 +59,39 @@ export class MyRoomsContainer extends Component {
} = this.eventListeners;
if (searchBarListener) {
- document
- .querySelector(".search-bar input")
- .removeEventListener("input", searchBarListener);
+ const searchBar = document.querySelector(".search-bar input");
+ if (searchBar) {
+ searchBar.removeEventListener("input", searchBarListener);
+ }
}
if (roomTypeListener) {
- document
- .getElementById("roomType")
- .removeEventListener("change", roomTypeListener);
+ const roomTypeSelect = document.getElementById("roomType");
+ if (roomTypeSelect) {
+ roomTypeSelect.removeEventListener("change", roomTypeListener);
+ }
}
if (createChatroomListener) {
- document
- .querySelector(".create-chatroom-button")
- .removeEventListener("click", createChatroomListener);
+ const createChatroomButton = document.querySelector(
+ ".create-chatroom-button",
+ );
+ if (createChatroomButton) {
+ createChatroomButton.removeEventListener(
+ "click",
+ createChatroomListener,
+ );
+ }
}
if (closeModalListener) {
- document
- .querySelector(".close-modal")
- .removeEventListener("click", closeModalListener);
+ const closeModal = document.querySelector(".close-modal");
+ if (closeModal) {
+ closeModal.removeEventListener("click", closeModalListener);
+ }
}
if (formSubmitListener) {
- document
- .getElementById("createChatroomForm")
- .removeEventListener("submit", formSubmitListener);
+ const createChatroomForm = document.getElementById("createChatroomForm");
+ if (createChatroomForm) {
+ createChatroomForm.removeEventListener("submit", formSubmitListener);
+ }
}
if (modalClickListener) {
window.removeEventListener("click", modalClickListener);
@@ -102,7 +112,12 @@ export class MyRoomsContainer extends Component {
const query = event.target.value.toLowerCase();
this.displayRooms(this.rooms, query);
};
- searchBar.addEventListener("input", this.eventListeners.searchBarListener);
+ if (searchBar) {
+ searchBar.addEventListener(
+ "input",
+ this.eventListeners.searchBarListener,
+ );
+ }
this.eventListeners.roomTypeListener = (event) => {
const emailField = document.getElementById("emailField");
@@ -115,26 +130,32 @@ export class MyRoomsContainer extends Component {
emailInput.removeAttribute("required");
}
};
- roomTypeSelect.addEventListener(
- "change",
- this.eventListeners.roomTypeListener,
- );
+ if (roomTypeSelect) {
+ roomTypeSelect.addEventListener(
+ "change",
+ this.eventListeners.roomTypeListener,
+ );
+ }
this.eventListeners.createChatroomListener = () => {
modal.style.display = "block";
};
- createChatroomButton.addEventListener(
- "click",
- this.eventListeners.createChatroomListener,
- );
+ if (createChatroomButton) {
+ createChatroomButton.addEventListener(
+ "click",
+ this.eventListeners.createChatroomListener,
+ );
+ }
this.eventListeners.closeModalListener = () => {
modal.style.display = "none";
};
- closeModal.addEventListener(
- "click",
- this.eventListeners.closeModalListener,
- );
+ if (closeModal) {
+ closeModal.addEventListener(
+ "click",
+ this.eventListeners.closeModalListener,
+ );
+ }
this.eventListeners.formSubmitListener = (event) => {
event.preventDefault();
@@ -158,10 +179,12 @@ export class MyRoomsContainer extends Component {
modal.style.display = "none";
};
- createChatroomForm.addEventListener(
- "submit",
- this.eventListeners.formSubmitListener,
- );
+ if (createChatroomForm) {
+ createChatroomForm.addEventListener(
+ "submit",
+ this.eventListeners.formSubmitListener,
+ );
+ }
this.eventListeners.modalClickListener = (event) => {
if (event.target === modal) {