You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@tapestry.apache.org by jk...@apache.org on 2006/09/30 06:00:29 UTC
svn commit: r451536 - in /tapestry/tapestry4/trunk:
tapestry-examples/TimeTracker/src/context/css/
tapestry-framework/src/js/tapestry/form/
tapestry-framework/src/js/tapestry/widget/
Author: jkuhnert
Date: Fri Sep 29 21:00:29 2006
New Revision: 451536
URL: http://svn.apache.org/viewvc?view=rev&rev=451536
Log:
Enhancements contributed from Greg Woolsey to make the validation dialog a little more extensible/usable/etc.
Modified:
tapestry/tapestry4/trunk/tapestry-examples/TimeTracker/src/context/css/exception.css
tapestry/tapestry4/trunk/tapestry-examples/TimeTracker/src/context/css/forms.css
tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/form/validation.js
tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/widget/AlertDialog.js
Modified: tapestry/tapestry4/trunk/tapestry-examples/TimeTracker/src/context/css/exception.css
URL: http://svn.apache.org/viewvc/tapestry/tapestry4/trunk/tapestry-examples/TimeTracker/src/context/css/exception.css?view=diff&rev=451536&r1=451535&r2=451536
==============================================================================
--- tapestry/tapestry4/trunk/tapestry-examples/TimeTracker/src/context/css/exception.css (original)
+++ tapestry/tapestry4/trunk/tapestry-examples/TimeTracker/src/context/css/exception.css Fri Sep 29 21:00:29 2006
@@ -31,14 +31,3 @@
-moz-border-radius-topleft: 10px;
}
-.alertDialog {
- width: 50%;
- border: 2px solid #ff660a;
- padding: 1em;
- padding-bottom: 1.7em;
- background: #ffffff;
-}
-
-.alertDialog .dojoButton {
- float: right;
-}
\ No newline at end of file
Modified: tapestry/tapestry4/trunk/tapestry-examples/TimeTracker/src/context/css/forms.css
URL: http://svn.apache.org/viewvc/tapestry/tapestry4/trunk/tapestry-examples/TimeTracker/src/context/css/forms.css?view=diff&rev=451536&r1=451535&r2=451536
==============================================================================
--- tapestry/tapestry4/trunk/tapestry-examples/TimeTracker/src/context/css/forms.css (original)
+++ tapestry/tapestry4/trunk/tapestry-examples/TimeTracker/src/context/css/forms.css Fri Sep 29 21:00:29 2006
@@ -40,7 +40,7 @@
form h3 { font: 0.8em Tahoma, Myriad, sans-serif; font-weight:bold; color: #296cb5; margin:1.5em -1em 0 -1em; border-bottom: 1px solid #d0d8e2; padding-bottom:0; }
form h4 { font: 0.8em Tahoma, Myriad, sans-serif; font-weight:bold; margin:0; margin-top:1em; border-bottom: 1px solid #ddd; }
-.submitButton,.submitButton:focus {
+.submitButton,.submitButton:focus,.alertButton {
width: auto;
border: none;
background-color: #699ED9;
@@ -55,7 +55,17 @@
}
.alertDialog {
- width: 25em;
+ width: 30em;
+ border: 2px solid #ff660a;
+ padding: 1em;
+ background: #ffffff;
+ -moz-border-radius: 10px;
+}
+
+.alertContent .alertButton {
+ float:right;
+ position:relative;
+ bottom:1em;
}
.fieldMissing {
Modified: tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/form/validation.js
URL: http://svn.apache.org/viewvc/tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/form/validation.js?view=diff&rev=451536&r1=451535&r2=451536
==============================================================================
--- tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/form/validation.js (original)
+++ tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/form/validation.js Fri Sep 29 21:00:29 2006
@@ -10,6 +10,8 @@
missingClass:"fieldMissing", // default css class that will be applied to fields missing a value
invalidClass:"fieldInvalid", // default css class applied to fields with invalid data
+ dialogName:"tapestry:AlertDialog",
+
/**
* Main entry point for running form validation. The
* props object passed in contains a number of fields that
@@ -213,7 +215,7 @@
var node=document.createElement("span");
document.body.appendChild(node);
- var dialog=dojo.widget.createWidget("tapestry:AlertDialog",
+ var dialog=dojo.widget.createWidget(this.dialogName,
{
widgetId:"validationDialog",
message:msg
Modified: tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/widget/AlertDialog.js
URL: http://svn.apache.org/viewvc/tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/widget/AlertDialog.js?view=diff&rev=451536&r1=451535&r2=451536
==============================================================================
--- tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/widget/AlertDialog.js (original)
+++ tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/widget/AlertDialog.js Fri Sep 29 21:00:29 2006
@@ -11,30 +11,61 @@
dojo.widget.Dialog,
{
bgColor: "white",
- bgOpacity: 0.5,
+ bgOpacity: 0.6,
okButton:null,
messageNode:null,
message:"",
+ dialogClass:"alertDialog",
+ contentClass:"alertContent",
+ buttonClass:"alertButton",
+
postCreate: function(args, frag, parentComp) {
dojo.widget.Dialog.prototype.postCreate.call(this, args, frag, parentComp);
var content=document.createElement("div");
+ dojo.html.setClass(content, this.contentClass);
this.containerNode.appendChild(content);
- dojo.html.addClass(this.containerNode, "alertDialog");
+ dojo.html.addClass(this.containerNode, this.dialogClass);
this.messageNode=document.createElement("div");
this.messageNode.innerHTML=this.message;
content.appendChild(this.messageNode);
- var buttNode=document.createElement("div");
- buttNode.appendChild(document.createTextNode("ok"));
+ var buttNode=document.createElement("button");
+ dojo.html.setClass(buttNode, this.buttonClass);
+ buttNode.innerHTML = "Ok";
content.appendChild(buttNode);
- this.show(); // to fix bug in button
- this.okButton=dojo.widget.createWidget("Button",{}, buttNode);
- this.tabStart=this.okButton.domNode;
- dojo.event.connect(this.okButton, "onClick", this, "hide");
+ this.okButton=buttNode;
+ this.tabStart=this.okButton;
+ this.tabEnd=this.okButton;
+ this.show();
+ dojo.event.connect(this.okButton, "onclick", this, "hideDialog");
+ this.okButton.focus();
+ dojo.event.connect(this.wrapper, 'onkeyup', this, 'dialogKeys');
+ dojo.event.connect(document.body, 'onkeyup', this, 'bodyKeys');
+ },
+
+ dialogKeys:function(e) {
+ if (e.keyCode == e.KEY_ESCAPE) {
+ this.hideDialog(e);
+ }
+ // allow default behavior, but don't let the event keep bubbling/propagating
+ if (e.stopPropagation) {
+ e.stopPropagation();
+ } else {
+ e.cancelBubble = true;
+ }
+ },
+
+ bodyKeys:function(e) {
+ if (e.keyCode == e.KEY_ESCAPE) {
+ this.hideDialog(e);
+ } else if ( ! dojo.dom.isDescendantOf(e.target, this.wrapper, true) ) {
+ dojo.event.browser.stopEvent(e);
+ this.tabStart.focus();
+ }
},
setMessage:function(str){
@@ -42,10 +73,12 @@
},
hideDialog:function(e){
+ dojo.event.disconnect(this.wrapper, 'onkeyup', this, 'dialogKeys');
+ dojo.event.disconnect(document.body, 'onkeyup', this, 'bodyKeys');
this.hideModalDialog();
- this.okButton.destroy();
+ dojo.dom.removeNode(this.okButton);
tapestry.widget.AlertDialog.prototype.destroy.call(this);
- dojo.dom.removeNode(this.bg);
+ dojo.dom.removeNode(this.bg);
}
},
"html"