Event.key documentation

CS Principles Unit and Lesson Discussion
,
1

Lesson 14 Stage 5 introduces the event.key == “Up”, etc. functionality of App Lab. I was trying to find some documentation on this feature in the App Lab documentation and couldn’t find it, however. OnEvent documentation doesn’t cover it. We need this for students to refer to when doing the Create PT. I helped them find the information on this by pointing them to U5 L14 S5, but haven’t been able to find any details anywhere else. How do we, for example, know what the various keys are named (“a” vs “A”, “Spacebar” vs “Space_bar”, etc.). Are there keys we can’t use for this function at all?

2

The documentation for event.key == up is unfortunately not available. Its generation and release is in progress.
A temporary solution is to add a console.log statement to each on event to see what it does.

Look for a an update soon.

1 Like
3

What do I put in the console.log() to see this?

4

When a key is pressed you would print the value of the key. Something like this:

onEvent(“screen1”, “keypress”, function(event){
console.log('key is: '+event.key);
});

1 Like
5

Also note that the left, right, up, and down arrow keys don’t respond to a “keypress” event, but they do respond to a “keydown” event.

1 Like
6

Thank you!! THis helps alot! A lot of my kids are creating games for their create PT and have asked if app lab has this capability :slight_smile:

2 Likes
7

I believe it would need to be “keydown” instead of “keypress”.

Otherwise, thanks for a very helpful line of code!

Bill

8

is there a reason why my image will not follow the mouse when I click on the screen using the code shown below?

onEvent(“screen1”, “mouseover”, function(event) {
setPosition(“ball”, event.x, event.y);
});

Thanks for your help.

9

Hi,

Try ‘mousemove’ as the event type. ‘mouseover’ only fires once, when the mouse initially passes over the object.

Baker
CSP Team

10

Thanks a bunch Baker.
just one more question: how do you hide the mouse cursor?

11

You will need to use an advanced command (not in the toolbox). You will need to type it in text mode. Use the setStyle command like this: setStyle(“screen1”, “cursor:none”);

1 Like
12

Thanks again. You guys Rock!!