]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blobdiff - server/lib/client-html.ts
video embed: use instance name as html title
[github/Chocobozzz/PeerTube.git] / server / lib / client-html.ts
index 85fced10ddb25dea956c89f8f6291ac4c4ffb107..f19ec7df02ebe6ca540c932b951c21a310b51e32 100644 (file)
@@ -1,39 +1,42 @@
 import * as express from 'express'
+import { readFile } from 'fs-extra'
+import { join } from 'path'
+import validator from 'validator'
 import { buildFileLocale, getDefaultLocale, is18nLocale, POSSIBLE_LOCALES } from '../../shared/core-utils/i18n/i18n'
+import { HttpStatusCode } from '../../shared/core-utils/miscs/http-error-codes'
+import { VideoPlaylistPrivacy, VideoPrivacy } from '../../shared/models/videos'
+import { escapeHTML, isTestInstance, sha256 } from '../helpers/core-utils'
+import { logger } from '../helpers/logger'
+import { CONFIG } from '../initializers/config'
 import {
+  ACCEPT_HEADERS,
   AVATARS_SIZE,
   CUSTOM_HTML_TAG_COMMENTS,
   EMBED_SIZE,
+  FILES_CONTENT_HASH,
   PLUGIN_GLOBAL_CSS_PATH,
-  WEBSERVER,
-  FILES_CONTENT_HASH
+  WEBSERVER
 } from '../initializers/constants'
-import { join } from 'path'
-import { escapeHTML, sha256 } from '../helpers/core-utils'
-import { VideoModel } from '../models/video/video'
-import { VideoPlaylistModel } from '../models/video/video-playlist'
-import validator from 'validator'
-import { VideoPrivacy, VideoPlaylistPrivacy } from '../../shared/models/videos'
-import { readFile } from 'fs-extra'
-import { getActivityStreamDuration } from '../models/video/video-format-utils'
 import { AccountModel } from '../models/account/account'
+import { VideoModel } from '../models/video/video'
 import { VideoChannelModel } from '../models/video/video-channel'
-import * as Bluebird from 'bluebird'
-import { CONFIG } from '../initializers/config'
-import { logger } from '../helpers/logger'
+import { getActivityStreamDuration } from '../models/video/video-format-utils'
+import { VideoPlaylistModel } from '../models/video/video-playlist'
 import { MAccountActor, MChannelActor } from '../types/models'
 
 type Tags = {
   ogType: string
-  twitterCard: string
+  twitterCard: 'player' | 'summary' | 'summary_large_image'
   schemaType: string
 
   list?: {
     numberOfItems: number
   }
 
+  siteName: string
   title: string
   url: string
+  originUrl: string
   description: string
 
   embed?: {
@@ -50,7 +53,7 @@ type Tags = {
   }
 }
 
-export class ClientHtml {
+class ClientHtml {
 
   private static htmlCache: { [path: string]: string } = {}
 
@@ -74,7 +77,7 @@ export class ClientHtml {
   static async getWatchHTMLPage (videoId: string, req: express.Request, res: express.Response) {
     // Let Angular application handle errors
     if (!validator.isInt(videoId) && !validator.isUUID(videoId, 4)) {
-      res.status(404)
+      res.status(HttpStatusCode.NOT_FOUND_404)
       return ClientHtml.getIndexHTML(req, res)
     }
 
@@ -85,7 +88,7 @@ export class ClientHtml {
 
     // Let Angular application handle errors
     if (!video || video.privacy === VideoPrivacy.PRIVATE || video.privacy === VideoPrivacy.INTERNAL || video.VideoBlacklist) {
-      res.status(404)
+      res.status(HttpStatusCode.NOT_FOUND_404)
       return html
     }
 
@@ -93,7 +96,9 @@ export class ClientHtml {
     customHtml = ClientHtml.addDescriptionTag(customHtml, escapeHTML(video.description))
 
     const url = WEBSERVER.URL + video.getWatchStaticPath()
+    const originUrl = video.url
     const title = escapeHTML(video.name)
+    const siteName = escapeHTML(CONFIG.INSTANCE.NAME)
     const description = escapeHTML(video.description)
 
     const image = {
@@ -111,7 +116,18 @@ export class ClientHtml {
     const twitterCard = CONFIG.SERVICES.TWITTER.WHITELISTED ? 'player' : 'summary_large_image'
     const schemaType = 'VideoObject'
 
-    customHtml = ClientHtml.addTags(customHtml, { url, title, description, image, embed, ogType, twitterCard, schemaType })
+    customHtml = ClientHtml.addTags(customHtml, {
+      url,
+      originUrl,
+      siteName,
+      title,
+      description,
+      image,
+      embed,
+      ogType,
+      twitterCard,
+      schemaType
+    })
 
     return customHtml
   }
@@ -119,7 +135,7 @@ export class ClientHtml {
   static async getWatchPlaylistHTMLPage (videoPlaylistId: string, req: express.Request, res: express.Response) {
     // Let Angular application handle errors
     if (!validator.isInt(videoPlaylistId) && !validator.isUUID(videoPlaylistId, 4)) {
-      res.status(404)
+      res.status(HttpStatusCode.NOT_FOUND_404)
       return ClientHtml.getIndexHTML(req, res)
     }
 
@@ -130,7 +146,7 @@ export class ClientHtml {
 
     // Let Angular application handle errors
     if (!videoPlaylist || videoPlaylist.privacy === VideoPlaylistPrivacy.PRIVATE) {
-      res.status(404)
+      res.status(HttpStatusCode.NOT_FOUND_404)
       return html
     }
 
@@ -138,7 +154,9 @@ export class ClientHtml {
     customHtml = ClientHtml.addDescriptionTag(customHtml, escapeHTML(videoPlaylist.description))
 
     const url = videoPlaylist.getWatchUrl()
+    const originUrl = videoPlaylist.url
     const title = escapeHTML(videoPlaylist.name)
+    const siteName = escapeHTML(CONFIG.INSTANCE.NAME)
     const description = escapeHTML(videoPlaylist.description)
 
     const image = {
@@ -158,7 +176,19 @@ export class ClientHtml {
     const twitterCard = CONFIG.SERVICES.TWITTER.WHITELISTED ? 'player' : 'summary'
     const schemaType = 'ItemList'
 
-    customHtml = ClientHtml.addTags(customHtml, { url, embed, title, description, image, list, ogType, twitterCard, schemaType })
+    customHtml = ClientHtml.addTags(customHtml, {
+      url,
+      originUrl,
+      siteName,
+      embed,
+      title,
+      description,
+      image,
+      list,
+      ogType,
+      twitterCard,
+      schemaType
+    })
 
     return customHtml
   }
@@ -171,8 +201,25 @@ export class ClientHtml {
     return this.getAccountOrChannelHTMLPage(() => VideoChannelModel.loadByNameWithHostAndPopulateAccount(nameWithHost), req, res)
   }
 
+  static async getEmbedHTML () {
+    const path = ClientHtml.getEmbedPath()
+
+    if (!isTestInstance() && ClientHtml.htmlCache[path]) return ClientHtml.htmlCache[path]
+
+    const buffer = await readFile(path)
+
+    let html = buffer.toString()
+    html = await ClientHtml.addAsyncPluginCSS(html)
+    html = ClientHtml.addCustomCSS(html)
+    html = ClientHtml.addTitleTag(html)
+
+    ClientHtml.htmlCache[path] = html
+
+    return html
+  }
+
   private static async getAccountOrChannelHTMLPage (
-    loader: () => Bluebird<MAccountActor | MChannelActor>,
+    loader: () => Promise<MAccountActor | MChannelActor>,
     req: express.Request,
     res: express.Response
   ) {
@@ -183,14 +230,16 @@ export class ClientHtml {
 
     // Let Angular application handle errors
     if (!entity) {
-      res.status(404)
+      res.status(HttpStatusCode.NOT_FOUND_404)
       return ClientHtml.getIndexHTML(req, res)
     }
 
     let customHtml = ClientHtml.addTitleTag(html, escapeHTML(entity.getDisplayName()))
     customHtml = ClientHtml.addDescriptionTag(customHtml, escapeHTML(entity.description))
 
-    const url = entity.Actor.url
+    const url = entity.getLocalUrl()
+    const originUrl = entity.Actor.url
+    const siteName = escapeHTML(CONFIG.INSTANCE.NAME)
     const title = escapeHTML(entity.getDisplayName())
     const description = escapeHTML(entity.description)
 
@@ -204,14 +253,24 @@ export class ClientHtml {
     const twitterCard = 'summary'
     const schemaType = 'ProfilePage'
 
-    customHtml = ClientHtml.addTags(customHtml, { url, title, description, image, ogType, twitterCard, schemaType })
+    customHtml = ClientHtml.addTags(customHtml, {
+      url,
+      originUrl,
+      title,
+      siteName,
+      description,
+      image,
+      ogType,
+      twitterCard,
+      schemaType
+    })
 
     return customHtml
   }
 
   private static async getIndexHTML (req: express.Request, res: express.Response, paramLang?: string) {
     const path = ClientHtml.getIndexPath(req, res, paramLang)
-    if (ClientHtml.htmlCache[path]) return ClientHtml.htmlCache[path]
+    if (!isTestInstance() && ClientHtml.htmlCache[path]) return ClientHtml.htmlCache[path]
 
     const buffer = await readFile(path)
 
@@ -252,6 +311,10 @@ export class ClientHtml {
     return join(__dirname, '../../../client/dist/' + buildFileLocale(lang) + '/index.html')
   }
 
+  private static getEmbedPath () {
+    return join(__dirname, '../../../client/dist/standalone/videos/embed.html')
+  }
+
   private static addHtmlLang (htmlStringPage: string, paramLang: string) {
     return htmlStringPage.replace('<html>', `<html lang="${paramLang}">`)
   }
@@ -303,6 +366,7 @@ export class ClientHtml {
   private static generateOpenGraphMetaTags (tags: Tags) {
     const metaTags = {
       'og:type': tags.ogType,
+      'og:site_name': tags.siteName,
       'og:title': tags.title,
       'og:image': tags.image.url
     }
@@ -348,6 +412,12 @@ export class ClientHtml {
       metaTags['twitter:image:height'] = tags.image.height
     }
 
+    if (tags.twitterCard === 'player') {
+      metaTags['twitter:player'] = tags.embed.url
+      metaTags['twitter:player:width'] = EMBED_SIZE.width
+      metaTags['twitter:player:height'] = EMBED_SIZE.height
+    }
+
     return metaTags
   }
 
@@ -386,7 +456,7 @@ export class ClientHtml {
     const twitterCardMetaTags = this.generateTwitterCardMetaTags(tagsValues)
     const schemaTags = this.generateSchemaTags(tagsValues)
 
-    const { url, title, embed } = tagsValues
+    const { url, title, embed, originUrl } = tagsValues
 
     const oembedLinkTags: { type: string, href: string, title: string }[] = []
 
@@ -432,8 +502,43 @@ export class ClientHtml {
     }
 
     // SEO, use origin URL
-    tagsString += `<link rel="canonical" href="${url}" />`
+    tagsString += `<link rel="canonical" href="${originUrl}" />`
 
     return htmlStringPage.replace(CUSTOM_HTML_TAG_COMMENTS.META_TAGS, tagsString)
   }
 }
+
+function sendHTML (html: string, res: express.Response) {
+  res.set('Content-Type', 'text/html; charset=UTF-8')
+
+  return res.send(html)
+}
+
+async function serveIndexHTML (req: express.Request, res: express.Response) {
+  if (req.accepts(ACCEPT_HEADERS) === 'html' ||
+      !req.headers.accept) {
+    try {
+      await generateHTMLPage(req, res, req.params.language)
+      return
+    } catch (err) {
+      logger.error('Cannot generate HTML page.', err)
+      return res.sendStatus(HttpStatusCode.INTERNAL_SERVER_ERROR_500)
+    }
+  }
+
+  return res.sendStatus(HttpStatusCode.NOT_ACCEPTABLE_406)
+}
+
+// ---------------------------------------------------------------------------
+
+export {
+  ClientHtml,
+  sendHTML,
+  serveIndexHTML
+}
+
+async function generateHTMLPage (req: express.Request, res: express.Response, paramLang?: string) {
+  const html = await ClientHtml.getDefaultHTMLPage(req, res, paramLang)
+
+  return sendHTML(html, res)
+}