make preview useable without client list, to reuse in create link view

src/open/ClientListView.js

@@ -0,0 +1,73 @@
+/*
+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 {ClientView} from "./ClientView.js";
+
+export class ClientListView extends TemplateView {
+	render(t, vm) {
+		return t.mapView(vm => vm.clientViewModel, () => {
+			if (vm.clientViewModel) {
+				return new ContinueWithClientView(vm);
+			} else {
+				return new AllClientsView(vm);
+			}
+		});
+	}
+}
+
+class AllClientsView extends TemplateView {
+	render(t, vm) {
+		return t.div({className: "ClientListView"}, [
+			t.h2("Choose an app to continue"),
+			t.mapView(vm => vm.clientList, () => {
+				return new TemplateView(vm, t => {
+					return t.div({className: "list"}, vm.clientList.map(clientViewModel => {
+						return t.view(new ClientView(clientViewModel));
+					}));
+				});
+			}),
+			t.div(t.label([
+				t.input({
+					type: "checkbox",
+					checked: vm.showUnsupportedPlatforms,
+					onChange: evt => vm.showUnsupportedPlatforms = evt.target.checked,
+				}),
+				"Show apps not available on my platform"
+			])),
+			t.div(t.label([
+				t.input({
+					type: "checkbox",
+					checked: vm.showExperimental,
+					onChange: evt => vm.showExperimental = evt.target.checked,
+				}),
+				"Show experimental apps"
+			])),
+		]);
+	}
+}
+
+class ContinueWithClientView extends TemplateView {
+	render(t, vm) {
+		return t.div({className: "ClientListView"}, [
+			t.h2([
+				`Continue with ${vm.clientViewModel.name} `,
+				t.button({onClick: () => vm.showAll()}, "Back")
+			]),
+			t.div({className: "list"}, t.view(new ClientView(vm.clientViewModel)))
+		]);
+	}
+}

src/open/ClientListViewModel.js

@@ -0,0 +1,84 @@
+/*
+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 {isWebPlatform, Platform} from "../Platform.js";
+import {Maturity} from "./types.js";
+import {ClientViewModel} from "./ClientViewModel.js";
+import {ViewModel} from "../utils/ViewModel.js";
+
+export class ClientListViewModel extends ViewModel {
+	constructor(options) {
+		super(options);
+		const {clients, client, link} = options;
+		this._clients = clients;
+		this._link = link;
+		this.clientList = null;
+		this._showExperimental = false;
+		this._showUnsupportedPlatforms = false;
+		this._filterClients();
+		this.clientViewModel = null;
+		if (client) {
+			this._pickClient(client);
+		}
+	}
+
+	get showUnsupportedPlatforms() {
+		return this._showUnsupportedPlatforms;
+	}
+
+	get showExperimental() {
+		return this._showExperimental;
+	}
+
+	set showUnsupportedPlatforms(enabled) {
+		this._showUnsupportedPlatforms = enabled;
+		this._filterClients();
+	}
+
+	set showExperimental(enabled) {
+		this._showExperimental = enabled;
+		this._filterClients();
+	}
+
+	_filterClients() {
+		this.clientList = this._clients.filter(client => {
+			const isStable = this.platforms.map(p => client.getMaturity(p)).includes(Maturity.Stable);
+			const isSupported = client.platforms.some(p => this.platforms.includes(p));
+			if (!this._showExperimental && !isStable) {
+				return false;
+			}
+			if (!this._showUnsupportedPlatforms && !isSupported) {
+				return false;
+			}
+			return true;
+		}).map(client => new ClientViewModel(this.childOptions({
+			client,
+			link: this._link,
+			pickClient: client => this._pickClient(client)
+		})));
+		this.emitChange();
+	}
+
+	_pickClient(client) {
+		this.clientViewModel = this.clientList.find(vm => vm.clientId === client.id);
+		this.emitChange();
+	}
+
+	showAll() {
+		this.clientViewModel = null;
+		this.emitChange();
+	}
+}

src/open/ClientView.js

@@ -0,0 +1,109 @@
+/*
+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";
+
+function formatPlatforms(platforms) {
+	return platforms.reduce((str, p, i, all) => {
+		const first = i === 0;
+		const last = i === all.length - 1;
+		return str + (first ? "" : last ? " & " : ", ") + p;
+	}, "");
+}
+
+export class ClientView extends TemplateView {
+
+	render(t, vm) {
+		return t.div({className: "ClientView"}, [
+			t.div({className: "header"}, [
+				t.div({className: "description"}, [
+					t.h3(vm.name),
+					t.p(vm.description),
+					t.p(formatPlatforms(vm.availableOnPlatformNames)),
+				]),
+				t.div({className: `icon ${vm.clientId}`})
+			]),
+			t.mapView(vm => vm.stage, stage => {
+				switch (stage) {
+					case "open": return new OpenClientView(vm);
+					case "install": return new InstallClientView(vm);
+				}
+			}),
+		]);
+	}
+}
+
+class OpenClientView extends TemplateView {
+	render(t, vm) {
+		return t.div({className: "OpenClientView"}, [
+			t.a({
+				className: "primary fullwidth",
+				href: vm.deepLink,
+				rel: "noopener noreferrer",
+				onClick: () => vm.deepLinkActivated(),
+			}, "Continue")
+		]);
+	}
+}
+
+class InstallClientView extends TemplateView {
+
+	copyToClipboard() {
+
+	}
+
+	render(t, vm) {
+		const children = [];
+
+		if (vm.textInstructions) {
+			const copy = t.button({className: "primary", onClick: evt => this.copyToClipboard(evt)}, "Copy");
+			children.push(t.p([vm.textInstructions, copy]));
+		}
+
+		const actions = t.div({className: "actions"}, vm.actions.map(a => {
+			let badgeUrl;
+			switch (a.kind) {
+				case "play-store": badgeUrl = "images/google-play-us.svg"; break;
+				case "fdroid": badgeUrl = "images/fdroid-badge.png"; break;
+				case "apple-app-store": badgeUrl = "images/app-store-us-alt.svg"; break;
+			}
+			return t.a({
+				href: a.url,
+				className: {
+					fullwidth: !badgeUrl,
+					primary: a.primary && !badgeUrl,
+					secondary: !a.primary && !badgeUrl,
+					badge: !!badgeUrl,
+				},
+				rel: "noopener noreferrer",
+				["aria-label"]: a.label, 
+				onClick: () => a.activated()
+			}, badgeUrl ? t.img({src: badgeUrl}) : a.label);
+		}));
+		children.push(actions);
+
+		if (vm.showDeepLinkInInstall) {
+			const deepLink = t.a({
+				rel: "noopener noreferrer",
+				href: vm.deepLink,
+				onClick: () => vm.deepLinkActivated(),
+			}, "open it here");
+			children.push(t.p([`If you already have ${vm.name} installed, you can `, deepLink, "."]))
+		}
+
+		return t.div({className: "InstallClientView"}, children);
+	}
+}

src/open/ClientViewModel.js

@@ -0,0 +1,149 @@
+/*
+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 {isWebPlatform, isDesktopPlatform, Platform} from "../Platform.js";
+import {ViewModel} from "../utils/ViewModel.js";
+
+export class ClientViewModel extends ViewModel {
+	constructor(options) {
+		super(options);
+		const {client, link, pickClient} = options;
+		this._client = client;
+		this._link = link;
+		this._pickClient = pickClient;
+
+		const supportedPlatforms = client.platforms;
+		const matchingPlatforms = this.platforms.filter(p => {
+			return supportedPlatforms.includes(p);
+		});
+		const nativePlatform = matchingPlatforms.find(p => !isWebPlatform(p));
+		const webPlatform = matchingPlatforms.find(p => isWebPlatform(p));
+		
+		this._proposedPlatform = this.preferences.platform || nativePlatform || webPlatform;
+		
+		this.actions = this._createActions(client, link, nativePlatform, webPlatform);
+		this.name = this._client.getName(this._proposedPlatform);
+		this.deepLink = this._client.getDeepLink(this._proposedPlatform, this._link);
+		this._clientCanIntercept = !!(nativePlatform && client.canInterceptMatrixToLinks(nativePlatform));
+		this._showOpen = this.deepLink && !this._clientCanIntercept;
+	}
+
+	_createActions(client, link, nativePlatform, webPlatform) {
+		let actions = [];
+		if (nativePlatform) {
+			const nativeActions = (client.getInstallLinks(nativePlatform) || []).map(installLink => {
+				return {
+					label: installLink.description,
+					url: installLink.createInstallURL(link),
+					kind: installLink.channelId,
+					primary: true,
+					activated: () => this.preferences.setClient(client.id, nativePlatform),
+				};
+			});
+			actions.push(...nativeActions);
+		}
+		if (webPlatform) {
+			const webDeepLink = client.getDeepLink(webPlatform, link);
+			if (webDeepLink) {
+				actions.push({
+					label: `Or open in ${client.getName(webPlatform)}`,
+					url: webDeepLink,
+					kind: "open-in-web",
+					activated: () => this.preferences.setClient(client.id, webPlatform),
+				});
+			}
+		}
+		if (actions.length === 0) {
+			actions.push({
+				label: `Visit app homepage`,
+				url: client.homepage,
+				primary: true,
+				kind: "homepage",
+				activated: () => {},
+			});
+		}
+		return actions;
+	}
+
+	get identifier() {
+		return this._link.identifier;
+	}
+
+	get description() {
+		return this._client.description;
+	}
+
+	get clientId() {
+		return this._client.id;
+	}
+
+	get stage() {
+		return this._showOpen ? "open" : "install";
+	}
+
+	get textInstructions() {
+		return this._client.getLinkInstructions(this._proposedPlatform, this._link);
+	}
+
+	get showDeepLinkInInstall() {
+		return this._clientCanIntercept && this.deepLink;
+	}
+
+	get availableOnPlatformNames() {
+		const platforms = this._client.platforms;
+		const textPlatforms = [];
+		const hasWebPlatform = platforms.some(p => isWebPlatform(p));
+		if (hasWebPlatform) {
+			textPlatforms.push("Web");
+		}
+		const desktopPlatforms = platforms.filter(p => isDesktopPlatform(p));
+		if (desktopPlatforms.length === 1) {
+			textPlatforms.push(desktopPlatforms[0]);
+		} else {
+			textPlatforms.push("Desktop");
+		}
+		if (platforms.includes(Platform.Android)) {
+			textPlatforms.push("Android");
+		}
+		if (platforms.includes(Platform.iOS)) {
+			textPlatforms.push("iOS");
+		}
+		return textPlatforms;
+	}
+	
+	deepLinkActivated() {
+		this._pickClient(this._client);
+		this.preferences.setClient(this._client.id, this._proposedPlatform);
+		if (this._showOpen) {
+			this._showOpen = false;
+			this.emitChange();
+		}
+	}
+}
+
+/*
+if (this._preferredClient.getLinkSupport(this.preferences.platform, this._link)) {
+				const deepLink = this._preferredClient.getDeepLink(this.preferences.platform, this._link);
+				this.openLink(deepLink);
+				const protocol = new URL(deepLink).protocol;
+				const isWebProtocol = protocol === "http:" || protocol === "https:";
+				if (!isWebProtocol) {
+					this.missingClientViewModel = new ClientViewModel(this.childOptions({client: this._preferredClient, link: this._link}));
+				}
+			} else {
+				this.acceptInstructions = this._preferredClient.getLinkInstructions(this.preferences.platform, this._link);
+			}
+ */

src/open/OpenLinkView.js

@@ -0,0 +1,35 @@
+/*
+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 {ClientListView} from "./ClientListView.js";
+import {PreviewView} from "../preview/PreviewView.js";
+
+export class OpenLinkView extends TemplateView {
+	render(t, vm) {
+		return t.div({className: "OpenLinkView card"}, [
+			t.view(new PreviewView(vm.previewViewModel)),
+			t.div({className: {hidden: vm => vm.previewLoading}}, [
+				t.p({className: {hidden: vm => vm.clientsViewModel}}, t.button({
+					className: "primary fullwidth",
+					onClick: () => vm.showClients()
+				}, vm => vm.showClientsLabel)),
+				t.mapView(vm => vm.clientsViewModel, childVM => childVM ? new ClientListView(childVM) : null),
+				t.p(["Preview provided by ", vm => vm.previewDomain]),
+			])
+		]);
+	}
+}

src/open/OpenLinkViewModel.js

@@ -0,0 +1,64 @@
+/*
+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 {ViewModel} from "../utils/ViewModel.js";
+import {ClientListViewModel} from "./ClientListViewModel.js";
+import {ClientViewModel} from "./ClientViewModel.js";
+import {PreviewViewModel} from "../preview/PreviewViewModel.js";
+import {getLabelForLinkKind} from "../Link.js";
+
+export class OpenLinkViewModel extends ViewModel {
+	constructor(options) {
+		super(options);
+		const {clients, link, consentedServers} = options;
+		this._link = link;
+		this._clients = clients;
+		this.previewViewModel = new PreviewViewModel(this.childOptions({link, consentedServers}));
+		this.previewLoading = false;
+		const preferredClient = this.preferences.clientId ? clients.find(c => c.id === this.preferences.clientId) : null;
+		this.clientsViewModel = preferredClient ? new ClientListViewModel(this.childOptions({
+			clients,
+			link,
+			client: preferredClient,
+		})) : null;
+	}
+
+	async load() {
+		this.previewLoading = true;	
+		this.emitChange();
+		await this.previewViewModel.load();
+		this.previewLoading = false;
+		this.emitChange();
+	}
+
+	get previewDomain() {
+		return this.previewViewModel.previewDomain;
+	}
+
+	get showClientsLabel() {
+		return getLabelForLinkKind(this._link.kind);
+	}
+
+	showClients() {
+		if (!this.clientsViewModel) {
+			this.clientsViewModel = new ClientListViewModel(this.childOptions({
+				clients: this._clients,
+				link: this._link
+			}));
+			this.emitChange();
+		}
+	}
+}

src/open/clients/Element.js

@@ -0,0 +1,86 @@
+/*
+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 {Maturity, Platform, LinkKind,
+	FDroidLink, AppleStoreLink, PlayStoreLink, WebsiteLink} from "../types.js";
+
+/**
+ * Information on how to deep link to a given matrix client.
+ */
+export class Element {
+	/* should only contain alphanumerical and -_, no dots (needs to be usable as css class) */
+	get id() { return "element-io"; }
+
+	get platforms() {
+		return [
+			Platform.Android, Platform.iOS,
+			Platform.Windows, Platform.macOS, Platform.Linux,
+			Platform.DesktopWeb
+		];
+	}
+
+	get description() { return 'Fully-featured Matrix client, used by millions.'; }
+
+	get homepage() { return "https://element.io"; }
+	get author() { return "https://element.io"; }
+
+	getMaturity(platform) { return Maturity.Stable; }
+
+	getDeepLink(platform, link) {
+		let fragmentPath;
+		switch (link.kind) {
+			case LinkKind.User:
+				fragmentPath = `user/${link.identifier}`;
+				break;
+			case LinkKind.Room:
+				fragmentPath = `room/${link.identifier}`;
+				break;
+			case LinkKind.Group:
+				fragmentPath = `group/${link.identifier}`;
+				break;
+			case LinkKind.Event:
+				fragmentPath = `room/${link.identifier}/${link.eventId}`;
+				break;
+		}
+		if (platform === Platform.DesktopWeb || platform === Platform.MobileWeb || platform === Platform.iOS) {
+			return `https://app.element.io/#/${fragmentPath}`;
+		} else {
+			return `element://${fragmentPath}`;
+		}
+	}
+
+	getLinkInstructions(platform, link) {}
+
+	getName(platform) {
+		if (platform === Platform.DesktopWeb || platform === Platform.MobileWeb) {
+			return "Element Web";
+		} else {
+			return "Element";
+		}
+	}
+
+	getInstallLinks(platform) {
+		switch (platform) {
+			case Platform.iOS: return [new AppleStoreLink('vector', 'id1083446067')];
+			case Platform.Android: return [new PlayStoreLink('im.vector.app'), new FDroidLink('im.vector.app')];
+			default: return [new WebsiteLink("https://element.io/get-started")];
+		}
+	}
+
+	canInterceptMatrixToLinks(platform) {
+		return platform === Platform.iOS || platform === Platform.Android;
+	}
+}

src/open/clients/Weechat.js

@@ -0,0 +1,42 @@
+/*
+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 {Maturity, Platform, LinkKind, WebsiteLink} from "../types.js";
+
+/**
+ * Information on how to deep link to a given matrix client.
+ */
+export class Weechat {
+	/* should only contain alphanumerical and -_, no dots (needs to be usable as css class) */
+	get id() { return "weechat"; }
+	getName(platform) { return "Weechat"; }
+    get author() { return "Poljar"; }
+    get homepage() { return "https://github.com/poljar/weechat-matrix"; }
+	get platforms() { return [Platform.Windows, Platform.macOS, Platform.Linux]; }
+	get description() { return 'Command-line Matrix interface using Weechat'; }
+	getMaturity(platform) { return Maturity.Beta; }
+	getDeepLink(platform, link) {}
+	canInterceptMatrixToLinks(platform) { return false; }
+
+	getLinkInstructions(platform, link) {
+		switch (link.kind) {
+			case LinkKind.User: return `Type /invite ${link.identifier}`;
+			case LinkKind.Room: return `Type /join ${link.identifier}`;
+		}
+	}
+
+	getInstallLinks(platform) {}
+}

src/open/clients/index.js

@@ -0,0 +1,25 @@
+/*
+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 {Element} from "./Element.js";
+import {Weechat} from "./Weechat.js";
+
+export function createClients() {
+	return [
+		new Element(),
+		new Weechat(),
+	];
+}

src/open/types.js

@@ -0,0 +1,94 @@
+/*
+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 {createEnum} from "../utils/enum.js";
+export const Maturity = createEnum("Alpha", "Beta", "Stable");
+export {LinkKind} from "../Link.js";
+export {Platform} from "../Platform.js";
+
+export class AppleStoreLink {
+    constructor(org, appId) {
+    	this._org = org;
+    	this._appId = appId;
+    }
+
+    createInstallURL(link) {
+        return `https://apps.apple.com/app/${encodeURIComponent(this._org)}/${encodeURIComponent(this._appId)}`;
+    }
+
+    get channelId() {
+        return "apple-app-store";
+    }
+
+    get description() {
+        return "Download on the App Store";
+    }
+}
+
+export class PlayStoreLink {
+    constructor(appId) {
+    	this._appId = appId;
+    }
+
+    createInstallURL(link) {
+        return `https://play.google.com/store/apps/details?id=${encodeURIComponent(this._appId)}&referrer=${encodeURIComponent(link.identifier)}`;
+    }
+      
+    get channelId() {
+        return "play-store";
+    }
+
+    get description() {
+        return "Get it on Google Play";
+    }
+}
+
+export class FDroidLink {
+    constructor(appId) {
+    	this._appId = appId;
+    }
+
+    createInstallURL(link) {
+        return `https://f-droid.org/packages/${encodeURIComponent(this._appId)}`;
+    }
+
+    get channelId() {
+        return "fdroid";
+    }
+
+    get description() {
+        return "Get it on F-Droid";
+    }
+}
+
+
+export class WebsiteLink {
+    constructor(url) {
+    	this._url = url;
+    }
+
+    createInstallURL(link) {
+        return this._url;
+    }
+
+    get channelId() {
+        return "website";
+    }
+
+    get description() {
+        return `Download from ${new URL(this._url).hostname}`;
+    }
+}