From 73ca2dfb779d29fd72d768d19ce9969b2f2315d9 Mon Sep 17 00:00:00 2001 From: RMidhunSuresh Date: Wed, 1 Dec 2021 16:05:16 +0530 Subject: [PATCH 01/15] Add Record and fix typo --- doc/TS-MIGRATION.md | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/doc/TS-MIGRATION.md b/doc/TS-MIGRATION.md index d7ebc7f4..f3773747 100644 --- a/doc/TS-MIGRATION.md +++ b/doc/TS-MIGRATION.md @@ -2,8 +2,12 @@ ## Use `type` rather than `interface` for named parameters and POJO return values. -`type` and `interface` can be used somewhat interchangebly used, but let's use `type` to describe data and `interface` to describe (polymorphic) behaviour. +`type` and `interface` can be used somewhat interchangeably, but let's use `type` to describe data and `interface` to describe (polymorphic) behaviour. Good examples of data are option objects to have named parameters, and POJO (plain old javascript objects) without any methods, just fields. Also see [this playground](https://www.typescriptlang.org/play?#code/C4TwDgpgBACghgJwgO2AeTMAlge2QZygF4oBvAKCiqmTgFsIAuKfYBLZAcwG5LqATCABs4IAPzNkAVzoAjCAl4BfcuVCQoAYQAWWIfwzY8hEvCSpDuAlABkZPlQDGOITgTNW7LstWOR+QjMUYHtqKGcCNilHYDcAChxMK3xmIIsk4wBKewcoFRVyPzgArV19KAgAD2AUfkDEYNDqCM9o2IQEjIJmHT0DLvxsijCw-ClIDsSjAkzeEebjEIYAuE5oEgADABJSKeSAOloGJSgsQh29433nVwQlDbnqfKA) + +## Use `Record` to describe a type that accepts any Javascript object. + +Prefer this over index signature, `any` or `object`. From 928a5c27f3b1391153c5a1b670dec67cd243ac4c Mon Sep 17 00:00:00 2001 From: R Midhun Suresh Date: Wed, 1 Dec 2021 22:50:59 +0530 Subject: [PATCH 02/15] Add rationale Co-authored-by: Bruno Windels --- doc/TS-MIGRATION.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/doc/TS-MIGRATION.md b/doc/TS-MIGRATION.md index f3773747..82e88a89 100644 --- a/doc/TS-MIGRATION.md +++ b/doc/TS-MIGRATION.md @@ -10,4 +10,4 @@ Also see [this playground](https://www.typescriptlang.org/play?#code/C4TwDgpgBAC ## Use `Record` to describe a type that accepts any Javascript object. -Prefer this over index signature, `any` or `object`. +Record allows us to avoid passing in primitive types and prevents type errors when accessing properties. As this is a temporary type while converting javascript, it seems best to not add any additional requirements. If any errors occur, they must have already been present, and we should fix it by adding proper types. So prefer `Record` over `[key: string]: any`, `any` or `object`. From ef3456199c4bea90695ec1fcbcd8ce3503207735 Mon Sep 17 00:00:00 2001 From: RMidhunSuresh Date: Wed, 1 Dec 2021 22:52:09 +0530 Subject: [PATCH 03/15] Fix formatting --- doc/TS-MIGRATION.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/doc/TS-MIGRATION.md b/doc/TS-MIGRATION.md index 82e88a89..a7342ba8 100644 --- a/doc/TS-MIGRATION.md +++ b/doc/TS-MIGRATION.md @@ -10,4 +10,4 @@ Also see [this playground](https://www.typescriptlang.org/play?#code/C4TwDgpgBAC ## Use `Record` to describe a type that accepts any Javascript object. -Record allows us to avoid passing in primitive types and prevents type errors when accessing properties. As this is a temporary type while converting javascript, it seems best to not add any additional requirements. If any errors occur, they must have already been present, and we should fix it by adding proper types. So prefer `Record` over `[key: string]: any`, `any` or `object`. +`Record` allows us to avoid passing in primitive types and prevents type errors when accessing properties. As this is a temporary type while converting javascript, it seems best to not add any additional requirements. If any errors occur, they must have already been present, and we should fix it by adding proper types. So prefer `Record` over `[key: string]: any`, `any` or `object`. From 5ef7ab32dfc2a6bcd9ad810e4a3ec3a3961bcf7e Mon Sep 17 00:00:00 2001 From: RMidhunSuresh Date: Fri, 10 Dec 2021 12:09:18 +0530 Subject: [PATCH 04/15] Update doc --- doc/TS-MIGRATION.md | 28 ++++++++++++++++++++++++++-- 1 file changed, 26 insertions(+), 2 deletions(-) diff --git a/doc/TS-MIGRATION.md b/doc/TS-MIGRATION.md index a7342ba8..78a4c9ba 100644 --- a/doc/TS-MIGRATION.md +++ b/doc/TS-MIGRATION.md @@ -8,6 +8,30 @@ Good examples of data are option objects to have named parameters, and POJO (pla Also see [this playground](https://www.typescriptlang.org/play?#code/C4TwDgpgBACghgJwgO2AeTMAlge2QZygF4oBvAKCiqmTgFsIAuKfYBLZAcwG5LqATCABs4IAPzNkAVzoAjCAl4BfcuVCQoAYQAWWIfwzY8hEvCSpDuAlABkZPlQDGOITgTNW7LstWOR+QjMUYHtqKGcCNilHYDcAChxMK3xmIIsk4wBKewcoFRVyPzgArV19KAgAD2AUfkDEYNDqCM9o2IQEjIJmHT0DLvxsijCw-ClIDsSjAkzeEebjEIYAuE5oEgADABJSKeSAOloGJSgsQh29433nVwQlDbnqfKA) -## Use `Record` to describe a type that accepts any Javascript object. +## Use `type foo = { [key: string]: any }` for types that you intend to fill in later. -`Record` allows us to avoid passing in primitive types and prevents type errors when accessing properties. As this is a temporary type while converting javascript, it seems best to not add any additional requirements. If any errors occur, they must have already been present, and we should fix it by adding proper types. So prefer `Record` over `[key: string]: any`, `any` or `object`. +For instance, if you have a method such as: +```js + function load(options) { + // ... + } +``` +and you intend to type options at some later point, do: +```ts + type Options = { [key: string]: any} +``` +This makes it much easier to add the necessary type information at a later time. + +## Use `object` or `Record` to describe a type that accepts any javascript object. + +Sometimes a function or method may genuinely need to accept any object; eg: +```js +function encodeBody(body) { + // ... +} +``` +In this scenario: +- Use `object` if you know that you will not access any property +- Use `Record` if you need to access some property + +Both usages prevent the type from accepting primitives (eg: string, boolean...). If using `Record`, ensure you have guards to check that the properties really do exist. From 10368500f2a2b4b56421659a46dc3473d7b2094c Mon Sep 17 00:00:00 2001 From: RMidhunSuresh Date: Fri, 10 Dec 2021 12:12:52 +0530 Subject: [PATCH 05/15] Fix formatting --- doc/TS-MIGRATION.md | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/doc/TS-MIGRATION.md b/doc/TS-MIGRATION.md index 78a4c9ba..b63966f2 100644 --- a/doc/TS-MIGRATION.md +++ b/doc/TS-MIGRATION.md @@ -34,4 +34,5 @@ In this scenario: - Use `object` if you know that you will not access any property - Use `Record` if you need to access some property -Both usages prevent the type from accepting primitives (eg: string, boolean...). If using `Record`, ensure you have guards to check that the properties really do exist. +Both usages prevent the type from accepting primitives (eg: string, boolean...). +If using `Record`, ensure that you have guards to check that the properties really do exist. From 205de7e5c5050b1d56ae0a79c775c89365b39b69 Mon Sep 17 00:00:00 2001 From: RMidhunSuresh Date: Mon, 27 Dec 2021 15:51:25 +0530 Subject: [PATCH 06/15] Add hash-bang to fix build error --- scripts/sdk/build.sh | 1 + 1 file changed, 1 insertion(+) diff --git a/scripts/sdk/build.sh b/scripts/sdk/build.sh index 3145df80..b19f2960 100755 --- a/scripts/sdk/build.sh +++ b/scripts/sdk/build.sh @@ -1,3 +1,4 @@ +#!/bin/bash rm -rf target yarn run vite build -c vite.sdk-assets-config.js yarn run vite build -c vite.sdk-lib-config.js From b76f97be93df411ef0bb971e88e8afb9a79fe2a5 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Wed, 12 Jan 2022 10:11:04 +0100 Subject: [PATCH 07/15] put bs58 in devDeps as we bundle it in the sdk --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 1efafb16..8703a9df 100644 --- a/package.json +++ b/package.json @@ -45,13 +45,13 @@ "text-encoding": "^0.7.0", "typescript": "^4.3.5", "vite": "^2.6.14", - "xxhashjs": "^0.2.2" + "xxhashjs": "^0.2.2", + "bs58": "^4.0.1" }, "dependencies": { "@matrix-org/olm": "https://gitlab.matrix.org/api/v4/projects/27/packages/npm/@matrix-org/olm/-/@matrix-org/olm-3.2.3.tgz", "another-json": "^0.2.0", "base64-arraybuffer": "^0.2.0", - "bs58": "^4.0.1", "dompurify": "^2.3.0" } } From d7290bf750a5c136b56c159c33fa2fd972aa6acb Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Wed, 12 Jan 2022 17:14:52 +0100 Subject: [PATCH 08/15] remove exports field to try and prevent vite bug resolving asset url downside is that we can't export cjs version anymore --- scripts/sdk/base-manifest.json | 11 ++--------- scripts/sdk/create-manifest.js | 19 +++++++++++++++++-- 2 files changed, 19 insertions(+), 11 deletions(-) mode change 100755 => 100644 scripts/sdk/create-manifest.js diff --git a/scripts/sdk/base-manifest.json b/scripts/sdk/base-manifest.json index bc8919fb..666cc2b9 100644 --- a/scripts/sdk/base-manifest.json +++ b/scripts/sdk/base-manifest.json @@ -2,14 +2,7 @@ "name": "hydrogen-view-sdk", "description": "Embeddable matrix client library, including view components", "version": "0.0.2", - "main": "./hydrogen.cjs.js", - "exports": { - ".": { - "import": "./hydrogen.es.js", - "require": "./hydrogen.cjs.js" - }, - "./paths/vite": "./paths/vite.js", - "./style.css": "./style.css" - }, "types": "types/lib.d.ts" + "main": "./hydrogen.es.js", + "type": "module" } diff --git a/scripts/sdk/create-manifest.js b/scripts/sdk/create-manifest.js old mode 100755 new mode 100644 index 7a01de0a..cf2e360c --- a/scripts/sdk/create-manifest.js +++ b/scripts/sdk/create-manifest.js @@ -1,7 +1,22 @@ #!/usr/bin/env node const fs = require("fs"); -const appManifest = require("../../package.json") -const baseSDKManifest = require("./base-manifest.json") +const appManifest = require("../../package.json"); +const baseSDKManifest = require("./base-manifest.json"); +/* + need to leave exports out of base-manifest.json because of #vite-bug, + with the downside that we can't support environments that support + both esm and commonjs modules, so we pick just esm. + ``` + "exports": { + ".": { + "import": "./hydrogen.es.js", + "require": "./hydrogen.cjs.js" + }, + "./paths/vite": "./paths/vite.js", + "./style.css": "./style.css" + }, + ``` +*/ const mergeOptions = require('merge-options'); const manifestExtension = { From f526098293525f61d1cd419fe3f9a8cef57914a1 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Wed, 12 Jan 2022 17:41:00 +0100 Subject: [PATCH 09/15] also remove ts types, as we get errors for the untyped files that don't exist --- scripts/sdk/base-manifest.json | 1 - scripts/sdk/create-manifest.js | 7 +++++++ 2 files changed, 7 insertions(+), 1 deletion(-) mode change 100644 => 100755 scripts/sdk/create-manifest.js diff --git a/scripts/sdk/base-manifest.json b/scripts/sdk/base-manifest.json index 666cc2b9..fbfcc415 100644 --- a/scripts/sdk/base-manifest.json +++ b/scripts/sdk/base-manifest.json @@ -2,7 +2,6 @@ "name": "hydrogen-view-sdk", "description": "Embeddable matrix client library, including view components", "version": "0.0.2", - "types": "types/lib.d.ts" "main": "./hydrogen.es.js", "type": "module" } diff --git a/scripts/sdk/create-manifest.js b/scripts/sdk/create-manifest.js old mode 100644 new mode 100755 index cf2e360c..b420e679 --- a/scripts/sdk/create-manifest.js +++ b/scripts/sdk/create-manifest.js @@ -16,6 +16,13 @@ const baseSDKManifest = require("./base-manifest.json"); "./style.css": "./style.css" }, ``` + + Also need to leave typescript type definitions out until the + typescript conversion is complete and all imports in the d.ts files + exists. + ``` + "types": "types/lib.d.ts" + ``` */ const mergeOptions = require('merge-options'); From 3f60ef8da7c1c7eac61e79a574cac9c9786d89ff Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Wed, 12 Jan 2022 17:50:54 +0100 Subject: [PATCH 10/15] release sdk version 0.0.3 --- scripts/sdk/base-manifest.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/scripts/sdk/base-manifest.json b/scripts/sdk/base-manifest.json index fbfcc415..7c47312e 100644 --- a/scripts/sdk/base-manifest.json +++ b/scripts/sdk/base-manifest.json @@ -1,7 +1,7 @@ { "name": "hydrogen-view-sdk", "description": "Embeddable matrix client library, including view components", - "version": "0.0.2", + "version": "0.0.3", "main": "./hydrogen.es.js", "type": "module" } From 93eca757d383898580be7740f6a7a6ac25d06c1d Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Wed, 12 Jan 2022 18:31:55 +0100 Subject: [PATCH 11/15] dont add paths/vite to sdk output, as it does not work --- scripts/sdk/build.sh | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/scripts/sdk/build.sh b/scripts/sdk/build.sh index b19f2960..5534601e 100755 --- a/scripts/sdk/build.sh +++ b/scripts/sdk/build.sh @@ -5,7 +5,8 @@ yarn run vite build -c vite.sdk-lib-config.js yarn tsc -p tsconfig-declaration.json ./scripts/sdk/create-manifest.js ./target/package.json mkdir target/paths -./scripts/sdk/transform-paths.js ./src/platform/web/sdk/paths/vite.js ./target/paths/vite.js +# this doesn't work, the ?url imports need to be in the consuming project, so disable for now +# ./scripts/sdk/transform-paths.js ./src/platform/web/sdk/paths/vite.js ./target/paths/vite.js cp doc/SDK.md target/README.md pushd target pushd asset-build/assets From 8c1596d8694e74e8826f5fabec75ba2424dbdd8c Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Wed, 12 Jan 2022 18:32:15 +0100 Subject: [PATCH 12/15] update SDK docs to not use paths/vite anymore --- doc/SDK.md | 23 +++++++++++++++++++++-- 1 file changed, 21 insertions(+), 2 deletions(-) diff --git a/doc/SDK.md b/doc/SDK.md index d92b99c6..8ce0b304 100644 --- a/doc/SDK.md +++ b/doc/SDK.md @@ -33,7 +33,20 @@ import { RoomViewModel, TimelineView } from "hydrogen-view-sdk"; -import assetPaths from "hydrogen-view-sdk/paths/vite"; +import downloadSandboxPath from 'hydrogen-view-sdk/download-sandbox.html?url'; +import workerPath from 'hydrogen-view-sdk/main.js?url'; +import olmWasmPath from '@matrix-org/olm/olm.wasm?url'; +import olmJsPath from '@matrix-org/olm/olm.js?url'; +import olmLegacyJsPath from '@matrix-org/olm/olm_legacy.js?url'; +const assetPaths = { + downloadSandbox: downloadSandboxPath, + worker: workerPath, + olm: { + wasm: olmWasmPath, + legacyBundle: olmLegacyJsPath, + wasmBundle: olmJsPath + } +}; import "hydrogen-view-sdk/style.css"; async function main() { @@ -84,7 +97,13 @@ main(); ## Typescript support -There is partial typescript support while we are still in the process of converting the Hydrogen codebase to typesccript. +Typescript support is not yet available while we're converting the Hydrogen codebase to Typescript. +In your `src` directory, you'll need to add a `.d.ts` (can be called anything, e.g. `deps.d.ts`) +containing this snippet to make Typescript not complain that `hydrogen-view-sdk` doesn't have types: + +```ts +declare module "hydrogen-view-sdk"; +``` ## API Stability From 1ed8d48ced53c44eb61cd2c1eb62962ba33bf301 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Wed, 12 Jan 2022 18:39:13 +0100 Subject: [PATCH 13/15] release SDK 0.0.4 --- scripts/sdk/base-manifest.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/scripts/sdk/base-manifest.json b/scripts/sdk/base-manifest.json index 7c47312e..d3e21d7b 100644 --- a/scripts/sdk/base-manifest.json +++ b/scripts/sdk/base-manifest.json @@ -1,7 +1,7 @@ { "name": "hydrogen-view-sdk", "description": "Embeddable matrix client library, including view components", - "version": "0.0.3", + "version": "0.0.4", "main": "./hydrogen.es.js", "type": "module" } From 1f9be978b72cc149f2548b5c5ffd8eb72fed7f90 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Fri, 14 Jan 2022 13:57:11 +0100 Subject: [PATCH 14/15] load image in timeline from when it is partially visible --- .../session/room/timeline/tiles/BaseMediaTile.js | 16 +++++++++++++--- .../web/ui/session/room/timeline/ImageView.js | 1 - 2 files changed, 13 insertions(+), 4 deletions(-) diff --git a/src/domain/session/room/timeline/tiles/BaseMediaTile.js b/src/domain/session/room/timeline/tiles/BaseMediaTile.js index e5e62107..a927d766 100644 --- a/src/domain/session/room/timeline/tiles/BaseMediaTile.js +++ b/src/domain/session/room/timeline/tiles/BaseMediaTile.js @@ -25,10 +25,8 @@ export class BaseMediaTile extends BaseMessageTile { super(options); this._decryptedThumbnail = null; this._decryptedFile = null; + this._isVisible = false; this._error = null; - if (!this.isPending) { - this._tryLoadEncryptedThumbnail(); - } } get isUploading() { @@ -60,6 +58,9 @@ export class BaseMediaTile extends BaseMessageTile { } get thumbnailUrl() { + if (!this._isVisible) { + return ""; + } if (this._decryptedThumbnail) { return this._decryptedThumbnail.url; } else { @@ -85,6 +86,15 @@ export class BaseMediaTile extends BaseMessageTile { return ""; } + notifyVisible() { + super.notifyVisible(); + this._isVisible = true; + this.emitChange("thumbnailUrl"); + if (!this.isPending) { + this._tryLoadEncryptedThumbnail(); + } + } + get width() { const info = this._getContent()?.info; return Math.round(info?.w * this._scaleFactor()); diff --git a/src/platform/web/ui/session/room/timeline/ImageView.js b/src/platform/web/ui/session/room/timeline/ImageView.js index f4c1ecf7..1668b09c 100644 --- a/src/platform/web/ui/session/room/timeline/ImageView.js +++ b/src/platform/web/ui/session/room/timeline/ImageView.js @@ -19,7 +19,6 @@ import {BaseMediaView} from "./BaseMediaView.js"; export class ImageView extends BaseMediaView { renderMedia(t, vm) { const img = t.img({ - loading: "lazy", src: vm => vm.thumbnailUrl, alt: vm => vm.label, title: vm => vm.label, From 18a76025c7d0096ac9775373e6ba096ec64d1994 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Fri, 14 Jan 2022 15:27:46 +0100 Subject: [PATCH 15/15] add location tile view so we don't throw when a location is shared --- .../room/timeline/tiles/LocationTile.js | 44 ++++++++++++++----- .../web/ui/css/themes/element/timeline.css | 12 +++++ .../web/ui/session/room/TimelineView.ts | 2 + .../ui/session/room/timeline/LocationView.js | 27 ++++++++++++ 4 files changed, 74 insertions(+), 11 deletions(-) create mode 100644 src/platform/web/ui/session/room/timeline/LocationView.js diff --git a/src/domain/session/room/timeline/tiles/LocationTile.js b/src/domain/session/room/timeline/tiles/LocationTile.js index fddc4501..e5f7e1a3 100644 --- a/src/domain/session/room/timeline/tiles/LocationTile.js +++ b/src/domain/session/room/timeline/tiles/LocationTile.js @@ -16,21 +16,43 @@ limitations under the License. import {BaseMessageTile} from "./BaseMessageTile.js"; -/* -map urls: -apple: https://developer.apple.com/library/archive/featuredarticles/iPhoneURLScheme_Reference/MapLinks/MapLinks.html -android: https://developers.google.com/maps/documentation/urls/guide -wp: maps:49.275267 -122.988617 -https://www.habaneroconsulting.com/stories/insights/2011/opening-native-map-apps-from-the-mobile-browser -*/ export class LocationTile extends BaseMessageTile { + get shape() { + return "location"; + } + get mapsLink() { - const geoUri = this._getContent().geo_uri; - const [lat, long] = geoUri.split(":")[1].split(","); - return `maps:${lat} ${long}`; + try { + const url = new URL(this._getContent().geo_uri); + if (url.protocol !== "geo:") { + return ""; + } + const [locationStr, ...namedParams] = url.pathname.split(";"); + const [latStr, longStr] = locationStr.split(","); + const lat = parseFloat(latStr); + const long = parseFloat(longStr); + let uncertainty; + for (const namedParam of namedParams) { + const [name, value] = namedParam.split("="); + if (name === "u") { + uncertainty = parseFloat(value); + } + } + if (this.platform.isIOS) { + return `http://maps.apple.com/?ll=${lat},${long}`; + } else { + let uri = `geo:${lat},${long}`; + if (uncertainty) { + uri = uri + `;u=${uncertainty}`; + } + return uri; + } + } catch { + return ""; + } } get label() { - return `${this.sender} sent their location, click to see it in maps.`; + return this.i18n`${this.displayName} sent their location`; } } diff --git a/src/platform/web/ui/css/themes/element/timeline.css b/src/platform/web/ui/css/themes/element/timeline.css index 6558c003..21ec660f 100644 --- a/src/platform/web/ui/css/themes/element/timeline.css +++ b/src/platform/web/ui/css/themes/element/timeline.css @@ -363,6 +363,18 @@ only loads when the top comes into view*/ animation-timing-function: linear; } +.Timeline_locationLink { + padding: 0px 8px; + border-radius: 16px; + border: 1px solid #e9edf1; + background-color: #f3f8fd; + text-decoration: none; + display: inline-block; + line-height: 2rem; + vertical-align: top; + margin: 1px 4px; +} + .AnnouncementView { margin: 5px 0; padding: 5px 10%; diff --git a/src/platform/web/ui/session/room/TimelineView.ts b/src/platform/web/ui/session/room/TimelineView.ts index da3dc537..62b7656a 100644 --- a/src/platform/web/ui/session/room/TimelineView.ts +++ b/src/platform/web/ui/session/room/TimelineView.ts @@ -22,6 +22,7 @@ import {TextMessageView} from "./timeline/TextMessageView.js"; import {ImageView} from "./timeline/ImageView.js"; import {VideoView} from "./timeline/VideoView.js"; import {FileView} from "./timeline/FileView.js"; +import {LocationView} from "./timeline/LocationView.js"; import {MissingAttachmentView} from "./timeline/MissingAttachmentView.js"; import {AnnouncementView} from "./timeline/AnnouncementView.js"; import {RedactedView} from "./timeline/RedactedView.js"; @@ -49,6 +50,7 @@ export function viewClassForEntry(entry: SimpleTile): TileViewConstructor | unde case "image": return ImageView; case "video": return VideoView; case "file": return FileView; + case "location": return LocationView; case "missing-attachment": return MissingAttachmentView; case "redacted": return RedactedView; diff --git a/src/platform/web/ui/session/room/timeline/LocationView.js b/src/platform/web/ui/session/room/timeline/LocationView.js new file mode 100644 index 00000000..62073782 --- /dev/null +++ b/src/platform/web/ui/session/room/timeline/LocationView.js @@ -0,0 +1,27 @@ +/* +Copyright 2020 Bruno Windels + +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 {BaseMessageView} from "./BaseMessageView.js"; + +export class LocationView extends BaseMessageView { + renderMessageBody(t, vm) { + return t.p({className: "Timeline_messageBody statusMessage"}, [ + t.span(vm.label), + t.a({className: "Timeline_locationLink", href: vm.mapsLink, target: "_blank", rel: "noopener"}, vm.i18n`Click to open in maps`), + t.time(vm.date + " " + vm.time) + ]); + } +}