vue-insta-stories - npm Package Compare versions

Comparing version 0.9.7 to 0.9.8

dist/vue-insta-stories.cjs.js

@@ -494,3 +494,3 @@ 'use strict';
     },
-    emits: ['storyStart', 'storyEnd', 'allStoriesEnd', 'update:currentIndex', 'update:isPaused', 'seeMore'],
+    emits: ['storyStart', 'storyEnd', 'allStoriesEnd', 'update:currentIndex', 'update:isPaused', 'seeMore', 'next', 'prev'],
     watch: {
@@ -502,12 +502,4 @@ currentIndex: function (val) {
             immediate: true,
-            handler: function (current, prev) {
+            handler: function (current) {
                 this.$emit('update:currentIndex', current);
-                if (prev !== undefined) {
-                    this.$emit('storyEnd', prev);
-                    if (prev === this.stories.length - 1 && current === 0) {
-                        this.$emit('allStoriesEnd');
-                        if (this.loop)
-                            this.index = 0;
-                    }
-                }
                 this.$emit('storyStart', current);
@@ -555,3 +547,5 @@ },
     methods: {
-        nextSlide: function () {
+        nextSlide: function (emit) {
+            if (emit === void 0) { emit = true; }
+            emit && this.$emit('next');
             if (this.index < this.stories.length - 1) {
@@ -565,2 +559,3 @@ this.index++;
         previousSlide: function () {
+            this.$emit('prev');
             if (this.index > 0)
@@ -583,3 +578,10 @@ this.index--;
         storyEnd: function (index) {
-            this.nextSlide();
+            this.$emit('storyEnd', index);
+            this.nextSlide(false);
+            if (index === this.stories.length - 1) {
+                if (this.loop)
+                    this.index = 0;
+                else
+                    this.$emit('allStoriesEnd');
+            }
         },
@@ -586,0 +588,0 @@ },

dist/vue-insta-stories.esm.js

@@ -490,3 +490,3 @@ import { isVue2, h as h$1, defineComponent } from 'vue-demi';
     },
-    emits: ['storyStart', 'storyEnd', 'allStoriesEnd', 'update:currentIndex', 'update:isPaused', 'seeMore'],
+    emits: ['storyStart', 'storyEnd', 'allStoriesEnd', 'update:currentIndex', 'update:isPaused', 'seeMore', 'next', 'prev'],
     watch: {
@@ -498,12 +498,4 @@ currentIndex: function (val) {
             immediate: true,
-            handler: function (current, prev) {
+            handler: function (current) {
                 this.$emit('update:currentIndex', current);
-                if (prev !== undefined) {
-                    this.$emit('storyEnd', prev);
-                    if (prev === this.stories.length - 1 && current === 0) {
-                        this.$emit('allStoriesEnd');
-                        if (this.loop)
-                            this.index = 0;
-                    }
-                }
                 this.$emit('storyStart', current);
@@ -551,3 +543,5 @@ },
     methods: {
-        nextSlide: function () {
+        nextSlide: function (emit) {
+            if (emit === void 0) { emit = true; }
+            emit && this.$emit('next');
             if (this.index < this.stories.length - 1) {
@@ -561,2 +555,3 @@ this.index++;
         previousSlide: function () {
+            this.$emit('prev');
             if (this.index > 0)
@@ -579,3 +574,10 @@ this.index--;
         storyEnd: function (index) {
-            this.nextSlide();
+            this.$emit('storyEnd', index);
+            this.nextSlide(false);
+            if (index === this.stories.length - 1) {
+                if (this.loop)
+                    this.index = 0;
+                else
+                    this.$emit('allStoriesEnd');
+            }
         },
@@ -582,0 +584,0 @@ },

dist/vue-insta-stories.global.js

@@ -494,3 +494,3 @@ (function (global, factory) {
         },
-        emits: ['storyStart', 'storyEnd', 'allStoriesEnd', 'update:currentIndex', 'update:isPaused', 'seeMore'],
+        emits: ['storyStart', 'storyEnd', 'allStoriesEnd', 'update:currentIndex', 'update:isPaused', 'seeMore', 'next', 'prev'],
         watch: {
@@ -502,12 +502,4 @@ currentIndex: function (val) {
                 immediate: true,
-                handler: function (current, prev) {
+                handler: function (current) {
                     this.$emit('update:currentIndex', current);
-                    if (prev !== undefined) {
-                        this.$emit('storyEnd', prev);
-                        if (prev === this.stories.length - 1 && current === 0) {
-                            this.$emit('allStoriesEnd');
-                            if (this.loop)
-                                this.index = 0;
-                        }
-                    }
                     this.$emit('storyStart', current);
@@ -555,3 +547,5 @@ },
         methods: {
-            nextSlide: function () {
+            nextSlide: function (emit) {
+                if (emit === void 0) { emit = true; }
+                emit && this.$emit('next');
                 if (this.index < this.stories.length - 1) {
@@ -565,2 +559,3 @@ this.index++;
             previousSlide: function () {
+                this.$emit('prev');
                 if (this.index > 0)
@@ -583,3 +578,10 @@ this.index--;
             storyEnd: function (index) {
-                this.nextSlide();
+                this.$emit('storyEnd', index);
+                this.nextSlide(false);
+                if (index === this.stories.length - 1) {
+                    if (this.loop)
+                        this.index = 0;
+                    else
+                        this.$emit('allStoriesEnd');
+                }
             },
@@ -586,0 +588,0 @@ },

package.json

 {
   "name": "vue-insta-stories",
-  "version": "0.9.7",
+  "version": "0.9.8",
   "description": "Vue component for Instagram stories",
@@ -5,0 +5,0 @@ "keywords": [

README.md

@@ -26,13 +26,18 @@ ## Simple usage
 ### Props
-| Property          | Type             | Default  | Description                                                        |
-|-------------------|------------------|----------|--------------------------------------------------------------------|
-| `stories`         | [String/Object]  | required | An array of image urls or array of story objects (more info below) |
-| `interval`        | Number           | 2000     | Story duration in milliseconds                                     |
-| `isPaused`        | Boolean          | false    | Toggle the playing state                                           |
-| `loop`            | Boolean          | false    | Loop through stories                                               |
-| `currentIndex`    | Number           | 0        | Set the current story index                                        |
-| **Events**      |                    |          |                                                                    |
-| `storyStart`    | Function(Number)   | -        | Callback when a story starts                                       |
-| `storyEnd`      | Function(Number)   | -        | Callback when a story ends                                         |
-| `allStoriesEnd` | Function()         | -        | Callback when all stories in the array have ended                  |
+| Property              | Type                  | Default  | Description                                                        |
+|-----------------------|-----------------------|----------|--------------------------------------------------------------------|
+| `stories`             | Array<String\|Object> | required | An array of image urls or array of story objects (more info below) |
+| `interval`            | Number                | 2000     | Story duration in milliseconds                                     |
+| `isPaused`            | Boolean               | false    | Toggle the playing state                                           |
+| `loop`                | Boolean               | false    | Loop through stories                                               |
+| `currentIndex`        | Number                | 0        | Set the current story index                                        |
+| **Events**            |                       |          |                                                                    |
+| `storyStart`          | Function(index)       | -        | Callback when a story starts                                       |
+| `storyEnd`            | Function(index)       | -        | Callback when a story ends                                         |
+| `allStoriesEnd`       | Function()            | -        | Callback when all stories have ended (not emitted if loop=true)    |
+| `seeMore`             | Function(story)       | -        | Callback when user have pressed See more                           |
+| `prev`                | Function()            | -        | Callback when user press prev                                      |
+| `next`                | Function()            | -        | Callback when user press next                                      |
+| `update:currentIndex` | Function(index)       | -        |                                                                    |
+| `update:isPaused`     | Function(paused)      | -        |                                                                    |
 
@@ -39,0 +44,0 @@ ### Story Object

No alert changes

Improved metrics

Total package byte prevSize

146443

increased by0.73%

Lines of code

1906

increased by0.32%

Number of lines in readme file

116

increased by4.5%

No dependency changes