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

add find next and find previous commands to nav

Browse source
This commit is contained in:
Cassie Tarakajian 2017-09-14 16:58:59 -04:00
parent 7f206122a2
commit 34cf86326b
2 changed files with 42 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
client/components/Nav.jsx
View file

@ -131,7 +131,7 @@ class Nav extends React.PureComponent {
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Save Save
<span className="nav__keyboard-shortcut">{metaKeyName} + s</span> <span className="nav__keyboard-shortcut">{metaKeyName}+s</span>
</button> </button>
</li> } </li> }
{ this.props.project.id && this.props.user.authenticated && { this.props.project.id && this.props.user.authenticated &&
@ -206,7 +206,7 @@ class Nav extends React.PureComponent {
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Tidy Code Tidy Code
<span className="nav__keyboard-shortcut">{'\u21E7'} + Tab</span> <span className="nav__keyboard-shortcut">{'\u21E7'}+Tab</span>
</button> </button>
</li> </li>
<li className="nav__dropdown-item"> <li className="nav__dropdown-item">
@ -216,7 +216,27 @@ class Nav extends React.PureComponent {
onBlur={this.handleBlur} onBlur={this.handleBlur}
> >
Find Find
<span className="nav__keyboard-shortcut">{metaKeyName} + F</span> <span className="nav__keyboard-shortcut">{metaKeyName}+F</span>
</button>
</li>
<li className="nav__dropdown-item">
<button
onClick={() => this.props.cmController.findNext()}
onFocus={this.handleFocus.bind(this, 'edit')}
onBlur={this.handleBlur}
>
Find Next
<span className="nav__keyboard-shortcut">{metaKeyName}+G</span>
</button>
</li>
<li className="nav__dropdown-item">
<button
onClick={() => this.props.cmController.findPrev()}
onFocus={this.handleFocus.bind(this, 'edit')}
onBlur={this.handleBlur}
>
Find Previous
<span className="nav__keyboard-shortcut">{'\u21E7'}+{metaKeyName}+G</span>
</button> </button>
</li> </li>
</ul> </ul>
@ -395,7 +415,9 @@ Nav.propTypes = {
showKeyboardShortcutModal: PropTypes.func.isRequired, showKeyboardShortcutModal: PropTypes.func.isRequired,
cmController: PropTypes.shape({ cmController: PropTypes.shape({
tidyCode: PropTypes.func, tidyCode: PropTypes.func,
showFind: PropTypes.func showFind: PropTypes.func,
findNext: PropTypes.func,
findPrev: PropTypes.func
}) })
}; };

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

@ -49,6 +49,8 @@ class Editor extends React.Component {
super(props); super(props);
this.tidyCode = this.tidyCode.bind(this); this.tidyCode = this.tidyCode.bind(this);
this.showFind = this.showFind.bind(this); this.showFind = this.showFind.bind(this);
this.findNext = this.findNext.bind(this);
this.findPrev = this.findPrev.bind(this);
} }
componentDidMount() { componentDidMount() {
this.beep = new Audio(beepUrl); this.beep = new Audio(beepUrl);
@ -122,7 +124,9 @@ class Editor extends React.Component {
this.props.provideController({ this.props.provideController({
tidyCode: this.tidyCode, tidyCode: this.tidyCode,
showFind: this.showFind showFind: this.showFind,
findNext: this.findNext,
findPrev: this.findPrev
}); });
} }
@ -208,7 +212,17 @@ class Editor extends React.Component {
} }
showFind() { showFind() {
this._cm.execCommand('find'); this._cm.execCommand('findPersistent');
}
findNext() {
this._cm.focus();
this._cm.execCommand('findNext');
}
findPrev() {
this._cm.focus();
this._cm.execCommand('findPrev');
} }
toggleEditorOptions() { toggleEditorOptions() {