penguin/AstroJS

commit a08b0f3d5ec29814154656f8d01c1d3110ceedca

commit a08b0f3d5ec29814154656f8d01c1d3110ceedca
Author: 斟酌 鵬兄 <tgckpg@gmail.com>
Date:   2015-08-18T04:32:10Z

    MessageBox added keybindings
---
 botanjs/src/Components/MessageBox.css |  6 ++---
 botanjs/src/Components/MessageBox.js  | 44 ++++++++++++++++++++++++++++-------
 2 files changed, 39 insertions(+), 11 deletions(-)

diff --git a/botanjs/src/Components/MessageBox.css b/botanjs/src/Components/MessageBox.css
index e8845cc..fa27056 100644
--- a/botanjs/src/Components/MessageBox.css
+++ b/botanjs/src/Components/MessageBox.css
@@ -14,7 +14,7 @@
 	max-width: 800px;
 	max-height: 600px;
 	position: absolute;
-	background: #222;
+	background-color: rgba( 0, 0, 0, 0.8 );
 
 	-moz-box-shadow: 0 0 10px black;
 	-webkit-box-shadow: 0 0 10px black;
@@ -25,7 +25,7 @@
 	font-size: 1.2em;
 	padding: 0.35em;
 	color: white;
-	background: #181818;
+	background-color: rgba( 0, 0, 0, 0.5 );
 }
 
 .mbox_content {
@@ -59,4 +59,4 @@
 
 .mbox_button > span:hover {
 	background: orangered;
-}
\ No newline at end of file
+}
diff --git a/botanjs/src/Components/MessageBox.js b/botanjs/src/Components/MessageBox.js
index 1d29cb5..f628eaa 100644
--- a/botanjs/src/Components/MessageBox.js
+++ b/botanjs/src/Components/MessageBox.js
@@ -5,11 +5,18 @@
 	var Trigger                             = __import( "System.Cycle.Trigger" );
 	/** @type {Dandelion} */
 	var Dand                                = __import( "Dandelion" );
+	/** @type {Dandelion.IDOMObject} */
+	var IDOMObject                          = __import( "Dandelion.IDOMObject" );
+	/** @type {System.utils.EventKey} */
+	var EventKey                            = __import( "System.utils.EventKey" );
 
 	// __import( "Dandelion.CSSAnimations" ); CSS_RESERVATION
 
 	var MessageBox = function ( title, content, yes, no, handler )
 	{
+		var _self = this;
+		var doc = IDOMObject( document );
+
 		var _yes = Dand.wrap(
 			"span", null
 			, "mbox_button"
@@ -20,10 +27,10 @@
 		_yes.onclick = function()
 		{
 			// if handler is set
-			if( this.clickHandler ) this.clickHandler( true );
-			document.body.removeChild( this.stage );
-			this.stage = null;
-		}.bind( this );
+			if( _self.clickHandler ) _self.clickHandler( true );
+			document.body.removeChild( _self.stage );
+			_self.stage = null;
+		};
 
 		if ( no )
 		{
@@ -35,12 +42,33 @@
 
 			_no.onclick = function()
 			{
-				if( this.clickHandler ) this.clickHandler( false );
-				document.body.removeChild( this.stage );
-				this.stage = null;
-			}.bind( this );
+				if( _self.clickHandler ) _self.clickHandler( false );
+				document.body.removeChild( _self.stage );
+				_self.stage = null;
+			};
 		}
 
+		var keyBinding = new EventKey(
+			"KeyDown", function ( e )
+			{
+				e = e || window.event;
+				if ( e.keyCode ) code = e.keyCode;
+				else if ( e.which ) code = e.which;
+
+				if ( no && code == 27 )
+				{
+					_no.click();
+					doc.removeEventListener( keyBinding );
+				}
+				else if( code == 13 && ( e.ctrlKey || e.altKey ) )
+				{
+					_yes.click();
+					doc.removeEventListener( keyBinding );
+				}
+			}
+		);
+
+		doc.addEventListener( keyBinding );
 
 		// set handler
 		if ( handler ) this.clickHandler = handler;