New Idea for game result input

[feibeck]

The current input elements for entering a game result is not very userfriendly, especially on a tablet or touchscreen computer.

Mimic the goal counter on the table soccer with some nice graphics and enable a click/touch setting of the goals.

Team 1: __1-2-3-4-5-6-7-8-9-10
Team 2: __1-2-3-4-5-6-7-8-9-10

Clicking or touching a number chooses the number as the goal count. For example after clicking on 4 in the first row on the example above will change the counter to:

Team 1: 1-2-3-4__5-6-7-8-9-10
Team 2: __1-2-3-4-5-6-7-8-9-10

As a further improvement, the current active number (4) could be highlighted or the numbers higher than the goal count printed in a lighter color.

The input "widget" allows the setting of a game result with just two clicks. Even better, it can automatically set the 10 on the other game as soon as a number lower than 10 is selected, which would reduce the number of clicks to one.

The "widget" could be implemented as a jQuery plugin that can decorate a single input element with the new input.