Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 1 of 1
  1. #1
    New Coder
    Join Date
    May 2011
    Thanked 0 Times in 0 Posts

    Click/touch Icon, send keyboard input to canvas

    Edit2:: This is what I got to work.
    <INPUT class=touch type=button value='UP' onMouseDown="up=true;" onMouseUp="up=false;">
    <INPUT class=touch type=button value='DOWN' onMouseDown="down=true;" onMouseUp="down=false;">
    Then added a check to see if (up==true) {move up code}
    else if (down==true) {move down code}


    <INPUT class=touch type=button value='38' onMouseDown="movingUP();">
    Then in JS
    function movingUP(){
     window.event.keyCode = 38;

    But what do I put in movingUP() to send keyCode 38 when while the button is being clicked?????????????????????

    Trying to add 8 icons of W,A,S,D, LEFT, RIGHT, UP, DOWN which upon click/touch will input the relative command to the screen canvas for mobiles that don't have a keyboard.

    They aren't clicking on the canvas. I need some buttons/icons/images outside the canvas probably in a div, that send input events as an alternative to a keyboard...Something that can be clicked and held down to repeatedly spam that key to walk in that direction.

    I have script to click icons from a keyboard and output the clicked key to a text field, but I don't know how to tie it into my keyboard listener in my game..

    My game code uses:
    // Handle keyboard controls
    var keysDown = {};
    addEventListener("keydown", function (e) {
     keysDown[e.keyCode] = true;
    }, false);
    addEventListener("keyup", function (e) {
     delete keysDown[e.keyCode];
    }, false);
    Then elsewhere I can trigger events when keysDown contains the number of a key that triggers an item like:

    if (38 in keysDown && hero.y > 0 ) { 	// Player holding UP key
     	//walk north code here
    Is there a simple way to click on a button and send the "UP" keyCode to the entire screen? Particularly the canvas element......Or get it into my keysDown[e.keyCode];

    I found this:
    function addKey(cKey)
    d = document.forms["foo"].elements["bar"];
    d.value = (cKey.value=='backspace') ? d.value.slice(0,-1) : d.value+cKey.value;

    //elsewhere in html body
    <INPUT class=touch type=button value=w onClick="addKey(this)">
    which will send 'w' when clicked, and I tried to send '38' instead but it only sends it to 1 element and not the entire screen....so it shows 38 in a text box each time I click it but it doesn't actually send 38 to keys being pressed.

    Is there a simple way to do this? I wanted to add a fire button and others I figured I could just put an image with an event but can't figure it out....
    Last edited by nuBee; 12-22-2011 at 05:03 PM.


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts