Hello.

I am attempting to make it so the player can click on the edges of the game to go those directions. (I played a game on an Android app that has this functionality, and it is VERY nice on a mobile device!)

Anyway clicking on the top in the center goes N, top-right corner goes NE, etc....

This pretty much works...

I had it working better than I have it working now, but... I lost that code in the mix.

Anyone have any insights?

EDITED

(function($) {
  $(document).ready(function() {

    $(document).click(function(e) {
	  var relativeX = (e.pageX - $(e.target).offset().left),
	  relativeY = (e.pageY - $(e.target).offset().top);
	  if (relativeY < 30 && (relativeX > $('#gameBorder').width()/2-50 && relativeX < $('#gameBorder').width()/2+50)){
	    sendCommand("n");
	  }else if (relativeY > $(window).innerHeight() - 30 && (relativeX > $('#gameBorder').width()/2-50 && relativeX < $('#gameBorder').width()/2+50)){
	    sendCommand("s");
	  }else if (relativeY > $(window).innerHeight()/2 - 50 && relativeY < $(window).innerHeight()/2 + 50 && relativeX < 100){
	    sendCommand("w");
	  }else if (relativeY > $(window).innerHeight()/2 - 50 && relativeY < $(window).innerHeight()/2 + 50 && relativeX > $(window).innerWidth()-50){
	    sendCommand("e");
	  }else if (relativeY > $(window).innerHeight() - 30 && relativeX < 100){
	    sendCommand("sw");
	  }else if (relativeY > $(window).innerHeight() - 30 && relativeX > $(window).innerWidth()-100){
	    sendCommand("se");
	  }else if (relativeY < 30 && relativeX < 100){
	    sendCommand("nw");
	  }
	  else if (relativeY < 30 && relativeX > $(window).innerWidth()-100){
	    sendCommand("ne");
	  }			
	  console.log("X: " + relativeX + "  Y: " + relativeY);
    });
  });
})(jQuery);

... and no. I really don't have any clue as to what I should be doing here.

I think I would put invisible DIVs in each place on the border; if the player clicks on them, it sends the commands to Quest. I fact, I would start with them visible, get that working.