Allow manual coords input for overlaps.

[MattiasBuelens]

Replaced the span#coords2 with an input#coords2 and made it trigger the overlap calculation on value change. This way, you can quickly see what buttons are hit by a given coordinate without having to actually aim for that coordinate on the grid.

[hftf]

Looks good — but for usability, I think it somehow needs to handle successes (visibly indicate that the tool accepted the new value and “something happened”; i.e., currently, changing a coordinate by 1 doesn’t have a real visible effect) and failures (invalid input).

[MattiasBuelens]

Indeed, validation may be helpful. I'll make a follow-up patch for it.

[hftf]

I'm working on validation already, about to push.

[MattiasBuelens]

You made it waaay to difficult on yourself. HTML5 comes with basic input validation out of the box through the pattern attribute attribute :stuck_out_tongue: Have a look at 608bae1b2332118b424ae1e3991084fbff88be04.

However, handling input validation yourself does allow you to do more complex checks, such as your boundary check...

[hftf]

Ah yeah, I completely forgot about the validation API. :frowning: I'll think about changing it later, but I'm pretty sure the code would look basically the same* — time would be better spent adding more features instead.

* better browser support too, but that doesn't worry me since we're using cooler stuff like canvas anyway.

[MattiasBuelens]

I've opened #24 and #25 with some tiny improvements, nothing spectacular though and totally optional. Other than that, I agree that it's good enough as-is.