current community

your communities

more stack exchange communities

Stack Exchange
tour help
Take the 2-minute tour ×
Game Development Stack Exchange is a question and answer site for professional and independent game developers. It's 100% free, no registration required.
up vote 2 down vote favorite

I am creating a simple concept where I have a small menu to choose a tool from and then I can click and drag to build.

For example, I click on the rails tool and then I can click and move the mouse to create a rail segment.

I'm coding it something like this(missing some variables for temp values and objects):

var toolSelected = false;//if I click the rails button, it changes to 'rails'

renderer.domElement.addEventListener('mousedown', function(event){

    //here I check which is the tool selected 
    if(toolSelected === 'rails'){
        //create rail object starting in event coordinates
    }

});

renderer.domElement.addEventListener('mousemove', function(event){

    //here I check which is the tool selected 
    if(toolSelected === 'rails'){
        //pass the mouse movement to the rail object to update end coordinates position so I can drag and see the potential rail
    }

});

renderer.domElement.addEventListener('mouseup', function(event){

    //here I check which is the tool selected 
    if(toolSelected === 'rails'){
        //indicate that the rail should be finished and build it with the mouse up coordinates
    }

});

The question is, is there a better or recommended way to structure these mouse events? Or do I have to, under each mouse event, check which tool is selected and perform the appropriate actions?

share|improve this question

closed as off-topic by Anko, Trevor Powell, Josh Petrie♦ Aug 14 '14 at 15:31

This question appears to be off-topic. The users who voted to close gave this specific reason:

  • "Programming questions that aren't specific to game development are off-topic here, but can be asked on Stack Overflow. A good rule of thumb is to ask yourself "would a professional game developer give me a better/different/more specific answer to this question than other programmers?"" – Anko, Trevor Powell, Josh Petrie
If this question can be reworded to fit the rules in the help center, please edit the question.

1 Answer 1

up vote 1 down vote accepted

It's really your tools' responsibility to respond appropriately to events, so I'd recommend representing each of your tools as an object containing functions that handle mouse events and delegating the event handling to the currently active tool.

In practice, you can do this by defining your tools

var railsTool = {
    onMouseUp : function(event) { /* Whatever */ }
    // ... further event handlers
};
// ... further tools

and storing the active one in a globally-scoped activeTool-variable.

The event listener can delegate to the active tool's handler by doing something like

addEventListener('mouseup', function() {
    if (typeof activeTool.mouseUp == "function")   // Handler implemented?
        activeTool.mouseUp.apply(this, arguments); // Call it
});

and similarly for the other event types.

That should avoid repetitive code and keep tools cleanly separated.

share|improve this answer
    
this approach seems pretty good for what I'm trying to do! thanks! –  fmtoffolo Aug 14 '14 at 0:02
1  
If you care about performance, I would not recommend to process mouse events right away. You should do only basics in there, store some information aside and do heavylifting in requestAnimationFrame callback. –  FredyC Aug 14 '14 at 4:31

Not the answer you're looking for? Browse other questions tagged or ask your own question.