feat(gallery): ambient backdrop color input

fivethree-team · Jul 9, 2019 · fe199a8 · fe199a8
1 parent 6cbf0da
commit fe199a8
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 5 deletions.
diff --git a/projects/core/src/lib/gallery/gallery-image/gallery-image.component.ts b/projects/core/src/lib/gallery/gallery-image/gallery-image.component.ts
@@ -144,9 +144,9 @@ export class FivGalleryImage implements OnInit {
     this.animationParams = this.getThumbnailPosition(this.image);
 
     this.overlay.show(49999);
-    this.backdropColor = this.imageService.getAverageRGB(
-      this.image.nativeElement
-    );
+    this.backdropColor = this.gallery.ambient
+      ? this.imageService.getAverageRGB(this.image.nativeElement)
+      : '#000';
   }
 
   close(position: Position) {

diff --git a/projects/core/src/lib/gallery/gallery.component.html b/projects/core/src/lib/gallery/gallery.component.html
@@ -7,15 +7,17 @@
   </div>
 
   <ng-container *fivIf="['desktop']">
-    <ion-fab [@scale] *ngIf="controlsVisible && images?.length > 0 && pagerVisible" vertical="center" horizontal="start" slot="fixed">
+    <ion-fab [@scale] *ngIf="controlsVisible && images?.length > 0 && pagerVisible" vertical="center" horizontal="start"
+      slot="fixed">
       <ion-fab-button color="light" (click)="prev()" [disabled]="activeIndex === 0">
         <ion-icon name="arrow-back"></ion-icon>
       </ion-fab-button>
     </ion-fab>
   </ng-container>
 
   <div #viewer class="viewer" fivPull [maxPullHeight]="160" [minPullHeight]="120" (fivPull)="transformSlides($event)"
-    (fivRefresh)="closeFromPullDown($event)" (fivCancel)="resetPan($event)" [enableScroll]="true">
+    (fivRefresh)="closeFromPullDown($event)" [enabled]="pullEnabled" (fivCancel)="resetPan($event)"
+    [enableScroll]="true">
     <ion-slides #slider *ngIf="overlay.open" [ngClass]="[initialImage?.viewerState]"
       (ionSlideDidChange)="slideDidChange()" (ionSlideNextStart)="ionSlideNextStart()"
       (ionSlidePrevStart)="ionSlidePrevStart()" (ionSlidesDidLoad)="onSlidesLoad()" [options]="options">

diff --git a/projects/core/src/lib/gallery/gallery.component.ts b/projects/core/src/lib/gallery/gallery.component.ts
@@ -94,7 +94,9 @@ export class FivGallery implements OnInit, AfterContentInit {
   zoomedIn: boolean;
   controlsVisible = true;
   @Input() pagerVisible = true;
+  @Input() ambient = true;
   private slidesLoaded;
+  pullEnabled = false;
 
   @HostListener('window:keyup', ['$event'])
   keyEvent(event: KeyboardEvent) {
@@ -179,6 +181,7 @@ export class FivGallery implements OnInit, AfterContentInit {
     this.overlay.show(50000);
     this.initialImage = initial;
     this.showControls();
+    this.pullEnabled = true
   }
 
   close() {