Shared library for simple functions

The challenge I have is that I’m teaching a classroom of 7-11 year olds in our elementary school. Whatever setup is created has to be easy-automatic. Sharing sketches at this age is beyond their ability to do without errors.

In exploring alternatives, I decided a public github is easiest after all. Here’s the goal:

  1. Create a grid on the canvas so that a student can visualize coordinates.
  2. Write numbers on the top and left side of the grid, next to the grid lines.
  3. As the mouse moves over, display somewhere the X,Y coordinate of the location of the mouse in canvas space.

I’ve done 1 & 2, and loaded it in github here:
https://po4599.github.io/javascript/grid.js
I will add #3 shortly, but have to test extensively to make sure the mouse action doesn’t break student’s code.

This can then be added by inserting
<script src=“https://po4599.github.io/javascript/grid.js”></script>
into index.html.

But even this edit of index.html is beyond them. Think issues with single quote vs. double quote, or colon vs. semi-colon. Is that a dot or a comma?

Ideally I’d like to share a library with all of my students, so the just need to add
grid();
into their code to see a grid.

Ideas?
-Peter

1 Like