Removed orange background

.gitignore

@@ -1 +1,44 @@
-dist
+# See http://help.github.com/ignore-files/ for more about ignoring files.
+
+# compiled output
+/dist
+/dist-ghpages
+/tmp
+/out-tsc
+
+# dependencies
+/node_modules
+
+# IDEs and editors
+/.idea
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# IDE - VSCode
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+
+# misc
+/.sass-cache
+/connect.lock
+/coverage
+/libpeerconnection.log
+npm-debug.log
+testem.log
+/typings
+
+# e2e
+/e2e/*.js
+/e2e/*.map
+
+# System Files
+.DS_Store
+Thumbs.db
+dist.tgz

ng-package.json

@@ -0,0 +1,6 @@
+{
+  "$schema": "./node_modules/ng-packagr/ng-package.schema.json",
+  "lib": {
+    "entryFile": "src/index.ts"
+  }
+}

package.json

@@ -1,46 +1,52 @@
 {
-  "name": "ui-carousel",
-  "version": "0.1.9",
+  "name": "ui-carousel-firstblood",
+  "version": "1.0.2",
   "license": "MIT",
   "author": {
-    "name": "Bougarfaoui El Houcine",
-    "email": "[email protected]"
+    "name": "Jan Hocevar",
+    "email": "[email protected]"
   },
-  "main": "./dist/index.js",
-  "module": "./dist/index.js",
-  "jsnext:main": "./dist/index.js",
   "tags": [
     "angular",
     "carousel",
     "typescript"
   ],
-  "scripts": {},
+  "scripts": {
+    "start": "ng serve --aot --host 0.0.0.0",
+    "build": "ng-packagr -p ng-package.json",
+    "test": "npm run lint && ng test --watch false",
+    "test-watch": "ng test",
+    "e2e": "ng e2e",
+    "e2e-watch": "watch \"ng e2e -s false\" src e2e --wait=1",
+    "lint": "ng lint"
+  },
+  "main": "./src/index.ts",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/bougarfaoui/ui-carousel"
+    "url": "git+https://github.com/firstbloodio/ui-carousel"
   },
   "bugs": {
-    "url": "https://github.com/bougarfaoui/ui-carousel/issues"
+    "url": "https://github.com/firstbloodio/ui-carousel/issues"
   },
-  "homepage": "https://github.com/bougarfaoui/ui-carousel#readme",
+  "homepage": "https://github.com/firstbloodio/ui-carousel#readme",
   "devDependencies": {
-    "@angular/animations": "^5.0.0",
-    "@angular/common": "^5.0.0",
-    "@angular/compiler": "^5.0.0",
-    "@angular/core": "^5.0.0",
-    "@angular/forms": "^5.0.0",
-    "@angular/http": "^5.0.0",
+    "@angular/animations": "^5.2.10",
+    "@angular/common": "^5.2.10",
+    "@angular/compiler": "^5.2.10",
+    "@angular/core": "^5.2.10",
+    "@angular/forms": "^5.2.10",
+    "@angular/http": "^5.2.10",
     "@angular/platform-browser": "^5.0.0",
-    "@angular/platform-browser-dynamic": "^5.0.0",
-    "@angular/router": "^5.0.0",
-    "core-js": "^2.4.1",
-    "rxjs": "^5.5.2",
-    "zone.js": "^0.8.14",
-    "@angular/cli": "1.5.0",
-    "@angular/compiler-cli": "^5.0.0",
-    "@angular/language-service": "^5.0.0",
+    "@angular/platform-browser-dynamic": "^5.2.10",
+    "@angular/router": "^5.2.10",
+    "core-js": "^2.5.5",
+    "rxjs": "^5.5.10",
+    "zone.js": "^0.8.26",
+    "@angular/cli": "1.7.4",
+    "@angular/compiler-cli": "^5.2.10",
+    "@angular/language-service": "^5.2.10",
     "@types/jasmine": "~2.5.53",
-    "@types/jasminewd2": "~2.0.2",
+    "@types/jasminewd2": "~2.0.3",
     "@types/node": "~6.0.60",
     "codelyzer": "~3.2.0",
     "jasmine-core": "~2.6.2",
@@ -51,9 +57,13 @@
     "karma-coverage-istanbul-reporter": "^1.2.1",
     "karma-jasmine": "~1.1.0",
     "karma-jasmine-html-reporter": "^0.2.2",
+    "ng-packagr": "^2.4.2",
     "protractor": "~5.1.2",
     "ts-node": "~3.2.0",
     "tslint": "~5.7.0",
-    "typescript": "~2.4.2"
+    "typescript": "~2.8.1"
+  },
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
   }
 }

ui-carousel-item/ui-carousel-item.component.ts → src/ui-carousel-item/ui-carousel-item.component.ts

@@ -48,7 +48,7 @@ import { UILazyloadDirective } from '../directives/ui-lazy-load.directive';
         .ui-carousel-item{
             height: 100%;
             width: 100%;
-            background: orange;
+            background: transparent;
             position: absolute;    
             overflow: hidden;
         }

ui-carousel/ui-carousel.component.ts → src/ui-carousel/ui-carousel.component.ts

@@ -11,25 +11,26 @@ import {
     ElementRef
 } from '@angular/core';
 
-import { Observable } from 'rxjs/Observable';
-import { Subject } from 'rxjs/Subject';
-import { Subscription } from 'rxjs/Subscription';
+import {Observable} from 'rxjs/Observable';
+import {Subject} from 'rxjs/Subject';
+import {Subscription} from 'rxjs/Subscription';
 import 'rxjs/add/operator/throttleTime';
 
-import { UICarouselItemComponent } from '../ui-carousel-item/ui-carousel-item.component';
+import {UICarouselItemComponent} from '../ui-carousel-item/ui-carousel-item.component';
 
 @Component({
     selector: 'ui-carousel',
-    template : `
-    <div (mouseenter)="(autoPlay)?autoPlayFunction(false):null" (mouseleave)="(autoPlay)?autoPlayFunction(true):null">
-        <ng-content></ng-content>
-        <dots *ngIf="isDotsVisible" [dots-count]="items.length" position="middle" [active-dot]="currentItemIndex" (on-click)="goTo($event)"></dots>
-        <arrow *ngIf="isArrowsVisible" dir="left" (on-click)="prev()" [disabled]="false"></arrow>
-        <arrow *ngIf="isArrowsVisible" dir="right" (on-click)="next()" [disabled]="false"></arrow>
-    </div>
+    template: `
+        <div (mouseenter)="(autoPlay)?autoPlayFunction(false):null" (mouseleave)="(autoPlay)?autoPlayFunction(true):null">
+            <ng-content></ng-content>
+            <dots *ngIf="isDotsVisible" [dots-count]="items.length" position="middle" [active-dot]="currentItemIndex"
+                  (on-click)="goTo($event)"></dots>
+            <arrow *ngIf="isArrowsVisible" dir="left" (on-click)="prev()" [disabled]="false"></arrow>
+            <arrow *ngIf="isArrowsVisible" dir="right" (on-click)="next()" [disabled]="false"></arrow>
+        </div>
     `,
     styles: [`
-        :host{
+        :host {
             display: block;
             overflow: hidden;
             position: relative;
@@ -39,10 +40,10 @@ import { UICarouselItemComponent } from '../ui-carousel-item/ui-carousel-item.co
 export class UICarouselComponent implements OnInit {
     private nextSubject: Subject<any> = new Subject<any>();
     private prevSubject: Subject<any> = new Subject<any>();
-    private subscriptions: Subscription;
+    private subscriptions = new Subscription();
     @Output() onChange: EventEmitter<any> = new EventEmitter<any>();
-    @Input() height: string = "300px";
-    @Input() width: string = "100%";
+    @Input() height: string = '300px';
+    @Input() width: string = '100%';
     @Input() speed: number;
     @Input() autoPlay: boolean = true;
     @Input() autoPlaySpeed: number;
@@ -56,19 +57,20 @@ export class UICarouselComponent implements OnInit {
 
     private _width: number;
     currentItemIndex: number = 0;
-    interval:any;
+    interval: any;
 
     private firstItemIndex: number; // the visual index of item and not necessary the index in the DOM
     private lastItemIndex: number; // ..
 
     constructor(
         private el: ElementRef
-    ) { }
+    ) {
+    }
 
     ngOnInit() {
         this.speed = this.speed || 500;
         this.autoPlaySpeed = this.autoPlaySpeed || 1500;
-        if(this.autoPlay){
+        if (this.autoPlay) {
             this.autoPlayFunction(true);
         }
         this.subscriptions.add(this.nextSubject.throttleTime(this.speed).subscribe(() => {
@@ -372,20 +374,19 @@ export class UICarouselComponent implements OnInit {
         }
     }
 
-    ngOnDestroy(){
+    ngOnDestroy() {
         this.subscriptions.unsubscribe();
     }
 
-    autoPlayFunction(boolean){
-        if(this.autoPlay){
-            if(boolean){
-                this.interval = setInterval(()=>{
+    autoPlayFunction(boolean) {
+        if (this.autoPlay) {
+            if (boolean) {
+                this.interval = setInterval(() => {
                     this.next();
                 }, this.autoPlaySpeed);
-            }else{
+            } else {
                 clearInterval(this.interval);
             }
         }
     }
 }
-

tsconfig.json

@@ -9,12 +9,12 @@
         "experimentalDecorators": true,
         "sourceMap": true,
         "noImplicitAny": true,
-        "outDir": "./dist",
+        "outDir": "./dist/out-tsc",
         "typeRoots": [
             "./node_modules/@types"
         ]
     },
     "files": [
-        "./index.ts"
+        "./src/index.ts"
     ]
 }