FIX: Preload metadata for audio/video when secure media enabled
Fixes an issue with missing video previews. Should have no side effects now that presigned URLs expire after 5 minutes.
This commit is contained in:
parent
9e160f58ab
commit
36bad0c31f
|
@ -144,23 +144,21 @@ export function extractDataAttribute(str) {
|
||||||
function videoHTML(token, opts) {
|
function videoHTML(token, opts) {
|
||||||
const src = token.attrGet("src");
|
const src = token.attrGet("src");
|
||||||
const origSrc = token.attrGet("data-orig-src");
|
const origSrc = token.attrGet("data-orig-src");
|
||||||
const preloadType = opts.secureMedia ? "none" : "metadata";
|
|
||||||
const dataOrigSrcAttr = origSrc !== null ? `data-orig-src="${origSrc}"` : "";
|
const dataOrigSrcAttr = origSrc !== null ? `data-orig-src="${origSrc}"` : "";
|
||||||
return `<div class="video-container">
|
return `<div class="video-container">
|
||||||
<p class="video-description">${opts.alt}</p>
|
<p class="video-description">${opts.alt}</p>
|
||||||
<video width="100%" height="100%" preload="${preloadType}" controls>
|
<video width="100%" height="100%" preload="metadata" controls>
|
||||||
<source src="${src}" ${dataOrigSrcAttr}>
|
<source src="${src}" ${dataOrigSrcAttr}>
|
||||||
<a href="${src}">${src}</a>
|
<a href="${src}">${src}</a>
|
||||||
</video>
|
</video>
|
||||||
</div>`;
|
</div>`;
|
||||||
}
|
}
|
||||||
|
|
||||||
function audioHTML(token, opts) {
|
function audioHTML(token) {
|
||||||
const src = token.attrGet("src");
|
const src = token.attrGet("src");
|
||||||
const origSrc = token.attrGet("data-orig-src");
|
const origSrc = token.attrGet("data-orig-src");
|
||||||
const preloadType = opts.secureMedia ? "none" : "metadata";
|
|
||||||
const dataOrigSrcAttr = origSrc !== null ? `data-orig-src="${origSrc}"` : "";
|
const dataOrigSrcAttr = origSrc !== null ? `data-orig-src="${origSrc}"` : "";
|
||||||
return `<audio preload="${preloadType}" controls>
|
return `<audio preload="metadata" controls>
|
||||||
<source src="${src}" ${dataOrigSrcAttr}>
|
<source src="${src}" ${dataOrigSrcAttr}>
|
||||||
<a href="${src}">${src}</a>
|
<a href="${src}">${src}</a>
|
||||||
</audio>`;
|
</audio>`;
|
||||||
|
@ -177,13 +175,12 @@ function renderImageOrPlayableMedia(tokens, idx, options, env, slf) {
|
||||||
// see https://github.com/markdown-it/markdown-it/blob/master/docs/architecture.md#renderer
|
// see https://github.com/markdown-it/markdown-it/blob/master/docs/architecture.md#renderer
|
||||||
// handles |video and |audio alt transformations for image tags
|
// handles |video and |audio alt transformations for image tags
|
||||||
const mediaOpts = {
|
const mediaOpts = {
|
||||||
secureMedia: options.discourse.limitedSiteSettings.secureMedia,
|
|
||||||
alt: split[0]
|
alt: split[0]
|
||||||
};
|
};
|
||||||
if (split[1] === "video") {
|
if (split[1] === "video") {
|
||||||
return videoHTML(token, mediaOpts);
|
return videoHTML(token, mediaOpts);
|
||||||
} else if (split[1] === "audio") {
|
} else if (split[1] === "audio") {
|
||||||
return audioHTML(token, mediaOpts);
|
return audioHTML(token);
|
||||||
}
|
}
|
||||||
|
|
||||||
// parsing ![myimage|500x300]() or ![myimage|75%]() or ![myimage|500x300, 75%]
|
// parsing ![myimage|500x300]() or ![myimage|75%]() or ![myimage|500x300, 75%]
|
||||||
|
@ -342,10 +339,6 @@ export function setup(opts, siteSettings, state) {
|
||||||
opts.discourse = copy;
|
opts.discourse = copy;
|
||||||
getOptions.f = () => opts.discourse;
|
getOptions.f = () => opts.discourse;
|
||||||
|
|
||||||
opts.discourse.limitedSiteSettings = {
|
|
||||||
secureMedia: siteSettings.secure_media
|
|
||||||
};
|
|
||||||
|
|
||||||
opts.engine = window.markdownit({
|
opts.engine = window.markdownit({
|
||||||
discourse: opts.discourse,
|
discourse: opts.discourse,
|
||||||
html: true,
|
html: true,
|
||||||
|
|
|
@ -1025,33 +1025,6 @@ QUnit.test("attachment - mapped url - secure media enabled", assert => {
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
QUnit.test("video - secure media enabled", assert => {
|
|
||||||
assert.cookedOptions(
|
|
||||||
"![baby shark|video](upload://eyPnj7UzkU0AkGkx2dx8G4YM1Jx.mp4)",
|
|
||||||
{ siteSettings: { secure_media: true } },
|
|
||||||
`<p><div class="video-container">
|
|
||||||
<p class="video-description">baby shark</p>
|
|
||||||
<video width="100%" height="100%" preload="none" controls>
|
|
||||||
<source src="/404" data-orig-src="upload://eyPnj7UzkU0AkGkx2dx8G4YM1Jx.mp4">
|
|
||||||
<a href="/404">/404</a>
|
|
||||||
</video>
|
|
||||||
</div></p>`,
|
|
||||||
"It returns the correct video player HTML"
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
QUnit.test("audio - secure media enabled", assert => {
|
|
||||||
assert.cookedOptions(
|
|
||||||
"![young americans|audio](upload://eyPnj7UzkU0AkGkx2dx8G4YM1Jx.mp3)",
|
|
||||||
{ siteSettings: { secure_media: true } },
|
|
||||||
`<p><audio preload="none" controls>
|
|
||||||
<source src="/404" data-orig-src="upload://eyPnj7UzkU0AkGkx2dx8G4YM1Jx.mp3">
|
|
||||||
<a href="/404">/404</a>
|
|
||||||
</audio></p>`,
|
|
||||||
"It returns the correct audio player HTML"
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
QUnit.test("video", assert => {
|
QUnit.test("video", assert => {
|
||||||
assert.cooked(
|
assert.cooked(
|
||||||
"![baby shark|video](upload://eyPnj7UzkU0AkGkx2dx8G4YM1Jx.mp4)",
|
"![baby shark|video](upload://eyPnj7UzkU0AkGkx2dx8G4YM1Jx.mp4)",
|
||||||
|
@ -1084,7 +1057,7 @@ QUnit.test("video - mapped url - secure media enabled", assert => {
|
||||||
},
|
},
|
||||||
`<p><div class="video-container">
|
`<p><div class="video-container">
|
||||||
<p class="video-description">baby shark</p>
|
<p class="video-description">baby shark</p>
|
||||||
<video width="100%" height="100%" preload="none" controls>
|
<video width="100%" height="100%" preload="metadata" controls>
|
||||||
<source src="/secure-media-uploads/original/3X/c/b/test.mp4">
|
<source src="/secure-media-uploads/original/3X/c/b/test.mp4">
|
||||||
<a href="/secure-media-uploads/original/3X/c/b/test.mp4">/secure-media-uploads/original/3X/c/b/test.mp4</a>
|
<a href="/secure-media-uploads/original/3X/c/b/test.mp4">/secure-media-uploads/original/3X/c/b/test.mp4</a>
|
||||||
</video>
|
</video>
|
||||||
|
@ -1120,7 +1093,7 @@ QUnit.test("audio - mapped url - secure media enabled", assert => {
|
||||||
siteSettings: { secure_media: true },
|
siteSettings: { secure_media: true },
|
||||||
lookupUploadUrls: lookupUploadUrls
|
lookupUploadUrls: lookupUploadUrls
|
||||||
},
|
},
|
||||||
`<p><audio preload="none" controls>
|
`<p><audio preload="metadata" controls>
|
||||||
<source src="/secure-media-uploads/original/3X/c/b/test.mp3">
|
<source src="/secure-media-uploads/original/3X/c/b/test.mp3">
|
||||||
<a href="/secure-media-uploads/original/3X/c/b/test.mp3">/secure-media-uploads/original/3X/c/b/test.mp3</a>
|
<a href="/secure-media-uploads/original/3X/c/b/test.mp3">/secure-media-uploads/original/3X/c/b/test.mp3</a>
|
||||||
</audio></p>`,
|
</audio></p>`,
|
||||||
|
|
Loading…
Reference in New Issue