Skip to content

C
converse.js
Commit c9f29f76 authored by JC Brand's avatar JC Brand
Browse files
Options

Use lit-html to render URLs

parent 366dee0a
Hide whitespace changes
Inline Side-by-side
Showing with 37 additions and 37 deletions
spec/http-file-upload.js
View file @ c9f29f76
......@@ -324,10 +324,8 @@
await u.waitUntil(() => view.el.querySelector('.chat-image'), 1000);
// Check that the image renders
expect(view.el.querySelector('.chat-msg .chat-msg__media').innerHTML.trim()).toEqual(
`<!-- src/templates/image.html -->\n`+
`<a href="${base_url}/logo/conversejs-filled.svg" target="_blank" rel="noopener">`+
`<img class="chat-image img-thumbnail" src="${base_url}/logo/conversejs-filled.svg">`+
`</a>`);
`<!----><a target="_blank" rel="noopener" href="${base_url}/logo/conversejs-filled.svg">`+
`<img class="chat-image img-thumbnail" src="${base_url}/logo/conversejs-filled.svg"></a><!---->`);
XMLHttpRequest.prototype.send = send_backup;
done();
}));
......@@ -430,10 +428,9 @@
await u.waitUntil(() => view.el.querySelector('.chat-image'), 1000);
// Check that the image renders
expect(view.el.querySelector('.chat-msg .chat-msg__media').innerHTML.trim()).toEqual(
`<!-- src/templates/image.html -->\n`+
`<a href="${base_url}/logo/conversejs-filled.svg" target="_blank" rel="noopener">`+
`<img class="chat-image img-thumbnail" src="${base_url}/logo/conversejs-filled.svg">`+
`</a>`);
`<!----><a target="_blank" rel="noopener" href="${base_url}/logo/conversejs-filled.svg">`+
`<img class="chat-image img-thumbnail" src="${base_url}/logo/conversejs-filled.svg"></a><!---->`);
XMLHttpRequest.prototype.send = send_backup;
done();
}));
......
spec/messages.js
View file @ c9f29f76
......@@ -1920,9 +1920,8 @@
expect(msg.textContent).toEqual('Have you heard this funny audio?');
let media = view.el.querySelector('.chat-msg .chat-msg__media');
expect(media.innerHTML.replace(/(\r\n|\n|\r)/gm, "")).toEqual(
'<!-- src/templates/audio.html -->'+
'<audio controls="" src="https://montague.lit/audio.mp3"></audio>'+
'<a target="_blank" rel="noopener" href="https://montague.lit/audio.mp3">Download audio file "audio.mp3"</a>');
`<!----> <audio controls="" src="https://montague.lit/audio.mp3"></audio> `+
`<a target="_blank" rel="noopener" href="https://montague.lit/audio.mp3"><!---->Download audio file "audio.mp3"<!----></a><!---->`);
// If the <url> and <body> contents is the same, don't duplicate.
stanza = u.toStanza(`
......@@ -1938,10 +1937,9 @@
expect(msg.innerHTML).toEqual('<!-- message gets added here via renderMessage -->'); // Emtpy
media = view.el.querySelector('.chat-msg:last-child .chat-msg__media');
expect(media.innerHTML.replace(/(\r\n|\n|\r)/gm, "")).toEqual(
'<!-- src/templates/audio.html -->'+
'<audio controls="" src="https://montague.lit/audio.mp3"></audio>'+
'<a target="_blank" rel="noopener" href="https://montague.lit/audio.mp3">Download audio file "audio.mp3"</a>'
);
`<!----> <audio controls="" src="https://montague.lit/audio.mp3"></audio> `+
`<a target="_blank" rel="noopener" href="https://montague.lit/audio.mp3">`+
`<!---->Download audio file "audio.mp3"<!----></a><!---->`);
done();
}));
......@@ -1970,8 +1968,8 @@
expect(msg.textContent).toEqual('Have you seen this funny video?');
let media = view.el.querySelector('.chat-msg .chat-msg__media');
expect(media.innerHTML.replace(/(\r\n|\n|\r)/gm, "")).toEqual(
'<!-- src/templates/video.html -->'+
'<video controls="" preload="metadata" src="https://montague.lit/video.mp4" style="max-height: 50vh"></video>');
`<!----><video controls="" preload="metadata" style="max-height: 50vh" src="https://montague.lit/video.mp4"></video><!---->`);
// If the <url> and <body> contents is the same, don't duplicate.
stanza = u.toStanza(`
......@@ -1987,8 +1985,7 @@
expect(msg.innerHTML).toEqual('<!-- message gets added here via renderMessage -->'); // Emtpy
media = view.el.querySelector('.chat-msg:last-child .chat-msg__media');
expect(media.innerHTML.replace(/(\r\n|\n|\r)/gm, "")).toEqual(
'<!-- src/templates/video.html -->'+
'<video controls="" preload="metadata" src="https://montague.lit/video.mp4" style="max-height: 50vh"></video>');
`<!----><video controls="" preload="metadata" style="max-height: 50vh" src="https://montague.lit/video.mp4"></video><!---->`);
done();
}));
......@@ -2017,8 +2014,7 @@
expect(msg.textContent).toEqual('Have you downloaded this funny file?');
const media = view.el.querySelector('.chat-msg .chat-msg__media');
expect(media.innerHTML.replace(/(\r\n|\n|\r)/gm, "")).toEqual(
'<!-- src/templates/file.html -->'+
'<a target="_blank" rel="noopener" href="https://montague.lit/funny.pdf">Download file "funny.pdf"</a>');
`<!----><a target="_blank" rel="noopener" href="https://montague.lit/funny.pdf"><!---->Download file "funny.pdf"<!----></a><!---->`);
done();
}));
......@@ -2050,10 +2046,8 @@
expect(msg.textContent).toEqual('Have you seen this funny image?');
const media = view.el.querySelector('.chat-msg .chat-msg__media');
expect(media.innerHTML.replace(/(\r\n|\n|\r)/gm, "")).toEqual(
`<!-- src/templates/image.html -->`+
`<a href="${base_url}/logo/conversejs-filled.svg" target="_blank" rel="noopener">`+
`<img class="chat-image img-thumbnail" src="${base_url}/logo/conversejs-filled.svg">`+
`</a>`);
`<!----><a target="_blank" rel="noopener" href="${base_url}/logo/conversejs-filled.svg">`+
`<img class="chat-image img-thumbnail" src="${base_url}/logo/conversejs-filled.svg"></a><!---->`);
done();
}));
});
......
src/converse-message-view.js
View file @ c9f29f76
......@@ -262,9 +262,7 @@ converse.plugins.add('converse-message-view', {
));
const url = this.model.get('oob_url');
if (url) {
msg.querySelector('.chat-msg__media').innerHTML = this.transformOOBURL(url);
}
url && render(this.transformOOBURL(url), msg.querySelector('.chat-msg__media'));
if (!is_retracted) {
const text = this.model.getMessageText();
......
src/templates/audio.html deleted 100644 → 0
View file @ 366dee0a
<audio controls src="{{{o.url}}}"></audio>
<a target="_blank" rel="noopener" href="{{{o.url}}}">{{{o.label_download}}}</a>
src/templates/audio.js 0 → 100644
View file @ c9f29f76
import { html } from "lit-html";
export default (o) => html`
<audio controls src="${o.url}"></audio>
<a target="_blank" rel="noopener" href="${o.url}">${o.label_download}</a>
`;
src/templates/file.html deleted 100644 → 0
View file @ 366dee0a
<a target="_blank" rel="noopener" href="{{{o.url}}}">{{{o.label_download}}}</a>
src/templates/file.js 0 → 100644
View file @ c9f29f76
import { html } from "lit-html";
export default (o) => html`<a target="_blank" rel="noopener" href="${o.url}">${o.label_download}</a>`;
src/templates/image.html deleted 100644 → 0
View file @ 366dee0a
<a href="{{{o.url}}}" target="_blank" rel="noopener"><img class="chat-image img-thumbnail" src="{{{o.url}}}"/></a>
src/templates/image.js 0 → 100644
View file @ c9f29f76
import { html } from "lit-html";
export default (o) => html`<a href="${o.url}" target="_blank" rel="noopener"><img class="chat-image img-thumbnail" src="${o.url}"/></a>`;
src/templates/video.html deleted 100644 → 0
View file @ 366dee0a
<video controls preload="metadata" src="{{{o.url}}}" style="max-height: 50vh"></video>
src/templates/video.js 0 → 100644
View file @ c9f29f76
import { html } from "lit-html";
export default (o) => html`<video controls preload="metadata" src="${o.url}" style="max-height: 50vh"></video>`;
src/utils/html.js
View file @ c9f29f76
......@@ -7,8 +7,8 @@ import URI from "urijs";
import _ from "../headless/lodash.noconflict";
import log from '@converse/headless/log';
import sizzle from "sizzle";
import tpl_audio from "../templates/audio.html";
import tpl_file from "../templates/file.html";
import tpl_audio from "../templates/audio.js";
import tpl_file from "../templates/file.js";
import tpl_form_captcha from "../templates/form_captcha.html";
import tpl_form_checkbox from "../templates/form_checkbox.html";
import tpl_form_input from "../templates/form_input.html";
......@@ -16,9 +16,9 @@ import tpl_form_select from "../templates/form_select.html";
import tpl_form_textarea from "../templates/form_textarea.html";
import tpl_form_url from "../templates/form_url.html";
import tpl_form_username from "../templates/form_username.html";
import tpl_image from "../templates/image.html";
import tpl_image from "../templates/image.js";
import tpl_select_option from "../templates/select_option.html";
import tpl_video from "../templates/video.html";
import tpl_video from "../templates/video.js";
import u from "../headless/utils/core";
const URL_REGEX = /\b(https?\:\/\/|www\.|https?:\/\/www\.)[^\s<>]{2,200}\b\/?/g;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7