Use preview instead of thumbnail for oembed

5 files changed, 26 insertions, 16 deletions

diff --git a/server/controllers/services.ts b/server/controllers/services.ts
index 3ce6bd526..4bbe56a8a 100644
--- a/server/controllers/services.ts
+++ b/server/controllers/services.ts
@@ -1,6 +1,6 @@
 import * as express from 'express'
 
-import { CONFIG, THUMBNAILS_SIZE } from '../initializers'
+import { CONFIG, PREVIEWS_SIZE, EMBED_SIZE } from '../initializers'
 import { oembedValidator } from '../middlewares'
 import { VideoInstance } from '../models'
 
@@ -23,17 +23,17 @@ function generateOEmbed (req: express.Request, res: express.Response, next: expr
   const maxWidth = parseInt(req.query.maxwidth, 10)
 
   const embedUrl = webserverUrl + video.getEmbedPath()
-  let thumbnailUrl = webserverUrl + video.getThumbnailPath()
-  let embedWidth = 560
-  let embedHeight = 315
+  let thumbnailUrl = webserverUrl + video.getPreviewPath()
+  let embedWidth = EMBED_SIZE.width
+  let embedHeight = EMBED_SIZE.height
 
   if (maxHeight < embedHeight) embedHeight = maxHeight
   if (maxWidth < embedWidth) embedWidth = maxWidth
 
   // Our thumbnail is too big for the consumer
   if (
-    (maxHeight !== undefined && maxHeight < THUMBNAILS_SIZE.height) ||
-    (maxWidth !== undefined && maxWidth < THUMBNAILS_SIZE.width)
+    (maxHeight !== undefined && maxHeight < PREVIEWS_SIZE.height) ||
+    (maxWidth !== undefined && maxWidth < PREVIEWS_SIZE.width)
   ) {
     thumbnailUrl = undefined
   }
@@ -54,8 +54,8 @@ function generateOEmbed (req: express.Request, res: express.Response, next: expr
 
   if (thumbnailUrl !== undefined) {
     json.thumbnail_url = thumbnailUrl
-    json.thumbnail_width = THUMBNAILS_SIZE.width
-    json.thumbnail_height = THUMBNAILS_SIZE.height
+    json.thumbnail_width = PREVIEWS_SIZE.width
+    json.thumbnail_height = PREVIEWS_SIZE.height
   }
 
   return res.json(json)
diff --git a/server/helpers/ffmpeg-utils.ts b/server/helpers/ffmpeg-utils.ts
index c35125ec1..913a90905 100644
--- a/server/helpers/ffmpeg-utils.ts
+++ b/server/helpers/ffmpeg-utils.ts
@@ -25,7 +25,7 @@ function getDurationFromVideoFile (path: string) {
   })
 }
 
-function generateImageFromVideoFile (fromPath: string, folder: string, imageName: string, size?: string) {
+function generateImageFromVideoFile (fromPath: string, folder: string, imageName: string, size: string) {
   const options = {
     filename: imageName,
     count: 1,
diff --git a/server/initializers/constants.ts b/server/initializers/constants.ts
index 6218644cf..491fb78f9 100644
--- a/server/initializers/constants.ts
+++ b/server/initializers/constants.ts
@@ -300,8 +300,13 @@ const THUMBNAILS_SIZE = {
   height: 110
 }
 const PREVIEWS_SIZE = {
-  width: 640,
-  height: 480
+  width: 560,
+  height: 315
+}
+
+const EMBED_SIZE = {
+  width: 560,
+  height: 315
 }
 
 // Sub folders of cache directory
@@ -343,6 +348,7 @@ export {
   CACHE,
   CONFIG,
   CONSTRAINTS_FIELDS,
+  EMBED_SIZE,
   FRIEND_SCORE,
   JOB_STATES,
   JOBS_CONCURRENCY,
diff --git a/server/models/video/video.ts b/server/models/video/video.ts
index 0d0048b4a..fb18a485a 100644
--- a/server/models/video/video.ts
+++ b/server/models/video/video.ts
@@ -48,6 +48,7 @@ import {
 
   VideoMethods
 } from './video-interface'
+import { PREVIEWS_SIZE } from '../../initializers/constants'
 
 let Video: Sequelize.Model<VideoInstance, VideoAttributes>
 let getOriginalFile: VideoMethods.GetOriginalFile
@@ -373,10 +374,13 @@ isOwned = function (this: VideoInstance) {
 }
 
 createPreview = function (this: VideoInstance, videoFile: VideoFileInstance) {
+  const imageSize = PREVIEWS_SIZE.width + 'x' + PREVIEWS_SIZE.height
+
   return generateImageFromVideoFile(
     this.getVideoFilePath(videoFile),
     CONFIG.STORAGE.PREVIEWS_DIR,
-    this.getPreviewName()
+    this.getPreviewName(),
+    imageSize
   )
 }
 
diff --git a/server/tests/api/services.ts b/server/tests/api/services.ts
index b396ea582..76911fdc5 100644
--- a/server/tests/api/services.ts
+++ b/server/tests/api/services.ts
@@ -42,16 +42,16 @@ describe('Test services', function () {
     const res = await getOEmbed(server.url, oembedUrl)
     const expectedHtml = `<iframe width="560" height="315" src="http://localhost:9001/videos/embed/${server.video.uuid}" ` +
                          'frameborder="0" allowfullscreen></iframe>'
-    const expectedThumbnailUrl = 'http://localhost:9001/static/thumbnails/' + server.video.uuid + '.jpg'
+    const expectedThumbnailUrl = 'http://localhost:9001/static/previews/' + server.video.uuid + '.jpg'
 
     expect(res.body.html).to.equal(expectedHtml)
     expect(res.body.title).to.equal(server.video.name)
     expect(res.body.author_name).to.equal(server.video.author)
-    expect(res.body.height).to.equal(315)
     expect(res.body.width).to.equal(560)
+    expect(res.body.height).to.equal(315)
     expect(res.body.thumbnail_url).to.equal(expectedThumbnailUrl)
-    expect(res.body.thumbnail_width).to.equal(200)
-    expect(res.body.thumbnail_height).to.equal(110)
+    expect(res.body.thumbnail_width).to.equal(560)
+    expect(res.body.thumbnail_height).to.equal(315)
   })
 
   it('Should have a valid oEmbed response with small max height query', async function () {