ng2-slides - npm Package Compare versions

Comparing version 0.3.5 to 0.4.0

dist/index.d.ts

@@ -1,3 +0,2 @@
-export * from './slide';
 export * from './services';
 export * from './slides.module';

dist/index.js

@@ -5,4 +5,3 @@ "use strict";
 }
-__export(require('./slide'));
-__export(require('./services'));
-__export(require('./slides.module'));
+__export(require("./services"));
+__export(require("./slides.module"));

dist/services/index.d.ts

 export * from './slide.service';
-export * from './slide.event';
+export * from './models';

dist/services/index.js

@@ -5,3 +5,3 @@ "use strict";
 }
-__export(require('./slide.service'));
-__export(require('./slide.event'));
+__export(require("./slide.service"));
+__export(require("./models"));

dist/services/slide.service.d.ts

 import { ReplaySubject } from 'rxjs';
-import { SlideEvent } from './slide.event';
-import { SlideServiceConfig } from './slide-service.config';
+import { SlideEvent, SlideServiceConfig } from './models';
 export declare class SlideService {
     slideChange: ReplaySubject<SlideEvent>;
-    private elements;
-    private animator;
-    private animating;
+    private engine;
     private config;
-    private keys;
-    private keyObs;
-    private touchObs;
-    private scrollObs;
-    init(): void;
-    scrollToIndex(index: number, previousIndex?: number, elements?: HTMLElement[]): void;
-    setConfiguration(config: SlideServiceConfig): void;
-    private getNg2SlideElements();
-    private getCurrentSlideIndex(elements);
-    private preventDefault(e);
+    init(initialIndex?: number, config?: SlideServiceConfig): void;
+    scrollToIndex(toIndex: number): void;
+    setPause(state: boolean): void;
+    private bootstrapEngine(initialIndex);
+    private startResizeListener();
+    private checkWhichEngineToUse();
 }

dist/services/slide.service.js

@@ -8,98 +8,62 @@ "use strict";
 };
-var __metadata = (this && this.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = require('@angular/core');
-var rxjs_1 = require('rxjs');
-var slide_animator_1 = require('./slide.animator');
-var slide_event_1 = require('./slide.event');
+var core_1 = require("@angular/core");
+var rxjs_1 = require("rxjs");
+var slider_engine_1 = require("./slider-engine");
+var slide_helper_1 = require("./slide-helper");
 var SlideService = (function () {
     function SlideService() {
-        var _this = this;
         this.slideChange = new rxjs_1.ReplaySubject();
-        this.animating = false;
         this.config = {
-            sensitivity: 20
+            sensitivity: 40,
+            minHeight: 400,
+            minWidth: 800
         };
-        this.keys = { 37: true, 38: true, 39: true, 40: true };
-        this.keyObs = rxjs_1.Observable.fromEvent(document, 'keydown')
-            .filter(function (event) { return _this.keys[event.keyCode]; });
-        this.touchObs = rxjs_1.Observable.fromEvent(window, 'touchstart')
-            .zip(rxjs_1.Observable.fromEvent(window, 'touchend'))
-            .map(function (payload) {
-            var anyPayload = payload;
-            return {
-                deltaY: anyPayload[0].changedTouches[0].clientY -
-                    anyPayload[1].changedTouches[0].clientY
-            };
-        })
-            .filter(function (change) { return Math.abs(change.deltaY) > 50; });
-        this.scrollObs = rxjs_1.Observable.fromEvent(window, 'wheel')
-            .merge(rxjs_1.Observable.fromEvent(window, 'mousewheel'))
-            .merge(rxjs_1.Observable.fromEvent(window, 'DOMMouseScroll'))
-            .merge(rxjs_1.Observable.fromEvent(window, 'touchmove'))
-            .merge(this.touchObs)
-            .merge(this.keyObs);
     }
-    SlideService.prototype.init = function () {
-        var _this = this;
-        this.elements = this.getNg2SlideElements();
-        this.animator = new slide_animator_1.SlideAnimator();
-        this.scrollObs.subscribe(function (event) {
-            if (window.innerHeight > 600) {
-                _this.preventDefault(event);
-                if (!_this.animating) {
-                    _this.elements = _this.getNg2SlideElements();
-                    var currentIndex = _this.getCurrentSlideIndex(_this.elements);
-                    if (event.deltaY > _this.config.sensitivity || event.key === 'ArrowDown') {
-                        _this.scrollToIndex(currentIndex + 1, currentIndex);
-                    }
-                    else if (event.deltaY < -_this.config.sensitivity || event.key === 'ArrowUp') {
-                        _this.scrollToIndex(currentIndex - 1, currentIndex);
-                    }
-                }
-            }
-        });
+    SlideService.prototype.init = function (initialIndex, config) {
+        if (initialIndex === void 0) { initialIndex = 0; }
+        if (config)
+            this.config = config;
+        this.engine = new (this.checkWhichEngineToUse())();
+        this.bootstrapEngine(initialIndex);
+        this.startResizeListener();
     };
-    SlideService.prototype.scrollToIndex = function (index, previousIndex, elements) {
-        var _this = this;
-        if (elements)
-            this.elements = elements;
-        if (!previousIndex)
-            previousIndex = this.getCurrentSlideIndex(this.elements);
-        this.slideChange.next(new slide_event_1.SlideEventStart(previousIndex, index));
-        if (this.elements[index]) {
-            var startingPoint = window.scrollY;
-            var endingPoint = this.elements[index].getBoundingClientRect().top + window.scrollY;
-            this.animating = true;
-            this.animator.animateScroll(startingPoint, endingPoint, function () {
-                _this.slideChange.next(new slide_event_1.SlideEventEnd(previousIndex, index));
-                _this.animating = false;
-            });
-        }
+    SlideService.prototype.scrollToIndex = function (toIndex) {
+        this.engine.scrollToIndex(toIndex);
     };
-    SlideService.prototype.setConfiguration = function (config) {
-        this.config = Object.assign(this.config, config);
+    SlideService.prototype.setPause = function (state) {
+        this.engine.setPause(state);
     };
-    SlideService.prototype.getNg2SlideElements = function () {
-        return Array.prototype.slice.call(document.querySelectorAll('ng2-slide'));
+    SlideService.prototype.bootstrapEngine = function (initialIndex) {
+        var _this = this;
+        this.engine.init(initialIndex, this.config)
+            .subscribe(function (event) { return _this.slideChange.next(event); });
     };
-    SlideService.prototype.getCurrentSlideIndex = function (elements) {
-        return elements.findIndex(function (element) {
-            var offsetTop = element.getBoundingClientRect().top + window.scrollY;
-            return offsetTop <= window.scrollY && window.scrollY < offsetTop + element.clientHeight;
+    SlideService.prototype.startResizeListener = function () {
+        var _this = this;
+        rxjs_1.Observable.fromEvent(window, 'resize')
+            .debounceTime(300)
+            .map(function () { return _this.checkWhichEngineToUse(); })
+            .filter(function (newEngine) { return !(_this.engine instanceof newEngine); })
+            .subscribe(function (newEngine) {
+            var previousIndex = _this.engine.remove();
+            delete _this.engine;
+            _this.engine = new (newEngine)();
+            _this.bootstrapEngine(previousIndex);
         });
     };
-    SlideService.prototype.preventDefault = function (e) {
-        e = e || window.event;
-        if (e.preventDefault)
-            e.preventDefault();
-        e.returnValue = false;
+    SlideService.prototype.checkWhichEngineToUse = function () {
+        if (slide_helper_1.SlideHelper.isTouchDevice() ||
+            window.innerHeight < this.config.minHeight ||
+            window.innerWidth < this.config.minWidth) {
+            return slider_engine_1.ScrollSliderEngine;
+        }
+        else {
+            return slider_engine_1.TranslateSliderEngine;
+        }
     };
-    SlideService = __decorate([
-        core_1.Injectable(), 
-        __metadata('design:paramtypes', [])
-    ], SlideService);
     return SlideService;
 }());
+SlideService = __decorate([
+    core_1.Injectable()
+], SlideService);
 exports.SlideService = SlideService;

dist/slide/index.js

@@ -5,2 +5,2 @@ "use strict";
 }
-__export(require('./slide.component'));
+__export(require("./slide.component"));

dist/slide/slide.component.js

@@ -8,21 +8,17 @@ "use strict";
 };
-var __metadata = (this && this.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = require('@angular/core');
+var core_1 = require("@angular/core");
 var SlideComponent = (function () {
     function SlideComponent() {
     }
-    SlideComponent = __decorate([
-        core_1.Component({
-            selector: 'ng2-slide',
-            styles: [
-                ":host {\n\t\t\tdisplay: block;\n\t\t\theight: auto;\n\t\t}\n\t\t\n\t\t@media only screen and (min-height: 600px) {\n\t\t\t:host {\n\t\t\t\theight: 100vh;\n\t\t\t}\n\t\t}"
-            ],
-            template: "<ng-content></ng-content>"
-        }), 
-        __metadata('design:paramtypes', [])
-    ], SlideComponent);
     return SlideComponent;
 }());
+SlideComponent = __decorate([
+    core_1.Component({
+        selector: 'ng2-slide',
+        styleUrls: [
+            './slide.styles.css'
+        ],
+        template: "<ng-content></ng-content>"
+    })
+], SlideComponent);
 exports.SlideComponent = SlideComponent;

dist/slides.module.js

@@ -8,25 +8,23 @@ "use strict";
 };
-var __metadata = (this && this.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var core_1 = require('@angular/core');
-var slide_1 = require('./slide');
-var services_1 = require('./services');
+var core_1 = require("@angular/core");
+var slide_1 = require("./slide");
+var services_1 = require("./services");
 var SlidesModule = (function () {
     function SlidesModule() {
     }
-    SlidesModule = __decorate([
-        core_1.NgModule({
-            declarations: [
-                slide_1.SlideComponent
-            ],
-            providers: [
-                services_1.SlideService
-            ],
-            bootstrap: [slide_1.SlideComponent]
-        }), 
-        __metadata('design:paramtypes', [])
-    ], SlidesModule);
     return SlidesModule;
 }());
+SlidesModule = __decorate([
+    core_1.NgModule({
+        declarations: [
+            slide_1.SlideComponent
+        ],
+        providers: [
+            services_1.SlideService
+        ],
+        exports: [
+            slide_1.SlideComponent
+        ]
+    })
+], SlidesModule);
 exports.SlidesModule = SlidesModule;

package.json

 {
   "name": "ng2-slides",
-  "version": "0.3.5",
+  "version": "0.4.0",
   "author": "Jamie Spittal",
@@ -27,13 +27,13 @@ "description": "An Angular2 library to create full height slides",
   "peerDependencies": {
-    "@angular/core": "^2.0.0-rc.4",
-    "typescript": "^2.0.0-beta",
-    "rxjs": "5.0.0-beta.6",
-    "zone.js": "^0.6.12"
+    "@angular/core": "^2.4.5",
+    "rxjs": "^5.1.0",
+    "typescript": "^2.1.5",
+    "zone.js": "^0.7.6"
   },
   "dependencies": {
-    "@angular/core": "^2.0.0-rc.4",
-    "typescript": "^2.0.0-beta",
-    "rxjs": "5.0.0-beta.6",
-    "zone.js": "^0.6.12"
+    "@angular/core": "^2.4.5",
+    "rxjs": "^5.1.0",
+    "typescript": "^2.1.5",
+    "zone.js": "^0.7.6"
   }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

35559

increased by66.4%

Number of package files

51

increased by112.5%

Lines of code

811

increased by78.24%

Worsened metrics

Number of downloads

0

decreased by-100%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• - Removedrxjs@5.0.0-beta.6(transitive)

• - Removedzone.js@0.6.26(transitive)

• Updated@angular/core@^2.4.5

• Updatedrxjs@^5.1.0

• Updatedtypescript@^2.1.5

• Updatedzone.js@^0.7.6