r/p5.js-web-editor
1
0
Fork 0
Code Issues 1 Pull requests Releases 1 Wiki Activity

Remove accessibility CSS; Auto focus (#583)

Browse source 
* Change accessibility example links

* added library to iframe

* changed preview to add accessible elements to iframe

* add library only when accesible output is seleceted

* focus on iframe when plaing

* css

* deleted accessibleOutput.jsx and edited IDEView to integrate accessibility library

* deleted comments

* fix package

* Moved CSS to library and removed section from file.js (#2)

* Remove gitmodule (#509)


* remove git modules

* removed submodule and replaced interceptor for library

* removed submodule and replaced interceptor for library (#510)

* deleted comments

* deleted jquery

* deleted interceptor folder

* delete interceptor

* added jquery

* removed jquery and updated accessible library cdn

* 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

* remove empty divs from files.js

* fix merge error

* remove empty divs from files.js

* 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

* moved accessible output css

* removed css, added aria-label, preliminary cdn update

* removed section from iframe

* updated cdn

* add autofocus; remove CSS
This commit is contained in:
Mathura MG 2018-03-01 13:28:43 -05:00 committed by Cassie Tarakajian
parent ea02d7692d
commit 3acefe4709
3 changed files with 13 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
client/modules/IDE/components/PreviewFrame.jsx
View file

@ -205,16 +205,11 @@ class PreviewFrame extends React.Component {
]; ];
const accessiblelib = sketchDoc.createElement('script'); const accessiblelib = sketchDoc.createElement('script');
accessiblelib.setAttribute( accessiblelib.setAttribute(
'src', 'https://cdn.rawgit.com/MathuraMG/p5-accessibility/9cb5bd0b/dist/p5-accessibility.js' 'src', 'https://cdn.rawgit.com/MathuraMG/p5-accessibility/298ccdf6/dist/p5-accessibility.js'
); );
const accessibleOutputs = sketchDoc.createElement('section'); const accessibleOutputs = sketchDoc.createElement('section');
accessibleOutputs.setAttribute('id', 'accessible-outputs'); accessibleOutputs.setAttribute('id', 'accessible-outputs');
accessibleOutputs.style.position = 'absolute'; accessibleOutputs.setAttribute('aria-label', 'accessible-output');
accessibleOutputs.style.left = '-1000px';
accessibleOutputs.style.top = 'auto';
accessibleOutputs.style.width = '1px';
accessibleOutputs.style.height = '1px';
accessibleOutputs.style.overflow = 'hidden';
if (this.props.textOutput) { if (this.props.textOutput) {
sketchDoc.body.appendChild(accessibleOutputs); sketchDoc.body.appendChild(accessibleOutputs);
sketchDoc.body.appendChild(accessiblelib); sketchDoc.body.appendChild(accessiblelib);

8
client/modules/IDE/components/Toolbar.jsx
View file

@ -60,7 +60,11 @@ class Toolbar extends React.Component {
<div className="toolbar"> <div className="toolbar">
<button <button
className="toolbar__play-sketch-button" className="toolbar__play-sketch-button"
onClick={this.props.startAccessibleSketch} onClick={() => {
this.props.startAccessibleSketch();
this.props.setTextOutput(true);
this.props.setGridOutput(true);
}}
aria-label="play sketch" aria-label="play sketch"
disabled={this.props.infiniteLoop} disabled={this.props.infiniteLoop}
> >
@ -169,6 +173,8 @@ Toolbar.propTypes = {
infiniteLoop: PropTypes.bool.isRequired, infiniteLoop: PropTypes.bool.isRequired,
autorefresh: PropTypes.bool.isRequired, autorefresh: PropTypes.bool.isRequired,
setAutorefresh: PropTypes.func.isRequired, setAutorefresh: PropTypes.func.isRequired,
setTextOutput: PropTypes.func.isRequired,
setGridOutput: PropTypes.func.isRequired,
startSketch: PropTypes.func.isRequired, startSketch: PropTypes.func.isRequired,
startAccessibleSketch: PropTypes.func.isRequired, startAccessibleSketch: PropTypes.func.isRequired,
saveProject: PropTypes.func.isRequired, saveProject: PropTypes.func.isRequired,

8
client/modules/IDE/reducers/files.js
View file

@ -1,11 +1,11 @@
import objectID from 'bson-objectid'; import objectID from 'bson-objectid';
import * as ActionTypes from '../../../constants'; import * as ActionTypes from '../../../constants';
const defaultSketch = `function setup() { const defaultSketch = `function setup() {
createCanvas(400, 400); createCanvas(400, 400);
} }
function draw() { function draw() {
background(220); background(220);
}`; }`;
@ -22,7 +22,7 @@ const defaultHTML =
</head> </head>
<body> <body>
<script src="sketch.js"></script> <script src="sketch.js"></script>
</body> </body>
</html> </html>
`; `;