Fix/animation problems (#33)

CHANGELOG.md

@@ -2,6 +2,10 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### Bug Fixes
+* Animation wasn't playing the segments stated at the initial mount
+* Animation was reseted on every mount
+
 <a name="2.1.2"></a>
 ## [2.1.2](https://github.com/felippenardi/lottie-react-web/compare/v2.1.1...v2.1.2) (2018-08-09)
 

package.json

@@ -51,8 +51,8 @@
   },
   "dependencies": {
     "babel-runtime": "^6.26.0",
-    "lottie-web": "^5.2.1",
-    "lottie-api": "^1.0.0"
+    "lottie-web": "^5.6.1",
+    "lottie-api": "^1.0.2"
   },
   "main": "dist/index.js",
   "engines": {

src/index.js

@@ -18,7 +18,6 @@ export default class Lottie extends React.Component {
       renderer = 'svg',
       rendererSettings,
       assetsPath,
-      segments,
     } = options;
 
     this.options = {
@@ -27,7 +26,6 @@ export default class Lottie extends React.Component {
       renderer,
       loop: loop !== false,
       autoplay: autoplay !== false,
-      segments: segments !== false,
       animationData,
       rendererSettings,
       assetsPath
@@ -41,6 +39,14 @@ export default class Lottie extends React.Component {
     this.animApi = lottieApi.createAnimationApi(this.anim);
     this.registerEvents(eventListeners);
     this.setAnimationControl();
+
+    if (this.props.isStopped) {
+      this.stops();
+    } else if (this.props.segments) {
+      this.playSegments(true);
+    } else {
+      this.play();
+    }
   }
 
   componentWillUpdate(nextProps /* , nextState */) {
@@ -55,12 +61,17 @@ export default class Lottie extends React.Component {
     }
   }
 
-  componentDidUpdate() {
+  componentDidUpdate(prevProps) {
     if (this.props.isStopped) {
       this.stop();
     } else if (this.props.segments) {
-      const shouldForce = !!this.props.forceSegments;
-      this.playSegments(shouldForce);
+      if (
+        JSON.stringify(this.props.segments) ===
+        JSON.stringify(prevProps.segments)
+      ) {
+        return;
+      }
+      this.playSegments(this.props.forceSegments);
     } else {
       this.play();
     }