[pLog-svn] r5831 - plog/trunk/js/ui

[oscar at devel.lifetype.net]

Author: oscar
Date: 2007-08-15 17:05:35 -0400 (Wed, 15 Aug 2007)
New Revision: 5831

Modified:
   plog/trunk/js/ui/ui.js
Log:
Now the html code needed for the ok/cancel prompt is generated via dom calls rather than using innerHTML and a raw HTML string. In addition to that, a new handler for onKeyPress has been implemented so that we can get the enter key to close the prompt and perform the callback function and the esc key to cancel the whole thing.


Modified: plog/trunk/js/ui/ui.js
===================================================================
--- plog/trunk/js/ui/ui.js	2007-08-15 21:04:07 UTC (rev 5830)
+++ plog/trunk/js/ui/ui.js	2007-08-15 21:05:35 UTC (rev 5831)
@@ -217,8 +217,8 @@
 		effect:{effect:YAHOO.widget.ContainerEffect.FADE, duration: 0.25},
 		underlay:"shadow",
 		modal:true,
-		buttons : [ { text:tr("ok"), handler:this.handleOk, isDefault:true }, 
-		            { text:tr("cancel"), handler:this.handleCancel } ]		
+		buttons : [ { text:tr("cancel"), handler:this.handleCancel },
+		            { text:tr("ok"), handler:this.handleOk, isDefault:true } ]		
 	});
 	
 	if( props != undefined ) {
@@ -226,19 +226,43 @@
 		this.cancelCallback = props.handleCancel;
 		this.defaultValue = props.defaultValue;
 	}
+	
+	var promptBody = document.createElement( 'div' );
+	promptBody.className = 'promptBody';
+	promptBody.appendChild( document.createTextNode( str ));
+	promptBody.appendChild( document.createElement( 'br' ));
+	var inputField = document.createElement( 'input' );
+	inputField.type = 'text';
+	inputField.name = 'dlgPromptText';
+	inputField.id = 'dlgPromptText';
+	inputField.className = 'dlgPromptText';
+	inputField.size = '50';
+	inputField.onkeypress = Lifetype.bind( this.onKeyPressHandler, this );
+	if( this.defaultValue)
+		inputField.value = defaultValue;
+	promptBody.appendChild( inputField );
 
-	var dlgBody  = "<div class='promptBody'>" + str + "<br/>" +
-		          "<input type='text' name='dlgPromptText' id='dlgPromptText' class='dlgPromptText' size='50' value='";
-	if( this.defaultValue )
-		dlgBody += this.defaultValue;
-	dlgBody     +=  "' /></div>";
-	this.setBody( dlgBody );
+	this.setBody( promptBody );
 	this.render( document.body );
 }
 
 YAHOO.extend( Lifetype.UI.Prompt.OkCancelPrompt, YAHOO.widget.Dialog );
 
 /**
+ * Handless key-presses in this dialog, so that we can redirect
+ * the enter key to handleOk and the esc key to the cancel event
+ */
+Lifetype.UI.Prompt.OkCancelPrompt.prototype.onKeyPressHandler = function( e )
+{
+	if( e.keyCode == 13 ) {
+		this.handleOk();
+	}
+	else if( e.keyCode == 27 ) {
+		this.handleCancel();
+	}
+}
+
+/**
  * Handler for the Ok button. You should not reimplement this one,
  * as it takes care of fetching the value that was typed in the field 
  * and passing it to the okCallback function