7 files changed, 81 insertions, 44 deletions

diff --git a/client/src/app/videos/+video-edit/video-add.component.html b/client/src/app/videos/+video-edit/video-add.component.html
index 3bf4101f4..a70788ed8 100644
--- a/client/src/app/videos/+video-edit/video-add.component.html
+++ b/client/src/app/videos/+video-edit/video-add.component.html
@@ -28,7 +28,6 @@
       <div class="form-group">
         <label for="category">Channel</label>
         <select class="form-control" id="channelId" formControlName="channelId">
-          <option></option>
           <option *ngFor="let channel of userVideoChannels" [value]="channel.id">{{ channel.label }}</option>
         </select>
 
@@ -103,11 +102,8 @@
 
       <div class="form-group">
         <label for="description">Description</label>
-        <textarea
-          id="description" class="form-control" placeholder="Description..."
-          formControlName="description"
-        >
-        </textarea>
+        <my-video-description formControlName="description"></my-video-description>
+
         <div *ngIf="formErrors.description" class="alert alert-danger">
           {{ formErrors.description }}
         </div>
diff --git a/client/src/app/videos/+video-edit/video-add.component.ts b/client/src/app/videos/+video-edit/video-add.component.ts
index 92b03e8c9..5b5557ed9 100644
--- a/client/src/app/videos/+video-edit/video-add.component.ts
+++ b/client/src/app/videos/+video-edit/video-add.component.ts
@@ -82,7 +82,7 @@ export class VideoAddComponent extends FormReactive implements OnInit {
       category: [ '', VIDEO_CATEGORY.VALIDATORS ],
       licence: [ '', VIDEO_LICENCE.VALIDATORS ],
       language: [ '', VIDEO_LANGUAGE.VALIDATORS ],
-      channelId: [ this.userVideoChannels[0].id, VIDEO_CHANNEL.VALIDATORS ],
+      channelId: [ '', VIDEO_CHANNEL.VALIDATORS ],
       description: [ '', VIDEO_DESCRIPTION.VALIDATORS ],
       videofile: [ '', VIDEO_FILE.VALIDATORS ],
       tags: [ '' ]
@@ -96,10 +96,22 @@ export class VideoAddComponent extends FormReactive implements OnInit {
     this.videoLicences = this.serverService.getVideoLicences()
     this.videoLanguages = this.serverService.getVideoLanguages()
 
-    const user = this.authService.getUser()
-    this.userVideoChannels = user.videoChannels.map(v => ({ id: v.id, label: v.name }))
-
     this.buildForm()
+
+    this.authService.userInformationLoaded
+      .subscribe(
+        () => {
+          const user = this.authService.getUser()
+          if (!user) return
+
+          const videoChannels = user.videoChannels
+          if (Array.isArray(videoChannels) === false) return
+
+          this.userVideoChannels = videoChannels.map(v => ({ id: v.id, label: v.name }))
+
+          this.form.patchValue({ channelId: this.userVideoChannels[0].id })
+        }
+      )
   }
 
   // The goal is to keep reactive form validation (required field)
diff --git a/client/src/app/videos/+video-edit/video-add.module.ts b/client/src/app/videos/+video-edit/video-add.module.ts
index 141d33ad2..3d937b008 100644
--- a/client/src/app/videos/+video-edit/video-add.module.ts
+++ b/client/src/app/videos/+video-edit/video-add.module.ts
@@ -1,17 +1,14 @@
 import { NgModule } from '@angular/core'
 
-import { TagInputModule } from 'ngx-chips'
-
 import { VideoAddRoutingModule } from './video-add-routing.module'
 import { VideoAddComponent } from './video-add.component'
-import { VideoService } from '../shared'
+import { VideoEditModule } from './video-edit.module'
 import { SharedModule } from '../../shared'
 
 @NgModule({
   imports: [
-    TagInputModule,
-
     VideoAddRoutingModule,
+    VideoEditModule,
     SharedModule
   ],
 
@@ -23,8 +20,6 @@ import { SharedModule } from '../../shared'
     VideoAddComponent
   ],
 
-  providers: [
-    VideoService
-  ]
+  providers: [ ]
 })
 export class VideoAddModule { }
diff --git a/client/src/app/videos/+video-edit/video-edit.module.ts b/client/src/app/videos/+video-edit/video-edit.module.ts
new file mode 100644
index 000000000..33f654960
--- /dev/null
+++ b/client/src/app/videos/+video-edit/video-edit.module.ts
@@ -0,0 +1,33 @@
+import { NgModule } from '@angular/core'
+
+import { TagInputModule } from 'ngx-chips'
+import { TabsModule } from 'ngx-bootstrap/tabs'
+
+import { VideoService, MarkdownService, VideoDescriptionComponent } from '../shared'
+import { SharedModule } from '../../shared'
+
+@NgModule({
+  imports: [
+    TagInputModule,
+    TabsModule.forRoot(),
+
+    SharedModule
+  ],
+
+  declarations: [
+    VideoDescriptionComponent
+  ],
+
+  exports: [
+    TagInputModule,
+    TabsModule,
+
+    VideoDescriptionComponent
+  ],
+
+  providers: [
+    VideoService,
+    MarkdownService
+  ]
+})
+export class VideoEditModule { }
diff --git a/client/src/app/videos/+video-edit/video-update.component.html b/client/src/app/videos/+video-edit/video-update.component.html
index 4dcb3ea56..ec040630e 100644
--- a/client/src/app/videos/+video-edit/video-update.component.html
+++ b/client/src/app/videos/+video-edit/video-update.component.html
@@ -62,7 +62,7 @@
     </div>
 
     <div class="form-group">
-      <label for="tags" class="label-tags">Tags</label> <span class="little-information">(press enter to add the tag)</span>
+      <label class="label-tags">Tags</label> <span class="little-information">(press enter to add the tag)</span>
       <tag-input
         [ngModel]="tags" [validators]="tagValidators" [errorMessages]="tagValidatorsMessages"
         formControlName="tags" maxItems="5" modelAsStrings="true"
@@ -71,11 +71,8 @@
 
     <div class="form-group">
       <label for="description">Description</label>
-      <textarea
-        id="description" class="form-control" placeholder="Description..."
-        formControlName="description"
-      >
-      </textarea>
+      <my-video-description formControlName="description"></my-video-description>
+
       <div *ngIf="formErrors.description" class="alert alert-danger">
         {{ formErrors.description }}
       </div>
diff --git a/client/src/app/videos/+video-edit/video-update.component.ts b/client/src/app/videos/+video-edit/video-update.component.ts
index 30390ac05..6ced77f1a 100644
--- a/client/src/app/videos/+video-edit/video-update.component.ts
+++ b/client/src/app/videos/+video-edit/video-update.component.ts
@@ -1,6 +1,8 @@
 import { Component, OnInit } from '@angular/core'
 import { FormBuilder, FormGroup } from '@angular/forms'
 import { ActivatedRoute, Router } from '@angular/router'
+import { Observable } from 'rxjs/Observable'
+import 'rxjs/add/observable/forkJoin'
 
 import { NotificationsService } from 'angular2-notifications'
 
@@ -84,19 +86,26 @@ export class VideoUpdateComponent extends FormReactive implements OnInit {
     this.videoLanguages = this.serverService.getVideoLanguages()
 
     const uuid: string = this.route.snapshot.params['uuid']
-    this.videoService.getVideo(uuid)
-                     .subscribe(
-                       video => {
-                         this.video = new VideoEdit(video)
-
-                         this.hydrateFormFromVideo()
-                       },
 
-                       err => {
-                         console.error(err)
-                         this.error = 'Cannot fetch video.'
-                       }
-                     )
+    this.videoService.getVideo(uuid)
+      .switchMap(video => {
+        return this.videoService
+          .loadCompleteDescription(video.descriptionPath)
+          .do(description => video.description = description)
+          .map(() => video)
+      })
+      .subscribe(
+        video => {
+          this.video = new VideoEdit(video)
+
+          this.hydrateFormFromVideo()
+        },
+
+        err => {
+          console.error(err)
+          this.error = 'Cannot fetch video.'
+        }
+      )
   }
 
   checkForm () {
diff --git a/client/src/app/videos/+video-edit/video-update.module.ts b/client/src/app/videos/+video-edit/video-update.module.ts
index eeb2e35e2..f7bd77c75 100644
--- a/client/src/app/videos/+video-edit/video-update.module.ts
+++ b/client/src/app/videos/+video-edit/video-update.module.ts
@@ -1,17 +1,14 @@
 import { NgModule } from '@angular/core'
 
-import { TagInputModule } from 'ngx-chips'
-
 import { VideoUpdateRoutingModule } from './video-update-routing.module'
 import { VideoUpdateComponent } from './video-update.component'
-import { VideoService } from '../shared'
+import { VideoEditModule } from './video-edit.module'
 import { SharedModule } from '../../shared'
 
 @NgModule({
   imports: [
-    TagInputModule,
-
     VideoUpdateRoutingModule,
+    VideoEditModule,
     SharedModule
   ],
 
@@ -23,8 +20,6 @@ import { SharedModule } from '../../shared'
     VideoUpdateComponent
   ],
 
-  providers: [
-    VideoService
-  ]
+  providers: [ ]
 })
 export class VideoUpdateModule { }