jab2870/Vim-Vixen
Archived
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Clean completion component

Browse source
This commit is contained in:
Shin'ya Ueoka 2019-02-14 20:55:55 +09:00
parent 014963b327
commit f43a2d2a9e
2 changed files with 11 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/console/components/console.jsx
View file

@ -6,6 +6,8 @@ import Completion from './console/completion';
import Message from './console/message'; import Message from './console/message';
import * as consoleActions from '../../console/actions/console'; import * as consoleActions from '../../console/actions/console';
const COMPLETION_MAX_ITEMS = 33;
class ConsoleComponent extends Component { class ConsoleComponent extends Component {
onBlur() { onBlur() {
if (this.props.mode === 'command' || this.props.mode === 'find') { if (this.props.mode === 'command' || this.props.mode === 'find') {
@ -105,7 +107,7 @@ class ConsoleComponent extends Component {
case 'command': case 'command':
case 'find': case 'find':
return <div className='vimvixen-console-command-wrapper'> return <div className='vimvixen-console-command-wrapper'>
<Completion /> <Completion size={COMPLETION_MAX_ITEMS} />
<Input <Input
ref={(c) => { this.input = c; }} ref={(c) => { this.input = c; }}
mode={this.props.mode} mode={this.props.mode}

22
src/console/components/console/completion.jsx
View file

@ -1,8 +1,6 @@
import { Component, h } from 'preact'; import { Component, h } from 'preact';
import { connect } from 'preact-redux'; import { connect } from 'preact-redux';
const COMPLETION_MAX_ITEMS = 33;
const CompletionTitle = (props) => { const CompletionTitle = (props) => {
return <li className='vimvixen-console-completion-title' >{props.title}</li>; return <li className='vimvixen-console-completion-title' >{props.title}</li>;
}; };
@ -38,18 +36,14 @@ class CompletionComponent extends Component {
} }
let viewSelect = (() => { let viewSelect = (() => {
let view = 0;
let index = 0; let index = 0;
for (let group of nextProps.completions) { for (let i = 0; i < nextProps.completions.length; ++i) {
++view; ++index;
// TODO refactor let g = nextProps.completions[i];
for (let _ of group.items) { if (nextProps.select + i + 1 < index + g.items.length) {
if (index === nextProps.select) { return nextProps.select + i + 1;
return view;
}
++view;
++index;
} }
index += g.items.length;
} }
})(); })();
@ -58,7 +52,7 @@ class CompletionComponent extends Component {
viewOffset = 0; viewOffset = 0;
} else if (prevState.select < nextProps.select) { } else if (prevState.select < nextProps.select) {
viewOffset = Math.max(prevState.viewOffset, viewOffset = Math.max(prevState.viewOffset,
viewSelect - COMPLETION_MAX_ITEMS + 1); viewSelect - nextProps.size + 1);
} else if (prevState.select > nextProps.select) { } else if (prevState.select > nextProps.select) {
viewOffset = Math.min(prevState.viewOffset, viewSelect); viewOffset = Math.min(prevState.viewOffset, viewSelect);
} }
@ -83,7 +77,7 @@ class CompletionComponent extends Component {
} }
let viewOffset = this.state.viewOffset; let viewOffset = this.state.viewOffset;
eles = eles.slice(viewOffset, viewOffset + COMPLETION_MAX_ITEMS); eles = eles.slice(viewOffset, viewOffset + this.props.size);
return ( return (
<ul className='vimvixen-console-completion'> <ul className='vimvixen-console-completion'>