Add Prettier and Travis (#31)

* Add Prettier and Travis

* Ignore dist

Author: Minishlink

.prettierignore

@@ -0,0 +1,4 @@
+node_modules
+package.json
+gift.json
+dist

.travis.yml

@@ -0,0 +1,14 @@
+language: node_js
+node_js:
+  - '12'
+install:
+  - yarn --frozen-lockfile
+script: yarn test
+cache:
+  directories:
+    - node_modules
+env:
+  matrix:
+    - CI=true TZ=Europe/Paris
+notifications:
+  email: false

README.md

@@ -1,7 +1,9 @@
 # react-native-web-lottie
+
 > React Native for Web implementation of Lottie
 
 ## Getting started
+
 `$ npm install react-native-web-lottie --save`
 
 Alias the package in your webpack config:
@@ -17,14 +19,18 @@ resolve: {
 ```
 
 ## Usage
+
 See [Lottie's docs](https://airbnb.io/lottie/#/react-native).
 
 ## Examples
+
 See the [storybook](https://react-native-web-community.github.io/react-native-web-lottie/storybook).
 
 ## Contributing
+
 PRs are welcome!
 
 The following important features are not implemented:
+
 - `progress` prop
 - imperative API

docs/.storybook/babel.config.js

@@ -1,7 +1,7 @@
-module.exports = function(api) {
+module.exports = function (api) {
   api.cache(true);
   return {
     presets: ['module:metro-react-native-babel-preset'],
-    plugins: ['react-native-web']
+    plugins: ['react-native-web'],
   };
 };

docs/.storybook/config.js

@@ -10,7 +10,7 @@ setOptions({
   goFullScreen: false,
   showLeftPanel: true,
   showDownPanel: false,
-  downPanelInRight: false
+  downPanelInRight: false,
 });
 
 function loadStories() {

docs/.storybook/decorator-centered.js

@@ -10,6 +10,6 @@ const styles = StyleSheet.create({
   },
 });
 
-export default function(renderStory) {
+export default function (renderStory) {
   return <View style={styles.root}>{renderStory()}</View>;
 }

docs/.storybook/webpack.config.js

@@ -1,39 +1,36 @@
 const path = require('path');
 const webpack = require('webpack');
 
-module.exports = ({config, mode}) => {
+module.exports = ({ config, mode }) => {
   const DEV = mode === 'DEVELOPMENT';
 
   const libDirectory = path.resolve(__dirname, '../../');
 
   config.module.rules.push({
     test: /\.js$/,
-    include: [
-      path.resolve(libDirectory, 'src'),
-      path.resolve(libDirectory, 'docs'),
-    ],
+    include: [path.resolve(libDirectory, 'src'), path.resolve(libDirectory, 'docs')],
     use: {
       loader: 'babel-loader',
       options: {
         cacheDirectory: true,
         presets: ['module:metro-react-native-babel-preset'],
         plugins: ['react-native-web'],
-      }
-    }
+      },
+    },
   });
 
   config.plugins.push(
     new webpack.DefinePlugin({
       'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development'),
-      'process.env.__REACT_NATIVE_DEBUG_ENABLED__': DEV
+      'process.env.__REACT_NATIVE_DEBUG_ENABLED__': DEV,
     })
   );
 
   config.resolve.extensions = ['.web.js', '.js', '.json', '.web.jsx', '.jsx'];
 
   config.resolve.alias = {
     'react-native$': 'react-native-web',
-    'lottie-react-native': path.join(__dirname, '../../src/')
+    'lottie-react-native': path.join(__dirname, '../../src/'),
   };
 
   return config;

docs/stories/index.js

@@ -7,4 +7,6 @@ import { storiesOf } from '@storybook/react';
 storiesOf('Lottie', module)
   .add('basic', () => <Animation source={require('./assets/gift.json')} autoPlay />)
   .add('loop', () => <Animation source={require('./assets/gift.json')} loop autoPlay />)
-  .add('onAnimationFinish', () => <Animation source={require('./assets/gift.json')} autoPlay onAnimationFinish={() => alert('Finished!')}/>);
+  .add('onAnimationFinish', () => (
+    <Animation source={require('./assets/gift.json')} autoPlay onAnimationFinish={() => alert('Finished!')} />
+  ));

package.json

@@ -22,7 +22,7 @@
   "scripts": {
     "prepublish": "yarn build",
     "build": "mkdir -p dist && babel src --out-dir dist --copy-files",
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "prettier --check ."
   },
   "babel": {
     "presets": [
@@ -44,7 +44,7 @@
     "babel-loader": "^8.0.5",
     "babel-plugin-react-native-web": "^0.10.0",
     "metro-react-native-babel-preset": "^0.51.1",
-    "prettier": "^1.7.3",
+    "prettier": "^2.0.5",
     "react": "^16.7.0",
     "react-art": "^16.7.0",
     "react-dom": "^16.7.0",

src/index.js

@@ -16,7 +16,7 @@ class Animation extends PureComponent {
     }
   }
 
-  loadAnimation = props => {
+  loadAnimation = (props) => {
     if (this.anim) {
       this.anim.destroy();
     }
@@ -27,37 +27,37 @@ class Animation extends PureComponent {
       renderer: 'svg',
       loop: props.loop || false,
       autoplay: props.autoPlay,
-      rendererSettings: props.rendererSettings || {},
+      rendererSettings: props.rendererSettings || {},
     });
 
     if (props.onAnimationFinish) {
-      this.anim.addEventListener("complete", props.onAnimationFinish);
+      this.anim.addEventListener('complete', props.onAnimationFinish);
     }
   };
 
-  setAnimationDOMNode = ref => (this.animationDOMNode = ReactDOM.findDOMNode(ref));
+  setAnimationDOMNode = (ref) => (this.animationDOMNode = ReactDOM.findDOMNode(ref));
 
   play = (...frames) => {
     if (!this.anim) {
-      return
+      return;
     }
 
-    this.anim.playSegments(frames, true)
-  }
+    this.anim.playSegments(frames, true);
+  };
 
   reset = () => {
     if (!this.anim) {
-      return
+      return;
     }
 
-    this.anim.stop()
-  }
-  
+    this.anim.stop();
+  };
+
   render() {
     return <View style={this.props.style} ref={this.setAnimationDOMNode} />;
   }
 }
 
 export default React.forwardRef((props, ref) => (
-  <Animation {...props} ref={typeof ref == 'function' ? c => ref(c && c.anim) : ref} />
+  <Animation {...props} ref={typeof ref == 'function' ? (c) => ref(c && c.anim) : ref} />
 ));