r79496 MediaWiki - Code Review archive

Repository:	MediaWiki
Revision:	< r79495‎ \| r79496 \| r79497 >
Date:	18:36, 2 January 2011
Author:	foxtrott
Status:	deferred
Tags:
Comment:	fixed timepicker, menuselect, mandatory inputs * timepicker and menuselect work in multiple forms now * parameter 'mandatory' works again (all inputs)
Modified paths:	/trunk/extensions/SemanticFormsInputs/SFI_Inputs.php (modified) (history) /trunk/extensions/SemanticFormsInputs/SemanticFormsInputs.php (modified) (history) /trunk/extensions/SemanticFormsInputs/libs/menuselect.js (modified) (history) /trunk/extensions/SemanticFormsInputs/libs/timepicker.js (modified) (history)

Diff [purge]

Index: trunk/extensions/SemanticFormsInputs/SemanticFormsInputs.php
—	—	@@ -33,7 +33,7 @@
34	34	$dir = dirname( __FILE__ );
35	35
36	36	// load user settings
37		~~-require_once( $dir. '/SFI_Settings.php' );~~
	37	+require_once( $dir . '/SFI_Settings.php' );
38	38
39	39	$wgExtensionMessagesFiles['SemanticFormsInputs'] = $dir . '/SemanticFormsInputs.i18n.php';
40	40	$wgExtensionFunctions[] = "wfSFISetup";
Index: trunk/extensions/SemanticFormsInputs/SFI_Inputs.php
—	—	@@ -39,7 +39,7 @@
40	40	// array of attributes to pass to the input field
41	41	$attribs = array(
42	42	"name" => $input_name,
43		~~- "cssclass" => $class,~~
	43	+ "class" => $class,
44	44	"value" => $cur_value,
45	45	"type" => "text"
46	46	);
—	—	@@ -56,12 +56,12 @@
57	57
58	58	// modify class attribute for mandatory form fields
59	59	if ( $is_mandatory ) {
60		~~- $attribs["cssclass"] .= ' mandatory';~~
	60	+ $attribs["class"] .= ' mandatoryField';
61	61	}
62	62
63	63	// add user class(es) to class attribute of input field
64	64	if ( array_key_exists( 'class', $other_args ) ) {
65		~~- $attribs["cssclass"] .= ' ' . $other_args['class'];~~
	65	+ $attribs["class"] .= ' ' . $other_args['class'];
66	66	}
67	67
68	68	// set readonly attrib
—	—	@@ -892,8 +892,8 @@
893	893
894	894	}
895	895
896		~~- // add span for error messages (e.g. used for mandatory inputs)~~
897		~~- $html .= Xml::element( "span", array( "id" => "info_$sfgFieldNum", "class" => "errorMessage" ) );~~
	896	+ // wrap in span (e.g. used for mandatory inputs)
	897	+ $html = '<span class="inputSpan' . ($is_mandatory ? ' mandatoryFieldSpan' : '') . '">' .$html . '</span>';
898	898
899	899	// insert the code of the JS init function into the pages code
900	900	$wgOut->addScript( '<script type="text/javascript">' . $jstext . '</script>' );
—	—	@@ -1032,7 +1032,7 @@
1033	1033	. Xml::expandAttributes ( array(
1034	1034	'type' => 'button',
1035	1035	'class' => 'createboxInput ' . $userClasses,
1036		~~- 'id' => "input_{$sfgFieldNum}_button",~~
	1036	+ 'name' => "button",
1037	1037	) )
1038	1038	. "onclick=\"document.getElementById(this.id.replace('_button','_show')).focus();\""
1039	1039	. ">"
—	—	@@ -1074,7 +1074,7 @@
1075	1075	. Xml::expandAttributes ( array(
1076	1076	'type' => 'button',
1077	1077	'class' => 'createboxInput ' . $userClasses,
1078		~~- 'id' => "input_{$sfgFieldNum}_resetbutton",~~
	1078	+ 'name' => "resetbutton",
1079	1079	) )
1080	1080	. "onclick=\"document.getElementById(this.id.replace('_resetbutton','')).value='';"
1081	1081	. "document.getElementById(this.id.replace('_resetbutton','_show')).value='';\""
—	—	@@ -1090,20 +1090,14 @@
1091	1091	}
1092	1092	}
1093	1093
1094		~~- // append span for error messages (e.g. fore mandatory fields)~~
1095		~~- $html .= Xml::element( "span", array( "id" => "info_$sfgFieldNum", "class" => "errorMessage" ) );~~
	1094	+ // wrap in span (e.g. used for mandatory inputs)
	1095	+ $html = '<span class="inputSpan' . ($is_mandatory ? ' mandatoryFieldSpan' : '') . '">' .$html . '</span>';
1096	1096
1097	1097	// third: if the timepicker is not disabled set up JS attributes ans assemble JS call
1098	1098	if ( !$is_disabled ) {
1099	1099
1100	1100	self::timepickerSetup();
1101	1101
1102		~~-// if ( array_key_exists( 'delimiter', $other_args ) ) {~~
1103		~~-// $delimiter = $other_args[ 'delimiter' ];~~
1104		~~-// } else {~~
1105		~~-// $delimiter = ' ';~~
1106		~~-// }~~
1107		~~-//~~
1108	1102	// set min time if valid, else use default
1109	1103	if ( array_key_exists( 'mintime', $other_args )
1110	1104	&& ( preg_match( '/^\d+:\d\d$/', trim( $other_args['mintime'] ) ) == 1 ) ) {
—	—	@@ -1128,8 +1122,16 @@
1129	1123	$interval = '15';
1130	1124	}
1131	1125
	1126	+ // build JS code from attributes array
	1127	+ $jstext = Xml::encodeJsVar( array(
	1128	+ "minTime" => $minTime,
	1129	+ "maxTime" => $maxTime,
	1130	+ "interval" => $interval,
	1131	+ "format" => "hh:mm"
	1132	+ ) );
	1133	+
1132	1134	$jstext = <<<JAVASCRIPT
1133		~~- addOnloadHook(function(){SFI_TP_init ( "input_$sfgFieldNum", "$minTime", "$maxTime", "$interval", "" );});~~
	1135	+jQuery(function(){ jQuery('#input_$sfgFieldNum').registerInitialisation(SFI_TP_init, $jstext ); });
1134	1136	JAVASCRIPT;
1135	1137
1136	1138	// write JS code directly to the page's code
—	—	@@ -1199,7 +1201,7 @@
1200	1202	) );
1201	1203
1202	1204
1203		~~- $html .= "<span class='SFI_menuselect' id='input_{$sfgFieldNum}_tree'>";~~
	1205	+ $html .= "<span class='SFI_menuselect' id='span_{$sfgFieldNum}_tree'>";
1204	1206
1205	1207
1206	1208	// if ( array_key_exists( 'delimiter', $other_args ) ) $delimiter = $other_args[ 'delimiter' ];
—	—	@@ -1224,12 +1226,16 @@
1225	1227
1226	1228	$html .= "</span>";
1227	1229
1228		~~- $jstext = <<<JAVASCRIPT~~
1229		~~- addOnloadHook(function(){SFI_MS_init("input_$sfgFieldNum");});~~
	1230	+ // wrap in span (e.g. used for mandatory inputs)
	1231	+ $html = '<span class="inputSpan' . ($is_mandatory ? ' mandatoryFieldSpan' : '') . '">' .$html . '</span>';
	1232	+
	1233	+ $jstext = <<<JAVASCRIPT
	1234	+jQuery(function(){ jQuery('#input_$sfgFieldNum').registerInitialisation(SFI_MS_init, null ); });
1230	1235	JAVASCRIPT;
1231	1236
1232	1237	// write JS code directly to the page's code
1233		~~- $wgOut->addScript( '<script type="text/javascript">' . $jstext . '</script>' );~~
	1238	+ $wgOut->addScript( '<script type="text/javascript">' . $jstext . '</script>' );
	1239	+
1234	1240	return array( $html, "", "SFI_MS_init" );
1235	1241
1236	1242	}
Index: trunk/extensions/SemanticFormsInputs/libs/menuselect.js
—	—	@@ -11,13 +11,15 @@
12	12	*
13	13	* @param inputID ( String ) the id of the input to initialize
14	14	*/
15		~~-function SFI_MS_init( inputID ) {~~
	15	+function SFI_MS_init( inputID, params ) {
16	16
17		~~- jQuery("#" + inputID + "_tree").css("visibility","hidden");~~
	17	+ var treeid = "#" + inputID.replace(/input/,"span") + "_tree"
18	18
	19	+ jQuery(treeid).css("visibility","hidden");
	20	+
19	21	// wrap content in span to separate content from sub-menus,
20	22	// wrap content in div to support animating the list item width later
21		~~- jQuery( "#" + inputID + "_tree li" ).each(~~
	23	+ jQuery( treeid + " li" ).each(
22	24	function() {
23	25
24	26	jQuery( this ).contents().not( "ul" )
—	—	@@ -39,13 +41,13 @@
40	42	// ensure labels of list item have constant width regardless of width of list item
41	43	// prevents layout changes when list item width is changed
42	44	// set position static ( was set to fixed to calculate text width )
43		~~- jQuery( "#" + inputID + "_tree li>span>div.cont" ).each( function() {~~
	45	+ jQuery( treeid + " li>span>div.cont" ).each( function() {
44	46	jQuery( this ).width( jQuery( this ).outerWidth(true) + jQuery( this ).siblings("div.arrow").outerWidth(true) + 5);
45	47	jQuery( this ).css( "position", "static" );
46	48	} );
47	49
48	50	// add class for default state and fix dimensions
49		~~- jQuery( "#" + inputID + "_tree li" )~~
	51	+ jQuery( treeid + " li" )
50	52	.addClass( "ui-state-default" )
51	53	.each(
52	54	function() {
—	—	@@ -58,18 +60,18 @@
59	61	);
60	62
61	63	// initially hide everything
62		~~- jQuery( "#" + inputID + "_tree ul" )~~
	64	+ jQuery( treeid + " ul" )
63	65	.css({"z-index":1})
64	66	.hide()
65	67	.fadeTo(0, 0 );
66	68
67	69	// some crap "browsers" need special treatment
68	70	if ( jQuery.browser.msie ) {
69		~~- jQuery( "#" + inputID + "_tree ul" ).css({ "position":"relative" });~~
	71	+ jQuery( treeid + " ul" ).css({ "position":"relative" });
70	72	}
71	73
72	74	// sanitize links
73		~~- jQuery( "#" + inputID + "_tree" ).find( "a" )~~
	75	+ jQuery( treeid ).find( "a" )
74	76	.each(
75	77	function() {
76	78
—	—	@@ -100,7 +102,7 @@
101	103	// attach event handlers
102	104
103	105	// mouse entered list item
104		~~- jQuery( "#" + inputID + "_tree li" )~~
	106	+ jQuery( treeid + " li" )
105	107	.mouseenter( function( evt ) {
106	108
107	109	// switch classes to change display style
—	—	@@ -163,7 +165,7 @@
164	166	} );
165	167
166	168	// mouse left list item
167		~~- jQuery( "#" + inputID + "_tree li" )~~
	169	+ jQuery( treeid + " li" )
168	170	.mouseleave( function( evt ) {
169	171
170	172	// switch classes to change display style
—	—	@@ -216,7 +218,7 @@
217	219	} );
218	220
219	221	// clicked list item
220		~~- jQuery( "#" + inputID + "_tree li" )~~
	222	+ jQuery( treeid + " li" )
221	223	.mousedown( function() {
222	224
223	225	// set visible value and leave input
—	—	@@ -245,19 +247,19 @@
246	248	// show top menu when input gets focus
247	249	jQuery( "#" + inputID + "_show" )
248	250	.focus( function() {
249		~~- jQuery( "#" + inputID + "_tree>ul" ).css( "display", "inline" ).fadeTo( 400, 1 );~~
	251	+ jQuery( treeid + ">ul" ).css( "display", "inline" ).fadeTo( 400, 1 );
250	252	} );
251	253
252	254	// hide all menus when input loses focus
253	255	jQuery( "#" + inputID + "_show" )
254	256	.blur( function() {
255	257
256		~~- jQuery( "#" + inputID + "_tree ul" ).fadeTo( 400, 0,~~
	258	+ jQuery( treeid + " ul" ).fadeTo( 400, 0,
257	259	function() {
258	260	jQuery( this ).css( "display", "none" );
259	261	} );
260	262	} );
261	263
262		~~- jQuery("#" + inputID + "_tree").css("visibility","visible");~~
	264	+ jQuery( treeid ).css("visibility","visible");
263	265
264	266	}
\ No newline at end of file
Index: trunk/extensions/SemanticFormsInputs/libs/timepicker.js
—	—	@@ -10,68 +10,66 @@
11	11	* Initializes a timepicker input
12	12	*
13	13	* @param inputID (String) the id of the input to initialize
14		~~- * @param minTime (String) the minimum time to be shown (format hh:mm)~~
15		~~- * @param maxTime (String) the maximum time to be shown (format hh:mm)~~
16		~~- * @param interval (String) the interval between selectable times in minutes~~
17		~~- * @param format (String) a format string (unused) (do we even need it?)~~
	14	+ * @param params (Object) the parameter object for the timepicker, contains
	15	+ * minTime: (String) the minimum time to be shown (format hh:mm)
	16	+ * maxTime: (String) the maximum time to be shown (format hh:mm)
	17	+ * interval: (String) the interval between selectable times in minutes
	18	+ * format: (String) a format string (unused) (do we even need it?)
18	19	*
19	20	*/
20		~~-function SFI_TP_init( inputID, minTime, maxTime, interval, format ) {~~
	21	+function SFI_TP_init( inputID, params ) { // minTime, maxTime, interval, format
21	22
22	23	// sanitize inputs
23		~~- re = /^\d+:\d\d$/;~~
	24	+ var re = /^\d+:\d\d$/;
	25	+ var minh = 0;
	26	+ var minm = 0;
24	27
25		~~- if ( re.test( minTime ) ) {~~
	28	+ var maxh = 23;
	29	+ var maxm = 59;
26	30
27		~~- min = minTime.split( ':', 2 );~~
	31	+if ( re.test( params.minTime ) ) {
	32	+
	33	+ var min = params.minTime.split( ':', 2 );
28	34	minh = Number( min[0] );
29	35	minm = Number( min[1] );
30	36
31	37	if ( minm > 59 ) minm = 59;
32		-
33		~~- } else {~~
34		~~- minh = 0;~~
35		~~- minm = 0;~~
36	38	}
37	39
38		~~- if ( re.test( maxTime ) ) {~~
	40	+ if ( re.test( params.maxTime ) ) {
39	41
40		~~- max = maxTime.split( ':', 2 );~~
	42	+ var max = params.maxTime.split( ':', 2 );
41	43	maxh = Number( max[0] );
42	44	maxm = Number( max[1] );
43	45
44	46	if ( maxm > 59 ) maxm = 59;
45		-
46		~~- } else {~~
47		~~- maxh = 23;~~
48		~~- maxm = 59;~~
49	47	}
50	48
51		~~- interv = Number( interval );~~
	49	+ var interv = Number( params.interval );
52	50
53	51	if ( interv < 1 ) interv = 1;
54	52	else if ( interv > 60 ) interv = 60;
55	53
56	54	// build html structure
57		~~- sp = jQuery( "<span class='SFI_timepicker' id='" + inputID + "_tree' ></span>" ).insertAfter( "#" + inputID );~~
	55	+ var sp = jQuery( "<span class='SFI_timepicker' id='" + inputID + "_tree' ></span>" ).insertAfter( "#" + inputID );
58	56
59		~~- ulh = jQuery( "<ul>" ).appendTo( sp );~~
	57	+ var ulh = jQuery( "<ul>" ).appendTo( sp );
60	58
61	59
62		~~- for ( h = minh; h <= maxh; ++h ) {~~
	60	+ for ( var h = minh; h <= maxh; ++h ) {
63	61
64		~~- lih = jQuery( "<li class='ui-state-default'>" + ( ( h < 10 ) ? "0" : "" ) + h + "</li>" ).appendTo( ulh );~~
	62	+ var lih = jQuery( "<li class='ui-state-default'>" + ( ( h < 10 ) ? "0" : "" ) + h + "</li>" ).appendTo( ulh );
65	63
66	64	//TODO: Replace value for "show" by formatted string
67	65	lih
68	66	.data( "value", ( ( h < 10 ) ? "0" : "" ) + h + ":00" )
69	67	.data( "show", ( ( h < 10 ) ?"0" : "" ) + h + ":00" );
70	68
71		~~- ulm = jQuery( "<ul>" ).appendTo( lih );~~
	69	+ var ulm = jQuery( "<ul>" ).appendTo( lih );
72	70
73		~~- for ( m = ( (h == minh) ? minm : 0 ) ; m <= ( (h == maxh) ? maxm : 59 ); m += interv ) {~~
	71	+ for ( var m = ( (h == minh) ? minm : 0 ) ; m <= ( (h == maxh) ? maxm : 59 ); m += interv ) {
74	72
75		~~- lim = jQuery( "<li class='ui-state-default'>" + ( ( m < 10 ) ? "0" : "" ) + m + "</li>" ).appendTo( ulm );~~
	73	+ var lim = jQuery( "<li class='ui-state-default'>" + ( ( m < 10 ) ? "0" : "" ) + m + "</li>" ).appendTo( ulm );
76	74
77	75	//TODO: Replace value for "show" by formatted string
78	76	lim
—	—	@@ -151,4 +149,15 @@
152	150	jQuery("#" + inputID ).attr("value", jQuery(this).attr("value"));
153	151	});
154	152
	153	+ jQuery("#" + inputID + '~ button[name="button"]' )
	154	+ .attr("id", inputID + "_button")
	155	+ .click(function() {
	156	+ jQuery("#" + inputID + "_show" ).focus();
	157	+ });
	158	+
	159	+ jQuery("#" + inputID + '~ button[name="resetbutton"]' )
	160	+ .attr("id", inputID + "_resetbutton")
	161	+ .click(function() {
	162	+ jQuery("#" + inputID + "_show" ).attr("value", "");
	163	+ });
155	164	}
\ No newline at end of file

Status & tagging log

18:56, 2 January 2011 Reedy (talk | contribs) changed the status of r79496 [removed: new added: deferred]