From d72d36986b21926bed9253aac2954e692dc868fa Mon Sep 17 00:00:00 2001 From: root Date: Thu, 3 Mar 2011 15:50:58 -0600 Subject: [PATCH] Removed the ugly time setting pop-up and replaced it with clean JS. Fixes bug #12061 --- docs/changelog/7.x.x.txt | 1 + docs/gotcha.txt | 3 ++ lib/WebGUI/Form/TimeField.pm | 12 ++--- www/extras/form/timefield.js | 85 ++++++++++++++++++++++++++++++++++++ 4 files changed, 93 insertions(+), 8 deletions(-) create mode 100644 www/extras/form/timefield.js diff --git a/docs/changelog/7.x.x.txt b/docs/changelog/7.x.x.txt index d33e96454..fd5f51235 100644 --- a/docs/changelog/7.x.x.txt +++ b/docs/changelog/7.x.x.txt @@ -5,6 +5,7 @@ - fixed #12062: Thingy: column headers missing from exported file - fixed #12063: Return URL from export doesn't work on non-default Thingy's - fixed #12054: Thingy: Time fields and formatting + - fixed #12061: TimeField form plugin doesn't work with all names. 7.10.10 - fixed #12035: Story Manager - make keywords from Story view work diff --git a/docs/gotcha.txt b/docs/gotcha.txt index 804eef938..fb097f8a1 100644 --- a/docs/gotcha.txt +++ b/docs/gotcha.txt @@ -14,6 +14,9 @@ save you many hours of grief. * The updated versions of HTML::Packer, JavaScript::Packer and CSS::Packer added for 7.10.9 require perl 5.8.9 or higher to run. + * Modified TimeField, now provides popupless immediate validation with + an alert if the value is not interpretable when the user leaves that field + 7.10.9 -------------------------------------------------------------------- * WebGUI now depends on Data::ICal for making and reading iCal feeds diff --git a/lib/WebGUI/Form/TimeField.pm b/lib/WebGUI/Form/TimeField.pm index c5ccfb37b..17613e278 100644 --- a/lib/WebGUI/Form/TimeField.pm +++ b/lib/WebGUI/Form/TimeField.pm @@ -192,6 +192,7 @@ Set the head tags for this form plugin sub headTags { my $self = shift; $self->session->style->setScript($self->session->url->extras('inputCheck.js'),{ type=>'text/javascript' }); + $self->session->style->setScript($self->session->url->extras('form/timefield.js'),{ type=>'text/javascript' }); } #------------------------------------------------------------------- @@ -218,14 +219,9 @@ sub toHtml { my $self = shift; ##JS expects formatted time $self->set('value', $self->getValueAsHtml); - my $i18n = WebGUI::International->new($self->session); - $self->set("extras", $self->get('extras') . ' onkeyup="doInputCheck(document.getElementById(\''.$self->get("id").'\'),\'0123456789:\')"'); - return $self->SUPER::toHtml - .WebGUI::Form::Button->new($self->session, - id=>$self->get('id'), - extras=>'style="font-size: 8pt;" onclick="window.timeField = this.form.'.$self->get("name").';clockSet = window.open(\''.$self->session->url->extras('timeChooser.html').'\',\'timeChooser\',\'WIDTH=230,HEIGHT=100\');return false"', - value=>$i18n->get(970) - )->toHtml; + #my $i18n = WebGUI::International->new($self->session); + $self->set("extras", $self->get('extras') . ' onblur="WebGUI.TimeField.munge(document.getElementById(\''.$self->get("id").'\'))" onkeyup="WebGUI.TimeField.check(document.getElementById(\''.$self->get("id").'\'));"'); + return $self->SUPER::toHtml; } #------------------------------------------------------------------- diff --git a/www/extras/form/timefield.js b/www/extras/form/timefield.js new file mode 100644 index 000000000..a2a101d07 --- /dev/null +++ b/www/extras/form/timefield.js @@ -0,0 +1,85 @@ + +/*** The WebGUI Asset Manager + * Requires: YAHOO, Dom, Event + * + */ + +if ( typeof WebGUI == "undefined" ) { + WebGUI = {}; +} +if ( typeof WebGUI.TimeField == "undefined" ) { + WebGUI.TimeField = {}; +} + +WebGUI.TimeField.init = function (o) { + WebGUI.TimeField.i18n + = new WebGUI.i18n( { + namespaces : { + 'Form_TimeField' : [ + "invalid time" + ] + } + } ); +} + +WebGUI.TimeField.check = function( field ) { + var timePattern = /^(\d{1,2})(:)?(\d{1,2})?(:)?(\d{1,2})?$/; + var matchArray = field.value.match( timePattern ); + if( matchArray == null ) + return this.reject( field ); + + hour = matchArray[1]; + minute = matchArray[3]; + second = matchArray[5]; + + if( hour < 0 || hour > 23 ) + return this.reject( field ); + + if( minute != null && ( minute < 0 || minute > 59 ) ) + return this.reject( field ); + + if( second != null && ( second < 0 || second > 59 ) ) + return this.reject( field ); + + return this.accept( field ); +} + +WebGUI.TimeField.reject = function( field ) { + field.style.backgroundColor = "DarkSalmon"; + return false; +} + +WebGUI.TimeField.accept = function( field ) { + field.style.backgroundColor = ""; + return false; +} + +WebGUI.TimeField.munge = function( field ) { + var date = new Date( "01/01/01 " + field.value ); + var hour = date.getHours(); + var minute = date.getMinutes(); + var second = date.getSeconds(); + //var ap = "AM"; + //if (hour > 11) { ap = "PM"; } + //if (hour > 12) { hour = hour - 12; } + //if (hour == 0) { hour = 12; } + if (hour < 10) { hour = "0" + hour; } + if (minute < 10) { minute = "0" + minute; } + if (second < 10) { second = "0" + second; } + field.value = hour + ':' + minute + ':' + second; // + " " +ap; + + if( field.value.indexOf("NaN") != -1 ) { + field.value = "12:00:00"; + alert( WebGUI.TimeField.i18n.get('Form_TimeField', 'invalid time') ); + window.setTimeout( function() { + field.focus(); + field.select(); + }, 1 ); + } + + field.style.backgroundColor = "" + + return false; +} + +WebGUI.TimeField.init(); \ No newline at end of file