title: How to add on-screen virtual keyboard to a HTML5/Javascript/Canvas mobile game?
body: <p>I'm using HTML5 and canvas to design a game for which I need a keyboard input element. I do NOT want to use the device's keyboard, but instead, would like to make a custom keyboard that will be "fixed" to the screen/canvas for the duration of gameplay. I've seen <a href="http://net.tutsplus.com/tutorials/javascript-ajax/creating-a-keyboard-with-css-and-jquery/" rel="nofollow">NETTUT's</a> sample of a CSS/JS/HTML5 keyboard. I would love to recreate the IOS-like interface in that example. However, I'm interested in a keyboard that is integrated into the canvas (in other words, no CSS). Is that possible? If so, what are the different methods that I use in order to draw the keyboard and give it functionality WITHIN the canvas using javascript? Scaling is also a concern. I'm extremely comfortable with HTML5/CSS but I am brand new to Javascript, so PLEASE break it ALL the way down. Thanks!</p>