fix merge conflicts
This commit is contained in:
commit
84ac4459d1
8 changed files with 140 additions and 16 deletions
|
@ -84,5 +84,8 @@ export const SET_TOAST_TEXT = 'SET_TOAST_TEXT';
|
|||
|
||||
export const SET_UNSAVED_CHANGES = 'SET_UNSAVED_CHANGES';
|
||||
|
||||
export const DETECT_INFINITE_LOOPS = 'DETECT_INFINITE_LOOPS';
|
||||
export const RESET_INFINITE_LOOPS = 'RESET_INFINITE_LOOPS';
|
||||
|
||||
// eventually, handle errors more specifically and better
|
||||
export const ERROR = 'ERROR';
|
||||
|
|
|
@ -170,3 +170,14 @@ export function setUnsavedChanges(value) {
|
|||
};
|
||||
}
|
||||
|
||||
export function detectInfiniteLoops() {
|
||||
return {
|
||||
type: ActionTypes.DETECT_INFINITE_LOOPS
|
||||
};
|
||||
}
|
||||
|
||||
export function resetInfiniteLoops() {
|
||||
return {
|
||||
type: ActionTypes.RESET_INFINITE_LOOPS
|
||||
};
|
||||
}
|
||||
|
|
|
@ -15,6 +15,7 @@ import 'codemirror/addon/lint/html-lint';
|
|||
import 'codemirror/addon/comment/comment';
|
||||
import 'codemirror/keymap/sublime';
|
||||
import 'codemirror/addon/search/jump-to-line';
|
||||
|
||||
import { JSHINT } from 'jshint';
|
||||
window.JSHINT = JSHINT;
|
||||
import { CSSLint } from 'csslint';
|
||||
|
@ -27,15 +28,16 @@ const downArrowUrl = require('../../../images/down-arrow.svg');
|
|||
import classNames from 'classnames';
|
||||
|
||||
import { debounce } from 'throttle-debounce';
|
||||
import loopProtect from 'loop-protect';
|
||||
|
||||
class Editor extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.tidyCode = this.tidyCode.bind(this);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.beep = new Audio(beepUrl);
|
||||
this.widgets = [];
|
||||
this._cm = CodeMirror(this.refs.container, { // eslint-disable-line
|
||||
theme: 'p5-widget',
|
||||
value: this.props.file.content,
|
||||
|
@ -47,23 +49,30 @@ class Editor extends React.Component {
|
|||
gutters: ['CodeMirror-lint-markers'],
|
||||
keyMap: 'sublime',
|
||||
lint: {
|
||||
onUpdateLinting: debounce(2000, (annotations) => {
|
||||
this.props.clearLintMessage();
|
||||
annotations.forEach((x) => {
|
||||
if (x.from.line > -1) {
|
||||
this.props.updateLintMessage(x.severity, (x.from.line + 1), x.message);
|
||||
onUpdateLinting: () => {
|
||||
debounce(2000, (annotations) => {
|
||||
this.props.clearLintMessage();
|
||||
annotations.forEach((x) => {
|
||||
if (x.from.line > -1) {
|
||||
this.props.updateLintMessage(x.severity, (x.from.line + 1), x.message);
|
||||
}
|
||||
});
|
||||
if (this.props.lintMessages.length > 0 && this.props.lintWarning) {
|
||||
this.beep.play();
|
||||
}
|
||||
});
|
||||
if (this.props.lintMessages.length > 0 && this.props.lintWarning) {
|
||||
this.beep.play();
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
this._cm.on('change', debounce(200, () => {
|
||||
this.props.setUnsavedChanges(true);
|
||||
this.props.updateFileContent(this.props.file.name, this._cm.getValue());
|
||||
this.checkForInfiniteLoop(debounce(200, (infiniteLoop, prevs) => {
|
||||
if (!infiniteLoop && prevs) {
|
||||
this.props.startSketch();
|
||||
}
|
||||
}));
|
||||
}));
|
||||
|
||||
this._cm.on('keyup', () => {
|
||||
|
@ -128,6 +137,65 @@ class Editor extends React.Component {
|
|||
}
|
||||
}
|
||||
|
||||
checkForInfiniteLoop(callback) {
|
||||
const prevIsplaying = this.props.isPlaying;
|
||||
let infiniteLoop = false;
|
||||
this.props.stopSketch();
|
||||
this.props.resetInfiniteLoops();
|
||||
|
||||
for (let i = 0; i < this.widgets.length; ++i) {
|
||||
this._cm.removeLineWidget(this.widgets[i]);
|
||||
}
|
||||
this.widgets.length = 0;
|
||||
const OriginalIframe = document.getElementById('OriginalIframe');
|
||||
if (OriginalIframe !== null) {
|
||||
document.body.removeChild(OriginalIframe);
|
||||
}
|
||||
|
||||
loopProtect.alias = 'protect';
|
||||
|
||||
loopProtect.hit = (line) => {
|
||||
this.props.detectInfiniteLoops();
|
||||
infiniteLoop = true;
|
||||
callback(infiniteLoop, prevIsplaying);
|
||||
const msg = document.createElement('div');
|
||||
const loopError = `line ${line}: This loop is taking too long to run.`;
|
||||
msg.appendChild(document.createTextNode(loopError));
|
||||
msg.className = 'lint-error';
|
||||
this.widgets.push(this._cm.addLineWidget(line - 1, msg, { coverGutter: false, noHScroll: true }));
|
||||
};
|
||||
|
||||
const processed = loopProtect(this.props.file.content);
|
||||
|
||||
const iframe = document.createElement('iframe');
|
||||
iframe.id = 'OriginalIframe';
|
||||
iframe.style.display = 'none';
|
||||
|
||||
document.body.appendChild(iframe);
|
||||
|
||||
const win = iframe.contentWindow;
|
||||
const doc = win.document;
|
||||
doc.open();
|
||||
|
||||
win.protect = loopProtect;
|
||||
|
||||
doc.write(`<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.2/p5.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.2/addons/p5.dom.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.2/addons/p5.sound.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
${processed}
|
||||
</script>
|
||||
</body>
|
||||
</html>`);
|
||||
doc.close();
|
||||
callback(infiniteLoop, prevIsplaying);
|
||||
}
|
||||
|
||||
_cm: CodeMirror.Editor
|
||||
|
||||
render() {
|
||||
|
@ -191,7 +259,13 @@ Editor.propTypes = {
|
|||
showEditorOptions: PropTypes.func.isRequired,
|
||||
closeEditorOptions: PropTypes.func.isRequired,
|
||||
showKeyboardShortcutModal: PropTypes.func.isRequired,
|
||||
setUnsavedChanges: PropTypes.func.isRequired
|
||||
setUnsavedChanges: PropTypes.func.isRequired,
|
||||
infiniteLoop: PropTypes.bool.isRequired,
|
||||
detectInfiniteLoops: PropTypes.func.isRequired,
|
||||
resetInfiniteLoops: PropTypes.func.isRequired,
|
||||
stopSketch: PropTypes.func.isRequired,
|
||||
startSketch: PropTypes.func.isRequired,
|
||||
isPlaying: PropTypes.bool.isRequired
|
||||
};
|
||||
|
||||
export default Editor;
|
||||
|
|
|
@ -205,7 +205,13 @@ class PreviewFrame extends React.Component {
|
|||
|
||||
renderSketch() {
|
||||
const doc = ReactDOM.findDOMNode(this);
|
||||
if (this.props.isPlaying) {
|
||||
if (this.props.infiniteLoop) {
|
||||
window.alert('There is an infinite loop in the code, please remove it before running the sketch.');
|
||||
this.props.resetInfiniteLoops();
|
||||
doc.srcdoc = '';
|
||||
srcDoc.set(doc, ' ');
|
||||
}
|
||||
if (this.props.isPlaying && !this.props.infiniteLoop) {
|
||||
srcDoc.set(doc, this.injectLocalFiles());
|
||||
} else {
|
||||
doc.srcdoc = '';
|
||||
|
@ -250,7 +256,9 @@ PreviewFrame.propTypes = {
|
|||
cssFiles: PropTypes.array.isRequired,
|
||||
files: PropTypes.array.isRequired,
|
||||
dispatchConsoleEvent: PropTypes.func,
|
||||
children: PropTypes.element
|
||||
children: PropTypes.element,
|
||||
infiniteLoop: PropTypes.bool.isRequired,
|
||||
resetInfiniteLoops: PropTypes.func.isRequired
|
||||
};
|
||||
|
||||
export default PreviewFrame;
|
||||
|
|
|
@ -265,6 +265,12 @@ class IDEView extends React.Component {
|
|||
closeEditorOptions={this.props.closeEditorOptions}
|
||||
showKeyboardShortcutModal={this.props.showKeyboardShortcutModal}
|
||||
setUnsavedChanges={this.props.setUnsavedChanges}
|
||||
infiniteLoop={this.props.ide.infiniteLoop}
|
||||
detectInfiniteLoops={this.props.detectInfiniteLoops}
|
||||
resetInfiniteLoops={this.props.resetInfiniteLoops}
|
||||
stopSketch={this.props.stopSketch}
|
||||
startSketch={this.props.startSketch}
|
||||
isPlaying={this.props.ide.isPlaying}
|
||||
/>
|
||||
<Console
|
||||
consoleEvent={this.props.ide.consoleEvent}
|
||||
|
@ -300,6 +306,8 @@ class IDEView extends React.Component {
|
|||
isTextOutputPlaying={this.props.ide.isTextOutputPlaying}
|
||||
textOutput={this.props.preferences.textOutput}
|
||||
dispatchConsoleEvent={this.props.dispatchConsoleEvent}
|
||||
infiniteLoop={this.props.ide.infiniteLoop}
|
||||
resetInfiniteLoops={this.props.resetInfiniteLoops}
|
||||
/>
|
||||
</div>
|
||||
</SplitPane>
|
||||
|
@ -403,12 +411,15 @@ IDEView.propTypes = {
|
|||
shareModalVisible: PropTypes.bool.isRequired,
|
||||
editorOptionsVisible: PropTypes.bool.isRequired,
|
||||
keyboardShortcutVisible: PropTypes.bool.isRequired,
|
||||
unsavedChanges: PropTypes.bool.isRequired
|
||||
unsavedChanges: PropTypes.bool.isRequired,
|
||||
infiniteLoop: PropTypes.bool.isRequired,
|
||||
}).isRequired,
|
||||
startSketch: PropTypes.func.isRequired,
|
||||
stopSketch: PropTypes.func.isRequired,
|
||||
startTextOutput: PropTypes.func.isRequired,
|
||||
stopTextOutput: PropTypes.func.isRequired,
|
||||
detectInfiniteLoops: PropTypes.func.isRequired,
|
||||
resetInfiniteLoops: PropTypes.func.isRequired,
|
||||
project: PropTypes.shape({
|
||||
id: PropTypes.string,
|
||||
name: PropTypes.string.isRequired,
|
||||
|
|
|
@ -16,7 +16,8 @@ const initialState = {
|
|||
shareModalVisible: false,
|
||||
editorOptionsVisible: false,
|
||||
keyboardShortcutVisible: false,
|
||||
unsavedChanges: false
|
||||
unsavedChanges: false,
|
||||
infiniteLoop: false
|
||||
};
|
||||
|
||||
const ide = (state = initialState, action) => {
|
||||
|
@ -71,8 +72,15 @@ const ide = (state = initialState, action) => {
|
|||
return Object.assign({}, state, { keyboardShortcutVisible: true });
|
||||
case ActionTypes.CLOSE_KEYBOARD_SHORTCUT_MODAL:
|
||||
return Object.assign({}, state, { keyboardShortcutVisible: false });
|
||||
<<<<<<< HEAD
|
||||
case ActionTypes.SET_UNSAVED_CHANGES:
|
||||
return Object.assign({}, state, { unsavedChanges: action.value });
|
||||
=======
|
||||
case ActionTypes.DETECT_INFINITE_LOOPS:
|
||||
return Object.assign({}, state, { infiniteLoop: true });
|
||||
case ActionTypes.RESET_INFINITE_LOOPS:
|
||||
return Object.assign({}, state, { infiniteLoop: false });
|
||||
>>>>>>> 43052cb675fa0bc500467f5c7c6643f3636493ae
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
|
|
|
@ -80,4 +80,12 @@
|
|||
.editor--options & {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.lint-error {
|
||||
font-family: Inconsolata, monospace;
|
||||
font-size: 100%;
|
||||
background: #FFBEC1;
|
||||
color: red;
|
||||
padding: 2px 5px 3px;
|
||||
}
|
||||
|
|
|
@ -83,6 +83,7 @@
|
|||
"jshint": "^2.9.2",
|
||||
"jszip": "^3.0.0",
|
||||
"jszip-utils": "0.0.2",
|
||||
"loop-protect": "git+https://git@github.com/sagar-sm/loop-protect.git",
|
||||
"moment": "^2.14.1",
|
||||
"mongoose": "^4.4.16",
|
||||
"node-uuid": "^1.4.7",
|
||||
|
|
Loading…
Reference in a new issue