From 1f0215a908c3b447cef03c10d4b089c0788922bd Mon Sep 17 00:00:00 2001
From: Chocobozzz <florian.bigard@gmail.com>
Date: Fri, 5 May 2017 16:08:43 +0200
Subject: Client: little refractoring

---
 client/src/app/videos/shared/index.ts              |  1 -
 client/src/app/videos/shared/loader/index.ts       |  1 -
 .../app/videos/shared/loader/loader.component.html |  3 ---
 .../app/videos/shared/loader/loader.component.scss | 22 ----------------------
 .../app/videos/shared/loader/loader.component.ts   | 11 -----------
 client/src/app/videos/video-list/index.ts          |  1 +
 .../app/videos/video-list/loader.component.html    |  3 +++
 .../app/videos/video-list/loader.component.scss    | 22 ++++++++++++++++++++++
 .../src/app/videos/video-list/loader.component.ts  | 11 +++++++++++
 .../videos/video-list/video-list.component.scss    | 13 -------------
 .../app/videos/video-list/video-list.component.ts  |  5 -----
 .../video-list/video-miniature.component.html      |  2 +-
 .../video-list/video-miniature.component.scss      |  5 +----
 .../videos/video-list/video-miniature.component.ts | 10 ----------
 .../videos/video-watch/video-watch.component.html  |  2 ++
 .../videos/video-watch/video-watch.component.scss  | 10 ++++------
 client/src/app/videos/videos.module.ts             |  4 ++--
 17 files changed, 47 insertions(+), 79 deletions(-)
 delete mode 100644 client/src/app/videos/shared/loader/index.ts
 delete mode 100644 client/src/app/videos/shared/loader/loader.component.html
 delete mode 100644 client/src/app/videos/shared/loader/loader.component.scss
 delete mode 100644 client/src/app/videos/shared/loader/loader.component.ts
 create mode 100644 client/src/app/videos/video-list/loader.component.html
 create mode 100644 client/src/app/videos/video-list/loader.component.scss
 create mode 100644 client/src/app/videos/video-list/loader.component.ts

(limited to 'client/src/app/videos')

diff --git a/client/src/app/videos/shared/index.ts b/client/src/app/videos/shared/index.ts
index beaa528c0..a68491022 100644
--- a/client/src/app/videos/shared/index.ts
+++ b/client/src/app/videos/shared/index.ts
@@ -1,4 +1,3 @@
-export * from './loader';
 export * from './sort-field.type';
 export * from './rate-type.type';
 export * from './video.model';
diff --git a/client/src/app/videos/shared/loader/index.ts b/client/src/app/videos/shared/loader/index.ts
deleted file mode 100644
index ab22584e4..000000000
--- a/client/src/app/videos/shared/loader/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './loader.component';
diff --git a/client/src/app/videos/shared/loader/loader.component.html b/client/src/app/videos/shared/loader/loader.component.html
deleted file mode 100644
index 38d06950e..000000000
--- a/client/src/app/videos/shared/loader/loader.component.html
+++ /dev/null
@@ -1,3 +0,0 @@
-<div id="video-loading" *ngIf="loading">
-  <div class="glyphicon glyphicon-refresh glyphicon-refresh-animate"></div>
-</div>
diff --git a/client/src/app/videos/shared/loader/loader.component.scss b/client/src/app/videos/shared/loader/loader.component.scss
deleted file mode 100644
index 44cf1f9da..000000000
--- a/client/src/app/videos/shared/loader/loader.component.scss
+++ /dev/null
@@ -1,22 +0,0 @@
-// Thanks https://gist.github.com/alexandrevicenzi/680147013e902a4eaa5d
-.glyphicon-refresh-animate {
-    -animation: spin .7s infinite linear;
-    -ms-animation: spin .7s infinite linear;
-    -webkit-animation: spinw .7s infinite linear;
-    -moz-animation: spinm .7s infinite linear;
-}
-
-@keyframes spin {
-    from { transform: scale(1) rotate(0deg);}
-    to { transform: scale(1) rotate(360deg);}
-}
-
-@-webkit-keyframes spinw {
-    from { -webkit-transform: rotate(0deg);}
-    to { -webkit-transform: rotate(360deg);}
-}
-
-@-moz-keyframes spinm {
-    from { -moz-transform: rotate(0deg);}
-    to { -moz-transform: rotate(360deg);}
-}
diff --git a/client/src/app/videos/shared/loader/loader.component.ts b/client/src/app/videos/shared/loader/loader.component.ts
deleted file mode 100644
index e72d2f3f3..000000000
--- a/client/src/app/videos/shared/loader/loader.component.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Component, Input } from '@angular/core';
-
-@Component({
-  selector: 'my-loader',
-  styleUrls: [ './loader.component.scss' ],
-  templateUrl: './loader.component.html'
-})
-
-export class LoaderComponent {
-  @Input() loading: boolean;
-}
diff --git a/client/src/app/videos/video-list/index.ts b/client/src/app/videos/video-list/index.ts
index 1f6d6a4e7..71d3b78e6 100644
--- a/client/src/app/videos/video-list/index.ts
+++ b/client/src/app/videos/video-list/index.ts
@@ -1,3 +1,4 @@
+export * from './loader.component';
 export * from './video-list.component';
 export * from './video-miniature.component';
 export * from './video-sort.component';
diff --git a/client/src/app/videos/video-list/loader.component.html b/client/src/app/videos/video-list/loader.component.html
new file mode 100644
index 000000000..38d06950e
--- /dev/null
+++ b/client/src/app/videos/video-list/loader.component.html
@@ -0,0 +1,3 @@
+<div id="video-loading" *ngIf="loading">
+  <div class="glyphicon glyphicon-refresh glyphicon-refresh-animate"></div>
+</div>
diff --git a/client/src/app/videos/video-list/loader.component.scss b/client/src/app/videos/video-list/loader.component.scss
new file mode 100644
index 000000000..44cf1f9da
--- /dev/null
+++ b/client/src/app/videos/video-list/loader.component.scss
@@ -0,0 +1,22 @@
+// Thanks https://gist.github.com/alexandrevicenzi/680147013e902a4eaa5d
+.glyphicon-refresh-animate {
+    -animation: spin .7s infinite linear;
+    -ms-animation: spin .7s infinite linear;
+    -webkit-animation: spinw .7s infinite linear;
+    -moz-animation: spinm .7s infinite linear;
+}
+
+@keyframes spin {
+    from { transform: scale(1) rotate(0deg);}
+    to { transform: scale(1) rotate(360deg);}
+}
+
+@-webkit-keyframes spinw {
+    from { -webkit-transform: rotate(0deg);}
+    to { -webkit-transform: rotate(360deg);}
+}
+
+@-moz-keyframes spinm {
+    from { -moz-transform: rotate(0deg);}
+    to { -moz-transform: rotate(360deg);}
+}
diff --git a/client/src/app/videos/video-list/loader.component.ts b/client/src/app/videos/video-list/loader.component.ts
new file mode 100644
index 000000000..e72d2f3f3
--- /dev/null
+++ b/client/src/app/videos/video-list/loader.component.ts
@@ -0,0 +1,11 @@
+import { Component, Input } from '@angular/core';
+
+@Component({
+  selector: 'my-loader',
+  styleUrls: [ './loader.component.scss' ],
+  templateUrl: './loader.component.html'
+})
+
+export class LoaderComponent {
+  @Input() loading: boolean;
+}
diff --git a/client/src/app/videos/video-list/video-list.component.scss b/client/src/app/videos/video-list/video-list.component.scss
index b48a4f125..4b4409602 100644
--- a/client/src/app/videos/video-list/video-list.component.scss
+++ b/client/src/app/videos/video-list/video-list.component.scss
@@ -23,19 +23,6 @@
 
   my-video-miniature {
     text-align: left;
-    transition: all 0.5s ease;
-
-    &.ng-enter {
-      opacity: 0;
-    }
-
-    &.ng-enter-active {
-      opacity: 1;
-    }
-
-    &.ng-leave {
-      opacity: 0;
-    }
   }
 
   .no-video {
diff --git a/client/src/app/videos/video-list/video-list.component.ts b/client/src/app/videos/video-list/video-list.component.ts
index 16e1b5bcc..16a40bdc4 100644
--- a/client/src/app/videos/video-list/video-list.component.ts
+++ b/client/src/app/videos/video-list/video-list.component.ts
@@ -76,10 +76,7 @@ export class VideoListComponent implements OnInit, OnDestroy {
     this.loading.next(true);
     this.videos = [];
 
-    this.changeDetector.detectChanges();
-
     let observable = null;
-
     if (this.search.value) {
       observable = this.videoService.searchVideos(this.search, this.pagination, this.sort);
     } else {
@@ -150,8 +147,6 @@ export class VideoListComponent implements OnInit, OnDestroy {
     } else {
       this.pagination.currentPage = 1;
     }
-
-    this.changeDetector.detectChanges();
   }
 
   private navigateToNewParams() {
diff --git a/client/src/app/videos/video-list/video-miniature.component.html b/client/src/app/videos/video-list/video-miniature.component.html
index 1d3451c2b..648ef61b1 100644
--- a/client/src/app/videos/video-list/video-miniature.component.html
+++ b/client/src/app/videos/video-list/video-miniature.component.html
@@ -1,4 +1,4 @@
-<div class="video-miniature" (mouseenter)="onHover()" (mouseleave)="onBlur()">
+<div class="video-miniature">
   <a
     [routerLink]="['/videos/watch', video.id]" [attr.title]="video.description"
     class="video-miniature-thumbnail"
diff --git a/client/src/app/videos/video-list/video-miniature.component.scss b/client/src/app/videos/video-list/video-miniature.component.scss
index f7fecdc35..c2743c3be 100644
--- a/client/src/app/videos/video-list/video-miniature.component.scss
+++ b/client/src/app/videos/video-list/video-miniature.component.scss
@@ -1,5 +1,3 @@
-@import "../../../sass/pre-customizations.scss";
-
 .video-miniature {
   margin-top: 30px;
   display: inline-block;
@@ -71,7 +69,7 @@
       }
 
       .video-miniature-tags {
-        // Fix for chrome when tags a long
+        // Fix for chrome when tags are long
         width: 201px;
 
         .video-miniature-tag {
@@ -81,7 +79,6 @@
           top: -2px;
 
           .label {
-            line-height: $line-height-base;
             transition: background-color 0.2s;
           }
         }
diff --git a/client/src/app/videos/video-list/video-miniature.component.ts b/client/src/app/videos/video-list/video-miniature.component.ts
index 13deec381..28601ca7f 100644
--- a/client/src/app/videos/video-list/video-miniature.component.ts
+++ b/client/src/app/videos/video-list/video-miniature.component.ts
@@ -17,8 +17,6 @@ export class VideoMiniatureComponent {
   @Input() user: User;
   @Input() video: Video;
 
-  hovering = false;
-
   constructor(
     private notificationsService: NotificationsService,
     private confirmService: ConfirmService,
@@ -33,14 +31,6 @@ export class VideoMiniatureComponent {
     return this.video.name;
   }
 
-  onBlur() {
-    this.hovering = false;
-  }
-
-  onHover() {
-    this.hovering = true;
-  }
-
   isVideoNSFWForThisUser() {
     return this.video.isVideoNSFWForUser(this.user);
   }
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 13f6719bb..62f27ba48 100644
--- a/client/src/app/videos/video-watch/video-watch.component.html
+++ b/client/src/app/videos/video-watch/video-watch.component.html
@@ -22,12 +22,14 @@
   <div *ngIf="videoNotFound" id="video-not-found">Video not found :'(</div>
 </div>
 
+<!-- P2P informations -->
 <div id="torrent-info" class="row">
   <div id="torrent-info-download" class="col-md-4 col-sm-4 col-xs-4">Download: {{ downloadSpeed | bytes }}/s</div>
   <div id="torrent-info-upload" class="col-md-4 col-sm-4 col-xs-4">Upload: {{ uploadSpeed | bytes }}/s</div>
   <div id="torrent-info-peers" class="col-md-4 col-sm-4 col-xs-4">Number of peers: {{ numPeers }}</div>
 </div>
 
+<!-- Video informations -->
 <div *ngIf="video !== null" id="video-info">
   <div class="row video-name-views">
     <div class="col-xs-8 col-md-8 video-name">
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 767a3ed4e..789260a91 100644
--- a/client/src/app/videos/video-watch/video-watch.component.scss
+++ b/client/src/app/videos/video-watch/video-watch.component.scss
@@ -13,6 +13,10 @@
 
 .embed-responsive {
   height: 500px;
+
+  @media screen and (max-width: 600px) {
+    height: 300px;
+  }
 }
 
 #torrent-info {
@@ -25,12 +29,6 @@
   }
 }
 
-.embed-responsive {
-  @media screen and (max-width: 600px) {
-    height: 300px;
-  }
-}
-
 #video-info {
   .video-name-views {
     font-weight: bold;
diff --git a/client/src/app/videos/videos.module.ts b/client/src/app/videos/videos.module.ts
index 04a06e0a3..adfbe7031 100644
--- a/client/src/app/videos/videos.module.ts
+++ b/client/src/app/videos/videos.module.ts
@@ -5,7 +5,7 @@ import { TagInputModule } from 'ng2-tag-input';
 import { VideosRoutingModule } from './videos-routing.module';
 import { VideosComponent } from './videos.component';
 import { VideoAddComponent, VideoUpdateComponent } from './video-edit';
-import { VideoListComponent, VideoMiniatureComponent, VideoSortComponent } from './video-list';
+import { LoaderComponent, VideoListComponent, VideoMiniatureComponent, VideoSortComponent } from './video-list';
 import {
   VideoWatchComponent,
   VideoMagnetComponent,
@@ -13,7 +13,7 @@ import {
   VideoShareComponent,
   WebTorrentService
 } from './video-watch';
-import { LoaderComponent, VideoService } from './shared';
+import { VideoService } from './shared';
 import { SharedModule } from '../shared';
 
 @NgModule({
-- 
cgit v1.2.3