From 7324f4db1099f04e5dd61d34c03a5c116b506771 Mon Sep 17 00:00:00 2001
From: Axis <arunbluez@gmail.com>
Date: Tue, 5 Dec 2017 00:48:07 +0100
Subject: [PATCH 1/2] Added Config option to hide Nav elements

---
 src/app/components/app.component.ts                | 3 ++-
 src/app/components/carousel/carousel.component.ts  | 4 ++--
 src/app/components/carousel/carousel.template.html | 6 ++++--
 src/app/services/declarations/index.ts             | 1 +
 4 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/src/app/components/app.component.ts b/src/app/components/app.component.ts
index 23765e5..98f16fa 100644
--- a/src/app/components/app.component.ts
+++ b/src/app/components/app.component.ts
@@ -23,6 +23,7 @@ export class AppComponent {
     animationType: AnimationConfig.SLIDE,
     autoplay: true,
     autoplayDelay: 2000,
-    stopAutoplayMinWidth: 768
+    stopAutoplayMinWidth: 768,
+    hideNavElements: false
   };
 }
diff --git a/src/app/components/carousel/carousel.component.ts b/src/app/components/carousel/carousel.component.ts
index 8d8d156..58ae35a 100644
--- a/src/app/components/carousel/carousel.component.ts
+++ b/src/app/components/carousel/carousel.component.ts
@@ -22,15 +22,16 @@ export class CarouselComponent implements OnInit, OnDestroy {
 
   private autoplayIntervalId;
   private preventAutoplay: boolean;
-
   public loadedImages: string[];
   public galleryLength: number;
   public currentSlide = 0;
+  public hideElement: boolean;
 
   constructor(private carouselService: CarouselService, private windowWidthService: WindowWidthService) { }
 
   ngOnInit() {
     this.initData();
+    this.hideElement = this.config.hideNavElements;
   }
 
   public initData() {
@@ -110,7 +111,6 @@ export class CarouselComponent implements OnInit, OnDestroy {
     if (!this.config.animation) {
       return;
     }
-
     this.carouselArrowsComponent.disableNavButtons();
     this.pinsComponent.disableNavButtons();
   }
diff --git a/src/app/components/carousel/carousel.template.html b/src/app/components/carousel/carousel.template.html
index cc76a9c..7860ff9 100644
--- a/src/app/components/carousel/carousel.template.html
+++ b/src/app/components/carousel/carousel.template.html
@@ -10,10 +10,12 @@
     *ngIf="galleryLength > 1"
     [images]="loadedImages"
     [currentSlide]="currentSlide"
-    (changeSlide)="onChangeSlideIndex($event);">
+    (changeSlide)="onChangeSlideIndex($event);"
+    [hideElement]="hideElement"
+    [style.visibility]="hideElement ? 'hidden' : 'none'">
   </carousel-pins>
 
   <carousel-arrows
     *ngIf="galleryLength > 1"
-    (changeSlide)="onChangeSlide($event);"></carousel-arrows>
+    (changeSlide)="onChangeSlide($event);" [style.visibility]="hideElement ? 'hidden' : 'none'"></carousel-arrows>
 </div>
diff --git a/src/app/services/declarations/index.ts b/src/app/services/declarations/index.ts
index 1212c6a..594708b 100644
--- a/src/app/services/declarations/index.ts
+++ b/src/app/services/declarations/index.ts
@@ -8,4 +8,5 @@ export interface ICarouselConfig {
   autoplay: boolean;
   autoplayDelay: number;
   stopAutoplayMinWidth: number;
+  hideNavElements: boolean;
 }

From 672f8bef082782fc9b9f50da1a1e8fb330af22a1 Mon Sep 17 00:00:00 2001
From: Axis <arunbluez@gmail.com>
Date: Tue, 5 Dec 2017 00:50:57 +0100
Subject: [PATCH 2/2] updated Readme

---
 README.md | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/README.md b/README.md
index 1e44500..2d7ddb9 100644
--- a/README.md
+++ b/README.md
@@ -29,7 +29,7 @@ imports: [CarouselModule]
 
 **component template:**
 
-add carousel and container 
+add carousel and container
 ```
 <div style="width: 800px; height: 400px">
   <carousel [sources]="imageSources" [config]="config"></carousel>
@@ -39,7 +39,7 @@ add carousel and container
 <br/>
 
 **component ts:**
- 
+
 ```
 import { ICarouselConfig, AnimationConfig } from 'angular4-carousel';
 ```
@@ -51,7 +51,7 @@ public imageSources: string[] = [
      'path to img2',
      'path to img3'
   ];
-  
+
   public config: ICarouselConfig = {
     verifyBeforeLoad: true,
     log: false,
@@ -59,16 +59,17 @@ public imageSources: string[] = [
     animationType: AnimationConfig.SLIDE,
     autoplay: true,
     autoplayDelay: 2000,
-    stopAutoplayMinWidth: 768
+    stopAutoplayMinWidth: 768,
+    hideNavElements: false;
   };
 ```
-  
-**Add font awesome to your project.** 
+
+**Add font awesome to your project.**
 ```
 <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
 ```
 (you can add font awesome using CLI or directly or CDN, or whatever you want, or redefine default styles for arrows ;) with pure CSS )
-  
+
 ## Config
 
 _verifyBeforeLoad_ <br/>
@@ -98,6 +99,10 @@ values: [number] (px)
 Prop for preventing autoplay on mobile devices.
 If window width (w/o scroll) <= value, autoplay will stop.
 
+_hideNavElements:_ <br/>
+values: false, true
+Hides the Navigation arrows and the pins
+
 ## API
 
 You can catch event on image loaded <br/>
@@ -122,4 +127,3 @@ this.x.onImageLoad().subscribe(
       () => console.log('all imgs loaded')
     )
 ```
-