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

toggling menu (#258)

Browse source 
* toggling menu

* Other components should be treated equally
This commit is contained in:
Akarshit Wal 2017-01-09 23:17:32 +05:30 committed by Cassie Tarakajian
parent d0445a624d
commit 843418e195
3 changed files with 30 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
client/modules/IDE/components/Editor.jsx
View file

@ -177,6 +177,15 @@ class Editor extends React.Component {
}
}
toggleEditorOptions() {
if (this.props.editorOptionsVisible) {
this.props.closeEditorOptions();
} else {
this.refs.optionsButton.focus();
this.props.showEditorOptions();
}
}
_cm: CodeMirror.Editor
render() {
@ -222,8 +231,7 @@ class Editor extends React.Component {
tabIndex="0"
ref="optionsButton"
onClick={() => {
this.refs.optionsButton.focus();
this.props.showEditorOptions();
this.toggleEditorOptions();
}}
onBlur={() => setTimeout(this.props.closeEditorOptions, 200)}
>

12
client/modules/IDE/components/FileNode.jsx
View file

@ -48,6 +48,15 @@ export class FileNode extends React.Component {
}
}
toggleFileOptions() {
if (this.props.isOptionsOpen) {
this.props.hideFileOptions(this.props.id);
} else {
this.refs[`fileOptions-${this.props.id}`].focus();
this.props.showFileOptions(this.props.id);
}
}
renderChild(childId) {
return (
<li key={childId}>
@ -120,8 +129,7 @@ export class FileNode extends React.Component {
ref={`fileOptions-${this.props.id}`}
tabIndex="0"
onClick={() => {
this.refs[`fileOptions-${this.props.id}`].focus();
this.props.showFileOptions(this.props.id);
this.toggleFileOptions();
}}
>
<InlineSVG src={downArrowUrl} />

12
client/modules/IDE/components/Sidebar.jsx
View file

@ -16,6 +16,15 @@ class Sidebar extends React.Component {
this.props.setSelectedFile(this.props.files[1].id);
}
toggleProjectOptions() {
if (this.props.projectOptionsVisible) {
this.props.closeProjectOptions();
} else {
this.refs.sidebarOptions.focus();
this.props.openProjectOptions();
}
}
render() {
const sidebarClass = classNames({
sidebar: true,
@ -39,8 +48,7 @@ class Sidebar extends React.Component {
tabIndex="0"
ref="sidebarOptions"
onClick={() => {
this.refs.sidebarOptions.focus();
this.props.openProjectOptions();
this.toggleProjectOptions();
}}
onBlur={() => setTimeout(this.props.closeProjectOptions, 200)}
>