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`

`; } let autojoin = html`
`; // Show autojoin field in advanced options, except if it's pre-filled let isAutojoinAdvanced = (this.props.params.autojoin || []).length === 0; return html`

Connect to IRC



${auth} ${!isAutojoinAdvanced ? [autojoin, html`
`] : null}

Advanced options
${serverURL}





${isAutojoinAdvanced ? autojoin : null}

${status}
`; } }