-function mouseevent(etype, event) {
- let canvas = document.getElementById("mbrotImage");
- let context = canvas.getContext("2d");
- switch (etype) {
- case 'down':
- if (event.button == 0) {
- // left button - start dragzoom
- zoomstart = {x: event.clientX - canvas.offsetLeft,
- y: event.clientY - canvas.offsetTop};
- imgBackup = context.getImageData(0, 0, canvas.width, canvas.height);
- }
- break;
- case 'up':
- if (event.button == 0 && zoomstart) {
- context.putImageData(imgBackup, 0, 0);
- let zoomend = {x: event.clientX - canvas.offsetLeft,
- y: event.clientY - canvas.offsetTop};
-
- // make sure zoomend is bigger than zoomstart
- if ((zoomend.x == zoomstart.x) || (zoomend.y == zoomstart.y)) {
- // cannot zoom what has no area, discard it
- zoomstart = undefined;
- return;
+let imgEvHandler = {
+ handleEvent: function(aEvent) {
+ let canvas = document.getElementById("mbrotImage");
+ let context = canvas.getContext("2d");
+ switch (aEvent.type) {
+ case 'mousedown':
+ case 'touchstart':
+ if (aEvent.button == 0) {
+ // left button - start dragzoom
+ zoomstart = {x: aEvent.clientX - canvas.offsetLeft,
+ y: aEvent.clientY - canvas.offsetTop};
+ imgBackup = context.getImageData(0, 0, canvas.width, canvas.height);
+ }
+ break;
+ case 'mouseup':
+ case 'touchend':
+ if (aEvent.button == 0 && zoomstart) {
+ context.putImageData(imgBackup, 0, 0);
+ let zoomend = {x: aEvent.clientX - canvas.offsetLeft,
+ y: aEvent.clientY - canvas.offsetTop};
+
+ // make sure zoomend is bigger than zoomstart
+ if ((zoomend.x == zoomstart.x) || (zoomend.y == zoomstart.y)) {
+ // cannot zoom what has no area, discard it
+ zoomstart = undefined;
+ return;
+ }
+ if (zoomend.x < zoomstart.x)
+ [zoomend.x, zoomstart.x] = [zoomstart.x, zoomend.x];
+ if (zoomend.y < zoomstart.y)
+ [zoomend.y, zoomstart.y] = [zoomstart.y, zoomend.y];
+
+ // determine new "coordinates"
+ let CWidth = gCurrentImageData.C_max.r - gCurrentImageData.C_min.r;
+ let CHeight = gCurrentImageData.C_max.i - gCurrentImageData.C_min.i;
+ let newC_min = new complex(
+ gCurrentImageData.C_min.r + zoomstart.x / gCurrentImageData.iWidth * CWidth,
+ gCurrentImageData.C_min.i + zoomstart.y / gCurrentImageData.iHeight * CHeight);
+ let newC_max = new complex(
+ gCurrentImageData.C_min.r + zoomend.x / gCurrentImageData.iWidth * CWidth,
+ gCurrentImageData.C_min.i + zoomend.y / gCurrentImageData.iHeight * CHeight);
+
+ adjustCoordsAndDraw(newC_min, newC_max);
+ }
+ zoomstart = undefined;
+ break;
+ case 'mousemove':
+ case 'touchmove':
+ if (aEvent.button == 0 && zoomstart) {
+ context.putImageData(imgBackup, 0, 0);
+ context.strokeStyle = "rgb(255,255,31)";
+ context.strokeRect(zoomstart.x, zoomstart.y,
+ aEvent.clientX - canvas.offsetLeft - zoomstart.x,
+ aEvent.clientY - canvas.offsetTop - zoomstart.y);