add turning on and off accessible output to nav

This commit is contained in:
Cassie Tarakajian 2017-09-15 12:10:25 -04:00
parent a92f4f5b3c
commit 8322282269
3 changed files with 37 additions and 7 deletions

View file

@ -275,6 +275,26 @@ class Nav extends React.PureComponent {
<span className="nav__keyboard-shortcut">{'\u21E7'}+{metaKeyName}+Enter</span> <span className="nav__keyboard-shortcut">{'\u21E7'}+{metaKeyName}+Enter</span>
</button> </button>
</li> </li>
<li className="nav__dropdown-item">
<button
onClick={this.props.setAllAccessibleOutput.bind(this, true)}
onFocus={this.handleFocus.bind(this, 'sketch')}
onBlur={this.handleBlur}
>
Start Accessible
<span className="nav__keyboard-shortcut">{'\u21E7'}+{metaKeyName}+2</span>
</button>
</li>
<li className="nav__dropdown-item">
<button
onClick={this.props.setAllAccessibleOutput.bind(this, false)}
onFocus={this.handleFocus.bind(this, 'sketch')}
onBlur={this.handleBlur}
>
Stop Accessible
<span className="nav__keyboard-shortcut">{'\u21E7'}+{metaKeyName}+1</span>
</button>
</li>
</ul> </ul>
</li> </li>
<li className={navDropdownState.help}> <li className={navDropdownState.help}>
@ -432,7 +452,8 @@ Nav.propTypes = {
findPrev: PropTypes.func findPrev: PropTypes.func
}), }),
startSketch: PropTypes.func.isRequired, startSketch: PropTypes.func.isRequired,
stopSketch: PropTypes.func.isRequired stopSketch: PropTypes.func.isRequired,
setAllAccessibleOutput: PropTypes.func.isRequired
}; };
Nav.defaultProps = { Nav.defaultProps = {

View file

@ -216,3 +216,12 @@ export function setAutorefresh(value) {
} }
}; };
} }
export function setAllAccessibleOutput(value) {
return (dispatch) => {
dispatch(setTextOutput(value));
dispatch(setGridOutput(value));
dispatch(setSoundOutput(value));
};
}

View file

@ -166,16 +166,14 @@ class IDEView extends React.Component {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
this.props.startSketch(); this.props.startSketch();
// 50 === 2
} else if (e.keyCode === 50 && ((e.metaKey && this.isMac) || (e.ctrlKey && !this.isMac)) && e.shiftKey) { } else if (e.keyCode === 50 && ((e.metaKey && this.isMac) || (e.ctrlKey && !this.isMac)) && e.shiftKey) {
e.preventDefault(); e.preventDefault();
this.props.setTextOutput(false); this.props.setAllAccessibleOutput(false);
this.props.setGridOutput(false); // 49 === 1
this.props.setSoundOutput(false);
} else if (e.keyCode === 49 && ((e.metaKey && this.isMac) || (e.ctrlKey && !this.isMac)) && e.shiftKey) { } else if (e.keyCode === 49 && ((e.metaKey && this.isMac) || (e.ctrlKey && !this.isMac)) && e.shiftKey) {
e.preventDefault(); e.preventDefault();
this.props.setTextOutput(true); this.props.setAllAccessibleOutput(true);
this.props.setGridOutput(true);
this.props.setSoundOutput(true);
} }
} }
@ -220,6 +218,7 @@ class IDEView extends React.Component {
warnIfUnsavedChanges={this.warnIfUnsavedChanges} warnIfUnsavedChanges={this.warnIfUnsavedChanges}
showKeyboardShortcutModal={this.props.showKeyboardShortcutModal} showKeyboardShortcutModal={this.props.showKeyboardShortcutModal}
cmController={this.cmController} cmController={this.cmController}
setAllAccessibleOutput={this.props.setAllAccessibleOutput}
/> />
<Toolbar <Toolbar
className="Toolbar" className="Toolbar"
@ -612,6 +611,7 @@ IDEView.propTypes = {
setTextOutput: PropTypes.func.isRequired, setTextOutput: PropTypes.func.isRequired,
setGridOutput: PropTypes.func.isRequired, setGridOutput: PropTypes.func.isRequired,
setSoundOutput: PropTypes.func.isRequired, setSoundOutput: PropTypes.func.isRequired,
setAllAccessibleOutput: PropTypes.func.isRequired,
files: PropTypes.arrayOf(PropTypes.shape({ files: PropTypes.arrayOf(PropTypes.shape({
id: PropTypes.string.isRequired, id: PropTypes.string.isRequired,
name: PropTypes.string.isRequired, name: PropTypes.string.isRequired,