keypress event -> control characters

[phil_gg04]

Dear Javascript Experts,

I'm currently implementing Anyterm, a terminal emulator on a web page.
It consists of an Apache module, some XmlHTTP and a bit of Javascript.
The idea is to give you shell access to your server from (almost)
anywhere; other solutions to the problem tend to require access to
ports other than 80 and Java. The very primitive first attempt is at
http://chezphil.org/anyterm/. A more functional version will be
available soon.

My "problem for the day" is how to send control characters. For
example, if the user types Ctrl-D I need to send byte 4 to the server.
There are two sub-problems: first, some of these actions will be
intercepted by the browser so I need to do anything I can to avoid that
and/or provide an alternative entry mechanism (eg press ALT for CTRL).
Second, I need a piece of reasonably browser-independent code that
takes a keypress event, looks at all of its properties, and returns a
byte.

I'm hoping that someone has already done this and can point me at some
existing code. Otherwise, all suggestions are welcome.

Regards,

--Phil.

 

[Diego Vilar]

Hi Phil,

Guess it can be done, but forget about onkeypress.... you would need
onkeydown, since onkeypress only fires for a limited set of chars....
onkeydown lets u catch most of the keys before the browser does... ALT
and CTRL could be detected by reading object event's specific
properties for those keys (altKey, altLeft, ctrlKey, ctrlLeft) in the
onkeydown event handler.. Well, I dont really do cross-browser
scripts... I´m kinda of an IE guy cause thats the enviroment used for
my company, but read some Javascript papers and Netscape's DOM on those
events.. that should not be dificult.

Anyway,
http://msdn.microsoft.com/workshop/author/dhtml/reference/events/onkeydown.asp?frame=true

[ ]'s
Diego

 

[phil_gg04]

Replying to my own question...

I need a piece of reasonably browser-independent code that
takes a keypress event, looks at all of its properties, and returns a
byte. [for key combinations including control sequences]

Well as Diego points out onkeypress doesn't do control keys, but on the
other hand if I use onkeydown I have to map shift+a to capital A etc
myself. So I'm now using the following code that uses both onkeypress
and onkeydown; onkeypress is used in most cases but ignores evens when
ctrl is pressed while onkeydown detects only those. This seems to work
in Firefox1.0 and IE6, though in FF the browser default actions (e.g.
Ctrl-A = select all) still seem to fire; can I stop that? I also need
to worry about keys like PgUp/PgDn, arrows etc. Any improvements
welcomed.

function keypress(ev) {
if (!ev) var ev=window.event;

if (ev.ctrlKey) {
return;
}

var kc;
if (ev.keyCode) kc=ev.keyCode;
if (ev.which) kc=ev.which;
//if (kc==13) kc=10;
var k=String.fromCharCode(kc);
process_key(k);

ev.cancelBubble=true;
if (ev.stopPropagation) ev.stopPropagation();
return false;
}


function keydown(ev) {
if (!ev) var ev=window.event;

if (!ev.ctrlKey || ev.keyCode==17) {
return;
}

var kc=ev.keyCode;
process_key(String.fromCharCode(kc-64));

ev.cancelBubble=true;
if (ev.stopPropagation) ev.stopPropagation();
return false;
}


document.onkeypress=keypress;
document.onkeydown=keydown;



Many thanks,

--Phil.

 

[Martin Honnen]

though in FF the browser default actions (e.g.
Ctrl-A = select all) still seem to fire; can I stop that?

You could at least try to use the proper code for that
if (ev.preventDefault) {
ev.preventDefault();
}
in DOM Level 2:
<http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-Event>
Note that I haven't checked whether that prevents the text selection in
Mozilla.

 

[phil_gg04]

the browser default actions (e.g. Ctrl-A = select all) still seem to
fire

ev.preventDefault();

You're right, I should do that. But unfortunately it doesn't seem to
help with ctrl-A.

--Phil.