feeles-ide/lib/Cards/ShotCard/index.js

The hackable and serializable IDE to make learning material

import _extends from 'babel-runtime/helpers/extends';
import _Object$getPrototypeOf from 'babel-runtime/core-js/object/get-prototype-of';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import Card from '../CardWindow';
import ContentReply from 'material-ui/svg-icons/content/reply';

import ShotPane from './ShotPane';
import shallowEqual from '../../utils/shallowEqual';

var ShotCard = function (_PureComponent) {
  _inherits(ShotCard, _PureComponent);

  function ShotCard() {
    var _ref;

    var _temp, _this, _ret;

    _classCallCheck(this, ShotCard);

    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = ShotCard.__proto__ || _Object$getPrototypeOf(ShotCard)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
      file: null,
      completes: []
    }, _this.handleCode = function (event) {
      var value = event.data.value;

      if (value) {
        // feeles.openCode()
        var file = _this.props.findFile(value);
        _this.setState({ file: file });
        _this.props.updateCard('ShotCard', { visible: true });
      } else {
        // feeles.closeCode()
        _this.props.updateCard('ShotCard', { visible: false });
      }
    }, _this.handleComplete = function (event) {
      var value = event.data.value;
      // feeles.exports

      if (!shallowEqual(value, _this.state.completes)) {
        _this.setState({ completes: value });
      }
    }, _temp), _possibleConstructorReturn(_this, _ret);
  }

  _createClass(ShotCard, [{
    key: 'componentWillMount',
    value: function componentWillMount() {
      var globalEvent = this.props.globalEvent;

      globalEvent.on('message.code', this.handleCode);
      globalEvent.on('message.complete', this.handleComplete);
    }
  }, {
    key: 'render',
    value: function render() {
      var visible = this.props.cardPropsBag.visible;


      return React.createElement(
        Card,
        _extends({ icon: ShotCard.icon() }, this.props.cardPropsBag),
        visible ? React.createElement(ShotPane, {
          fileView: this.props.fileView,
          file: this.state.file,
          completes: this.state.completes,
          files: this.props.files,
          findFile: this.props.findFile,
          localization: this.props.localization,
          getConfig: this.props.getConfig,
          loadConfig: this.props.loadConfig,
          globalEvent: this.props.globalEvent
        }) : null
      );
    }
  }], [{
    key: 'icon',
    value: function icon() {
      return React.createElement(ContentReply, null);
    }
  }]);

  return ShotCard;
}(PureComponent);

ShotCard.propTypes = {
  cardPropsBag: PropTypes.object.isRequired,
  fileView: PropTypes.object.isRequired,
  updateCard: PropTypes.func.isRequired,
  files: PropTypes.array.isRequired,
  findFile: PropTypes.func.isRequired,
  localization: PropTypes.object.isRequired,
  getConfig: PropTypes.func.isRequired,
  loadConfig: PropTypes.func.isRequired,
  globalEvent: PropTypes.object.isRequired
};
export default ShotCard;