XR extras rotate rotates all the entities

[diegoMontesinos]

In the A-Frame manipulate example, is using the xrextras-two-finger-rotate component. When I have two entities, and rotate with the two finger gesture, both entities are been rotated. I wanted to rotate just a selected one.

<a-entity
        id="model"
        gltf-model="#sandCastleModel"
        class="cantap"
        xrextras-hold-drag
        xrextras-two-finger-rotate
        xrextras-pinch-scale
        scale="3 3 3"
        shadow="receive: false">
      </a-entity>

<a-entity
        id="model-2"
        gltf-model="#sandCastleModel"
        class="cantap"
        xrextras-hold-drag
        xrextras-two-finger-rotate
        xrextras-pinch-scale
        scale="3 3 3"
        shadow="receive: false">
      </a-entity>

I decide to re-implement by myself the component adding a mousedown event to grab the entity that is been rotating:

let selection = null

const twoFingerRotateComponent = {
  schema: {
    factor: {default: 5},
  },
  init() {
    this.handleMouseDownEvent = this.handleMouseDownEvent.bind(this)
    this.handleMoveEvent = this.handleMoveEvent.bind(this)
    this.handleEndEvent = this.handleEndEvent.bind(this)

    this.el.addEventListener('mousedown', this.handleMouseDownEvent)
    this.el.sceneEl.addEventListener('twofingermove', this.handleMoveEvent)
    this.el.sceneEl.addEventListener('twofingerend', this.handleEndEvent)
  },
  remove() {
    this.el.removeEventListener('mousedown', this.handleMouseDownEvent)
    this.el.sceneEl.removeEventListener('twofingermove', this.handleMoveEvent)
    this.el.sceneEl.removeEventListener('twofingerend', this.handleEndEvent)
  },
  handleMouseDownEvent(event) {
    selection = this.el
  },
  handleMoveEvent(event) {
    if (selection) {
      selection.object3D.rotation.y += event.detail.positionChange.x * this.data.factor
    }
  },
  handleEndEvent(event) {
    selection = null
  },
}

export {twoFingerRotateComponent}

And registering with:

import {twoFingerRotateComponent} from './xrextras-finger-rotate'

AFRAME.registerComponent('xrextras-finger-rotate', twoFingerRotateComponent)

Any thoughts? Can you update the XRExtras library?

[malika-k]

I am facing this same issue with xrextra-one-finger-rotate as well

[atomarch]

Check out https://www.8thwall.com/playground/gesture-selector , this sample projects allows you to position, scale or rotate objects individually