add find next and find previous commands to nav

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

View file

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

View file

@ -49,6 +49,8 @@ class Editor extends React.Component {
super(props);
this.tidyCode = this.tidyCode.bind(this);
this.showFind = this.showFind.bind(this);
this.findNext = this.findNext.bind(this);
this.findPrev = this.findPrev.bind(this);
}
componentDidMount() {
this.beep = new Audio(beepUrl);
@ -122,7 +124,9 @@ class Editor extends React.Component {
this.props.provideController({
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() {
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() {