diff --git a/src/Link.js b/src/Link.js index 63a3d41..292879c 100644 --- a/src/Link.js +++ b/src/Link.js @@ -166,4 +166,12 @@ export class Link { this.servers.length === link.servers.length && this.servers.every((s, i) => link.servers[i] === s); } + + toFragment() { + if (this.eventId) { + return `/${this.identifier}/${this.eventId}`; + } else { + return `/${this.identifier}`; + } + } } diff --git a/src/RootViewModel.js b/src/RootViewModel.js index 822b3d8..ffa79a0 100644 --- a/src/RootViewModel.js +++ b/src/RootViewModel.js @@ -41,7 +41,8 @@ export class RootViewModel extends ViewModel { this.openLinkViewModel.load(); } } else { - this.previewViewModel = null; + this.openLinkViewModel = null; + this.createLinkViewModel = new CreateLinkViewModel(this.childOptions()); } this.emitChange(); } diff --git a/src/create/CreateLinkView.js b/src/create/CreateLinkView.js new file mode 100644 index 0000000..cc1b738 --- /dev/null +++ b/src/create/CreateLinkView.js @@ -0,0 +1,33 @@ +/* +Copyright 2020 The Matrix.org Foundation C.I.C. + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import {TemplateView} from "../utils/TemplateView.js"; +import {PreviewView} from "../preview/PreviewView.js"; + +export class CreateLinkView extends TemplateView { + render(t, vm) { + return t.div({className: "CreateLinkView card"}, [ + t.mapView(vm => vm.previewViewModel, childVM => childVM ? new PreviewView(childVM) : null), + t.h2({className: {hidden: vm => !vm.linkUrl}}, t.a({href: vm => vm.linkUrl}, vm => vm.linkUrl)), + t.div(t.input({ + className: "fullwidth", + type: "text", + onChange: evt => vm.createLink(evt.target.value), + placeholder: "#room:example.com, @user:example.com" + })), + ]); + } +} \ No newline at end of file diff --git a/src/create/CreateLinkViewModel.js b/src/create/CreateLinkViewModel.js index 4318a45..2f620bc 100644 --- a/src/create/CreateLinkViewModel.js +++ b/src/create/CreateLinkViewModel.js @@ -14,13 +14,33 @@ See the License for the specific language governing permissions and limitations under the License. */ +import {ViewModel} from "../utils/ViewModel.js"; +import {PreviewViewModel} from "../preview/PreviewViewModel.js"; +import {Link} from "../Link.js"; + export class CreateLinkViewModel extends ViewModel { - createLink(identifier) { - this._link = Link.fromIdentifier(identifier); + constructor(options) { + super(options); + this.previewViewModel = null; + } + + async createLink(identifier) { + this._link = Link.parseFragment(identifier); + if (this._link) { + // TODO: abort previous load + this.previewViewModel = new PreviewViewModel(this.childOptions({ + link: this._link, + consentedServers: this._link.servers, + })); + this.emitChange(); + await this.previewViewModel.load(); + } this.emitChange(); } - get link() { - this._link.toURL(); + get linkUrl() { + if (this._link) { + return `${this.origin}/#${this._link.toFragment()}`; + } } } \ No newline at end of file diff --git a/src/utils/ViewModel.js b/src/utils/ViewModel.js index 40507f6..6c4b484 100644 --- a/src/utils/ViewModel.js +++ b/src/utils/ViewModel.js @@ -61,6 +61,7 @@ export class ViewModel extends EventEmitter { } get request() { return this._options.request; } + get origin() { return this._options.origin; } get openLink() { return this._options.openLink; } get platforms() { return this._options.platforms; } get preferences() { return this._options.preferences; } @@ -68,6 +69,7 @@ export class ViewModel extends EventEmitter { childOptions(options = {}) { return Object.assign({ request: this.request, + origin: this.origin, openLink: this.openLink, platforms: this.platforms, preferences: this.preferences,