Fix chat not coming back after server comes back. Closes #136

This commit is contained in:
Gabe Kangas 2020-09-12 18:46:08 -07:00
parent 4c497454b6
commit 0dcd92e9cd
2 changed files with 26 additions and 36 deletions

View file

@ -44,7 +44,7 @@ export default class App extends Component {
this.state = {
websocket: new Websocket(),
displayChat: getLocalStorage(KEY_CHAT_DISPLAYED) || true, // chat panel state
chatEnabled: false, // chat input box state
chatInputEnabled: false, // chat input box state
username: getLocalStorage(KEY_USERNAME) || generateUsername(),
userAvatarImage:
getLocalStorage(KEY_AVATAR) ||
@ -283,7 +283,7 @@ export default class App extends Component {
this.setState({
playerActive: true,
streamOnline: true,
chatEnabled: true,
chatInputEnabled: true,
streamStatusMessage: MESSAGE_ONLINE,
});
}
@ -323,7 +323,7 @@ export default class App extends Component {
disableChatInput() {
this.setState({
chatEnabled: false,
chatInputEnabled: false,
});
}
@ -340,7 +340,7 @@ export default class App extends Component {
render(props, state) {
const {
chatEnabled,
chatInputEnabled,
configData,
displayChat,
extraUserContent,
@ -538,7 +538,7 @@ export default class App extends Component {
websocket=${websocket}
username=${username}
userAvatarImage=${userAvatarImage}
chatEnabled=${chatEnabled}
chatInputEnabled=${chatInputEnabled}
/>
</div>
`;

View file

@ -144,18 +144,6 @@ export default class Chat extends Component {
this.websocket.send(message);
}
disableChat() {
this.setState({
inputEnabled: false,
});
}
enableChat() {
this.setState({
inputEnabled: true,
});
}
updateAuthorList(message) {
const { type } = message;
const nameList = this.state.chatUserNames;
@ -175,7 +163,7 @@ export default class Chat extends Component {
render(props, state) {
const { username, messagesOnly, chatEnabled } = props;
const { username, messagesOnly, chatInputEnabled } = props;
const { messages, inputEnabled, chatUserNames } = state;
const messageList = messages.map((message) => (html`<${Message} message=${message} username=${username} key=${message.id} />`));
@ -193,25 +181,27 @@ export default class Chat extends Component {
`);
}
return (
html`
<section id="chat-container-wrap" class="flex flex-col">
<div id="chat-container" class="bg-gray-800 flex flex-col justify-end overflow-auto">
<div
id="messages-container"
ref=${this.scrollableMessagesContainer}
class="py-1 overflow-auto z-10"
>
${messageList}
</div>
<${ChatInput}
chatUserNames=${chatUserNames}
inputEnabled=${chatEnabled && inputEnabled}
handleSendMessage=${this.submitChat}
/>
return html`
<section id="chat-container-wrap" class="flex flex-col">
<div
id="chat-container"
class="bg-gray-800 flex flex-col justify-end overflow-auto"
>
<div
id="messages-container"
ref=${this.scrollableMessagesContainer}
class="py-1 overflow-auto z-10"
>
${messageList}
</div>
</section>
`);
<${ChatInput}
chatUserNames=${chatUserNames}
inputEnabled=${chatInputEnabled}
handleSendMessage=${this.submitChat}
/>
</div>
</section>
`;
}
}