r83050 MediaWiki - Code Review archive

Repository:MediaWiki
Revision:r83049‎ | r83050 | r83051 >
Date:21:51, 1 March 2011
Author:foxtrott
Status:deferred
Tags:
Comment:
bugfixes

* datetimepicker now displays datetime correctly and retains wrong-formatted values if they are unchanged
* late initialisation of menuselect to avoid conflicts
Modified paths:
  • /trunk/extensions/SemanticFormsInputs/SFI_Inputs.php (modified) (history)
  • /trunk/extensions/SemanticFormsInputs/libs/datetimepicker.js (modified) (history)
  • /trunk/extensions/SemanticFormsInputs/libs/menuselect.js (modified) (history)

Diff [purge]

Index: trunk/extensions/SemanticFormsInputs/SFI_Inputs.php
@@ -898,16 +898,6 @@
899899
900900 }
901901
902 - // build JS code from attributes array
903 - $jsattribsString = Xml::encodeJsVar( $jsattribs );
904 -
905 - $jstext = <<<JAVASCRIPT
906 -jQuery(function(){ jQuery('#input_$sfgFieldNum').SemanticForms_registerInputInit(SFI_DTP_init, $jsattribsString ); });
907 -JAVASCRIPT;
908 -
909 - // insert the code of the JS init function into the pages code
910 - $wgOut->addScript('<script type="text/javascript">' . $jstext . '</script>');
911 -
912902 // find allowed values and keep only the date portion
913903 if ( array_key_exists( 'possible_values', $other_args ) &&
914904 count( $other_args[ 'possible_values' ] ) ) {
@@ -919,11 +909,29 @@
920910 );
921911 }
922912
923 - $separator = strpos($cur_value, " ");
 913+ $dateTimeString = trim( $cur_value );
 914+ $dateString = '';
 915+ $timeString = '';
924916
 917+ $separatorPos = strpos($dateTimeString, " ");
 918+
 919+ // does it have a separating whitespace? assume it's a date & time
 920+ if ( $separatorPos ) {
 921+ $dateString = substr( $dateTimeString, 0, $separatorPos );
 922+ $timeString = substr( $dateTimeString, $separatorPos + 1 );
 923+
 924+ // does it start with a time of some kind?
 925+ } elseif ( preg_match( '/^\d?\d:\d\d/', $dateTimeString ) ) {
 926+ $timeString = $dateTimeString;
 927+
 928+ // if all else fails assume it's a date
 929+ } else {
 930+ $dateString = $dateTimeString;
 931+ }
 932+
925933 $html = '<span class="inputSpan' . ($is_mandatory ? ' mandatoryFieldSpan' : '') . '">' .
926 - self::jqDatePickerHTML(substr($cur_value + " ", 0, $separator), $input_name, $is_mandatory, $is_disabled, $other_args) . " " .
927 - self::timepickerHTML(substr($cur_value + " ", $separator + 1), $input_name, $is_mandatory, $is_disabled, $other_args) .
 934+ self::jqDatePickerHTML( $dateString, $input_name, $is_mandatory, $is_disabled, $other_args) . " " .
 935+ self::timepickerHTML( $timeString, $input_name, $is_mandatory, $is_disabled, $other_args) .
928936 Xml::element("input",
929937 array(
930938 "id" => "input_{$sfgFieldNum}",
@@ -933,6 +941,16 @@
934942 ))
935943 . '</span>';
936944
 945+ // build JS code from attributes array
 946+ $jsattribsString = Xml::encodeJsVar( $jsattribs );
 947+
 948+ $jstext = <<<JAVASCRIPT
 949+jQuery(function(){ jQuery('#input_$sfgFieldNum').SemanticForms_registerInputInit(SFI_DTP_init, $jsattribsString ); });
 950+JAVASCRIPT;
 951+
 952+ // insert the code of the JS init function into the pages code
 953+ $wgOut->addScript('<script type="text/javascript">' . $jstext . '</script>');
 954+
937955 return $html;
938956 }
939957
Index: trunk/extensions/SemanticFormsInputs/libs/menuselect.js
@@ -13,253 +13,260 @@
1414 */
1515 function SFI_MS_init( inputID, params ) {
1616
17 - var treeid = "#" + inputID.replace(/input/,"span") + "_tree"
 17+ jQuery('#' + inputID + "_show").one('focus', function(){
 18+ var treeid = "#" + inputID.replace(/input/,"span") + "_tree"
1819
19 - jQuery(treeid).css("visibility","hidden");
 20+ jQuery(treeid).css("visibility","hidden");
2021
21 - // wrap content in span to separate content from sub-menus,
22 - // wrap content in div to support animating the list item width later
23 - jQuery( treeid + " li" ).each(
24 - function() {
 22+ // wrap content in span to separate content from sub-menus,
 23+ // wrap content in div to support animating the list item width later
 24+ jQuery( treeid + " li" ).each(
 25+ function() {
2526
26 - jQuery( this ).contents().not( "ul" )
27 - .wrapAll( '<span />' )
28 - .wrapAll( '<div class="cont"/>' );
 27+ jQuery( this ).contents().not( "ul" )
 28+ .wrapAll( '<span />' )
 29+ .wrapAll( '<div class="cont"/>' );
2930
30 - jQuery( this ).contents().not( "ul" )
31 - .find("div.cont")
32 - .css('position','fixed');
 31+ jQuery( this ).contents().not( "ul" )
 32+ .find("div.cont")
 33+ .css({
 34+ position:'fixed',
 35+ top: '0px',
 36+ left: '0px'
 37+ });
3338
34 - // insert the arrows indicating submenus
35 - if ( jQuery( this ).children( "ul" ).length > 0 ) {
36 - jQuery( this ).children( "span" ).children( "div" )
37 - .before( '<div class="arrow" ><img src="' + sfigScriptPath + '/images/MenuSelectArrow.gif" /></div>' )
 39+ // insert the arrows indicating submenus
 40+ if ( jQuery( this ).children( "ul" ).length > 0 ) {
 41+ jQuery( this ).children( "span" ).children( "div" )
 42+ .before( '<div class="arrow" ><img src="' + sfigScriptPath + '/images/MenuSelectArrow.gif" /></div>' )
 43+ }
 44+
 45+ } );
 46+
 47+ // ensure labels of list item have constant width regardless of width of list item
 48+ // prevents layout changes when list item width is changed
 49+ // set position static ( was set to fixed to calculate text width )
 50+ jQuery( treeid + " li>span>div.cont" ).each( function() {
 51+ jQuery( this ).width( jQuery( this ).outerWidth(true) + jQuery( this ).siblings("div.arrow").outerWidth(true) + 5);
 52+ jQuery( this ).css( "position", "static" );
 53+ } );
 54+
 55+ // add class for default state and fix dimensions
 56+ jQuery( treeid + " li" )
 57+ .addClass( "ui-state-default" )
 58+ .each(
 59+ function() {
 60+ jQuery(this).height(jQuery(this).height());
 61+ jQuery(this).width(jQuery(this).width());
 62+
 63+ // to be used for restoring width after mouse leves this item
 64+ jQuery(this).data("width", jQuery(this).width());
3865 }
 66+ );
3967
40 - } );
41 -
42 - // ensure labels of list item have constant width regardless of width of list item
43 - // prevents layout changes when list item width is changed
44 - // set position static ( was set to fixed to calculate text width )
45 - jQuery( treeid + " li>span>div.cont" ).each( function() {
46 - jQuery( this ).width( jQuery( this ).outerWidth(true) + jQuery( this ).siblings("div.arrow").outerWidth(true) + 5);
47 - jQuery( this ).css( "position", "static" );
48 - } );
 68+ // initially hide everything
 69+ jQuery( treeid + " ul" )
 70+ .css({"z-index":1})
 71+ .hide()
 72+ .fadeTo(0, 0 );
4973
50 - // add class for default state and fix dimensions
51 - jQuery( treeid + " li" )
52 - .addClass( "ui-state-default" )
53 - .each(
54 - function() {
55 - jQuery(this).height(jQuery(this).height());
56 - jQuery(this).width(jQuery(this).width());
57 -
58 - // to be used for restoring width after mouse leves this item
59 - jQuery(this).data("width", jQuery(this).width());
 74+ // some crap "browsers" need special treatment
 75+ if ( jQuery.browser.msie ) {
 76+ jQuery( treeid + " ul" ).css({ "position":"relative" });
6077 }
61 - );
62 -
63 - // initially hide everything
64 - jQuery( treeid + " ul" )
65 - .css({"z-index":1})
66 - .hide()
67 - .fadeTo(0, 0 );
6878
69 - // some crap "browsers" need special treatment
70 - if ( jQuery.browser.msie ) {
71 - jQuery( treeid + " ul" ).css({ "position":"relative" });
72 - }
 79+ // sanitize links
 80+ jQuery( treeid ).find( "a" )
 81+ .each(
 82+ function() {
7383
74 - // sanitize links
75 - jQuery( treeid ).find( "a" )
76 - .each(
77 - function() {
 84+ // find title of target page
 85+ if ( jQuery( this ).hasClass( 'new' ) ) { // for red links get it from the href
7886
79 - // find title of target page
80 - if ( jQuery( this ).hasClass( 'new' ) ) { // for red links get it from the href
 87+ regexp = /.*title=([^&]*).*/;
 88+ res = regexp.exec( jQuery( this ).attr( 'href' ) );
8189
82 - regexp = /.*title=([^&]*).*/;
83 - res = regexp.exec( jQuery( this ).attr( 'href' ) );
 90+ title = unescape( res[1] );
8491
85 - title = unescape( res[1] );
 92+ jQuery( this ).data( 'title', title ); // save title in data
8693
87 - jQuery( this ).data( 'title', title ); // save title in data
 94+ } else { // for normal links title is in the links title attribute
 95+ jQuery( this )
 96+ .data( 'title', jQuery( this ).attr( 'title' ) ); // save title in data
 97+ }
8898
89 - } else { // for normal links title is in the links title attribute
9099 jQuery( this )
91 - .data( 'title', jQuery( this ).attr( 'title' ) ); // save title in data
 100+ .removeAttr( 'title' ) // remove title to prevent tooltips on links
 101+ .bind( "click", function( event ) {
 102+ event.preventDefault();
 103+ } ) // prevent following links
 104+
92105 }
 106+ );
93107
94 - jQuery( this )
95 - .removeAttr( 'title' ) // remove title to prevent tooltips on links
96 - .bind( "click", function( event ) {
97 - event.preventDefault();
98 - } ) // prevent following links
99 -
100 - }
101 - );
 108+ // attach event handlers
102109
103 - // attach event handlers
 110+ // mouse entered list item
 111+ jQuery( treeid + " li" )
 112+ .mouseenter( function( evt ) {
104113
105 - // mouse entered list item
106 - jQuery( treeid + " li" )
107 - .mouseenter( function( evt ) {
 114+ // switch classes to change display style
 115+ jQuery( evt.currentTarget )
 116+ .removeClass( "ui-state-default" )
 117+ .addClass( "ui-state-hover" );
108118
109 - // switch classes to change display style
110 - jQuery( evt.currentTarget )
111 - .removeClass( "ui-state-default" )
112 - .addClass( "ui-state-hover" );
 119+ // if we reentered (i.e. moved mouse from item to sub-item)
 120+ if (jQuery( evt.currentTarget ).data( "timeout" ) != null) {
113121
114 - // if we reentered (i.e. moved mouse from item to sub-item)
115 - if (jQuery( evt.currentTarget ).data( "timeout" ) != null) {
 122+ // clear any timeout that may still run on the list item
 123+ // (i.e. do not fade out submenu)
 124+ clearTimeout( jQuery( evt.currentTarget ).data( "timeout" ) );
 125+ jQuery( evt.currentTarget ).data( "timeout", null );
116126
117 - // clear any timeout that may still run on the list item
118 - // (i.e. do not fade out submenu)
119 - clearTimeout( jQuery( evt.currentTarget ).data( "timeout" ) );
120 - jQuery( evt.currentTarget ).data( "timeout", null );
 127+ // abort further actions (just leave the submenu open)
 128+ return;
 129+ }
121130
122 - // abort further actions (just leave the submenu open)
123 - return;
124 - }
125131
 132+ // if list item has sub-items...
 133+ if ( jQuery( evt.currentTarget ).children( "ul" ).length > 0 ) {
126134
127 - // if list item has sub-items...
128 - if ( jQuery( evt.currentTarget ).children( "ul" ).length > 0 ) {
 135+ // set timeout to show sub-items
 136+ jQuery( evt.currentTarget )
 137+ .data( "timeout", setTimeout(
 138+ function() {
129139
130 - // set timeout to show sub-items
131 - jQuery( evt.currentTarget )
132 - .data( "timeout", setTimeout(
133 - function() {
 140+ // clear timeout data
 141+ jQuery( evt.currentTarget ).data( "timeout", null );
134142
135 - // clear timeout data
136 - jQuery( evt.currentTarget ).data( "timeout", null );
 143+ // some crap "browsers" need special treatment
 144+ if ( jQuery.browser.msie ) {
 145+ jQuery( evt.currentTarget ).children( "ul" )
 146+ .css( {
 147+ "top": -jQuery( evt.currentTarget ).outerHeight(),
 148+ "left": jQuery( evt.currentTarget ).outerWidth() + 10
 149+ } );
 150+ }
137151
138 - // some crap "browsers" need special treatment
139 - if ( jQuery.browser.msie ) {
 152+ // fade in sub-menu
 153+ // can not use fadeIn, it sets display:block
140154 jQuery( evt.currentTarget ).children( "ul" )
141155 .css( {
142 - "top": -jQuery( evt.currentTarget ).outerHeight(),
143 - "left": jQuery( evt.currentTarget ).outerWidth() + 10
144 - } );
145 - }
 156+ "display":"inline",
 157+ "z-index":100
 158+ } )
 159+ .fadeTo( 400, 1 );
146160
147 - // fade in sub-menu
148 - // can not use fadeIn, it sets display:block
149 - jQuery( evt.currentTarget ).children( "ul" )
150 - .css( {
151 - "display":"inline",
152 - "z-index":100
153 - } )
154 - .fadeTo( 400, 1 );
 161+ w = jQuery( evt.currentTarget ).width();
155162
156 - w = jQuery( evt.currentTarget ).width();
 163+ // animate list item width
 164+ jQuery( evt.currentTarget )
 165+ .animate( { "width": w + 10 }, 100 );
157166
158 - // animate list item width
159 - jQuery( evt.currentTarget )
160 - .animate( { "width": w + 10 }, 100 );
 167+ }, 400 )
 168+ );
 169+ }
161170
162 - }, 400 )
163 - );
164 - }
 171+ } );
165172
166 - } );
 173+ // mouse left list item
 174+ jQuery( treeid + " li" )
 175+ .mouseleave( function( evt ) {
167176
168 - // mouse left list item
169 - jQuery( treeid + " li" )
170 - .mouseleave( function( evt ) {
 177+ // switch classes to change display style
 178+ jQuery( evt.currentTarget )
 179+ .removeClass( "ui-state-hover" )
 180+ .addClass( "ui-state-default" )
171181
172 - // switch classes to change display style
173 - jQuery( evt.currentTarget )
174 - .removeClass( "ui-state-hover" )
175 - .addClass( "ui-state-default" )
 182+ // if we just moved in and out of the item (without really hovering)
 183+ if (jQuery( evt.currentTarget ).data( "timeout" ) != null) {
176184
177 - // if we just moved in and out of the item (without really hovering)
178 - if (jQuery( evt.currentTarget ).data( "timeout" ) != null) {
 185+ // clear any timeout that may still run on the list item
 186+ // (i.e. do not fade in submenu)
 187+ clearTimeout( jQuery( evt.currentTarget ).data( "timeout" ) );
 188+ jQuery( evt.currentTarget ).data( "timeout", null );
179189
180 - // clear any timeout that may still run on the list item
181 - // (i.e. do not fade in submenu)
182 - clearTimeout( jQuery( evt.currentTarget ).data( "timeout" ) );
183 - jQuery( evt.currentTarget ).data( "timeout", null );
 190+ // abort further actions (no need to close)
 191+ return;
 192+ }
184193
185 - // abort further actions (no need to close)
186 - return;
187 - }
 194+ // if list item has sub-items...
 195+ if ( jQuery( evt.currentTarget ).children( "ul" ).length > 0 ) {
188196
189 - // if list item has sub-items...
190 - if ( jQuery( evt.currentTarget ).children( "ul" ).length > 0 ) {
 197+ // hide sub-items after a short pause
 198+ jQuery( evt.currentTarget ).data( "timeout", setTimeout(
 199+ function() {
191200
192 - // hide sub-items after a short pause
193 - jQuery( evt.currentTarget ).data( "timeout", setTimeout(
194 - function() {
 201+ // clear timeout data
 202+ jQuery( evt.currentTarget ).data( "timeout", null );
195203
196 - // clear timeout data
197 - jQuery( evt.currentTarget ).data( "timeout", null );
 204+ // fade out sub-menu
 205+ // when finished set display:none and put list item back in
 206+ // line ( i.e. animate to original width )
 207+ jQuery( evt.currentTarget ).children( "ul" )
 208+ .css( "z-index", 1 )
 209+ .fadeTo( 400, 0,
 210+ function() {
198211
199 - // fade out sub-menu
200 - // when finished set display:none and put list item back in
201 - // line ( i.e. animate to original width )
202 - jQuery( evt.currentTarget ).children( "ul" )
203 - .css( "z-index", 1 )
204 - .fadeTo( 400, 0,
205 - function() {
 212+ jQuery( this ).css( "display", "none" );
206213
207 - jQuery( this ).css( "display", "none" );
 214+ // animate list item width
 215+ jQuery( this ).parent()
 216+ .animate( { "width": jQuery( this ).parent().data( "width" ) }, 100 );
 217+ }
 218+ );
208219
209 - // animate list item width
210 - jQuery( this ).parent()
211 - .animate( { "width": jQuery( this ).parent().data( "width" ) }, 100 );
212 - }
213 - );
 220+ }, 400 )
 221+ );
 222+ }
214223
215 - }, 400 )
216 - );
217 - }
 224+ } );
218225
219 - } );
 226+ // clicked list item
 227+ jQuery( treeid + " li" )
 228+ .mousedown( function() {
220229
221 - // clicked list item
222 - jQuery( treeid + " li" )
223 - .mousedown( function() {
 230+ // set visible value and leave input
 231+ jQuery( "#" + inputID + "_show" ).attr( "value", jQuery( this )
 232+ .children( "span" ).find( "div.cont" ).text() ).blur();
224233
225 - // set visible value and leave input
226 - jQuery( "#" + inputID + "_show" ).attr( "value", jQuery( this )
227 - .children( "span" ).find( "div.cont" ).text() ).blur();
 234+ // set hidden value that gets sent back to the server
 235+ link = jQuery( this ).children( "span" ).find( "div.cont>a" );
228236
229 - // set hidden value that gets sent back to the server
230 - link = jQuery( this ).children( "span" ).find( "div.cont>a" );
 237+ // if content is link
 238+ if ( link.length == 1 ) {
231239
232 - // if content is link
233 - if ( link.length == 1 ) {
 240+ // use title set by MW
 241+ jQuery( "#" + inputID ).attr( "value", link.data( "title" ) );
234242
235 - // use title set by MW
236 - jQuery( "#" + inputID ).attr( "value", link.data( "title" ) );
 243+ } else {
237244
238 - } else {
 245+ // just use text of list item
 246+ jQuery( "#" + inputID ).attr( "value", jQuery( this ).children( "span" ).find( "div.cont" ).text() );
239247
240 - // just use text of list item
241 - jQuery( "#" + inputID ).attr( "value", jQuery( this ).children( "span" ).find( "div.cont" ).text() );
 248+ }
 249+ return false;
242250
243 - }
244 - return false;
 251+ } );
245252
246 - } );
 253+ // show top menu when input gets focus
 254+ jQuery( "#" + inputID + "_show" )
 255+ .focus( function() {
 256+ jQuery( treeid + ">ul" ).css( "display", "inline" ).fadeTo( 400, 1 );
 257+ } );
247258
248 - // show top menu when input gets focus
249 - jQuery( "#" + inputID + "_show" )
250 - .focus( function() {
251 - jQuery( treeid + ">ul" ).css( "display", "inline" ).fadeTo( 400, 1 );
252 - } );
 259+ // hide all menus when input loses focus
 260+ jQuery( "#" + inputID + "_show" )
 261+ .blur( function() {
253262
254 - // hide all menus when input loses focus
255 - jQuery( "#" + inputID + "_show" )
256 - .blur( function() {
 263+ jQuery( treeid + " ul" ).fadeTo( 400, 0,
 264+ function() {
 265+ jQuery( this ).css( "display", "none" );
 266+ } );
 267+ } );
257268
258 - jQuery( treeid + " ul" ).fadeTo( 400, 0,
259 - function() {
260 - jQuery( this ).css( "display", "none" );
261 - } );
262 - } );
 269+ jQuery( treeid ).css("visibility","visible");
 270+ jQuery( treeid + ">ul" ).css( "display", "inline" ).fadeTo( 400, 1 );
263271
264 - jQuery( treeid ).css("visibility","visible");
265 -
 272+ });
266273 }
\ No newline at end of file
Index: trunk/extensions/SemanticFormsInputs/libs/datetimepicker.js
@@ -34,4 +34,6 @@
3535 })
3636 }
3737 }
 38+
 39+ jQuery( "#" + input_id ).attr("value", jQuery( "#" + input_id ).attr("value") + " " + tp.attr( "value" ) );
3840 }
\ No newline at end of file