ARCGIS Javascript vertex custom right click event possible?

Question

i am using the ARCGIS Javascript API and trying to override the default right click behavior of the vertex points of a shape.

in ESRI's help it does list the onVertexClick event however from here it seems there is no way to determine if this is a right or left click event so i cannot override just the rightclick. https://developers.arcgis.com/javascript/jsapi/edit.html

I am trying to set the right click behavour to just delete the current node/vertex instead of showing a menu with the option Delete.

EDIT Here is the current event that exists within the ARCGIS api.

this.eventsList.push(dojo.connect(this._editToolbar, 'onVertexClick', $.proxy(this.addCustomVertexClickEvent, this)));

this event is already in the api however it does not return any way for me to determine left/right click.

your comment "listen for the click event then test the button attribute of the MouseEvent object" would work however i cant actually add a click event to the vertex points directly as these are inside the ARCGIS api code.

Answer 1

For anyone else who is looking for a way to do this without hacking around. You can listen to "contextmenu" (right click) events on the body, set a flag in the "contextmenu" handler to let the application know the current state. Simulate a click event to the "vertex handle" with a "mousedown", "mouseup" combination. In the "vertex-click" handler check for the right click flag set in the "contextmenu" handler

var editToolbar = new Edit(map, options);
var rightClick;

$('body').on('contextmenu', function(e) {
  var target = e.target;
  if(target.tagName === 'circle') {
    // We only care about this event if it targeted a vertex
    // which is visualized with an SVG circle element
    // Set flag for right click
    rightClick = true;
    // Simulate click on vertex to allow esri vertex-click
    // to fill in the data for us
    var mouseDownEvt = new MouseEvent('mousedown', e.originalEvent);
    target.dispatchEvent(mouseDownEvt);
    var mouseUpEvt = new MouseEvent('mouseup', e.originalEvent);
    target.dispatchEvent(mouseUpEvt);
    // Since this event will be handled by us lets prevent default
    // and stop propagation so the browser context menu doesnt appear
    e.preventDefault();
    e.stopPropagation();
  }
});

editToolbar.on('vertex-click', function(e) {
  if(rightClick) {
    // Handle the right click on a vertex
    rightClick = null;
  }
});