Fix JSButton codes.

e.buttons variable of the event instance seems more reliable.
Click event doesn't need to read the mouse buttons. And also, it shouldn't because click event is also fired for touch devices natively by the browser.
e.buttons variable gives 1->"for left", 2->"for right" and 4->"for middle" buttons. Use them now.
Previously we were using 0->"for left", which is confused with 0->"for no buttons". Now there is no confusion.

This fixes issues which happen when no button is pressed but we act like left button is pressed.

Signed-off-by: Gökay Şatır <[email protected]>
Change-Id: I8ebf58baad75a75fc83150ee628c7e95d29b86f4

Author: gokaysatir

browser/src/canvas/sections/MouseControl.ts

@@ -59,9 +59,9 @@ class MouseControl extends CanvasSectionObject {
 
 	private readButtons(e: MouseEvent) {
 		let buttons = 0;
-		buttons |= e.button === app.JSButtons.left ? app.LOButtons.left : 0;
-		buttons |= e.button === app.JSButtons.middle ? app.LOButtons.middle : 0;
-		buttons |= e.button === app.JSButtons.right ? app.LOButtons.right : 0;
+		buttons |= e.buttons === app.JSButtons.left ? app.LOButtons.left : 0;
+		buttons |= e.buttons === app.JSButtons.middle ? app.LOButtons.middle : 0;
+		buttons |= e.buttons === app.JSButtons.right ? app.LOButtons.right : 0;
 
 		return buttons;
 	}
@@ -423,7 +423,9 @@ class MouseControl extends CanvasSectionObject {
 
 		if (!(<any>window).mode.isDesktop()) app.map.fire('closemobilewizard');
 
-		let buttons = this.readButtons(e);
+		// Right click is not supported. And click event doesn't have "buttons" property set. Safe to set it here to default.
+		let buttons = app.JSButtons.left;
+
 		let modifier = this.readModifier(e);
 		const sendingPosition = this.currentPosition.clone();
 

browser/src/control/Control.LokDialog.js

@@ -712,9 +712,9 @@ window.L.Control.LokDialog = window.L.Control.extend({
 
 			var buttons = 0;
 			if (this._map['mouse']) {
-				buttons |= e.button === app.JSButtons.left ? app.LOButtons.left : 0;
-				buttons |= e.button === app.JSButtons.middle ? app.LOButtons.middle : 0;
-				buttons |= e.button === app.JSButtons.right ? app.LOButtons.right : 0;
+				buttons |= e.buttons === app.JSButtons.left ? app.LOButtons.left : 0;
+				buttons |= e.buttons === app.JSButtons.middle ? app.LOButtons.middle : 0;
+				buttons |= e.buttons === app.JSButtons.right ? app.LOButtons.right : 0;
 			} else {
 				buttons = 1;
 			}
@@ -1097,9 +1097,9 @@ window.L.Control.LokDialog = window.L.Control.extend({
 		window.L.DomEvent.on(canvas, 'mousedown mouseup', function(e) {
 			var buttons = 0;
 			if (this._map['mouse']) {
-				buttons |= e.button === app.JSButtons.left ? app.LOButtons.left : 0;
-				buttons |= e.button === app.JSButtons.middle ? app.LOButtons.middle : 0;
-				buttons |= e.button === app.JSButtons.right ? app.LOButtons.right : 0;
+				buttons |= e.buttons === app.JSButtons.left ? app.LOButtons.left : 0;
+				buttons |= e.buttons === app.JSButtons.middle ? app.LOButtons.middle : 0;
+				buttons |= e.buttons === app.JSButtons.right ? app.LOButtons.right : 0;
 			} else {
 				buttons = 1;
 			}

browser/src/docstate.ts

@@ -27,8 +27,8 @@ window.app = {
 		CTRLMAC: 32768,
 	},
 	JSButtons: {
-		left: 0,
-		middle: 1,
+		left: 1,
+		middle: 4,
 		right: 2,
 	},
 	LOButtons: {