vue-scroll-behavior - npm Package Compare versions

Comparing version 0.1.6 to 0.2.0

dist/vue-scroll-behavior.js

 /**
- * vue-scroll-behavior v0.1.6
+ * vue-scroll-behavior v0.2.0
  * (c) 2017 jeneser <[e-mail]>
  * @license MIT
  */
-!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):e.vueScrollBehavior=n()}(this,function(){"use strict";function e(e){void 0!==e.maxLength&&"number"==typeof e.maxLength&&(u._maxLength=e.maxLength),void 0!==e.ignore&&Array.isArray(e.ignore)&&(u._ignore=e.ignore)}function n(){return{x:window.pageXOffset,y:window.pageYOffset}}function t(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{x:0,y:0};e.nextTick(function(){window.scrollTo(n.x,n.y)})}function o(e){e.splice(0,parseInt(e.length/2))}function r(e){u._ignore.some(function(n){return e.fullPath.match(n)})}var i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},u=(function(){function e(e){this.value=e}function n(n){function t(e,n){return new Promise(function(t,r){var f={key:e,arg:n,resolve:t,reject:r,next:null};u?u=u.next=f:(i=u=f,o(e,n))})}function o(t,i){try{var u=n[t](i),f=u.value;f instanceof e?Promise.resolve(f.value).then(function(e){o("next",e)},function(e){o("throw",e)}):r(u.done?"return":"normal",u.value)}catch(e){r("throw",e)}}function r(e,n){switch(e){case"return":i.resolve({value:n,done:!0});break;case"throw":i.reject(n);break;default:i.resolve({value:n,done:!1})}i=i.next,i?o(i.key,i.arg):u=null}var i,u;this._invoke=t,"function"!=typeof n.return&&(this.return=void 0)}"function"==typeof Symbol&&Symbol.asyncIterator&&(n.prototype[Symbol.asyncIterator]=function(){return this}),n.prototype.next=function(e){return this._invoke("next",e)},n.prototype.throw=function(e){return this._invoke("throw",e)},n.prototype.return=function(e){return this._invoke("return",e)}}(),{_maxLength:50,_ignore:[]});return u.install=function(f,c){e(c),f.vsbHistoryList=[],f.vueScrollBehavior=function(e){var c=this;"object"===(void 0===e?"undefined":i(e))&&"function"==typeof e.beforeEach?(e.beforeEach(function(e,t,i){if(r(t))i();else{var f=c.vsbHistoryList,a=n(),l=f.findIndex(function(e){return e.path===t.fullPath});f.length>=u._maxLength&&o(f),-1!==l?f[l].position=a:f.push({path:t.fullPath,position:a}),i()}}),e.afterEach(function(e){if(r(e))t(f);else{var n=c.vsbHistoryList.find(function(n){return n.path===e.fullPath});void 0!==n?t(f,n.position):t(f)}})):console.warn("Vue-scroll-behavior dependent on vue-router! Please create the router instance.")},f.vueScrollBehavior(c.router)},"undefined"!=typeof window&&window.Vue&&window.Vue.use(u),u});
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):e.vueScrollBehavior=n()}(this,function(){"use strict";function e(e){void 0!==e.maxLength&&"number"==typeof e.maxLength&&(u._maxLength=e.maxLength),void 0!==e.ignore&&Array.isArray(e.ignore)&&(u._ignore=e.ignore),"number"==typeof e.delay&&(u._delay=e.delay)}function n(){return{x:window.pageXOffset,y:window.pageYOffset}}function t(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{x:0,y:0};u._delay>0?setTimeout(function(){e.nextTick(function(){window.scrollTo(n.x,n.y)})},u._delay):e.nextTick(function(){window.scrollTo(n.x,n.y)})}function o(e){e.splice(0,parseInt(e.length/2))}function r(e){u._ignore.some(function(n){return e.fullPath.match(n)})}var i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},u=(function(){function e(e){this.value=e}function n(n){function t(e,n){return new Promise(function(t,r){var f={key:e,arg:n,resolve:t,reject:r,next:null};u?u=u.next=f:(i=u=f,o(e,n))})}function o(t,i){try{var u=n[t](i),f=u.value;f instanceof e?Promise.resolve(f.value).then(function(e){o("next",e)},function(e){o("throw",e)}):r(u.done?"return":"normal",u.value)}catch(e){r("throw",e)}}function r(e,n){switch(e){case"return":i.resolve({value:n,done:!0});break;case"throw":i.reject(n);break;default:i.resolve({value:n,done:!1})}i=i.next,i?o(i.key,i.arg):u=null}var i,u;this._invoke=t,"function"!=typeof n.return&&(this.return=void 0)}"function"==typeof Symbol&&Symbol.asyncIterator&&(n.prototype[Symbol.asyncIterator]=function(){return this}),n.prototype.next=function(e){return this._invoke("next",e)},n.prototype.throw=function(e){return this._invoke("throw",e)},n.prototype.return=function(e){return this._invoke("return",e)}}(),{_maxLength:50,_ignore:[],_delay:0});return u.install=function(f,c){e(c),f.vsbHistoryList=[],f.vueScrollBehavior=function(e){var c=this;"object"===(void 0===e?"undefined":i(e))&&"function"==typeof e.beforeEach?(e.beforeEach(function(e,t,i){if(r(t))i();else{var f=c.vsbHistoryList,a=n(),l=f.findIndex(function(e){return e.path===t.fullPath});f.length>=u._maxLength&&o(f),-1!==l?f[l].position=a:f.push({path:t.fullPath,position:a}),i()}}),e.afterEach(function(e){if(r(e))t(f);else{var n=c.vsbHistoryList.find(function(n){return n.path===e.fullPath});void 0!==n?t(f,n.position):t(f)}})):console.warn("Vue-scroll-behavior dependent on vue-router! Please create the router instance.")},f.vueScrollBehavior(c.router)},"undefined"!=typeof window&&window.Vue&&window.Vue.use(u),u});

package.json

 {
   "name": "vue-scroll-behavior",
   "description": "Scroll behavior for Vue.js",
-  "version": "0.1.6",
+  "version": "0.2.0",
   "private": false,
@@ -34,21 +34,17 @@ "main": "dist/vue-scroll-behavior.js",
     "build:library": "node build/build.rollup.js",
-    "test": "npm run build"
+    "test": "npm run build",
+    "deploy": "gh-pages -d demo/dist"
   },
   "dependencies": {},
   "devDependencies": {
+    "autoprefixer": "^6.7.2",
     "babel-cli": "^6.14.0",
+    "babel-core": "^6.22.1",
+    "babel-loader": "^6.2.10",
     "babel-plugin-external-helpers": "^6.22.0",
+    "babel-plugin-transform-runtime": "^6.22.0",
     "babel-polyfill": "^6.13.0",
+    "babel-preset-env": "^1.3.2",
     "babel-preset-es2015": "^6.22.0",
     "babel-preset-es2015-rollup": "^1.2.0",
-    "rollup": "^0.35.10",
-    "rollup-plugin-babel": "^2.6.1",
-    "rollup-plugin-uglify": "^1.0.1",
-    "vue": "^2.3.3",
-    "vue-router": "^2.3.1",
-    "autoprefixer": "^6.7.2",
-    "babel-core": "^6.22.1",
-    "babel-loader": "^6.2.10",
-    "babel-plugin-transform-runtime": "^6.22.0",
-    "babel-preset-env": "^1.3.2",
     "babel-preset-stage-2": "^6.22.0",
@@ -65,7 +61,5 @@ "babel-register": "^6.22.0",
     "friendly-errors-webpack-plugin": "^1.1.3",
+    "gh-pages": "^1.0.0",
     "html-webpack-plugin": "^2.28.0",
     "http-proxy-middleware": "^0.17.3",
-    "webpack-bundle-analyzer": "^2.2.1",
-    "semver": "^5.3.0",
-    "shelljs": "^0.7.6",
     "opn": "^4.0.2",
@@ -75,7 +69,15 @@ "optimize-css-assets-webpack-plugin": "^1.3.0",
     "rimraf": "^2.6.0",
+    "rollup": "^0.35.10",
+    "rollup-plugin-babel": "^2.6.1",
+    "rollup-plugin-uglify": "^1.0.1",
+    "semver": "^5.3.0",
+    "shelljs": "^0.7.6",
     "url-loader": "^0.5.8",
+    "vue": "^2.3.3",
     "vue-loader": "^12.1.0",
+    "vue-router": "^2.3.1",
     "vue-style-loader": "^3.0.1",
     "vue-template-compiler": "^2.3.3",
     "webpack": "^2.6.1",
+    "webpack-bundle-analyzer": "^2.2.1",
     "webpack-dev-middleware": "^1.10.0",
@@ -82,0 +84,0 @@ "webpack-hot-middleware": "^2.18.0",

README.md

 ## vue-scroll-behavior
 
-**Completely customize the scroll behavior on route navigation**
+**Customize the scrolling position on route navigation**
 
@@ -57,3 +57,3 @@ [![npm version](https://badge.fury.io/js/vue-scroll-behavior.svg)](https://badge.fury.io/js/vue-scroll-behavior) [![Build Status](https://travis-ci.org/jeneser/vue-scroll-behavior.svg?branch=master)](https://travis-ci.org/jeneser/vue-scroll-behavior) [![David](https://img.shields.io/david/expressjs/express.svg?style=flat-square)](https://github.com/jeneser/douban) [![Percentage of issues still open](http://isitmaintained.com/badge/open/jeneser/vue-scroll-behavior.svg)](http://isitmaintained.com/project/jeneser/vue-scroll-behavior "Percentage of issues still open") [![PR](https://img.shields.io/badge/PR-welcome-brightgreen.svg)](https://github.com/jeneser/vue-scroll-behavior/pulls) [![license](https://img.shields.io/badge/license-MIT-brightgreen.svg)](https://github.com/jeneser/vue-scroll-behavior/blob/master/LICENSE)
 ```html
-<script src="https://unpkg.com/vue-scroll-behavior@0.1.6/dist/vue-scroll-behavior.js"></script>
+<script src="https://unpkg.com/vue-scroll-behavior@0.2.0/dist/vue-scroll-behavior.js"></script>
 ```
@@ -65,4 +65,9 @@
 
-**`vue-scroll-behavior` allows you to completely customize the scroll behavior in HTML5 history mode and hash mode.**
+**`vue-scroll-behavior` allows you to customize the scrolling position on route navigation. Especially hash mode. You just need to tell it which routes need to be processed, and it will do that automatically**
 
+**By default, It will scroll to the saved position. If you ignore some routes, they will directly scroll to the top**
+
+**Of course, If you have some special scenes, we also provide some options, and you can manually use them to save or restore the scroll position**
+
+**If you use transitions on all of your route changes, use the _delay_ option to delay the scroll until the appropriate point (e.g. the middle of the changeover).**
 ## Features
@@ -72,2 +77,4 @@
 * **Compatibility** - Working in HTML5 history mode and hash mode
+* **Automatically** - Automatically saves or restores the scroll position
+* **Customizable** - Can manually save or restore the scroll position
 
@@ -85,5 +92,6 @@ ## Example
 Vue.use(vueScrollBehavior, {
-  router: router,
-  maxLength: 100,
-  ignore: [/\/boo/, /\/zoo/],
+  router: router,    // The router instance
+  maxLength: 100,    // Saved history List max length
+  ignore: [/\/boo/, /\/zoo/],    // ignore some routes, they will directly scroll to the top
+  delay: 0          // Delay by a number of milliseconds
 })
@@ -111,4 +119,5 @@ ```
 `router`       | Object     |           | The router instance: `const router = new VueRouter({})`
-`ignore`       | Array      | `[ ]`     | **RegExp** list to ignore some routes
+`ignore`       | Array      | `[ ]`     | **RegExp** list to ignore some routes, they will directly scroll to the top
 `maxLength`    | Number     | `50`      | Saved history List max length
+`delay`        | Number     | `0`       | Delay scroll by a number of milliseconds
 
@@ -118,4 +127,8 @@
 
+This project uses semantic versioning. [Learn more](http://semver.org/)
+
+- October 27, 2017:
+  - Publish @0.2.0 Merged PR[#9](https://github.com/jeneser/vue-scroll-behavior/pull/9), Add delay
 - June 24, 2017:
-  - Publish @0.1.6 Fix issue#2
+  - Publish @0.1.6 Fix issue[#2](https://github.com/jeneser/vue-scroll-behavior/issues/2)
 - June 7, 2017:
@@ -122,0 +135,0 @@ - Publish @0.1.5 Add some opts

src/utils/helpers.js

@@ -15,2 +15,6 @@ import vueScrollBehavior from '../vue-scroll-behavior'
   }
+
+  if (typeof options.delay === 'number') {
+    vueScrollBehavior._delay = options.delay
+  }
 }
@@ -32,5 +36,13 @@
 export function setScrollPosition (Vue, position = {x: 0, y: 0}) {
-  Vue.nextTick(() => {
-    window.scrollTo(position.x, position.y)
-  })
+  if (vueScrollBehavior._delay > 0) {
+    setTimeout(() => {
+      Vue.nextTick(() => {
+          window.scrollTo(position.x, position.y)
+      })
+    }, vueScrollBehavior._delay);
+  } else {
+    Vue.nextTick(() => {
+      window.scrollTo(position.x, position.y)
+    })
+  }
 }
@@ -37,0 +49,0 @@

src/vue-scroll-behavior.js

 /**
-  * vue-scroll-behavior v0.1.6
+  * vue-scroll-behavior v0.2.0
   * (c) 2017 jeneser
@@ -12,3 +12,4 @@ * @license MIT
   _maxLength: 50,
-  _ignore: []
+  _ignore: [],
+  _delay: 0
 }
@@ -15,0 +16,0 @@

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

17220

increased by11.27%

Lines of code

151

increased by9.42%

Number of lines in readme file

155

increased by9.15%

Worsened metrics

Dev dependency count

44

increased by2.33%

No dependency changes