aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorValerio Virgillito2012-06-25 16:37:06 -0700
committerValerio Virgillito2012-06-25 16:37:06 -0700
commit96e1bb2a8d842dc37e4982a273a5bde48f6944c3 (patch)
treeb21bb4aa8efaff3105456a0a403343ef1ed76ab7
parent4e5331c9967d4a24df56160188cc916a4051052b (diff)
downloadninja-96e1bb2a8d842dc37e4982a273a5bde48f6944c3.tar.gz
Fix for IKNINJA-1615: Enable mouse up event on top of the user document scrollbar
Chrome has a bug where mouse up does not fire when the mouse is released on top of a scrollbar. To work around this issue, I temporary increase the canvas to cover the scrollbar when drawing and then shrink it back on mouse up. Signed-off-by: Valerio Virgillito <valerio@motorola.com>
-rwxr-xr-xjs/mediators/mouse-mediator.js31
-rwxr-xr-xjs/ninja.reel/ninja.html4
-rwxr-xr-xjs/stage/stage.reel/stage.js33
3 files changed, 30 insertions, 38 deletions
diff --git a/js/mediators/mouse-mediator.js b/js/mediators/mouse-mediator.js
deleted file mode 100755
index 4d1fb62a..00000000
--- a/js/mediators/mouse-mediator.js
+++ /dev/null
@@ -1,31 +0,0 @@
1/* <copyright>
2This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5</copyright> */
6
7var Montage = require("montage/core/core").Montage,
8 Component = require("montage/ui/component").Component;
9
10exports.MouseMediator = Montage.create(Component, {
11 hasTemplate: {
12 value: false
13 },
14
15 deserializedFromTemplate: {
16 value: function() {
17 document.addEventListener("mouseup", this, false);
18 }
19 },
20
21 handleMouseup: {
22 value: function(event) {
23
24 if(event._event.target.id !== "drawingCanvas") {
25 NJevent( "appMouseUp");
26 }
27
28 return true;
29 }
30 }
31});
diff --git a/js/ninja.reel/ninja.html b/js/ninja.reel/ninja.html
index beae59d9..1bd002ae 100755
--- a/js/ninja.reel/ninja.html
+++ b/js/ninja.reel/ninja.html
@@ -261,10 +261,6 @@
261 } 261 }
262 }, 262 },
263 263
264 "mouseMediator": {
265 "prototype": "js/mediators/mouse-mediator"
266 },
267
268 "keyboardMediator": { 264 "keyboardMediator": {
269 "prototype": "js/mediators/keyboard-mediator", 265 "prototype": "js/mediators/keyboard-mediator",
270 "properties":{ 266 "properties":{
diff --git a/js/stage/stage.reel/stage.js b/js/stage/stage.reel/stage.js
index f4de3070..1de4e003 100755
--- a/js/stage/stage.reel/stage.js
+++ b/js/stage/stage.reel/stage.js
@@ -343,8 +343,6 @@ exports.Stage = Montage.create(Component, {
343 // Hide the canvas 343 // Hide the canvas
344 this.hideCanvas(true); 344 this.hideCanvas(true);
345 345
346 this.eventManager.addEventListener( "appMouseUp", this, false);
347
348 this.eventManager.addEventListener( "enableStageMove", this, false); 346 this.eventManager.addEventListener( "enableStageMove", this, false);
349 this.eventManager.addEventListener( "disableStageMove", this, false); 347 this.eventManager.addEventListener( "disableStageMove", this, false);
350 348
@@ -454,6 +452,7 @@ exports.Stage = Montage.create(Component, {
454 452
455 enableMouseInOut: { 453 enableMouseInOut: {
456 value: function() { 454 value: function() {
455 document.addEventListener("mouseup", this, true);
457 this._drawingCanvas.addEventListener("mouseout", this, false); 456 this._drawingCanvas.addEventListener("mouseout", this, false);
458 this._drawingCanvas.addEventListener("mouseover", this, false); 457 this._drawingCanvas.addEventListener("mouseover", this, false);
459 } 458 }
@@ -466,6 +465,19 @@ exports.Stage = Montage.create(Component, {
466 } 465 }
467 }, 466 },
468 467
468 captureMouseup: {
469 value: function(event) {
470 var target = event._event.target.getAttribute("data-montage-id");
471
472 if(target && target === "drawingCanvas") {
473 return true;
474 } else {
475 this.handleAppMouseUp(event);
476 return true;
477 }
478 }
479 },
480
469 handleMouseout: { 481 handleMouseout: {
470 value: function(event) { 482 value: function(event) {
471 this.outFlag = true; 483 this.outFlag = true;
@@ -480,6 +492,11 @@ exports.Stage = Montage.create(Component, {
480 492
481 handleMousedown: { 493 handleMousedown: {
482 value: function(event) { 494 value: function(event) {
495
496 // Increase the canvas to cover the scroll bars
497 this._drawingCanvas.height = this._drawingCanvas.height + 11;
498 this._drawingCanvas.width = this._drawingCanvas.width + 11;
499
483 // Call the focus manager to set focus to blur any focus'd elements 500 // Call the focus manager to set focus to blur any focus'd elements
484 this.focusManager.setFocus(); 501 this.focusManager.setFocus();
485 502
@@ -509,13 +526,18 @@ exports.Stage = Montage.create(Component, {
509 526
510 handleMouseup: { 527 handleMouseup: {
511 value: function(event) { 528 value: function(event) {
529 // Restore canvas to un-cover the scroll bars.
530 this._drawingCanvas.height = this._drawingCanvas.height - 11;
531 this._drawingCanvas.width = this._drawingCanvas.width - 11;
512 // If the mouse up comes from dismissing the context menu return 532 // If the mouse up comes from dismissing the context menu return
533
513 if(this.contextMenu) { 534 if(this.contextMenu) {
514 this.contextMenu = false; 535 this.contextMenu = false;
515 return; 536 return;
516 } 537 }
517 538
518 //this.disableMouseInOut(); 539 this.disableMouseInOut();
540 document.removeEventListener("mouseup", this, true);
519 541
520 this.application.ninja.toolsData.selectedToolInstance.HandleLeftButtonUp(event); 542 this.application.ninja.toolsData.selectedToolInstance.HandleLeftButtonUp(event);
521 543
@@ -563,12 +585,17 @@ exports.Stage = Montage.create(Component, {
563 handleAppMouseUp: { 585 handleAppMouseUp: {
564 value: function(event) { 586 value: function(event) {
565 if(this.outFlag) { 587 if(this.outFlag) {
588 this._drawingCanvas.height = this._drawingCanvas.height - 11;
589 this._drawingCanvas.width = this._drawingCanvas.width - 11;
590
566 if(this.application.ninja.toolsData.selectedToolInstance.isDrawing) { 591 if(this.application.ninja.toolsData.selectedToolInstance.isDrawing) {
567 this.application.ninja.toolsData.selectedToolInstance.HandleLeftButtonUp(event); 592 this.application.ninja.toolsData.selectedToolInstance.HandleLeftButtonUp(event);
568 } 593 }
569 this.disableMouseInOut(); 594 this.disableMouseInOut();
570 this.outFlag = false; 595 this.outFlag = false;
571 } 596 }
597
598 document.removeEventListener("mouseup", this, true);
572 } 599 }
573 }, 600 },
574 601