import { html, Component, createRef } from "../lib/index.js";
export default class ConnectForm extends Component {
state = {
url: "",
pass: "",
nick: "",
password: "",
rememberMe: false,
username: "",
realname: "",
autojoin: "",
};
nickInput = createRef();
constructor(props) {
super(props);
this.handleChange = this.handleChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
if (props.params) {
this.state = {
...this.state,
url: props.params.url || "",
nick: props.params.nick || "",
rememberMe: props.params.autoconnect || false,
username: props.params.username || "",
realname: props.params.realname || "",
autojoin: (props.params.autojoin || []).join(","),
};
}
}
handleChange(event) {
let target = event.target;
let value = target.type == "checkbox" ? target.checked : target.value;
this.setState({ [target.name]: value });
}
handleSubmit(event) {
event.preventDefault();
if (this.props.connecting) {
return;
}
let params = {
url: this.state.url,
pass: this.state.pass,
nick: this.state.nick,
autoconnect: this.state.rememberMe,
username: this.state.username,
realname: this.state.realname,
saslPlain: null,
autojoin: [],
};
if (this.state.password) {
params.saslPlain = {
username: params.username || params.nick,
password: this.state.password,
};
} else if (this.props.auth === "external") {
params.saslExternal = true;
}
this.state.autojoin.split(",").forEach(function(ch) {
ch = ch.trim();
if (!ch) {
return;
}
params.autojoin.push(ch);
});
this.props.onSubmit(params);
}
componentDidMount() {
if (this.nickInput.current) {
this.nickInput.current.focus();
}
}
render() {
let disabled = this.props.connecting;
let serverURL = null;
if (!this.props.params || !this.props.params.url) {
serverURL = html`
`;
}
let status = null;
if (this.props.connecting) {
status = html`
Connecting...
`; } else if (this.props.error) { status = html`${this.props.error}
`; } let auth = null; if (this.props.auth !== "disabled" && this.props.auth !== "external") { auth = html`