snippets.cson

# Your snippets
#
# Atom snippets allow you to enter a simple prefix in the editor and hit tab to
# expand the prefix into a larger code block with templated values.
#
# You can create a new snippet in this file by typing "snip" and then hitting
# tab.
#
# An example CoffeeScript snippet to expand log to console.log:
#
# '.source.coffee':
#   'Console log':
#     'prefix': 'log'
#     'body': 'console.log $1'
#
# This file uses CoffeeScript Object Notation (CSON).
# If you are unfamiliar with CSON, you can read more about it here:
# https://github.com/bevry/cson#what-is-cson

'.source.js':
  'React network call stub':
    'prefix': 'fetch'
    'body': """fetch(\'\')
        .then((response) => response.json())
        .then((responseJSON) => {
          // Take a look at the format, if you want.
          console.log(responseJSON);
          this.setState({
            blah: {
              key: responseJSON.blah[0].field,
              anotherkey: responseJSON.blah[0].anotherfield
            }
          });
        })
        .catch((error) => {
          console.warn(error);
        });
        """

  'Pan Responder Boilerplate':
    'prefix': 'pan'
    'body': """
            this._panResponder = PanResponder.create({
              onStartShouldSetPanResponder: this._handleStartShouldSetPanResponder,
              onMoveShouldSetPanResponder: this._handleMoveShouldSetPanResponder,
              onPanResponderGrant: this._handlePanResponderGrant,
              onPanResponderMove: this._handlePanResponderMove,
              onPanResponderRelease: this._handlePanResponderEnd,
              onPanResponderTerminate: this._handlePanResponderEnd
            });

            _handleStartShouldSetPanResponder: function(e: Object, gestureState: Object): boolean {
              return true;
            },
            _handleMoveShouldSetPanResponder: function(e: Object, gestureState: Object): boolean {
              return true;
            },
            _handlePanResponderGrant: function(e: Object, gestureState: Object) {
            },
            _handlePanResponderMove: function(e: Object, gestureState: Object) {
            },
            _handlePanResponderEnd: function(e: Object, gestureState: Object) {
            },
            """

  'React Class Boilerplate':
    'prefix': 'class'
    'body': """
            'use strict';

            import React, {
              Component,
              Text,
              View,
              ListView,
            } from 'react-native';
            /*
            import Something from '../../Somewhere'
            import styles from './styles';
            */
            export default class ClassName extends Component {

              constructor(props) {
                super(props);
                console.log(props);
                //let ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});

                this.state = {
                  something: "hi"
                };
              }

              render() {
                return (
                  <View style={styles.container}>

                  </View>
                );
              }
            }
            """

  'Image (React)':
    'prefix': 'image'
    'body': """
            <Image
              style={{width: 20, height: 20}}
              source={{uri: 'https://i.imgur.com/7JIaRGA.png'}}
            />
            """

  'Text (React)':
    'prefix': 'text'
    'body': """
            <Text style={styles.someStyle}>
              {someVar}
            </Text>
            """

  'View (React)':
    'prefix': 'view'
    'body': """
            <View style={styles.someStyle}>
              {someVar}
            </View>
            """
  'WebView (React)':
    'prefix': 'webview'
    'body': """
            <WebView style={styles.webview}
                    source={require('./www/amcharts-example.html')}
                    injectedJavaScript={'alert("hello friend")'}
                  />
            """
  'TouchableHighlight (React)':
    'prefix': 'touchable'
    'body': """
            <TouchableHighlight onPress={this.onPress}>
            </TouchableHighlight>
            """

  'StyleSheet Stub (React)':
    'prefix': 'stylesheet'
    'body': """
            'use strict';

            import React, {
              StyleSheet
            } from 'react-native';

            import Dimensions from 'Dimensions';
            let windowSize = Dimensions.get('window');

            const styles = StyleSheet.create({
              container: {

                backgroundColor: '#000000',
              },
            });

            export default styles

            """