From cf02fbfb17f9e04312f771f245778d31bc1b69d2 Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Sun, 20 Nov 2016 16:09:38 +0100 Subject: Client: move video watch modals in their own component --- client/src/app/videos/video-watch/index.ts | 2 + .../videos/video-watch/video-magnet.component.html | 17 ++++++++ .../videos/video-watch/video-magnet.component.ts | 27 +++++++++++++ .../videos/video-watch/video-share.component.html | 25 ++++++++++++ .../videos/video-watch/video-share.component.ts | 38 ++++++++++++++++++ .../videos/video-watch/video-watch.component.html | 45 +--------------------- .../videos/video-watch/video-watch.component.scss | 7 ---- .../videos/video-watch/video-watch.component.ts | 32 ++++----------- 8 files changed, 118 insertions(+), 75 deletions(-) create mode 100644 client/src/app/videos/video-watch/video-magnet.component.html create mode 100644 client/src/app/videos/video-watch/video-magnet.component.ts create mode 100644 client/src/app/videos/video-watch/video-share.component.html create mode 100644 client/src/app/videos/video-watch/video-share.component.ts (limited to 'client/src/app/videos/video-watch') diff --git a/client/src/app/videos/video-watch/index.ts b/client/src/app/videos/video-watch/index.ts index b17aaacf2..1a8403b0a 100644 --- a/client/src/app/videos/video-watch/index.ts +++ b/client/src/app/videos/video-watch/index.ts @@ -1,2 +1,4 @@ +export * from './video-magnet.component'; +export * from './video-share.component'; export * from './video-watch.component'; export * from './webtorrent.service'; diff --git a/client/src/app/videos/video-watch/video-magnet.component.html b/client/src/app/videos/video-watch/video-magnet.component.html new file mode 100644 index 000000000..9108c7258 --- /dev/null +++ b/client/src/app/videos/video-watch/video-magnet.component.html @@ -0,0 +1,17 @@ + diff --git a/client/src/app/videos/video-watch/video-magnet.component.ts b/client/src/app/videos/video-watch/video-magnet.component.ts new file mode 100644 index 000000000..2894e7df6 --- /dev/null +++ b/client/src/app/videos/video-watch/video-magnet.component.ts @@ -0,0 +1,27 @@ +import { Component, Input, ViewChild } from '@angular/core'; + +import { ModalDirective } from 'ng2-bootstrap/components/modal'; + +import { Video } from '../shared'; + +@Component({ + selector: 'my-video-magnet', + templateUrl: './video-magnet.component.html' +}) +export class VideoMagnetComponent { + @Input() video: Video = null; + + @ViewChild('modal') modal: ModalDirective; + + constructor() { + // empty + } + + show() { + this.modal.show(); + } + + hide() { + this.modal.hide(); + } +} diff --git a/client/src/app/videos/video-watch/video-share.component.html b/client/src/app/videos/video-watch/video-share.component.html new file mode 100644 index 000000000..2e83e9a45 --- /dev/null +++ b/client/src/app/videos/video-watch/video-share.component.html @@ -0,0 +1,25 @@ + diff --git a/client/src/app/videos/video-watch/video-share.component.ts b/client/src/app/videos/video-watch/video-share.component.ts new file mode 100644 index 000000000..74b238350 --- /dev/null +++ b/client/src/app/videos/video-watch/video-share.component.ts @@ -0,0 +1,38 @@ +import { Component, Input, ViewChild } from '@angular/core'; + +import { ModalDirective } from 'ng2-bootstrap/components/modal'; + +import { Video } from '../shared'; + +@Component({ + selector: 'my-video-share', + templateUrl: './video-share.component.html' +}) +export class VideoShareComponent { + @Input() video: Video = null; + + @ViewChild('modal') modal: ModalDirective; + + constructor() { + // empty + } + + show() { + this.modal.show(); + } + + hide() { + this.modal.hide(); + } + + getVideoIframeCode() { + return ''; + } + + getVideoUrl() { + return window.location.href; + } +} diff --git a/client/src/app/videos/video-watch/video-watch.component.html b/client/src/app/videos/video-watch/video-watch.component.html index 2dfc25f56..0f0fa68cc 100644 --- a/client/src/app/videos/video-watch/video-watch.component.html +++ b/client/src/app/videos/video-watch/video-watch.component.html @@ -79,46 +79,5 @@ - - - + + diff --git a/client/src/app/videos/video-watch/video-watch.component.scss b/client/src/app/videos/video-watch/video-watch.component.scss index 45446e175..ac62b04e7 100644 --- a/client/src/app/videos/video-watch/video-watch.component.scss +++ b/client/src/app/videos/video-watch/video-watch.component.scss @@ -83,10 +83,3 @@ } } } - -.modal-content { - input { - /* Force blank on readonly inputs */ - background-color: #fff; - } -} 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 3dab2bbb7..afc6fe01c 100644 --- a/client/src/app/videos/video-watch/video-watch.component.ts +++ b/client/src/app/videos/video-watch/video-watch.component.ts @@ -1,10 +1,11 @@ import { Component, ElementRef, NgZone, OnDestroy, OnInit, ViewChild } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; -import { ModalDirective } from 'ng2-bootstrap/components/modal'; import { MetaService } from 'ng2-meta'; import * as videojs from 'video.js'; +import { VideoMagnetComponent } from './video-magnet.component'; +import { VideoShareComponent } from './video-share.component'; import { Video, VideoService } from '../shared'; import { WebTorrentService } from './webtorrent.service'; @@ -17,8 +18,8 @@ import { WebTorrentService } from './webtorrent.service'; export class VideoWatchComponent implements OnInit, OnDestroy { private static LOADTIME_TOO_LONG: number = 30000; - @ViewChild('magnetUriModal') magnetUriModal: ModalDirective; - @ViewChild('shareModal') shareModal: ModalDirective; + @ViewChild('videoMagnetModal') videoMagnetModal: VideoMagnetComponent; + @ViewChild('videoShareModal') videoShareModal: VideoShareComponent; downloadSpeed: number; error: boolean = false; @@ -121,31 +122,12 @@ export class VideoWatchComponent implements OnInit, OnDestroy { }); } - showMagnetUriModal() { - this.magnetUriModal.show(); - } - - hideMagnetUriModal() { - this.magnetUriModal.hide(); - } - showShareModal() { - this.shareModal.show(); + this.videoShareModal.show(); } - hideShareModal() { - this.shareModal.hide(); - } - - getVideoIframeCode() { - return ''; - } - - getVideoUrl() { - return window.location.href; + showMagnetUriModal() { + this.videoMagnetModal.show(); } private loadTooLong() { -- cgit v1.2.3