max-mapper / voxel-engine

3D HTML5 voxel game engine
http://maxogden.github.com/voxel-engine
BSD 3-Clause "New" or "Revised" License
1.29k stars 219 forks source link

Right Mouse button #114

Closed z3t0 closed 9 years ago

z3t0 commented 9 years ago

There seems to be no way to detect the right mouse button..

shama commented 9 years ago

@z3t0 https://developer.mozilla.org/en-US/docs/Web/Events/contextmenu

z3t0 commented 9 years ago

Sorry I'm kinda new to this, could you please provide a short example? I managed to get this working with gamejs but that is giving me a few annoying bugs

z3t0 commented 9 years ago

This is how I managed to get it working now.

// Controls

controls()

function controls(){

//Mouse Input
    document.body.addEventListener('mousedown', mousePressed)
    function mousePressed(event){
        switch(event.button){
            case 0: // Left mouse button
                var position = block
                if(game.getBlock(position) != 0){
                game.setBlock(position, 0)
                console.log('Break: ' + position)
                } else{
                    console.log('No Block')
                }

                break;

            case 1: // Middle mouse button
                var position = block
                var type = game.getBlock(position)
                console.log('BlockType: ' + type + ' : ' + position)
                break;

            case 2: // Right mouse button
            console.log(adjacentBlock)
                var position = adjacentBlock
                console.log(position)
                game.setBlock(position, 1)
                console.log('Placed: ' + position)

        }
    }

}
shama commented 9 years ago

Ah sorry I didn't understand your original request. contextmenu won't be useful in that case.

Here is an example which raycasts from the player's position and vector to determine the block to set (in which game is an instance of voxel-engine).

function raycast(dist) {
  dist = dist || 100
  var pos = game.cameraPosition()
  var vec = game.cameraVector()
  return game.raycastVoxels(pos, vec, dist)
}
document.addEventListener('mousedown', function(e) {
  if (e.button === 2) {
    var block = raycast()
    if (block) game.setBlock(block.position, 1)
  }
})

Also check out https://github.com/maxogden/voxel-highlight which does this and https://github.com/maxogden/voxel-hello-world/blob/master/index.js for a more in depth example.

z3t0 commented 9 years ago

Thanks! I am currently using this.

hl.on('highlight-adjacent', function(voxelPos) {
    adjacentBlock = voxelPos
    game.setBlock(adjacentBlock, 1)
    console.log('Placed: ' + adjacentBlock)
});
z3t0 commented 9 years ago

I was thinking of making some sort of wiki for voxel-engine and similar packages where we can put important things like this, what do you think? Also, is voxel-hello-world broken?

shama commented 9 years ago

You'd want to talk to @kumavis (as I think he is primary maintainer now?)

I'm not up to date on the current status of all the voxel- projects. I know a great deal of the effort has been move towards http://stack.gl/ and I think the plan is to circle back to the voxel- projects once the resources there are sufficient.

z3t0 commented 9 years ago

@shama That sounds interesting, but as I understand it voxel-engine uses Three.js right? So wouldn't that require rewriting it in stack.gl?

shama commented 9 years ago

@z3t0 I don't think any parts of three.js need to be rewritten. We just write the modules we need and try to avoid creating too much interdependence (as that would give us the same issues we have with three.js now).

A lot of these modules (or at least the foundation) already exist:

It's a bit all over the place atm but the holes are slowly being filled in. Once they are, making voxel modules and apps will become much easier and we'll be able to do a lot more interesting work.

deathcap commented 9 years ago

The biggest missing piece in the ndarray/stackgl branch (https://github.com/maxogden/voxel-engine/pull/103) right now is player avatars, there isn't anything like we had in three.js ported over, afaik.

For the original question of detecting right-click, https://github.com/maxogden/voxel-engine/issues/112 has some relevant pointers. I use https://github.com/deathcap/voxel-reach to handle DOM mousedown events; https://github.com/mikolalysenko/game-shell also listens for this event and provides a polling-style interface, which I use via descriptive keybinding names in https://github.com/deathcap/voxel-keys - this plugin also handles preventing the "default" browser action for both keys and mouse actions, so you can use them uninterrupted in your game (that is, it listens for DOM keydown and contextmenu events and calls preventDefault())

z3t0 commented 9 years ago

@deathcap @shama Thanks for the informative replies! We should probably create some sort of overarching wiki for the whole voxel-* project(s) because things like this are really confusing when you first start out.

P.S: This might be kinda stupid but... Is there some wiki out there I am not aware of? Because that would help a lot :smile:. Otherwise I could work on building the skeleton for one and you guys could fill in the technical details?