feeles-ide
Version:
The hackable and serializable IDE to make learning material
317 lines (263 loc) • 9.9 kB
JavaScript
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _typestyle = require("typestyle");
var _Dialog = _interopRequireDefault(require("@material-ui/core/Dialog"));
var _DialogTitle = _interopRequireDefault(require("@material-ui/core/DialogTitle"));
var _DialogContent = _interopRequireDefault(require("@material-ui/core/DialogContent"));
var _CircularProgress = _interopRequireDefault(require("@material-ui/core/CircularProgress"));
var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
var _brown = _interopRequireDefault(require("@material-ui/core/colors/brown"));
var _database = require("../database/");
var _CloneDialog = require("../Menu/CloneDialog");
var _core = require("@material-ui/core");
var cn = {
container: (0, _typestyle.style)({
margin: 16,
padding: 8,
paddingBottom: 16,
height: '20rem',
overflow: 'scroll',
backgroundColor: _brown.default['50'],
overflowX: 'auto',
overflowY: 'scroll',
textAlign: 'left'
}),
button: (0, _typestyle.style)({
marginLeft: 8,
marginBottom: 24,
fontSize: 'x-large'
}),
alignCenter: (0, _typestyle.style)({
textAlign: 'center'
})
};
var LaunchDialog =
/*#__PURE__*/
function (_PureComponent) {
(0, _inherits2.default)(LaunchDialog, _PureComponent);
function LaunchDialog() {
var _getPrototypeOf2;
var _this;
(0, _classCallCheck2.default)(this, LaunchDialog);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(LaunchDialog)).call.apply(_getPrototypeOf2, [this].concat(args)));
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "state", {
projects: null
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "handleTitleChange",
/*#__PURE__*/
function () {
var _ref = (0, _asyncToGenerator2.default)(
/*#__PURE__*/
_regenerator.default.mark(function _callee(project, title) {
var localization;
return _regenerator.default.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
localization = _this.props.localization;
_context.prev = 1;
_context.next = 4;
return (0, _database.updateProject)(project.id, {
title: title
});
case 4:
_context.next = 6;
return _this.refreshState();
case 6:
_context.next = 11;
break;
case 8:
_context.prev = 8;
_context.t0 = _context["catch"](1);
if (typeof _context.t0 === 'string') {
alert(localization.cloneDialog[_context.t0]);
}
case 11:
case "end":
return _context.stop();
}
}
}, _callee, this, [[1, 8]]);
}));
return function (_x, _x2) {
return _ref.apply(this, arguments);
};
}());
return _this;
}
(0, _createClass2.default)(LaunchDialog, [{
key: "componentDidMount",
value: function componentDidMount() {
if (this.props.open) {
this.refreshState();
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (!prevProps.open && this.props.open) {
this.refreshState();
}
}
}, {
key: "refreshState",
value: function () {
var _refreshState = (0, _asyncToGenerator2.default)(
/*#__PURE__*/
_regenerator.default.mark(function _callee2() {
var _this2 = this;
var url, projects;
return _regenerator.default.wrap(function _callee2$(_context2) {
while (1) {
switch (_context2.prev = _context2.next) {
case 0:
url = location.origin + location.pathname;
_context2.next = 3;
return _database.personalDB.projects.filter(function (item) {
return item.url === url;
}).toArray();
case 3:
projects = _context2.sent;
if (projects.length) {
_context2.next = 9;
break;
}
this.props.fallback();
this.props.onRequestClose();
_context2.next = 12;
break;
case 9:
projects.sort(function (a, b) {
return b.updated - a.updated;
});
_context2.next = 12;
return new Promise(function (resolve) {
_this2.setState({
projects: projects
}, resolve);
});
case 12:
case "end":
return _context2.stop();
}
}
}, _callee2, this);
}));
function refreshState() {
return _refreshState.apply(this, arguments);
}
return refreshState;
}()
}, {
key: "launchIDE",
value: function () {
var _launchIDE = (0, _asyncToGenerator2.default)(
/*#__PURE__*/
_regenerator.default.mark(function _callee3(project) {
return _regenerator.default.wrap(function _callee3$(_context3) {
while (1) {
switch (_context3.prev = _context3.next) {
case 0:
_context3.prev = 0;
_context3.next = 3;
return this.props.launchIDE(project);
case 3:
this.props.onRequestClose();
_context3.next = 9;
break;
case 6:
_context3.prev = 6;
_context3.t0 = _context3["catch"](0);
alert(_context3.t0.message || _context3.t0);
case 9:
case "end":
return _context3.stop();
}
}
}, _callee3, this, [[0, 6]]);
}));
function launchIDE(_x3) {
return _launchIDE.apply(this, arguments);
}
return launchIDE;
}()
}, {
key: "renderLoading",
value: function renderLoading() {
return _react.default.createElement(_Dialog.default, {
modal: true,
open: this.props.open,
style: {
textAlign: 'center'
}
}, _react.default.createElement(_CircularProgress.default, {
size: 120
}));
}
}, {
key: "render",
value: function render() {
var _this3 = this;
if (!this.state.projects) {
return this.renderLoading();
}
var localization = this.props.localization;
return _react.default.createElement(_Dialog.default, {
open: this.props.open
}, _react.default.createElement(_DialogTitle.default, null, localization.launchDialog.title), _react.default.createElement(_DialogContent.default, {
className: cn.alignCenter
}, _react.default.createElement(_Button.default, {
variant: "contained",
color: "primary",
className: cn.button,
onClick: this.props.fallback
}, localization.launchDialog.startNew), _react.default.createElement(_core.Typography, {
variant: "subheading"
}, localization.launchDialog.description), _react.default.createElement("div", {
className: cn.container
}, this.state.projects.map(function (item) {
return _react.default.createElement(_CloneDialog.ProjectCard, {
key: item.id,
project: item,
launchIDE: _this3.props.launchIDE,
requestTitleChange: _this3.handleTitleChange,
onProcessEnd: function onProcessEnd() {
return _this3.refreshState();
},
localization: localization
});
}))));
}
}]);
return LaunchDialog;
}(_react.PureComponent);
exports.default = LaunchDialog;
(0, _defineProperty2.default)(LaunchDialog, "propTypes", {
open: _propTypes.default.bool.isRequired,
localization: _propTypes.default.object.isRequired,
launchIDE: _propTypes.default.func.isRequired,
fallback: _propTypes.default.func.isRequired,
onRequestClose: _propTypes.default.func.isRequired
});
(0, _defineProperty2.default)(LaunchDialog, "defaultProps", {
fallback: function fallback() {}
});