From 344e50e6fe92b83bbc8a3dcb989101583b77847f Mon Sep 17 00:00:00 2001 From: Luis Morales-Navarro Date: Fri, 22 Dec 2017 11:47:04 +0800 Subject: [PATCH 01/12] added library to iframe --- .gitmodules | 4 -- .../modules/IDE/components/PreviewFrame.jsx | 57 ++++++------------- client/modules/IDE/reducers/files.js | 5 ++ package.json | 3 +- 4 files changed, 22 insertions(+), 47 deletions(-) diff --git a/.gitmodules b/.gitmodules index afc7971610..e69de29bb2 100644 --- a/.gitmodules +++ b/.gitmodules @@ -1,4 +0,0 @@ -[submodule "static/p5-interceptor"] - path = static/p5-interceptor - url = git://github.com/MathuraMG/p5-interceptor.git - branch = master diff --git a/client/modules/IDE/components/PreviewFrame.jsx b/client/modules/IDE/components/PreviewFrame.jsx index 6f28cc9943..f64ae408bc 100644 --- a/client/modules/IDE/components/PreviewFrame.jsx +++ b/client/modules/IDE/components/PreviewFrame.jsx @@ -198,49 +198,24 @@ class PreviewFrame extends React.Component { this.resolveScripts(sketchDoc, resolvedFiles); this.resolveStyles(sketchDoc, resolvedFiles); - let scriptsToInject = [ + const scriptsToInject = [ '/loop-protect.min.js', '/hijackConsole.js' ]; - if ( - this.props.isAccessibleOutputPlaying || - ((this.props.textOutput || this.props.gridOutput || this.props.soundOutput) && this.props.isPlaying)) { - let interceptorScripts = []; - interceptorScripts = [ - '/p5-interceptor/registry.js', - '/p5-interceptor/loadData.js', - '/p5-interceptor/interceptorHelperFunctions.js', - '/p5-interceptor/baseInterceptor.js', - '/p5-interceptor/entities/entity.min.js', - '/p5-interceptor/ntc.min.js' - ]; - if (!this.props.textOutput && !this.props.gridOutput && !this.props.soundOutput) { - this.props.setTextOutput(true); - } - if (this.props.textOutput) { - let textInterceptorScripts = []; - textInterceptorScripts = [ - '/p5-interceptor/textInterceptor/interceptorFunctions.js', - '/p5-interceptor/textInterceptor/interceptorP5.js' - ]; - interceptorScripts = interceptorScripts.concat(textInterceptorScripts); - } - if (this.props.gridOutput) { - let gridInterceptorScripts = []; - gridInterceptorScripts = [ - '/p5-interceptor/gridInterceptor/interceptorFunctions.js', - '/p5-interceptor/gridInterceptor/interceptorP5.js' - ]; - interceptorScripts = interceptorScripts.concat(gridInterceptorScripts); - } - if (this.props.soundOutput) { - let soundInterceptorScripts = []; - soundInterceptorScripts = [ - '/p5-interceptor/soundInterceptor/interceptorP5.js' - ]; - interceptorScripts = interceptorScripts.concat(soundInterceptorScripts); - } - scriptsToInject = scriptsToInject.concat(interceptorScripts); + if (this.props.textOutput) { + const textSection = sketchDoc.createElement('section'); + textSection.setAttribute('id', 'textOutput-content'); + sketchDoc.body.appendChild(textSection); + } + if (this.props.gridOutput) { + const gridSection = sketchDoc.createElement('section'); + gridSection.setAttribute('id', 'gridOutput-content'); + sketchDoc.body.appendChild(gridSection); + } + if (this.props.soundOutput) { + const soundSection = sketchDoc.createElement('section'); + soundSection.setAttribute('id', 'soundOutput-content'); + sketchDoc.body.appendChild(soundSection); } scriptsToInject.forEach((scriptToInject) => { @@ -419,7 +394,7 @@ PreviewFrame.propTypes = { textOutput: PropTypes.bool.isRequired, gridOutput: PropTypes.bool.isRequired, soundOutput: PropTypes.bool.isRequired, - setTextOutput: PropTypes.func.isRequired, + // setTextOutput: PropTypes.func.isRequired, htmlFile: PropTypes.shape({ content: PropTypes.string.isRequired }).isRequired, diff --git a/client/modules/IDE/reducers/files.js b/client/modules/IDE/reducers/files.js index a6678d8f42..eb928d9321 100644 --- a/client/modules/IDE/reducers/files.js +++ b/client/modules/IDE/reducers/files.js @@ -13,6 +13,7 @@ const defaultHTML = ` + @@ -20,7 +21,11 @@ const defaultHTML = +
+
+
+ `; diff --git a/package.json b/package.json index afebb2c673..8862b029f0 100644 --- a/package.json +++ b/package.json @@ -9,8 +9,7 @@ "lint-fix": "eslint client server --ext .jsx --ext .js --fix", "build": "NODE_ENV=production webpack --config webpack.config.prod.js --progress", "test": "npm run lint", - "fetch-examples": "node fetch-examples.js", - "postinstall": "git submodule update --remote --recursive" + "fetch-examples": "node fetch-examples.js" }, "main": "index.js", "author": "Cassie Tarakajian", From cff4819c21806d7874577e98ee56baa3c0d06ca1 Mon Sep 17 00:00:00 2001 From: Luis Morales-Navarro Date: Fri, 22 Dec 2017 15:12:01 +0800 Subject: [PATCH 02/12] changed preview to add accessible elements to iframe --- client/modules/IDE/components/PreviewFrame.jsx | 6 +++--- client/modules/IDE/reducers/files.js | 4 +--- 2 files changed, 4 insertions(+), 6 deletions(-) diff --git a/client/modules/IDE/components/PreviewFrame.jsx b/client/modules/IDE/components/PreviewFrame.jsx index f64ae408bc..63e9c7eb4f 100644 --- a/client/modules/IDE/components/PreviewFrame.jsx +++ b/client/modules/IDE/components/PreviewFrame.jsx @@ -205,17 +205,17 @@ class PreviewFrame extends React.Component { if (this.props.textOutput) { const textSection = sketchDoc.createElement('section'); textSection.setAttribute('id', 'textOutput-content'); - sketchDoc.body.appendChild(textSection); + sketchDoc.getElementById('outputs').appendChild(textSection); } if (this.props.gridOutput) { const gridSection = sketchDoc.createElement('section'); gridSection.setAttribute('id', 'gridOutput-content'); - sketchDoc.body.appendChild(gridSection); + sketchDoc.getElementById('outputs').appendChild(gridSection); } if (this.props.soundOutput) { const soundSection = sketchDoc.createElement('section'); soundSection.setAttribute('id', 'soundOutput-content'); - sketchDoc.body.appendChild(soundSection); + sketchDoc.getElementById('outputs').appendChild(soundSection); } scriptsToInject.forEach((scriptToInject) => { diff --git a/client/modules/IDE/reducers/files.js b/client/modules/IDE/reducers/files.js index eb928d9321..fdfbb3de70 100644 --- a/client/modules/IDE/reducers/files.js +++ b/client/modules/IDE/reducers/files.js @@ -21,9 +21,7 @@ const defaultHTML = -
-
-
+
From dcda574989ed3b140c81c93a0499894c20f3ea5f Mon Sep 17 00:00:00 2001 From: Luis Morales-Navarro Date: Mon, 25 Dec 2017 18:28:36 +0800 Subject: [PATCH 03/12] add library only when accesible output is seleceted --- client/modules/IDE/components/PreviewFrame.jsx | 11 ++++++++--- client/modules/IDE/reducers/files.js | 6 +++--- 2 files changed, 11 insertions(+), 6 deletions(-) diff --git a/client/modules/IDE/components/PreviewFrame.jsx b/client/modules/IDE/components/PreviewFrame.jsx index 63e9c7eb4f..14a5b08db9 100644 --- a/client/modules/IDE/components/PreviewFrame.jsx +++ b/client/modules/IDE/components/PreviewFrame.jsx @@ -202,20 +202,25 @@ class PreviewFrame extends React.Component { '/loop-protect.min.js', '/hijackConsole.js' ]; + const accessiblelib = sketchDoc.createElement('script'); + accessiblelib.setAttribute('src', 'https://cdn.rawgit.com/MathuraMG/p5-accessibility/e856365c/dist/p5-accessibility.js'); if (this.props.textOutput) { + sketchDoc.getElementById('accessibility-library').appendChild(accessiblelib); const textSection = sketchDoc.createElement('section'); textSection.setAttribute('id', 'textOutput-content'); - sketchDoc.getElementById('outputs').appendChild(textSection); + sketchDoc.getElementById('accessible-outputs').appendChild(textSection); } if (this.props.gridOutput) { + sketchDoc.getElementById('accessibility-library').appendChild(accessiblelib); const gridSection = sketchDoc.createElement('section'); gridSection.setAttribute('id', 'gridOutput-content'); - sketchDoc.getElementById('outputs').appendChild(gridSection); + sketchDoc.getElementById('accessible-outputs').appendChild(gridSection); } if (this.props.soundOutput) { + sketchDoc.getElementById('accessibility-library').appendChild(accessiblelib); const soundSection = sketchDoc.createElement('section'); soundSection.setAttribute('id', 'soundOutput-content'); - sketchDoc.getElementById('outputs').appendChild(soundSection); + sketchDoc.getElementById('accessible-outputs').appendChild(soundSection); } scriptsToInject.forEach((scriptToInject) => { diff --git a/client/modules/IDE/reducers/files.js b/client/modules/IDE/reducers/files.js index fdfbb3de70..2441c1fce7 100644 --- a/client/modules/IDE/reducers/files.js +++ b/client/modules/IDE/reducers/files.js @@ -21,10 +21,10 @@ const defaultHTML = -
+
- - +
+ `; From cf76989bb1ebd556e04b488ac94d1342df4ff03c Mon Sep 17 00:00:00 2001 From: Luis Morales-Navarro Date: Tue, 16 Jan 2018 17:35:50 +0800 Subject: [PATCH 04/12] focus on iframe when plaing --- .../IDE/components/AccessibleOutput.jsx | 16 +------- client/modules/IDE/components/GridOutput.jsx | 38 ------------------- .../modules/IDE/components/PreviewFrame.jsx | 2 + client/modules/IDE/components/TextOutput.jsx | 38 ------------------- 4 files changed, 3 insertions(+), 91 deletions(-) delete mode 100644 client/modules/IDE/components/GridOutput.jsx delete mode 100644 client/modules/IDE/components/TextOutput.jsx diff --git a/client/modules/IDE/components/AccessibleOutput.jsx b/client/modules/IDE/components/AccessibleOutput.jsx index a3688bd7d0..1e19c0e427 100644 --- a/client/modules/IDE/components/AccessibleOutput.jsx +++ b/client/modules/IDE/components/AccessibleOutput.jsx @@ -1,6 +1,4 @@ import React, { PropTypes } from 'react'; -import GridOutput from '../components/GridOutput'; -import TextOutput from '../components/TextOutput'; class AccessibleOutput extends React.Component { componentDidMount() { @@ -23,18 +21,8 @@ class AccessibleOutput extends React.Component { title="canvas text output" > {(() => { // eslint-disable-line - if (this.props.textOutput) { - return ( - - ); - } })()} {(() => { // eslint-disable-line - if (this.props.gridOutput) { - return ( - - ); - } })()} ); @@ -43,9 +31,7 @@ class AccessibleOutput extends React.Component { AccessibleOutput.propTypes = { isPlaying: PropTypes.bool.isRequired, - previewIsRefreshing: PropTypes.bool.isRequired, - textOutput: PropTypes.bool.isRequired, - gridOutput: PropTypes.bool.isRequired + previewIsRefreshing: PropTypes.bool.isRequired }; export default AccessibleOutput; diff --git a/client/modules/IDE/components/GridOutput.jsx b/client/modules/IDE/components/GridOutput.jsx deleted file mode 100644 index 3f7dcd1b5d..0000000000 --- a/client/modules/IDE/components/GridOutput.jsx +++ /dev/null @@ -1,38 +0,0 @@ -import React from 'react'; - -class GridOutput extends React.Component { - componentDidMount() { - this.GridOutputModal.focus(); - } - render() { - return ( -
{ this.GridOutputModal = element; }} - > -

table Output

-

-

- -
-
-
-
- ); - } -} - -export default GridOutput; diff --git a/client/modules/IDE/components/PreviewFrame.jsx b/client/modules/IDE/components/PreviewFrame.jsx index 14a5b08db9..1250025882 100644 --- a/client/modules/IDE/components/PreviewFrame.jsx +++ b/client/modules/IDE/components/PreviewFrame.jsx @@ -209,12 +209,14 @@ class PreviewFrame extends React.Component { const textSection = sketchDoc.createElement('section'); textSection.setAttribute('id', 'textOutput-content'); sketchDoc.getElementById('accessible-outputs').appendChild(textSection); + this.iframeElement.focus(); } if (this.props.gridOutput) { sketchDoc.getElementById('accessibility-library').appendChild(accessiblelib); const gridSection = sketchDoc.createElement('section'); gridSection.setAttribute('id', 'gridOutput-content'); sketchDoc.getElementById('accessible-outputs').appendChild(gridSection); + this.iframeElement.focus(); } if (this.props.soundOutput) { sketchDoc.getElementById('accessibility-library').appendChild(accessiblelib); diff --git a/client/modules/IDE/components/TextOutput.jsx b/client/modules/IDE/components/TextOutput.jsx deleted file mode 100644 index f9b528e0fe..0000000000 --- a/client/modules/IDE/components/TextOutput.jsx +++ /dev/null @@ -1,38 +0,0 @@ -import React from 'react'; - -class TextOutput extends React.Component { - componentDidMount() { - this.TextOutputModal.focus(); - } - render() { - return ( -
{ this.TextOutputModal = element; }} - > -

Text Output

-

-

- -
-
-
-
- ); - } -} - -export default TextOutput; From 1ae2c6f67c3fac3dc2742c1ad7e4d97ec33840fd Mon Sep 17 00:00:00 2001 From: Luis Morales-Navarro Date: Tue, 16 Jan 2018 18:16:12 +0800 Subject: [PATCH 05/12] css --- client/modules/IDE/reducers/files.js | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/client/modules/IDE/reducers/files.js b/client/modules/IDE/reducers/files.js index 2441c1fce7..55220ff904 100644 --- a/client/modules/IDE/reducers/files.js +++ b/client/modules/IDE/reducers/files.js @@ -19,9 +19,10 @@ const defaultHTML = + -
+
@@ -33,6 +34,15 @@ const defaultCSS = margin: 0; padding: 0; } + +#accessible-outputs { + position: absolute; + left: -10000px; + top: auto; + width: 1px; + height: 1px; + overflow: hidden; +} `; const initialState = () => { From 709780809eb79970781b8e66426caa78c010c080 Mon Sep 17 00:00:00 2001 From: Luis Morales-Navarro Date: Wed, 17 Jan 2018 14:38:08 +0800 Subject: [PATCH 06/12] deleted accessibleOutput.jsx and edited IDEView to integrate accessibility library --- .../IDE/components/AccessibleOutput.jsx | 37 ------------------- client/modules/IDE/pages/IDEView.jsx | 18 ++++----- 2 files changed, 9 insertions(+), 46 deletions(-) delete mode 100644 client/modules/IDE/components/AccessibleOutput.jsx diff --git a/client/modules/IDE/components/AccessibleOutput.jsx b/client/modules/IDE/components/AccessibleOutput.jsx deleted file mode 100644 index 1e19c0e427..0000000000 --- a/client/modules/IDE/components/AccessibleOutput.jsx +++ /dev/null @@ -1,37 +0,0 @@ -import React, { PropTypes } from 'react'; - -class AccessibleOutput extends React.Component { - componentDidMount() { - this.accessibleOutputModal.focus(); - } - componentDidUpdate(prevProps) { - // if the user explicitly clicks on the play button, want to refocus on the text output - if (this.props.isPlaying && this.props.previewIsRefreshing) { - this.accessibleOutputModal.focus(); - } - } - render() { - return ( -
{ this.accessibleOutputModal = element; }} - tabIndex="0" - aria-label="accessible-output" - title="canvas text output" - > - {(() => { // eslint-disable-line - })()} - {(() => { // eslint-disable-line - })()} -
- ); - } -} - -AccessibleOutput.propTypes = { - isPlaying: PropTypes.bool.isRequired, - previewIsRefreshing: PropTypes.bool.isRequired -}; - -export default AccessibleOutput; diff --git a/client/modules/IDE/pages/IDEView.jsx b/client/modules/IDE/pages/IDEView.jsx index 9bfbe4dfb6..7ec1450955 100644 --- a/client/modules/IDE/pages/IDEView.jsx +++ b/client/modules/IDE/pages/IDEView.jsx @@ -8,7 +8,7 @@ import Editor from '../components/Editor'; import Sidebar from '../components/Sidebar'; import PreviewFrame from '../components/PreviewFrame'; import Toolbar from '../components/Toolbar'; -import AccessibleOutput from '../components/AccessibleOutput'; +// import AccessibleOutput from '../components/AccessibleOutput'; import Preferences from '../components/Preferences'; import NewFileModal from '../components/NewFileModal'; import NewFolderModal from '../components/NewFolderModal'; @@ -375,14 +375,14 @@ class IDEView extends React.Component { ) && this.props.ide.isPlaying ) || - this.props.ide.isAccessibleOutputPlaying - ) && - + this.props.ide.isAccessibleOutputPlaying + ) // && + // } Date: Wed, 17 Jan 2018 22:34:59 +0800 Subject: [PATCH 07/12] deleted comments --- client/modules/IDE/pages/IDEView.jsx | 9 +-------- 1 file changed, 1 insertion(+), 8 deletions(-) diff --git a/client/modules/IDE/pages/IDEView.jsx b/client/modules/IDE/pages/IDEView.jsx index 7ec1450955..8e0ad0c644 100644 --- a/client/modules/IDE/pages/IDEView.jsx +++ b/client/modules/IDE/pages/IDEView.jsx @@ -8,7 +8,6 @@ import Editor from '../components/Editor'; import Sidebar from '../components/Sidebar'; import PreviewFrame from '../components/PreviewFrame'; import Toolbar from '../components/Toolbar'; -// import AccessibleOutput from '../components/AccessibleOutput'; import Preferences from '../components/Preferences'; import NewFileModal from '../components/NewFileModal'; import NewFolderModal from '../components/NewFolderModal'; @@ -376,13 +375,7 @@ class IDEView extends React.Component { this.props.ide.isPlaying ) || this.props.ide.isAccessibleOutputPlaying - ) // && - // + ) } Date: Tue, 30 Jan 2018 10:17:36 -0500 Subject: [PATCH 08/12] Remove gitmodule (#509) * remove git modules --- .gitmodules | 0 1 file changed, 0 insertions(+), 0 deletions(-) delete mode 100644 .gitmodules diff --git a/.gitmodules b/.gitmodules deleted file mode 100644 index e69de29bb2..0000000000 From c33d68c81a1dca2669dffbae655ef8fa273cf865 Mon Sep 17 00:00:00 2001 From: Luis Morales-Navarro Date: Wed, 31 Jan 2018 21:38:53 +0800 Subject: [PATCH 09/12] removed submodule and replaced interceptor for library (#510) --- README.md | 32 +++++++++++++++----------------- 1 file changed, 15 insertions(+), 17 deletions(-) diff --git a/README.md b/README.md index 01f37499c6..bbad921521 100644 --- a/README.md +++ b/README.md @@ -6,12 +6,11 @@ This project is currently in development! It will be announced when there is a ( 1. Fork this repository. 2. Clone the forked repostory and cd into it -3. `$ git submodule init` -4. `$ npm install` -5. Install MongoDB and make sure it is running +3. `$ npm install` +4. Install MongoDB and make sure it is running * For Mac OSX with [homebrew](http://brew.sh/): `brew install mongodb` then `brew services start mongodb` * For Windows and Linux: [MongoDB Installation](https://docs.mongodb.com/manual/installation/) -6. Create a file called `.env` in the root of this directory that looks like +5. Create a file called `.env` in the root of this directory that looks like ``` API_URL=/api @@ -29,10 +28,10 @@ This project is currently in development! It will be announced when there is a ( If you don't care about being able to upload media files to S3 or Login with Github, you can drop in the file exactly how it is. Or, if you don't want to do that, just ask me to send you mine. Refer to [this gist](https://gist.github.com/catarak/70c9301f0fd1ac2d6b58de03f61997e3) for creating an S3 bucket for testing, or if you don't want to do that, I can add you to one of my S3 buckets. -7. `$ npm run fetch-examples` - this downloads the example sketches into a user called 'p5' -8. `$ npm start` -9. Navigate to [http://localhost:8000](http://localhost:8000) in your browser -10. Install the [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en). +6. `$ npm run fetch-examples` - this downloads the example sketches into a user called 'p5' +7. `$ npm start` +8. Navigate to [http://localhost:8000](http://localhost:8000) in your browser +9. Install the [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en). 10. Open and close the Redux DevTools using `ctrl+h`, and move them with `ctrl+w` ### Testing SSL on your local machine @@ -68,10 +67,9 @@ If you don't have the full server environment running, you can launch a one-off ## Production Installation 1. Clone this repostory and `cd` into it -2. `$ git submodule init` -3. `$ npm install` -4. Install MongoDB and make sure it is running -5. Create a file called `.env` in the root of this directory that looks like +2. `$ npm install` +3. Install MongoDB and make sure it is running +4. Create a file called `.env` in the root of this directory that looks like ``` API_URL=/api @@ -91,9 +89,9 @@ If you don't have the full server environment running, you can launch a one-off ``` For production, you will need to have real Github and Amazon credentions. Refer to [this gist](https://gist.github.com/catarak/70c9301f0fd1ac2d6b58de03f61997e3) for creating an S3 bucket for testing. -6. `$ npm run fetch-examples` - this downloads the example sketches into a user called 'p5' -7. `$ npm run build` -8. `$ npm run start:prod` +5. `$ npm run fetch-examples` - this downloads the example sketches into a user called 'p5' +6. `$ npm run build` +7. `$ npm run start:prod` ### For Production Setup with PM2 1. `$ npm install -g pm2` @@ -119,7 +117,7 @@ http://docs.aws.amazon.com/AmazonS3/latest/dev/VirtualHosting.html#VirtualHostin ## Accessibility Guidelines -Here is guide on [how to use the accessible editor](https://gist.github.com/MathuraMG/e86666b7b41fbc8c078bad9aff3f666d) +Here is guide on [how to use the accessible editor](https://gist.github.com/MathuraMG/e86666b7b41fbc8c078bad9aff3f666d) and here is an overview of the [p5-accessibility.js](https://github.com/MathuraMG/p5-accessibility/blob/master/README.md) library that makes p5.js sketches accessible to screen readers. The code for the p5.js web editor adheres to web accessibility standards. The following guidelines will help to ensure that accessibility continues to be a priority as development continues. @@ -146,7 +144,7 @@ See [CONTRIBUTING.md](https://github.com/processing/p5.js-web-editor/blob/master The p5.js Web Editor is built on a MERN stack - MongoDB, Express, React/Redux, and Node. For a reference to the file structure format I am using, please look at the [Mern Starter](https://github.com/Hashnode/mern-starter) and [this comment](https://github.com/Hashnode/mern-starter/issues/90#issuecomment-221553573). -This project uses an in-development [p5.js interceptor library](https://github.com/MathuraMG/p5-interceptor) for accessibility as git submodule. Every time you run `npm install`, it will update the interceptor to HEAD, so it is important to do this often. +This project uses an in-development [p5-accessibility.js library](https://github.com/MathuraMG/p5-accessibility) for accessibility. This project does not use CSS Modules, but uses Sass. I like to follow [BEM rules](http://getbem.com/) for CSS naming conventions, write OOSCSS with placeholders and mixins, and follow the [7-1 Pattern](https://sass-guidelin.es/#the-7-1-pattern) for Sass. From bb846c2c3b9b53b36fe40ca235c8c1cba7d73717 Mon Sep 17 00:00:00 2001 From: Luis Morales-Navarro Date: Mon, 12 Feb 2018 22:54:18 +0800 Subject: [PATCH 10/12] Fixes #508 (#539) * removed submodule and replaced interceptor for library * deleted comments * deleted jquery * deleted interceptor folder * delete interceptor * added jquery * removed jquery and updated accessible library cdn --- Dockerfile | 3 +-- client/modules/IDE/components/PreviewFrame.jsx | 3 +-- client/modules/IDE/reducers/files.js | 1 - static/p5-interceptor | 1 - 4 files changed, 2 insertions(+), 6 deletions(-) delete mode 160000 static/p5-interceptor diff --git a/Dockerfile b/Dockerfile index 81f0872633..6d75fe0c24 100644 --- a/Dockerfile +++ b/Dockerfile @@ -8,8 +8,7 @@ ADD . $APP_HOME WORKDIR $APP_HOME # Install node modules -RUN git submodule init && \ - npm install +RUN npm install # Rebuild node-sass just to be safe RUN npm rebuild node-sass diff --git a/client/modules/IDE/components/PreviewFrame.jsx b/client/modules/IDE/components/PreviewFrame.jsx index 1250025882..8f714657ef 100644 --- a/client/modules/IDE/components/PreviewFrame.jsx +++ b/client/modules/IDE/components/PreviewFrame.jsx @@ -203,7 +203,7 @@ class PreviewFrame extends React.Component { '/hijackConsole.js' ]; const accessiblelib = sketchDoc.createElement('script'); - accessiblelib.setAttribute('src', 'https://cdn.rawgit.com/MathuraMG/p5-accessibility/e856365c/dist/p5-accessibility.js'); + accessiblelib.setAttribute('src', 'https://cdn.rawgit.com/MathuraMG/p5-accessibility/9cb5bd0b/dist/p5-accessibility.js'); if (this.props.textOutput) { sketchDoc.getElementById('accessibility-library').appendChild(accessiblelib); const textSection = sketchDoc.createElement('section'); @@ -401,7 +401,6 @@ PreviewFrame.propTypes = { textOutput: PropTypes.bool.isRequired, gridOutput: PropTypes.bool.isRequired, soundOutput: PropTypes.bool.isRequired, - // setTextOutput: PropTypes.func.isRequired, htmlFile: PropTypes.shape({ content: PropTypes.string.isRequired }).isRequired, diff --git a/client/modules/IDE/reducers/files.js b/client/modules/IDE/reducers/files.js index 55220ff904..2fdc8104c6 100644 --- a/client/modules/IDE/reducers/files.js +++ b/client/modules/IDE/reducers/files.js @@ -13,7 +13,6 @@ const defaultHTML = ` - diff --git a/static/p5-interceptor b/static/p5-interceptor deleted file mode 160000 index 62938f2e9c..0000000000 --- a/static/p5-interceptor +++ /dev/null @@ -1 +0,0 @@ -Subproject commit 62938f2e9cbe1c83a9c1b702a9deccb11a452170 From 4e8f9e4f53d02bcc7b039a0b3725e784e4e651bb Mon Sep 17 00:00:00 2001 From: Luis Morales-Navarro Date: Thu, 15 Feb 2018 23:09:45 +0800 Subject: [PATCH 11/12] Fixes #508 (#545) * removed submodule and replaced interceptor for library * deleted comments * deleted jquery * deleted interceptor folder * delete interceptor * added jquery * removed jquery and updated accessible library cdn * remove empty divs from files.js * fix merge error * remove empty divs from files.js --- client/modules/IDE/components/PreviewFrame.jsx | 11 ++++++++--- client/modules/IDE/reducers/files.js | 2 -- 2 files changed, 8 insertions(+), 5 deletions(-) diff --git a/client/modules/IDE/components/PreviewFrame.jsx b/client/modules/IDE/components/PreviewFrame.jsx index 8f714657ef..6e4f20fc97 100644 --- a/client/modules/IDE/components/PreviewFrame.jsx +++ b/client/modules/IDE/components/PreviewFrame.jsx @@ -204,22 +204,27 @@ class PreviewFrame extends React.Component { ]; const accessiblelib = sketchDoc.createElement('script'); accessiblelib.setAttribute('src', 'https://cdn.rawgit.com/MathuraMG/p5-accessibility/9cb5bd0b/dist/p5-accessibility.js'); + const accessibleOutputs = sketchDoc.createElement('section'); + accessibleOutputs.setAttribute('id', 'accessible-outputs'); if (this.props.textOutput) { - sketchDoc.getElementById('accessibility-library').appendChild(accessiblelib); + sketchDoc.body.appendChild(accessibleOutputs); + sketchDoc.body.appendChild(accessiblelib); const textSection = sketchDoc.createElement('section'); textSection.setAttribute('id', 'textOutput-content'); sketchDoc.getElementById('accessible-outputs').appendChild(textSection); this.iframeElement.focus(); } if (this.props.gridOutput) { - sketchDoc.getElementById('accessibility-library').appendChild(accessiblelib); + sketchDoc.body.appendChild(accessibleOutputs); + sketchDoc.body.appendChild(accessiblelib); const gridSection = sketchDoc.createElement('section'); gridSection.setAttribute('id', 'gridOutput-content'); sketchDoc.getElementById('accessible-outputs').appendChild(gridSection); this.iframeElement.focus(); } if (this.props.soundOutput) { - sketchDoc.getElementById('accessibility-library').appendChild(accessiblelib); + sketchDoc.body.appendChild(accessibleOutputs); + sketchDoc.body.appendChild(accessiblelib); const soundSection = sketchDoc.createElement('section'); soundSection.setAttribute('id', 'soundOutput-content'); sketchDoc.getElementById('accessible-outputs').appendChild(soundSection); diff --git a/client/modules/IDE/reducers/files.js b/client/modules/IDE/reducers/files.js index 2fdc8104c6..98075ed6e8 100644 --- a/client/modules/IDE/reducers/files.js +++ b/client/modules/IDE/reducers/files.js @@ -21,9 +21,7 @@ const defaultHTML = -
-
`; From 356921bb37272cd403b5ed12cdc07b8237be8b03 Mon Sep 17 00:00:00 2001 From: Luis Morales-Navarro Date: Mon, 19 Feb 2018 23:01:08 +0800 Subject: [PATCH 12/12] Fixes #508 (#548) * removed submodule and replaced interceptor for library * deleted comments * deleted jquery * deleted interceptor folder * delete interceptor * added jquery * removed jquery and updated accessible library cdn * remove empty divs from files.js * fix merge error * remove empty divs from files.js * moved accessible output css --- client/modules/IDE/components/PreviewFrame.jsx | 6 ++++++ client/modules/IDE/reducers/files.js | 9 --------- 2 files changed, 6 insertions(+), 9 deletions(-) diff --git a/client/modules/IDE/components/PreviewFrame.jsx b/client/modules/IDE/components/PreviewFrame.jsx index 8dbed7bd90..e7a114f5c7 100644 --- a/client/modules/IDE/components/PreviewFrame.jsx +++ b/client/modules/IDE/components/PreviewFrame.jsx @@ -207,6 +207,12 @@ class PreviewFrame extends React.Component { accessiblelib.setAttribute('src', 'https://cdn.rawgit.com/MathuraMG/p5-accessibility/9cb5bd0b/dist/p5-accessibility.js'); const accessibleOutputs = sketchDoc.createElement('section'); accessibleOutputs.setAttribute('id', 'accessible-outputs'); + accessibleOutputs.style.position = 'absolute'; + accessibleOutputs.style.left = '-1000px'; + accessibleOutputs.style.top = 'auto'; + accessibleOutputs.style.width = '1px'; + accessibleOutputs.style.height = '1px'; + accessibleOutputs.style.overflow = 'hidden'; if (this.props.textOutput) { sketchDoc.body.appendChild(accessibleOutputs); sketchDoc.body.appendChild(accessiblelib); diff --git a/client/modules/IDE/reducers/files.js b/client/modules/IDE/reducers/files.js index 184fe3157f..2e1c91634a 100644 --- a/client/modules/IDE/reducers/files.js +++ b/client/modules/IDE/reducers/files.js @@ -31,15 +31,6 @@ const defaultCSS = margin: 0; padding: 0; } - -#accessible-outputs { - position: absolute; - left: -10000px; - top: auto; - width: 1px; - height: 1px; - overflow: hidden; -} `; const initialState = () => {