feeles-ide/lib/Menu/AboutDialog.js

The hackable and serializable IDE to make learning material

import _regeneratorRuntime from 'babel-runtime/regenerator';
import _asyncToGenerator from 'babel-runtime/helpers/asyncToGenerator';
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';
/*global CORE_VERSION CORE_CDN_URL*/
import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import Dialog from 'material-ui/Dialog';
import Table, { TableBody, TableRow, TableRowColumn } from 'material-ui/Table';
import TextField from 'material-ui/TextField';
import FlatButton from 'material-ui/FlatButton';

import { SourceFile } from '../File/';

var getStyles = function getStyles(props, context) {
  return {
    left: {
      textAlign: 'right'
    }
  };
};

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

  function AboutDialog() {
    var _ref,
        _this2 = this;

    var _temp, _this, _ret;

    _classCallCheck(this, AboutDialog);

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

    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = AboutDialog.__proto__ || _Object$getPrototypeOf(AboutDialog)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
      inputSrc: null
    }, _this.handleSrcInput = function (event) {
      var inputSrc = event.target.value;
      _this.setState({ inputSrc: inputSrc });
    }, _this.handleChangeSrc = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
      var file, url;
      return _regeneratorRuntime.wrap(function _callee$(_context) {
        while (1) {
          switch (_context.prev = _context.next) {
            case 0:
              _context.next = 2;
              return SourceFile.cdn({
                getConfig: _this.props.getConfig,
                files: _this.props.files,
                src: _this.state.inputSrc,
                deployURL: _this.props.deployURL
              });

            case 2:
              file = _context.sent;
              url = URL.createObjectURL(file.blob);

              location.assign(url);

            case 5:
            case 'end':
              return _context.stop();
          }
        }
      }, _callee, _this2);
    })), _temp), _possibleConstructorReturn(_this, _ret);
  }

  _createClass(AboutDialog, [{
    key: 'render',
    value: function render() {
      var _props = this.props,
          onRequestClose = _props.onRequestClose,
          aboutDialog = _props.localization.aboutDialog;

      var _getStyles = getStyles(this.props),
          left = _getStyles.left;

      return React.createElement(
        'div',
        null,
        React.createElement(
          Dialog,
          {
            open: true,
            title: aboutDialog.title,
            modal: false,
            onRequestClose: onRequestClose
          },
          React.createElement(
            Table,
            { selectable: false },
            React.createElement(
              TableBody,
              { displayRowCheckbox: false },
              React.createElement(
                TableRow,
                null,
                React.createElement(
                  TableRowColumn,
                  { style: left },
                  aboutDialog.coreVersion
                ),
                React.createElement(
                  TableRowColumn,
                  null,
                  CORE_VERSION
                )
              ),
              React.createElement(
                TableRow,
                null,
                React.createElement(
                  TableRowColumn,
                  { style: left },
                  aboutDialog.changeVersion
                ),
                React.createElement(
                  TableRowColumn,
                  null,
                  React.createElement(TextField, {
                    multiLine: true,
                    id: 'ver',
                    defaultValue: CORE_CDN_URL,
                    onChange: this.handleSrcInput
                  }),
                  React.createElement(FlatButton, {
                    primary: true,
                    label: aboutDialog.change,
                    disabled: !this.state.inputSrc,
                    onClick: this.handleChangeSrc
                  })
                )
              )
            )
          )
        )
      );
    }
  }]);

  return AboutDialog;
}(PureComponent);

AboutDialog.propTypes = {
  onRequestClose: PropTypes.func.isRequired,
  localization: PropTypes.object.isRequired,
  files: PropTypes.array.isRequired,
  getConfig: PropTypes.func.isRequired,
  deployURL: PropTypes.string
};
export default AboutDialog;