forked from mystiq/hydrogen-web
move mxcUrl functions to media repo class
This commit is contained in:
parent
843f4fa0f7
commit
5d0ee21267
5 changed files with 40 additions and 38 deletions
|
@ -20,15 +20,10 @@ const MAX_HEIGHT = 300;
|
|||
const MAX_WIDTH = 400;
|
||||
|
||||
export class ImageTile extends MessageTile {
|
||||
constructor(options, room) {
|
||||
super(options);
|
||||
this._room = room;
|
||||
}
|
||||
|
||||
get thumbnailUrl() {
|
||||
const mxcUrl = this._getContent()?.url;
|
||||
if (typeof mxcUrl === "string") {
|
||||
return this._room.mxcUrlThumbnail(mxcUrl, this.thumbnailWidth, this.thumbnailHeight, "scale");
|
||||
return this._mediaRepository.mxcUrlThumbnail(mxcUrl, this.thumbnailWidth, this.thumbnailHeight, "scale");
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
@ -36,7 +31,7 @@ export class ImageTile extends MessageTile {
|
|||
get url() {
|
||||
const mxcUrl = this._getContent()?.url;
|
||||
if (typeof mxcUrl === "string") {
|
||||
return this._room.mxcUrl(mxcUrl);
|
||||
return this._mediaRepository.mxcUrl(mxcUrl);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
|
|
@ -20,6 +20,7 @@ import {getIdentifierColorNumber} from "../../../../avatar.js";
|
|||
export class MessageTile extends SimpleTile {
|
||||
constructor(options) {
|
||||
super(options);
|
||||
this._mediaRepository = options.mediaRepository;
|
||||
this._clock = options.clock;
|
||||
this._isOwn = this._entry.sender === options.ownUserId;
|
||||
this._date = this._entry.timestamp ? new Date(this._entry.timestamp) : null;
|
||||
|
|
|
@ -24,7 +24,8 @@ import {EncryptedEventTile} from "./tiles/EncryptedEventTile.js";
|
|||
|
||||
export function tilesCreator({room, ownUserId, clock}) {
|
||||
return function tilesCreator(entry, emitUpdate) {
|
||||
const options = {entry, emitUpdate, ownUserId, clock};
|
||||
const options = {entry, emitUpdate, ownUserId, clock,
|
||||
mediaRepository: room.mediaRepository};
|
||||
if (entry.isGap) {
|
||||
return new GapTile(options, room);
|
||||
} else if (entry.eventType) {
|
||||
|
@ -38,7 +39,7 @@ export function tilesCreator({room, ownUserId, clock}) {
|
|||
case "m.emote":
|
||||
return new TextTile(options);
|
||||
case "m.image":
|
||||
return new ImageTile(options, room);
|
||||
return new ImageTile(options);
|
||||
case "m.location":
|
||||
return new LocationTile(options);
|
||||
default:
|
||||
|
|
|
@ -45,6 +45,18 @@ class RequestWrapper {
|
|||
}
|
||||
}
|
||||
|
||||
function encodeQueryParams(queryParams) {
|
||||
return Object.entries(queryParams || {})
|
||||
.filter(([, value]) => value !== undefined)
|
||||
.map(([name, value]) => {
|
||||
if (typeof value === "object") {
|
||||
value = JSON.stringify(value);
|
||||
}
|
||||
return `${encodeURIComponent(name)}=${encodeURIComponent(value)}`;
|
||||
})
|
||||
.join("&");
|
||||
}
|
||||
|
||||
export class HomeServerApi {
|
||||
constructor({homeServer, accessToken, request, createTimeout, reconnector}) {
|
||||
// store these both in a closure somehow so it's harder to get at in case of XSS?
|
||||
|
@ -54,26 +66,15 @@ export class HomeServerApi {
|
|||
this._requestFn = request;
|
||||
this._createTimeout = createTimeout;
|
||||
this._reconnector = reconnector;
|
||||
this._mediaRepository = new MediaRepository(homeServer);
|
||||
}
|
||||
|
||||
_url(csPath) {
|
||||
return `${this._homeserver}/_matrix/client/r0${csPath}`;
|
||||
}
|
||||
|
||||
_encodeQueryParams(queryParams) {
|
||||
return Object.entries(queryParams || {})
|
||||
.filter(([, value]) => value !== undefined)
|
||||
.map(([name, value]) => {
|
||||
if (typeof value === "object") {
|
||||
value = JSON.stringify(value);
|
||||
}
|
||||
return `${encodeURIComponent(name)}=${encodeURIComponent(value)}`;
|
||||
})
|
||||
.join("&");
|
||||
}
|
||||
|
||||
_request(method, url, queryParams, body, options) {
|
||||
const queryString = this._encodeQueryParams(queryParams);
|
||||
const queryString = encodeQueryParams(queryParams);
|
||||
url = `${url}?${queryString}`;
|
||||
let bodyString;
|
||||
const headers = new Map();
|
||||
|
@ -154,13 +155,14 @@ export class HomeServerApi {
|
|||
return this._request("GET", `${this._homeserver}/_matrix/client/versions`, null, null, options);
|
||||
}
|
||||
|
||||
_parseMxcUrl(url) {
|
||||
const prefix = "mxc://";
|
||||
if (url.startsWith(prefix)) {
|
||||
return url.substr(prefix.length).split("/", 2);
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
get mediaRepository() {
|
||||
return this._mediaRepository;
|
||||
}
|
||||
}
|
||||
|
||||
class MediaRepository {
|
||||
constructor(homeserver) {
|
||||
this._homeserver = homeserver;
|
||||
}
|
||||
|
||||
mxcUrlThumbnail(url, width, height, method) {
|
||||
|
@ -168,7 +170,7 @@ export class HomeServerApi {
|
|||
if (parts) {
|
||||
const [serverName, mediaId] = parts;
|
||||
const httpUrl = `${this._homeserver}/_matrix/media/r0/thumbnail/${encodeURIComponent(serverName)}/${encodeURIComponent(mediaId)}`;
|
||||
return httpUrl + "?" + this._encodeQueryParams({width, height, method});
|
||||
return httpUrl + "?" + encodeQueryParams({width, height, method});
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
@ -182,6 +184,15 @@ export class HomeServerApi {
|
|||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
_parseMxcUrl(url) {
|
||||
const prefix = "mxc://";
|
||||
if (url.startsWith(prefix)) {
|
||||
return url.substr(prefix.length).split("/", 2);
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export function tests() {
|
||||
|
|
|
@ -201,14 +201,8 @@ export class Room extends EventEmitter {
|
|||
return this._timeline;
|
||||
}
|
||||
|
||||
/** @public */
|
||||
mxcUrlThumbnail(url, width, height, method) {
|
||||
return this._hsApi.mxcUrlThumbnail(url, width, height, method);
|
||||
}
|
||||
|
||||
/** @public */
|
||||
mxcUrl(url) {
|
||||
return this._hsApi.mxcUrl(url);
|
||||
get mediaRepository() {
|
||||
return this._hsApi.mediaRepository;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue