76 lines
2.0 KiB
JavaScript
76 lines
2.0 KiB
JavaScript
import { h, Component, Fragment } from 'https://unpkg.com/preact?module';
|
|
import htm from 'https://unpkg.com/htm?module';
|
|
const html = htm.bind(h);
|
|
|
|
import UsernameForm from './components/chat/username.js';
|
|
import Chat from './components/chat.js';
|
|
import Websocket from './utils/websocket.js';
|
|
|
|
import { getLocalStorage, generateAvatar, generateUsername } from './utils/helpers.js';
|
|
import { KEY_USERNAME, KEY_AVATAR } from '../utils/constants.js';
|
|
|
|
export default class StandaloneChat extends Component {
|
|
constructor(props, context) {
|
|
super(props, context);
|
|
|
|
this.state = {
|
|
websocket: new Websocket(),
|
|
chatEnabled: true, // always true for standalone chat
|
|
username: getLocalStorage(KEY_USERNAME) || generateUsername(),
|
|
userAvatarImage: getLocalStorage(KEY_AVATAR) || generateAvatar(`${this.username}${Date.now()}`),
|
|
};
|
|
|
|
this.websocket = null;
|
|
this.handleUsernameChange = this.handleUsernameChange.bind(this);
|
|
}
|
|
|
|
handleUsernameChange(newName, newAvatar) {
|
|
this.setState({
|
|
username: newName,
|
|
userAvatarImage: newAvatar,
|
|
});
|
|
}
|
|
|
|
handleChatToggle() {
|
|
return;
|
|
}
|
|
|
|
render(props, state) {
|
|
const { messagesOnly } = props;
|
|
const { username, userAvatarImage, websocket } = state;
|
|
|
|
|
|
if (messagesOnly) {
|
|
return (
|
|
html`
|
|
<${Chat}
|
|
websocket=${websocket}
|
|
username=${username}
|
|
userAvatarImage=${userAvatarImage}
|
|
messagesOnly
|
|
/>
|
|
`);
|
|
}
|
|
|
|
// not needed for standalone, just messages only. remove later.
|
|
return (
|
|
html`
|
|
<${Fragment}>
|
|
<${UsernameForm}
|
|
username=${username}
|
|
userAvatarImage=${userAvatarImage}
|
|
handleUsernameChange=${this.handleUsernameChange}
|
|
handleChatToggle=${this.handleChatToggle}
|
|
/>
|
|
|
|
<${Chat}
|
|
websocket=${websocket}
|
|
username=${username}
|
|
userAvatarImage=${userAvatarImage}
|
|
/>
|
|
</${Fragment}>
|
|
`);
|
|
}
|
|
|
|
}
|