commit 7427c13e7d1eeb6e08acc8b86db2f309f387a7bd
parent 9c696a4e777cf9d4b0a27bec9ecc20ea8c3fe8cb
Author: Alexander Burger <abu@software-lab.de>
Date: Mon, 28 Nov 2011 18:49:55 +0100
Up, down and enter keys in hints
Diffstat:
M | lib/form.js | | | 76 | ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++---------------- |
M | lib/xhtml.l | | | 2 | +- |
2 files changed, 61 insertions(+), 17 deletions(-)
diff --git a/lib/form.js b/lib/form.js
@@ -4,7 +4,7 @@
var FormReq = false;
var HintReq = false;
-var Hint, Hints, Beg, End;
+var Hint, Hints, Item, Beg, End;
try {
FormReq = new XMLHttpRequest();
@@ -21,8 +21,16 @@ var Key, InBtn, Auto, Drop;
function inBtn(flg) {InBtn = flg;}
function formKey(event) {
- if ((Key = event.keyCode) == 27 && Hint)
- Hint.style.visibility = "hidden";
+ Key = event.keyCode;
+ if (Hint && Hint.style.visibility == "visible") {
+ if ((Item >= 0 && Key == 13) || Key == 38 || Key == 40)
+ return false;
+ if (event.keyCode == 27) {
+ Hint.style.visibility = "hidden";
+ Item = -1;
+ return false;
+ }
+ }
return true;
}
@@ -306,16 +314,45 @@ function doHint(field) {
}
Hint.style.top = top + "px";
Hint.style.left = left + "px";
+ Item = -1;
}
}
function hintKey(field, event, tok, coy) {
- var i, data;
+ var i, data, lst;
if (!HintReq)
return true;
if (event.keyCode == 9 || event.keyCode == 27)
return false;
+ if (Item >= 0 && event.keyCode == 13) {
+ setHint(field, Hints.childNodes[Item]);
+ return false;
+ }
+ if (event.keyCode == 38) { // Up
+ if (Hint.style.visibility == "hidden")
+ return true;
+ if (Item > 0) {
+ (lst = Hints.childNodes)[Item].style.background = "white";
+ lst[Item].style.color= "black";
+ lst[--Item].style.background = "black";
+ lst[Item].style.color= "white";
+ }
+ return false;
+ }
+ if (event.keyCode == 40) { // Down
+ if (Hint.style.visibility == "hidden")
+ return true;
+ if (Item < (lst = Hints.childNodes).length-1) {
+ if (Item >= 0) {
+ lst[Item].style.background = "white";
+ lst[Item].style.color= "black";
+ }
+ lst[++Item].style.background = "black";
+ lst[Item].style.color= "white";
+ }
+ return false;
+ }
if (HintReq.readyState > 0 && HintReq.readyState < 4)
return false;
if (tok) {
@@ -350,7 +387,7 @@ function hintKey(field, event, tok, coy) {
while (Hints.hasChildNodes())
Hints.removeChild(Hints.firstChild);
for (i = 0, n = 7; i < lst.length; ++i) {
- addHint(field, str = decodeURIComponent(lst[i]));
+ addHint(i, field, str = decodeURIComponent(lst[i]));
if (str.length > n)
n = str.length;
}
@@ -373,30 +410,37 @@ function hintKey(field, event, tok, coy) {
return (event.keyCode != 45); // INS
}
-function addHint(field, str) {
+function addHint(i, field, str) {
var item = document.createElement("div");
item.appendChild(document.createTextNode(str));
item.onmouseover = function() {
this.style.background = "black";
this.style.color= "white";
field.onchange = false;
+ Item = i;
}
item.onmouseout = function() {
this.style.background = "white";
this.style.color= "black";
field.onchange = function() {
- return fldChg(field)
+ return fldChg(field, item);
};
+ Item = -1;
}
- item.onclick = function () {
- Hint.style.visibility = "hidden";
- field.value = field.value.substr(0,Beg) + item.firstChild.nodeValue + field.value.substr(End);
- post(field.form, null);
- field.setSelectionRange(Beg + item.firstChild.nodeValue.length, field.value.length);
- field.focus();
- field.onchange = function() {
- return fldChg(field)
- };
+ item.onclick = function() {
+ setHint(field, item);
}
Hints.appendChild(item);
}
+
+function setHint(field, item) {
+ Hint.style.visibility = "hidden";
+ field.value = field.value.substr(0,Beg) + item.firstChild.nodeValue + field.value.substr(End);
+ post(field.form, null);
+ field.setSelectionRange(Beg + item.firstChild.nodeValue.length, field.value.length);
+ field.focus();
+ field.onchange = function() {
+ return fldChg(field)
+ };
+ Item = -1;
+}
diff --git a/lib/xhtml.l b/lib/xhtml.l
@@ -521,7 +521,7 @@
(prin
"<form enctype=\"multipart/form-data\" action=\""
(sesId Url)
- (and *JS "\" onkeydown=\"return formKey(event)\" onsubmit=\"return doPost(this)")
+ (and *JS "\" onkeydown=\"return formKey(event)\" onkeypress=\"return formKey(event)\" onsubmit=\"return doPost(this)")
"\" method=\"post\">" )
(tag 'fieldset Attr 2 Prg)
(prinl "</form>") )