Support audio file previews

This commit is contained in:
Max Leiter 2017-12-06 14:27:35 -08:00
parent f9be519c2f
commit ad1114ccfe
4 changed files with 40 additions and 10 deletions

View File

@ -1235,6 +1235,11 @@ kbd {
display: inline-flex !important;
}
#chat audio {
width: 600px;
max-width: 100%;
}
/* Do not display an empty div when there are no previews. Useful for example in
part/quit messages where we don't load previews (adds a blank line otherwise) */
#chat .preview:empty {

View File

@ -23,7 +23,7 @@ const options = {
showSeconds: false,
statusMessages: "condensed",
theme: $("#theme").attr("href").replace(/^themes\/(.*).css$/, "$1"), // Extracts default theme name, set on the server configuration
thumbnails: true,
media: true,
userStyles: userStyles.text(),
};
let userOptions = JSON.parse(storage.get("settings")) || {};
@ -44,7 +44,7 @@ userOptions = null;
module.exports = options;
module.exports.shouldOpenMessagePreview = function(type) {
return (options.links && type === "link") || (options.thumbnails && type === "image");
return (options.links && type === "link") || (options.media && (type === "image" || type === "audio"));
};
module.exports.initialize = () => {

View File

@ -5,15 +5,22 @@
<img src="{{thumb}}">
</a>
{{else}}
{{#if thumb}}
<a class="toggle-thumbnail" href="{{link}}" target="_blank" rel="noopener">
<img src="{{thumb}}" class="thumb">
{{#equal type "audio"}}
<audio controls preload="metadata">
<source src="{{link}}" type="{{res}}">
Your browser does not support the audio element.
</audio>
{{else}}
{{#if thumb}}
<a class="toggle-thumbnail" href="{{link}}" target="_blank" rel="noopener">
<img src="{{thumb}}" class="thumb">
</a>
{{/if}}
<a class="toggle-text" href="{{link}}" target="_blank" rel="noopener">
<div class="head" title="{{head}}">{{head}}</div>
<div class="body" title="{{body}}">{{body}}</div>
</a>
{{/if}}
<a class="toggle-text" href="{{link}}" target="_blank" rel="noopener">
<div class="head" title="{{head}}">{{head}}</div>
<div class="body" title="{{body}}">{{body}}</div>
</a>
{{/equal}}
{{/equal}}
</div>
{{/preview}}

View File

@ -106,6 +106,22 @@ function parse(msg, preview, res, client) {
break;
case "audio/midi":
case "audio/mpeg":
case "audio/mpeg3":
case "audio/ogg":
case "audio/wav":
case "audio/x-mid":
case "audio/x-midi":
case "audio/x-mpeg":
case "audio/x-mpeg-3":
if (!preview.link.startsWith("https://")) {
break;
}
preview.type = "audio";
preview.res = res.type;
break;
default:
return;
}
@ -170,6 +186,8 @@ function fetch(uri, cb) {
if (contentLength > limit) {
req.abort();
}
} else if (/^audio\/.+/.test(res.headers["content-type"])) {
req.abort(); // ensure server doesn't download the audio file
} else {
// if not image, limit download to 50kb, since we need only meta tags
// twitter.com sends opengraph meta tags within ~20kb of data for individual tweets