Remove accessibility CSS; Auto focus (#583)
* 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:
parent
ea02d7692d
commit
3acefe4709
3 changed files with 13 additions and 12 deletions
|
@ -205,16 +205,11 @@ 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'
|
||||
'src', 'https://cdn.rawgit.com/MathuraMG/p5-accessibility/298ccdf6/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';
|
||||
accessibleOutputs.setAttribute('aria-label', 'accessible-output');
|
||||
if (this.props.textOutput) {
|
||||
sketchDoc.body.appendChild(accessibleOutputs);
|
||||
sketchDoc.body.appendChild(accessiblelib);
|
||||
|
|
|
@ -60,7 +60,11 @@ class Toolbar extends React.Component {
|
|||
<div className="toolbar">
|
||||
<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"
|
||||
disabled={this.props.infiniteLoop}
|
||||
>
|
||||
|
@ -169,6 +173,8 @@ Toolbar.propTypes = {
|
|||
infiniteLoop: PropTypes.bool.isRequired,
|
||||
autorefresh: PropTypes.bool.isRequired,
|
||||
setAutorefresh: PropTypes.func.isRequired,
|
||||
setTextOutput: PropTypes.func.isRequired,
|
||||
setGridOutput: PropTypes.func.isRequired,
|
||||
startSketch: PropTypes.func.isRequired,
|
||||
startAccessibleSketch: PropTypes.func.isRequired,
|
||||
saveProject: PropTypes.func.isRequired,
|
||||
|
|
Loading…
Reference in a new issue