just-carousel - npm Package Compare versions

Comparing version 0.0.4 to 0.1.0

index.js

@@ -48,3 +48,4 @@ /* global module, window, document */
 		this._transformTo = transformTo.bind(this);
-		this._animateTo = animateTo.bind(this);
+		this._animateToSlide = animateToSlide.bind(this);
+		this._animate = animate.bind(this);
 		this._onAnimationEnd = onAnimationEnd.bind(this);
@@ -76,9 +77,30 @@ this._getMostVisibleSlideIdx = getMostVisibleSlideIdx.bind(this);
 
-			if (idx < 0 || idx + 1 > this.slides.length) {
-				return this; // need to show begin/end of list
+			var self = this;
+
+			if (idx < 0) {
+				this._animate(1, 80, function () {
+					self._animate(0, 80);
+				});
+
+				return this;
 			}
 
+			if (idx + 1 > this.slides.length) {
+				var rightPoint = -100 / this.slides.length * (this.slides.length - 1);
+
+				this._animate(rightPoint - 1, 80, function () {
+					self._animate(rightPoint, 80);
+				});
+
+				return this;
+			}
+
 			this.neededSlideIdx = idx;
 
-			this._animateTo(this.neededSlideIdx, needQuick, this._onAnimationEnd);
+			if (this._isAnimation) {
+				this._isAnimation = false;
+				cancelAnimationFrame(this.myReq);
+			}
+
+			this._animateToSlide(this.neededSlideIdx, needQuick, this._onAnimationEnd);
 			this.isBehindRightBroder = false;
@@ -281,6 +303,6 @@ this.isBehindLeftBroder = false;
 	function getNeededSlide() {
-		return this.neededSlideIdx !== null ? this.neededSlideIdx : this.currentSlideIdx;
+		return this.neededSlideIdx === null ? this.currentSlideIdx : this.neededSlideIdx;
 	}
 
-	function animateTo(idx, needQuick, cb) {
+	function animateToSlide(idx, needQuick, cb) {
 		var self = this;
@@ -323,2 +345,27 @@
 
+	function animate(pos, duration, cb) {
+		var self = this;
+		var start = performance.now();
+
+		this.shakeReq = requestAnimationFrame(function animate(time) {
+			var timeFraction = (time - start) / duration;
+			if (timeFraction > 1) timeFraction = 1;
+			if (timeFraction < 0) timeFraction = 0;
+
+			var progress = timing(timeFraction);
+			var range = pos - self.currentOffset;
+
+			var value = self.currentOffset + range * progress;
+
+			self.inner.style.transform = 'translate3d(' + value + '%, 0, 0)';
+			if (timeFraction < 1) {
+				self.shakeReq = requestAnimationFrame(animate);
+			} else {
+				self.currentOffset = pos;
+				cb = cb || nope;
+				cb.call(self);
+			}
+		});
+	}
+
 	function timing(t) {
@@ -325,0 +372,0 @@ return t * (2 - t);

package.json

 {
 	"name": "just-carousel",
-	"version": "0.0.4",
+	"version": "0.1.0",
 	"description": "Just an 1-item-on-screen carousel that works naturally like an iOS/android desktops and nothing else.",
@@ -5,0 +5,0 @@ "license": "MIT",

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

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

14455

increased by8.24%

Lines of code

304

increased by13.43%

No dependency changes