Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #38374

Re: Keydriven events howto best encapsulate the keypress code

Show all headers | View raw

=?UTF-8?Q?Jonas_Th=C3=B6rnvall?= <jonas.thornvall@gmail.com> wrote on 20
Apr 2020 in comp.lang.javascript: 

> Even though i use event listeners here and there i am not really
> familiar with how to encapsulate the keydriven actions, is the way i
> present here how it is usually done? Or should/can one breakout the if
> clauses/selection to put within their own function? 
> 
> I honestly find it disturbing having the active code together with the
> declaration of the listener? But maybe that is just me finding reading
> javascript syntax confusing? Ideas like function(event) as parameters to
> listeners just feel foreign to me. 
> 
> document.addEventListener('keydown', function(event) {
>         if (event.keyCode == 67) {
>             document.getElementById("cnode").checked = true;
>         } else if (event.keyCode == 66) {
>             document.getElementById("rnode").checked = true;
>         } else if (event.keyCode == 69) {
>            document.getElementById("rmnode").checked = true;
>            removeMarkedNodes();
>         } else if (event.keyCode == 74) {
>            reset_booleans;
>            moveit=true;
>            build_canvas();
>            document.getElementById("movenode").checked = true;
>         } else if (event.keyCode == 71) {
>             document.getElementById("mnode").checked = true;
>         } else if (event.keyCode == 70) {
>             document.getElementById("relnodes").checked = true;
>             reset_booleans();
>             markarea=true;
>             markUnmarkAll();
>             build_canvas();
>             document.getElementById("movenode").checked = true;
>         } else if (event.keyCode == 65) {
>             document.getElementById("area").checked = true;
>         } else if (event.keyCode == 72) {
>             document.getElementById("cmlink").checked = true;
>             createMarkedLinks();
>         } else if (event.keyCode == 73) {
>             document.getElementById("rmlink").checked = true;
>             removeMarkedLinks();
>         } else if (event.keyCode == 68) {
>             document.getElementById("drawtool").checked = true;
>         } else if (event.keyCode == 82) {
>           document.getElementById("reshape").checked = true;
>         } else if (event.keyCode == 17) {
>             drawstart = true;
>             message2="SET FOCUS"
>         } else if (event.keyCode == 16) {
>             shiftpress = true;
>         } else if (event.keyCode == 84) {
>             document.getElementById("beziercurve").checked = true;
>             bezier_curve();
>         }
>     });
> 

Try [untested ofcourse]:

const ecArr = '67/66/71/65/68/82/69/74/70/72/73/84'.split('/');
const enArr = 
'cnode/rnode/mnode/area/drawtool/reshape/rmnode/movenode/relnodes/cmlink/rml
ink/beziercurve'.split('/');

document.addEventListener('keydown', event => {
	let ec = event.keyCode;
	let found = ecArr.indexOf(ec);
	if (found>-1)
		document.getElementById(enArr[found]).checked = true;
	
	if (ec == 69) {
		removeMarkedNodes();
	} else if (ec == 74) {
		reset_booleans;
		moveit=true;
		build_canvas();
	} else if (ec == 70) {
		reset_booleans();
		markarea=true;
		markUnmarkAll();
		build_canvas();
		document.getElementById('movenode').checked = true;
	} else if (ec == 72) {
		createMarkedLinks();
	} else if (ec == 73) {
		removeMarkedLinks();
	} else if (ec == 17) {
		drawstart = true;
		message2="SET FOCUS";
	} else if (ec == 16) {
		shiftpress = true;
	} else if (ec == 84) {
		bezier_curve();
	};
});



-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

Back to comp.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread

Thread

Keydriven events howto best encapsulate the keypress code Jonas Thörnvall <jonas.thornvall@gmail.com> - 2020-04-20 13:25 -0700
  Re: Keydriven events howto best encapsulate the keypress code "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2020-04-21 01:01 +0200
  Re: Keydriven events howto best encapsulate the keypress code JJ <jj4public@vfemail.net> - 2020-04-21 13:37 +0700

csiph-web