'15-'16 General Discussion for Lesson 5.1

CS Principles Unit and Lesson Discussion
,
1

Use this thread to discuss your questions and comments about how to run the lesson.

2

Hello,

My students are a little confused on some of the events, especially around the “key up” or “key press” events. Which keys should be pressed? Does the mouse need to be over it when it starts? Do you need to click first? We have tried experimenting with it but it seems to only work occasionally.

I tried looking in the documentation but it did not seem to talk much about these specific events.

Any suggestions?
Kaitie

3

Hi Katie,

Thanks for letting us know. We are still working on improving the documentation so hopefully that will be clearer in the future.

In the meantime in general:

  • I’m pretty sure you have to click the canvas first (after running it)
    before you can use the keys.

  • There are certain keys which don’t work with the keyup, keydown and keypress. Keyup and keydown work for the same keys while keypress works for a slightly different set of keys. The main difference is kind of summarized below:

  • keyup -> when the key is released

  • keydown -> when the key is pressed down

  • keypress -> represents a character of any kind being produced (might require more than one key, i.e. trying to make the $ with shift and 4)

Does that help clarify things a bit?

-Dani

4

Dani,
Below is my coding for moving the Code.org logo. My question is, if the default image is the logo why in the example answer is a url referenced? I tried coding with text and not putting url in my image IU because the default input is the logo. How come the logo doesn’t appear?

https://studio.code.org/projects/applab/fE-QhaqzG7pnRbYyV7u10Q

Thanks,

  Dillon
5

hey, dillon!

here’s the documentation for the image function. in order to display and image you have to set an id (a unique identifier that you can use in your program to reference it) and a location to pull the image from (which is a URL for the image). here’s what the image block looks like when you drag it into the workspace from the toolbox:

as you noted, the default image is the code.org logo, and that’s because when you pull out an image block, the default URL is the URL to the code.org logo (i.e. https://code.org/images/logo.png).

-brook

6

Brook,
Thanks !

  • Dillon
7

This may be a bit off topic, but does anybody know how to determine which key is pressed? Is there a way to get the keycode?

thanks!
Tom

8

Hi Tom

The easiest way is to use console.log to print out the keycode.

The following code will print to the console as you hit different keys:

onEvent(“screen1”, “keyup”, function(event) {
console.log(event.key);
});

You can change the event type if you want to see keypress which has a couple differences in how it responds to the keyboard.

-Dani

9

Thanks Dani! Very helpful.