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

clean completion

Browse source
This commit is contained in:
Shin'ya Ueoka 2017-09-05 18:38:08 +09:00
parent d8c9651b77
commit e436b98808
1 changed files with 48 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

82
src/console/console.js
View file

@ -6,7 +6,7 @@ const parent = window.parent;
// TODO consider object-oriented // TODO consider object-oriented
var prevValue = ""; var prevValue = "";
window.completion = null; var completion = null;
var completionOrigin = ""; var completionOrigin = "";
const blurMessage = () => { const blurMessage = () => {
@ -34,10 +34,10 @@ const handleBlur = () => {
}; };
const completeNext = () => { const completeNext = () => {
if (!window.completion) { if (!completion) {
return; return;
} }
let item = window.completion.next(); let item = completion.next();
if (!item) { if (!item) {
return; return;
} }
@ -49,10 +49,10 @@ const completeNext = () => {
} }
const completePrev = () => { const completePrev = () => {
if (!window.completion) { if (!completion) {
return; return;
} }
let item = window.completion.prev(); let item = completion.prev();
if (!item) { if (!item) {
return; return;
} }
@ -125,53 +125,67 @@ const showError = (text) => {
completion.style.display = 'none'; completion.style.display = 'none';
} }
const createCompletionTitle = (text) => {
let li = document.createElement('li');
li.className = 'vimvixen-console-completion-title';
li.textContent = text;
return li
}
const createCompletionItem = (icon, caption, url) => {
let captionEle = document.createElement('span');
captionEle.className = 'vimvixen-console-completion-item-caption';
captionEle.textContent = caption
let urlEle = document.createElement('span');
urlEle.className = 'vimvixen-console-completion-item-url';
urlEle.textContent = url
let li = document.createElement('li');
li.style.backgroundImage = 'url(' + icon + ')';
li.className = 'vimvixen-console-completion-item';
li.append(captionEle);
li.append(urlEle);
return li;
}
const setCompletions = (completions) => { const setCompletions = (completions) => {
let completion = window.document.querySelector('#vimvixen-console-completion'); let container = window.document.querySelector('#vimvixen-console-completion');
completion.style.display = 'block'; container.style.display = 'block';
completion.innerHTML = ''; container.innerHTML = '';
let pairs = []; let pairs = [];
for (let group of completions) { for (let group of completions) {
let title = window.document.createElement('li'); let title = createCompletionTitle(group.name);
title.className = 'vimvixen-console-completion-title'; container.append(title);
title.textContent = group.name;
completion.append(title);
for (let item of group.items) { for (let item of group.items) {
let caption = window.document.createElement('span'); let li = createCompletionItem(item.icon, item.caption, item.url);
caption.textContent = item.caption; container.append(li);
caption.className = 'vimvixen-console-completion-item-caption';
let url = window.document.createElement('span');
url.textContent = item.url;
url.className = 'vimvixen-console-completion-item-url';
let li = window.document.createElement('li');
li.style.backgroundImage = 'url(' + item.icon + ')';
li.className = 'vimvixen-console-completion-item';
li.append(caption);
li.append(url);
completion.append(li);
pairs.push([item, li]); pairs.push([item, li]);
} }
} }
window.completion = new Completion(pairs); completion = new Completion(pairs);
let input = window.document.querySelector('#vimvixen-console-command-input'); let input = window.document.querySelector('#vimvixen-console-command-input');
completionOrigin = input.value.split(' ')[0]; completionOrigin = input.value.split(' ')[0];
} }
const selectCompletion = (element) => { const selectCompletion = (target) => {
let elements = window.document.querySelectorAll('.vimvixen-console-completion-item'); let container = window.document.querySelector('#vimvixen-console-completion');
Array.prototype.forEach.call(elements, (ele) => { Array.prototype.forEach.call(container.children, (ele) => {
ele.className = 'vimvixen-console-completion-item'; if (!ele.classList.contains('vimvixen-console-completion-item')) {
return;
}
if (ele === target) {
ele.classList.add('vimvixen-completion-selected');
} else {
ele.classList.remove('vimvixen-completion-selected');
}
}); });
element.classList.add('vimvixen-completion-selected');
}; };
messages.receive(window, (message) => { messages.receive(window, (message) => {