swup - npm Package Compare versions

Comparing version 0.2.7 to 0.2.8

lib/index.js

@@ -109,2 +109,8 @@ 'use strict';
             scroll: true,
+
+            doScrollingRightAway: false,
+            animateScroll: true,
+            scrollFriction: .3,
+            scrollAcceleration: .04,
+
             preload: true,
@@ -114,7 +120,2 @@ support: true,
 
-            animateScrollToAnchor: false,
-            animateScrollOnMobile: false,
-            doScrollingRightAway: false,
-            scrollDuration: 0,
-
             LINK_SELECTOR: 'a[href^="/"]:not([data-no-swup]), a[href^="#"]:not([data-no-swup]), a[xlink\\:href]'
@@ -168,6 +169,4 @@
          */
-        if (this.options.scroll) {
-            if (window.innerWidth <= 767) {
-                this.mobile = true;
-            }
+        if (window.innerWidth <= 767) {
+            this.mobile = true;
         }
@@ -300,3 +299,4 @@
                             if (this.options.scroll) {
-                                this.scrollTo(document.body, element.offsetTop, 320);
+                                var top = element.getBoundingClientRect().top + window.pageYOffset;
+                                this.scrollTo(document.body, top);
                             }
@@ -310,3 +310,3 @@ history.replaceState(undefined, undefined, link.getHash());
                         if (this.options.scroll) {
-                            this.scrollTo(document.body, 0, 320);
+                            this.scrollTo(document.body, 0, 1);
                         }
@@ -313,0 +313,0 @@ }

lib/modules/doScrolling.js

@@ -10,7 +10,4 @@ "use strict";
             if (element != null) {
-                if (self.animateScrollToAnchor) {
-                    self.scrollTo(document.body, element.offsetTop, this.options.scrollDuration);
-                } else {
-                    self.scrollTo(document.body, element.offsetTop, 20);
-                }
+                var top = element.getBoundingClientRect().top + window.pageYOffset;
+                self.scrollTo(document.body, top);
             } else {
@@ -21,11 +18,5 @@ console.warn("Element for offset not found (" + self.scrollToElement + ")");
         } else {
-            if (this.mobile && !this.options.animateScrollOnMobile) {
-                this.scrollTo(document.body, 0, 0);
-            } else if (this.mobile && this.options.animateScrollOnMobile) {
-                this.scrollTo(document.body, 0, this.options.scrollDuration);
-            } else {
-                this.scrollTo(document.body, 0, this.options.scrollDuration);
-            }
+            this.scrollTo(document.body, 0);
         }
     }
 };

lib/modules/scrollTo.js

 'use strict';
 
-module.exports = function (element, to, duration) {
+module.exports = function (element, to) {
     var _this = this;
 
+    var animatedScroll = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : this.options.animateScroll;
+
     var body = document.body;
@@ -11,4 +13,4 @@
 
-    var friction = 0.7;
-    var acceleration = 0.04;
+    var friction = 1 - this.options.scrollFriction;
+    var acceleration = this.options.scrollAcceleration;
 
@@ -73,4 +75,4 @@ var positionY = 100;
     this.triggerEvent('scrollStart');
-    if (duration == 0) {
-        window.scrollTo(0, 0);
+    if (animatedScroll == 0) {
+        window.scrollTo(0, to);
         this.triggerEvent('scrollDone');
@@ -77,0 +79,0 @@ } else {

package.json

 {
   "name": "swup",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "description": "Animated page transitions with css.",
@@ -9,2 +9,3 @@ "main": "lib/index.js",
     "compile": "babel --presets es2015,stage-0 -d lib/ src/",
+    "build": "webpack-cli",
     "prepublish": "npm run compile"
@@ -30,5 +31,9 @@ },
     "babel-cli": "^6.26.0",
+    "babel-loader": "^7.1.4",
     "babel-preset-es2015": "^6.24.1",
-    "babel-preset-stage-0": "^6.24.1"
+    "babel-preset-stage-0": "^6.24.1",
+    "uglifyjs-webpack-plugin": "^1.2.5",
+    "webpack": "^4.8.3",
+    "webpack-cli": "^2.1.3"
   }
 }

readme.md

@@ -55,3 +55,9 @@ # swup
 
+or include the file from the dist folder
 
+```html
+<script src="./dist/swup.js"></script>
+```
+
+
 ## How it works
@@ -89,2 +95,9 @@ Apart from simply loading the contents of the new page and replacing it in HTML, swup is built around css animation - you defined the transition and timing in CSS and swup handles the rest. Swup detects the end of transition of animated elements and proceeds to replacing the content and animating your page back. For the animations based on CSS to be possible, swup uses several classes that are assigned to the html tag through the process of page transition.
 
+or simply 
+
+```javascript
+var swup = new Swup()
+```
+in case you've included swup from a dist folder. 
+
 Add the `swup` id to the main element in HTML so it is replaced with the main element of the loaded page. Also, add the class that handles animations of our faded element - `a-fade`.
@@ -215,2 +228,17 @@ ```html
 
+There are additional settings for scroll:
+
+`doScrollingRightAway` defines if swup is supposed to wait for the replace of the page to scroll to the top. 
+`animateScroll` sets whether the scroll animation is enabled. 
+Animation of scroll is also adjustable with options `scrollFriction` and `scrollAcceleration`.
+
+All default values for additional options of scroll are displayed below:
+
+```javascript
+doScrollingRightAway: false,
+animateScroll: true,
+scrollFriction: .3,
+scrollAcceleration: .04,
+```
+
 ### Support
@@ -217,0 +245,0 @@ Due to the use of promises, transitionEnd and pushState features of JavaScript, swup has a basic support check built in to avoid breaking of the site in case of an older browser that doesn't support used features.

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

112411

increased by12.09%

Number of package files

30

increased by3.45%

Lines of code

802

increased by3.89%

Number of lines in readme file

346

increased by8.81%

Worsened metrics

Dev dependency count

7

increased by133.33%

No dependency changes