gryf/pentadactyl-pm
1
0
Fork 0
mirror of https://github.com/gryf/pentadactyl-pm.git synced 2025-12-23 12:32:27 +01:00
Code Issues Projects Releases Wiki Activity

Speed completion scrolling

Browse Source
This commit is contained in:
Kris Maglione
2008-11-25 01:29:51 +00:00
parent 8de6c9d8df
commit ac2378110d
3 changed files with 69 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
content/completion.js
View File

@@ -108,6 +108,7 @@ CompletionContext.prototype = {
{ {
delete this.cache.filtered; delete this.cache.filtered;
delete this.cache.filter; delete this.cache.filter;
this.cache.rows = [];
this.hasItems = items.length > 0; this.hasItems = items.length > 0;
this._completions = items; this._completions = items;
let self = this; let self = this;
@@ -126,10 +127,14 @@ CompletionContext.prototype = {
get generate() !this._generate ? null : function () get generate() !this._generate ? null : function ()
{ {
this._completions = this._generate.call(this); let updateAsync = this.updateAsync; // XXX
this.updateAsync = false;
this.completions = this._generate.call(this);
this.updateAsync = updateAsync;
this.cache.offset = this.offset; this.cache.offset = this.offset;
this.cache.key = this.key; this.cache.key = this.key;
return this._completions; return this.completions;
}, },
set generate(arg) set generate(arg)
{ {
@@ -217,15 +222,24 @@ CompletionContext.prototype = {
{ {
let self = this; let self = this;
let items = this.items; let items = this.items;
if (!items)
return [];
let reverse = start > end; let reverse = start > end;
start = Math.max(0, start || 0); start = Math.max(0, start || 0);
end = Math.min(items.length, end ? end : items.length); end = Math.min(items.length, end ? end : items.length);
return util.map(util.range(start, end, reverse), function (i) items[i]); return util.map(util.range(start, end, reverse), function (i) items[i]);
}, },
getRows: function (start, end, doc)
{
let self = this;
let items = this.items;
let cache = this.cache.rows;
let reverse = start > end;
start = Math.max(0, start || 0);
end = Math.min(items.length, end ? end : items.length);
return util.map(util.range(start, end, reverse),
function (i) cache[i] = cache[i] || util.xmlToDom(self.createRow(items[i]), doc));
},
fork: function fork(name, offset, completer, self) fork: function fork(name, offset, completer, self)
{ {
let context = new CompletionContext(this, name, offset); let context = new CompletionContext(this, name, offset);

10
content/template.js
View File

@@ -32,7 +32,7 @@ const template = {
return <>{xml}</>; return <>{xml}</>;
}, },
completionRow: function completionRow(context, item, class) completionRow: function completionRow(item, class)
{ {
if (typeof icon == "function") if (typeof icon == "function")
icon = icon(); icon = icon();
@@ -43,8 +43,8 @@ const template = {
} }
else else
{ {
var text = context.process[0].call(context, item, item.text || context.getKey(item, "text")); var text = this.process[0].call(this, item, item.text || this.getKey(item, "text"));
var desc = context.process[1].call(context, item, context.getKey(item, "description")); var desc = this.process[1].call(this, item, this.getKey(item, "description"));
} }
return <ul class={class || "hl-CompItem"}> return <ul class={class || "hl-CompItem"}>
@@ -195,9 +195,9 @@ const template = {
context.format = format; context.format = format;
return this.generic( return this.generic(
<div class="hl-Completions"> <div class="hl-Completions">
{ this.completionRow(context, context.title, "hl-CompTitle") } { this.completionRow(context.title, "hl-CompTitle") }
{ {
this.map(items, function (item) template.completionRow(context, { text: context.getKey({item: item}, "text"), item: item })) this.map(items, function (item) template.completionRow.call(context, { text: context.getKey({item: item}, "text"), item: item }))
} }
</div>); </div>);
}, },

80
content/ui.js
View File

@@ -1289,6 +1289,8 @@ function ItemList(id) //{{{
var startIndex = -1; // The index of the first displayed item var startIndex = -1; // The index of the first displayed item
var endIndex = -1; // The index one *after* the last displayed item var endIndex = -1; // The index one *after* the last displayed item
var selIndex = -1; // The index of the currently selected element var selIndex = -1; // The index of the currently selected element
var div = null;
var noCompletions = null;
var completionBody = null; var completionBody = null;
var minHeight = 0; var minHeight = 0;
var div = null; var div = null;
@@ -1298,6 +1300,7 @@ function ItemList(id) //{{{
if (container.collapsed) if (container.collapsed)
div.style.minWidth = document.getElementById("liberator-commandline").scrollWidth + "px"; div.style.minWidth = document.getElementById("liberator-commandline").scrollWidth + "px";
minHeight = Math.max(minHeight, completionBody.getBoundingClientRect().bottom); minHeight = Math.max(minHeight, completionBody.getBoundingClientRect().bottom);
minHeight = 400;
container.height = minHeight; container.height = minHeight;
div.style.minWidth = undefined; div.style.minWidth = undefined;
// FIXME: Belongs elsewhere. // FIXME: Belongs elsewhere.
@@ -1306,6 +1309,30 @@ function ItemList(id) //{{{
function getCompletion(index) completionElements[index - startIndex]; function getCompletion(index) completionElements[index - startIndex];
function init()
{
function dom(xml) util.xmlToDom(xml, doc);
div = dom(
<div class="ex-command-output hl-Normal" style="white-space: nowrap">
<div class="hl-Completions"><span class="hl-Title">No Completions</span></div>
<div/>
<div class="hl-Completions">
{
template.map(util.range(0, maxItems), function (i)
<ul><li class="hl-CompTitle hl-NonText">~</li></ul>)
}
</div>
</div>);
noCompletions = div.childNodes[0];
completionBody = div.childNodes[1];
items.contextList.forEach(function (context) {
if (!context.items.length)
return;
context.cache.dom = dom(<div class="hl-Completions">{context.createRow(context.title || [], "hl-CompTitle")}</div>);
completionBody.appendChild(context.cache.dom);
});
}
/** /**
* uses the entries in "items" to fill the listbox * uses the entries in "items" to fill the listbox
* does incremental filling to speed up things * does incremental filling to speed up things
@@ -1321,50 +1348,32 @@ function ItemList(id) //{{{
startIndex = offset; startIndex = offset;
endIndex = Math.min(startIndex + maxItems, items.allItems.items.length); endIndex = Math.min(startIndex + maxItems, items.allItems.items.length);
// do a full refill of the list:
XML.ignoreWhitespace = true; XML.ignoreWhitespace = true;
let off = 0; let off = 0;
function getItems(context) function getRows(context)
{ {
let len = context.items.length; let len = context.items.length;
let start = off; let start = off;
off += len; off += len;
return context.getItems(offset - start, endIndex - start); return context.getRows(offset - start, endIndex - start, doc);
} }
let xml = <div class="ex-command-output hl-Normal" style="white-space: nowrap"> items.contextList.forEach(function (context) {
<div class="hl-Completions"> let dom = context.cache.dom;
{ if (!dom)
items.allItems.items.length == 0 ? return;
<span class="hl-Title">No Completions</span> while (dom.childNodes[1])
: <></> dom.removeChild(dom.childNodes[1]);
} for (let [,row] in Iterator(getRows(context)))
{ dom.appendChild(row);
template.map(items.contextList, function (context) context.items.length ? });
<>
{ context.createRow(context, context.title || [], "hl-CompTitle") } noCompletions.style.display = off > 0 ? "none" : "block";
{
template.map(getItems(context), function (item) context.createRow(context, item)) let dom = div.cloneNode(true);
} completionElements = dom.getElementsByClassName("hl-CompItem");
</> doc.body.replaceChild(dom, doc.body.firstChild);
: undefined)
}
</div>
<div class="hl-Completions">
{
// Hmm. The problem with not making this a CompItem is that
// the height and padding aren't the same.
template.map(util.range(0, maxItems), function (i)
<ul><li class="hl-NonText">~</li></ul>)
}
</div>
</div>;
div = util.xmlToDom(xml, doc);
completionBody = div.getElementsByClassName("hl-Completions")[0];
//completionElements = completionBody.childNodes; // Kris: This is broken for things like :dia pr<tab>
completionElements = div.getElementsByClassName("hl-CompItem");
doc.body.replaceChild(div, doc.body.firstChild);
autoSize(); autoSize();
} }
@@ -1395,6 +1404,7 @@ function ItemList(id) //{{{
{ {
startIndex = endIndex = selIndex = -1; startIndex = endIndex = selIndex = -1;
items = newItems; items = newItems;
init();
if (typeof selectedItem == "number") if (typeof selectedItem == "number")
{ {
this.selectItem(selectedItem); this.selectItem(selectedItem);