diff --git a/src/create/CreateLinkView.js b/src/create/CreateLinkView.js index 473c781..c4ae494 100644 --- a/src/create/CreateLinkView.js +++ b/src/create/CreateLinkView.js @@ -54,12 +54,14 @@ export class CreateLinkView extends TemplateView { t.div({className: {hidden: vm => !vm.linkUrl}}, [ t.h2(link), t.div(copyButton(t, link, "Copy link", "fullwidth primary")), + t.div(t.button({className: "secondary fullwidth", onClick: () => this._clear()}, "Or create another link")), ]), t.form({action: "#", onSubmit: evt => this._onSubmit(evt), className: {hidden: vm => vm.linkUrl}}, [ t.div(t.input({ className: "fullwidth large", type: "text", name: "identifier", + required: true, placeholder: "#room:example.com, @user:example.com", onChange: evt => this._onIdentifierChange(evt) })), @@ -71,8 +73,10 @@ export class CreateLinkView extends TemplateView { _onSubmit(evt) { evt.preventDefault(); const form = evt.target; - const identifier = form.elements.identifier.value; - this.value.createLink(identifier); + const {identifier} = form.elements; + this.value.createLink(identifier.value); + identifier.value = ""; + } _onIdentifierChange(evt) { @@ -83,4 +87,10 @@ export class CreateLinkView extends TemplateView { inputField.setCustomValidity(""); } } + + _clear() { + this.value.clear(); + const textField = this.root().querySelector("input[name=identifier]"); + textField.focus(); + } } diff --git a/src/create/CreateLinkViewModel.js b/src/create/CreateLinkViewModel.js index 306cc47..6e5fcc5 100644 --- a/src/create/CreateLinkViewModel.js +++ b/src/create/CreateLinkViewModel.js @@ -21,6 +21,7 @@ import {Link} from "../Link.js"; export class CreateLinkViewModel extends ViewModel { constructor(options) { super(options); + this._link = null; this.previewViewModel = null; } @@ -49,4 +50,10 @@ export class CreateLinkViewModel extends ViewModel { return `${this.origin}/#${this._link.toFragment()}`; } } + + clear() { + this._link = null; + this.previewViewModel = null; + this.emitChange(); + } }