client/angular/videos/components/add/videos-add.component.ts

   1 import {Component, ElementRef, Inject, OnInit} from 'angular2/core';
   2 import {Router} from 'angular2/router';
   3 import {NgForm} from 'angular2/common';
   4
   5 import {Video} from '../../models/video';
   6
   7 declare var jQuery:any;
   8
   9 @Component({
  10   selector: 'my-videos-add',
  11   styleUrls: [ 'app/angular/videos/components/add/videos-add.component.css' ],
  12   templateUrl: 'app/angular/videos/components/add/videos-add.component.html'
  13 })
  14
  15 export class VideosAddComponent implements OnInit {
  16   fileToUpload: any;
  17   progressBar: { value: number; max: number; } = { value: 0, max: 0 };
  18
  19   private _form: any;
  20
  21   constructor(private _router: Router, private _elementRef: ElementRef) {}
  22
  23   ngOnInit() {
  24     jQuery(this._elementRef.nativeElement).find('#input_video').fileupload({
  25       singleFileUploads: true,
  26       multipart: true,
  27       url: '/api/v1/videos',
  28       autoupload: false,
  29
  30       add: (e, data) => {
  31         this._form = data;
  32         this.fileToUpload = data['files'][0];
  33       },
  34
  35       progressall: (e, data) => {
  36         this.progressBar.value = data.loaded;
  37         this.progressBar.max= data.total;
  38       },
  39
  40       done: (e, data) => {
  41         console.log('finished');
  42         // Print all the videos once it's finished
  43         this._router.navigate(['VideosList']);
  44       }
  45     });
  46   }
  47
  48   uploadFile() {
  49     this._form.formData = jQuery(this._elementRef.nativeElement).find('form').serializeArray();
  50     this._form.submit();
  51   }
  52 }