3 files changed, 19 insertions, 14 deletions

diff --git a/client/src/app/app.component.ts b/client/src/app/app.component.ts
index 47d2bfdd2..8b4b4118b 100644
--- a/client/src/app/app.component.ts
+++ b/client/src/app/app.component.ts
@@ -1,8 +1,6 @@
 import { Component, OnInit, ViewContainerRef } from '@angular/core';
 import { Router } from '@angular/router';
 
-import { MetaService } from 'ng2-meta';
-
 import { AuthService } from './core';
 import { UserService } from './shared';
 
@@ -27,7 +25,6 @@ export class AppComponent implements OnInit {
 
   constructor(
     private router: Router,
-    private metaService: MetaService,
     private authService: AuthService,
     private userService: UserService,
     viewContainerRef: ViewContainerRef
diff --git a/client/src/app/app.module.ts b/client/src/app/app.module.ts
index 482a9b5b7..02da38b38 100644
--- a/client/src/app/app.module.ts
+++ b/client/src/app/app.module.ts
@@ -2,7 +2,7 @@ import { ApplicationRef, NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { removeNgStyles, createNewHosts } from '@angularclass/hmr';
 
-import { MetaModule, MetaConfig } from 'ng2-meta';
+import { MetaModule, MetaLoader, MetaStaticLoader, PageTitlePositioning } from '@nglibs/meta';
 import 'bootstrap-loader';
 
 import { ENV_PROVIDERS } from './environment';
@@ -16,14 +16,17 @@ import { LoginModule } from './login';
 import { SharedModule } from './shared';
 import { VideosModule } from './videos';
 
-const metaConfig: MetaConfig = {
-  //Append a title suffix such as a site name to all titles
-  //Defaults to false
-  useTitleSuffix: true,
-  defaults: {
-    title: 'PeerTube'
-  }
-};
+export function metaFactory(): MetaLoader {
+  return new MetaStaticLoader({
+    pageTitlePositioning: PageTitlePositioning.PrependPageTitle,
+    pageTitleSeparator: ' - ',
+    applicationName: 'PeerTube',
+    defaults: {
+      title: 'PeerTube',
+      description: 'PeerTube, a decentralized video streaming platform using P2P (BitTorrent) directly in the web browser'
+    }
+  });
+}
 
 // Application wide providers
 const APP_PROVIDERS = [
@@ -43,7 +46,10 @@ const APP_PROVIDERS = [
 
     AppRoutingModule,
 
-    MetaModule.forRoot(metaConfig),
+    MetaModule.forRoot({
+      provide: MetaLoader,
+      useFactory: (metaFactory)
+    }),
 
     AccountModule,
     CoreModule,
diff --git a/client/src/app/videos/video-watch/video-watch.component.ts b/client/src/app/videos/video-watch/video-watch.component.ts
index ed6b30102..5678f6df8 100644
--- a/client/src/app/videos/video-watch/video-watch.component.ts
+++ b/client/src/app/videos/video-watch/video-watch.component.ts
@@ -3,7 +3,7 @@ import { ActivatedRoute } from '@angular/router';
 import { Subscription } from 'rxjs/Subscription';
 
 import * as videojs from 'video.js';
-import { MetaService } from 'ng2-meta';
+import { MetaService } from '@nglibs/meta';
 import { NotificationsService } from 'angular2-notifications';
 
 import { AuthService } from '../../core';
@@ -228,6 +228,8 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
   }
 
   private setOpenGraphTags() {
+    this.metaService.setTitle(this.video.name);
+
     this.metaService.setTag('og:type', 'video');
 
     this.metaService.setTag('og:title', this.video.name);