diff --git a/client/constants.js b/client/constants.js index b863005e..4adce05f 100644 --- a/client/constants.js +++ b/client/constants.js @@ -58,6 +58,7 @@ export const HIDE_EDIT_FILE_NAME = 'HIDE_EDIT_FILE_NAME'; export const SET_AUTOSAVE = 'SET_AUTOSAVE'; export const SET_LINT_WARNING = 'SET_LINT_WARNING'; export const SET_PREFERENCES = 'SET_PREFERENCES'; +export const SET_TEXT_OUTPUT = 'SET_TEXT_OUTPUT'; // eventually, handle errors more specifically and better export const ERROR = 'ERROR'; diff --git a/client/modules/IDE/actions/preferences.js b/client/modules/IDE/actions/preferences.js index 82ea107a..f2270905 100644 --- a/client/modules/IDE/actions/preferences.js +++ b/client/modules/IDE/actions/preferences.js @@ -118,3 +118,21 @@ export function setLintWarning(value) { } }; } + +export function setTextOutput(value) { + return (dispatch, getState) => { + dispatch({ + type: ActionTypes.SET_TEXT_OUTPUT, + value + }); + const state = getState(); + if (state.user.authenticated) { + const formParams = { + preferences: { + textOutput: value + } + }; + updatePreferences(formParams, dispatch); + } + }; +} diff --git a/client/modules/IDE/components/Preferences.js b/client/modules/IDE/components/Preferences.js index 59f13c0a..7043d417 100644 --- a/client/modules/IDE/components/Preferences.js +++ b/client/modules/IDE/components/Preferences.js @@ -62,6 +62,14 @@ class Preferences extends React.Component { preference__option: true, 'preference__option--selected': !this.props.lintWarning }); + let textOutputOnClass = classNames({ + preference__option: true, + 'preference__option--selected': this.props.textOutput + }); + let textOutputOffClass = classNames({ + preference__option: true, + 'preference__option--selected': !this.props.textOutput + }); return (
@@ -169,6 +177,21 @@ class Preferences extends React.Component { >Off
+
+

Hidden Text Output

+
+ + +
+
); } @@ -186,6 +209,8 @@ Preferences.propTypes = { setFontSize: PropTypes.func.isRequired, autosave: PropTypes.bool.isRequired, setAutosave: PropTypes.func.isRequired, + textOutput: PropTypes.bool.isRequired, + setTextOutput: PropTypes.func.isRequired, lintWarning: PropTypes.bool.isRequired, setLintWarning: PropTypes.func.isRequired }; diff --git a/client/modules/IDE/components/PreviewFrame.js b/client/modules/IDE/components/PreviewFrame.js index bfdfcb5f..add011b1 100644 --- a/client/modules/IDE/components/PreviewFrame.js +++ b/client/modules/IDE/components/PreviewFrame.js @@ -128,22 +128,18 @@ class PreviewFrame extends React.Component { htmlFile = htmlFile.replace(fileRegex, ``); }); - const htmlHead = htmlFile.match(/(?:)([\s\S]*?)(?:<\/head>)/gmi); - const headRegex = new RegExp('head', 'i'); - let htmlHeadContents = htmlHead[0].split(headRegex)[1]; - htmlHeadContents = htmlHeadContents.slice(1, htmlHeadContents.length - 2); - htmlHeadContents += '\n'; - htmlHeadContents += '\n'; - htmlHeadContents += '\n'; - htmlHeadContents += ''; - htmlFile = htmlFile.replace(/(?:)([\s\S]*?)(?:<\/head>)/gmi, `\n${htmlHeadContents}\n`); + if (this.props.textOutput) { + const htmlHead = htmlFile.match(/(?:)([\s\S]*?)(?:<\/head>)/gmi); + const headRegex = new RegExp('head', 'i'); + let htmlHeadContents = htmlHead[0].split(headRegex)[1]; + htmlHeadContents = htmlHeadContents.slice(1, htmlHeadContents.length - 2); + htmlHeadContents += '\n'; + htmlHeadContents += '\n'; + htmlHeadContents += '\n'; + htmlHeadContents += ''; + htmlFile = htmlFile.replace(/(?:)([\s\S]*?)(?:<\/head>)/gmi, `\n${htmlHeadContents}\n`); + } - // const htmlHead = htmlFile.match(/(?:)([\s\S]*?)(?:<\/head>)/gmi); - // const headRegex = new RegExp('head', 'i'); - // let htmlHeadContents = htmlHead[0].split(headRegex)[1]; - // htmlHeadContents = htmlHeadContents.slice(1, htmlHeadContents.length - 2); - // htmlHeadContents += '\n'; - // htmlFile = htmlFile.replace(/(?:)([\s\S]*?)(?:<\/head>)/gmi, `\n${htmlHeadContents}\n`); htmlFile += hijackConsoleScript; return htmlFile; @@ -185,6 +181,7 @@ class PreviewFrame extends React.Component { PreviewFrame.propTypes = { isPlaying: PropTypes.bool.isRequired, + textOutput: PropTypes.bool.isRequired, head: PropTypes.object.isRequired, content: PropTypes.string.isRequired, htmlFile: PropTypes.shape({ diff --git a/client/modules/IDE/pages/IDEView.js b/client/modules/IDE/pages/IDEView.js index 034863bf..d6d0d426 100644 --- a/client/modules/IDE/pages/IDEView.js +++ b/client/modules/IDE/pages/IDEView.js @@ -124,6 +124,8 @@ class IDEView extends React.Component { setAutosave={this.props.setAutosave} lintWarning={this.props.preferences.lintWarning} setLintWarning={this.props.setLintWarning} + textOutput={this.props.preferences.textOutput} + setTextOutput={this.props.setTextOutput} />
} isPlaying={this.props.ide.isPlaying} + textOutput={this.props.preferences.textOutput} dispatchConsoleEvent={this.props.dispatchConsoleEvent} />
@@ -264,7 +267,8 @@ IDEView.propTypes = { indentationAmount: PropTypes.number.isRequired, isTabIndent: PropTypes.bool.isRequired, autosave: PropTypes.bool.isRequired, - lintWarning: PropTypes.bool.isRequired + lintWarning: PropTypes.bool.isRequired, + textOutput: PropTypes.bool.isRequired }).isRequired, closePreferences: PropTypes.func.isRequired, setFontSize: PropTypes.func.isRequired, @@ -273,6 +277,7 @@ IDEView.propTypes = { indentWithSpace: PropTypes.func.isRequired, setAutosave: PropTypes.func.isRequired, setLintWarning: PropTypes.func.isRequired, + setTextOutput: PropTypes.func.isRequired, files: PropTypes.array.isRequired, updateFileContent: PropTypes.func.isRequired, selectedFile: PropTypes.shape({ diff --git a/client/modules/IDE/reducers/preferences.js b/client/modules/IDE/reducers/preferences.js index 5d1d65bf..252b51dc 100644 --- a/client/modules/IDE/reducers/preferences.js +++ b/client/modules/IDE/reducers/preferences.js @@ -5,7 +5,8 @@ const initialState = { indentationAmount: 2, isTabIndent: true, autosave: true, - lintWarning: false + lintWarning: false, + textOutput: false }; const preferences = (state = initialState, action) => { @@ -26,6 +27,8 @@ const preferences = (state = initialState, action) => { return Object.assign({}, state, { autosave: action.value }); case ActionTypes.SET_LINT_WARNING: return Object.assign({}, state, { lintWarning: action.value }); + case ActionTypes.SET_TEXT_OUTPUT: + return Object.assign({}, state, { textOutput: action.value }); case ActionTypes.SET_PREFERENCES: return action.preferences; default: diff --git a/server/models/user.js b/server/models/user.js index c593159c..b9fa4987 100644 --- a/server/models/user.js +++ b/server/models/user.js @@ -13,7 +13,9 @@ const userSchema = new Schema({ fontSize: { type: Number, default: 18 }, indentationAmount: { type: Number, default: 2 }, isTabIndent: { type: Boolean, default: false }, - autosave: { type: Boolean, default: true } + autosave: { type: Boolean, default: true }, + lintWarning: { type: Boolean, default: false }, + textOutput: { type: Boolean, default: false } } }, { timestamps: true });