stepperjs - npm Package Compare versions

Comparing version 0.0.0 to 0.0.1

dist/Stepper.js

@@ -24,26 +24,33 @@ 'use strict';
         _classCallCheck(this, Stepper);
+
+        this.rafId = 0;
+        this.stopped = null;
     }
 
+    /**
+     * Start a step of raf with easing.
+     * @param {Object} options
+     * @example
+     * import Stepper from 'stepperjs';
+     * import linear from 'stepperjs/dist/easings/linear';
+     *
+     * const stepper = new Stepper();
+     *
+     * stepper.start({
+     *     duration: 300,
+     *     easing: linear,
+     *     loop: true,
+     *     start: () => ... ,
+     *     doing: (n) => ... ,
+     *     ended: () => ... ,
+     *     stopped: () => ...
+     * });
+     */
+
+
     _createClass(Stepper, [{
         key: 'start',
+        value: function start() {
+            var _this = this;
 
-
-        /**
-         * Start a step of raf with easing.
-         * @param {Object} options
-         * @example
-         * import Stepper from 'stepperjs';
-         * import linear from 'stepperjs/dist/easings/inQuad';
-         *
-         * const stepper = new Stepper();
-         *
-         * stepper.start({
-         *     duration: 300,
-         *     easing: linear,
-         *     start: () => ... ,
-         *     doing: (n) => ... ,
-         *     ended: () => ...
-         * });
-         */
-        value: function start() {
             var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
@@ -54,2 +61,4 @@ var _options$duration = options.duration,
                 easing = _options$easing === undefined ? _linear2.default : _options$easing,
+                _options$loop = options.loop,
+                loop = _options$loop === undefined ? false : _options$loop,
                 _options$start = options.start,
@@ -60,3 +69,5 @@ start = _options$start === undefined ? function () {} : _options$start,
                 _options$ended = options.ended,
-                ended = _options$ended === undefined ? function () {} : _options$ended;
+                ended = _options$ended === undefined ? function () {} : _options$ended,
+                _options$stopped = options.stopped,
+                stopped = _options$stopped === undefined ? function () {} : _options$stopped;
 
@@ -68,2 +79,8 @@
 
+            this.stopped = stopped;
+
+            if (this.rafId) {
+                this.stop();
+            }
+
             var end = +new Date() + duration;
@@ -76,7 +93,12 @@ var stepping = function stepping() {
                     ended();
-                    return;
+                    _this.rafId = 0;
+                    end = +new Date() + duration;
+
+                    if (!loop) {
+                        return;
+                    }
                 }
 
                 doing(1 - easing(time));
-                (0, _raf2.default)(stepping);
+                _this.rafId = (0, _raf2.default)(stepping);
             };
@@ -87,2 +109,16 @@
         }
+    }, {
+        key: 'stop',
+        value: function stop() {
+            if (!this.rafId) {
+                return;
+            }
+
+            _raf2.default.cancel(this.rafId);
+            this.rafId = 0;
+
+            if (this.stopped) {
+                this.stopped();
+            }
+        }
     }]);
@@ -89,0 +125,0 @@

package.json

 {
   "name": "stepperjs",
-  "version": "0.0.0",
+  "version": "0.0.1",
   "description": "A tiny requestAnimationFrame wrapper to improve usability.",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

README.md

@@ -5,2 +5,55 @@ # StepperJS
 
+## Installation
+
+### npm
+
+```bash
+$ npm install --save stepperjs
+```
+
+### Usage
+
+for Babel
+
+```js
+import Stepper from 'stepperjs';
+import linear from 'stepperjs/dist/easings/linear';
+
+const stepper = new Stepper();
+
+stepper.start({
+    duration: 300, // default: 0
+    easing: linear, // default: linear
+    loop: true, // default: false
+    start: () => ... ,
+    doing: (n) => ... ,
+    ended: () => ... ,
+    stopped: () => ...
+});
+
+stepper.stop();
+```
+
+for Browser
+
+```html
+<script type="text/javascript" src="stepperjs.browser-0.0.1.min.js"></script></head>
+```
+
+```js
+var stepper = new Stepper();
+
+stepper.start({
+    duration: 300,
+    easing: Stepper.easings.linear,
+    loop: true,
+    start: function () { ... },
+    doing: function (n) { ... },
+    ended: function () { ... },
+    stopped: function () { ... }
+});
+
+stepper.stop();
+```
+
 ## Supported browsers
@@ -7,0 +60,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

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

93818

increased by5.03%

Lines of code

1173

increased by4.36%

Number of lines in readme file

68

increased by353.33%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes