text: // Projector.js
  
  'use strict';
  
  import React, {Component} from 'react';
  import PropTypes from 'prop-types';
  import {StyleSheet, View, ViewPropTypes} from 'react-native';
  
  import Theme from '../../themes/Theme';
  
  export default class Projector extends Component {
  
    static propTypes = {
      ...ViewPropTypes,
      index: PropTypes.number,
      slideStyle: ViewPropTypes.style,
    };
  
    static defaultProps = {
      ...View.defaultProps,
      index: 0,
    };
  
    constructor(props) {
      super(props);
      this.slideShowns = this.initSlideShowns(props.children);
    }
  
    UNSAFE_componentWillReceiveProps(nextProps) {
      let nextSlideShowns = this.initSlideShowns(nextProps.children);
      if (nextSlideShowns.length != this.slideShowns.length) {
        this.slideShowns = nextSlideShowns;
      }
    }
  
    initSlideShowns(children) {
      if (children instanceof Array) return children.map(item => false);
      else if (children) return [false];
      return [];
    }
  
    render() {
      let {index, slideStyle, children, ...others} = this.props;
      if (!(children instanceof Array)) {
        if (children) children = [children];
        else children = [];
      }
      return (
        <View {...others}>
          {children.map((item, i) => {
            let active = (i == index);
            if (active) this.slideShowns[i] = true;
            let renderSlideStyle = [slideStyle, styles.slide, {opacity: active ? 1 : 0}]; 
            return (
              <View key={i} style={renderSlideStyle} pointerEvents={active ? 'auto' : 'none'}>
                {this.slideShowns[i] ? item : null}
              </View>
            );
          })}
        </View>
      );
    }
  }
  
  var styles = StyleSheet.create({
    slide: {
      position: 'absolute',
      left: 0,
      right: 0,
      top: 0,
      bottom: 0,
    },
  });
  