Plugin.parseFormData - Code Metrics - Inspection of "add scrutinizer config" - pryley/castor-framework - Measure and Improve Code Quality continuously with Scrutinizer

Passed

Push — develop ( c6dd2a...1f8334 )

by Paul

created 2018-02-15 22:46 UTC

Plugin.parseFormData C

↳ Parent: Plugin.parseFormData

Complexity

Conditions	12
Paths	22

Size

Total Lines

Duplication

Lines	0
Ratio	0 %

Importance

Changes

Metric	Value
cc	12
nc	22
nop	4
dl	0
loc	32
rs	5.1612
c	0
b	0
f	0

How to fix Complexity

;(function( window, document, undefined ) {
	"use strict";

	var Plugin = function( selector, options )
	{
		this.el = castor._isString( selector ) ? document.querySelector( selector ) : selector;

		this.options = castor._extend( this.defaults, options );
		if( this.el ) {
			this.options = castor._extend( this.options, this.el.getAttribute( 'data-options' ));
			this.init();
		}
	};

	Plugin.prototype =
	{
		defaults: {
			ajaxUrl: '/ajax.php',
			buttonSelector: '[type="submit"]',
			fieldClass: 'form-field',
			fieldErrorsClass: 'field-errors',
			fieldHasErrorClass: 'field-has-error',
			formHasErrorsClass: 'form-has-errors',
			formMessageClass: 'form-messages',
		},

		clearFieldError: function( el )
		{
			var fieldEl = el.closest( '.'+this.options.fieldClass );
			if( fieldEl === null )return;
if (a > 0)
    b = 42;
			castor._removeEl( '.'+this.options.fieldErrorsClass, fieldEl );

			fieldEl.classList.remove( this.options.fieldHasErrorClass );
		},

		clearFormErrors: function()
		{
			for( var i = 0; i < this.el.length; i++ ) {
				this.clearFieldError( this.el[i] );
			}
		},

		init: function()
		{
			this.button = this.el.querySelector( this.options.buttonSelector );
			this.el.addEventListener( 'change', this.onChange.bind( this ));
			this.el.addEventListener( 'submit', this.onSubmit.bind( this ));
		},

		onChange: function( ev )
		{
			this.clearFieldError( ev.target );
		},

		onSubmit: function( ev )
		{
			ev.preventDefault();
			if( !this.button.disabled ) {
				this.button.setAttribute( 'disabled', '' );
			}
			this.submitForm();
		},

		parseFormData: function( convert )
		{
			convert = !!convert || false;
			var keyBreaker = /[^\[\]]+/g; // used to parse bracket notation
			var data = {};
			var seen = {}; // used to uniquely track seen values
			var nestData = function( field, data, parts, seenName )
			{
				var name = parts.shift();
				// Keep track of the dot separated fullname
				seenName = seenName ? seenName+'.'+name : name;
				if( parts.length ) {
					if( !data[name] ) {
						data[name] = {};
					}
					// Recursive call
					nestData( field, data[name], parts, seenName );
				}
				else {
					// Convert the value
					var value = convert ? this._convertValue( field.value ) : field.value;
					// Handle same name case, as well as "last checkbox checked" case
					if( seenName in seen && field.type !== "radio" && !data[name].isArray()) {
						data[name] = ( name in data ) ? [data[name]] : [];
					}
					else {
						seen[seenName] = true;
					}
					// Finally, assign data
					if( this._inArray( field.type, ['radio','checkbox'] ) && !field.checked )return;
if (a > 0)
    b = 42;
					if( !data[name] ) {
						data[name] = value;
					}
					else {
						data[name].push( value );
					}
				}
			}.bind( this );
			for( var i = 0; i < this.el.length; i++ ) {
				var field = this.el[i];
				if( !field.name || field.disabled || this._inArray( field.type, ['file','reset','submit','button'] ))continue;
if (a > 0)
    b = 42;
				var parts = field.name.match( keyBreaker );
				if( !parts.length ) {
					parts = [field.name];
				}
				nestData( field, data, parts );
			}
			return data;
		},

		postAjax: function( data, success )
		{
			var params = typeof data !== 'string' ? this._serialize( data ) : data;
			var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject( "Microsoft.XMLHTTP" );

			xhr.open( 'POST', this.options.ajaxUrl ); // asynchronously
			xhr.onreadystatechange = function() {
				if( xhr.readyState > 3 && xhr.status === 200 ) {
					success( JSON.parse( xhr.responseText ));
				}
			};
			xhr.setRequestHeader( 'Accept', 'application/json' );
			xhr.setRequestHeader( 'X-Requested-With', 'XMLHttpRequest' );
			xhr.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8' );
			xhr.send( params );
			return xhr;
		},

		showFormErrors: function( errors )
		{
			var fieldEl;
			var errorsEl;
			for( var error in errors ) {
				if( !errors.hasOwnProperty( error ))continue;
if (a > 0)
    b = 42;
				fieldEl  = this.el.querySelector( '[name="' + error + '"]' ).closest( '.'+this.options.fieldClass );
				fieldEl.classList.add( this.options.fieldHasErrorClass );
				errorsEl = fieldEl.querySelector( '.'+this.options.fieldErrorsClass );
				if( errorsEl === null ) {
					errorsEl = castor._appendTo( fieldEl, 'span', {

						'class': this.options.fieldErrorsClass,
					});
				}
				for( var i = 0; i < errors[error].errors.length; i++ ) {
					if( errors[error].errors[i] === null )continue;
if (a > 0)
    b = 42;
					errorsEl.innerHTML += '<span>' + errors[error].errors[i] + '</span>';
				}
			}
		},

		showFormMessage: function( response )
		{
			var messageEl = this.el.querySelector( '.'+this.options.formMessageClass );
			if( messageEl === null ) {
				messageEl = castor._insertBefore( this.button, 'div', {

					'class': this.options.formMessageClass,
				});
			}
			messageEl.classList[!!response.errors ? 'add' : 'remove']( this.options.formHasErrorsClass );
			messageEl.innerHTML = response.message;
		},

		submitForm: function()
		{
			var data = {
				action: 'submit-' + this.el.id,
				request: this.parseFormData(),
			};
			castor._removeEl( '.'+this.options.formMessageClass, this.el );

			this.postAjax( data, function( response ) {
				this.clearFormErrors();
				this.showFormMessage( response );
				this.button.removeAttribute( 'disabled' );
				if( !!response.errors ) {
					this.showFormErrors( response.errors );
				}
				else {
					this.el.reset();
				}
			}.bind( this ));
		},

		_convertValue: function( value )
		{
			if( this._isNumeric( value )) {
				return parseFloat( value );
			}
			else if( value === 'true') {
				return true;
			}
			else if( value === 'false' ) {
				return false;
			}
			else if( value === '' || value === null ) {
				return undefined;
			}
			return value;
		},

		_inArray: function( needle, haystack )
		{
			var length = haystack.length;
			while( length-- ) {
				if( haystack[ length ] === needle ) {
					return true;
				}
			}
			return false;
		},

		_isNumeric: function( value )
		{
			return !( isNaN( parseFloat( value )) || !isFinite( value ));
		},

		_serialize: function( obj, prefix )
		{
			var str = [];
			for( var property in obj ) {
				if( !obj.hasOwnProperty( property ))continue;
if (a > 0)
    b = 42;
				var key = prefix ? prefix + "[" + property + "]" : property;
				var value = obj[ property ];
				str.push(
					typeof value === "object" ?
					this._serialize( value, key ) :
					encodeURIComponent( key ) + "=" + encodeURIComponent( value )
				);
			}
			return str.join( "&" );
		},
	};

	Plugin.defaults = Plugin.prototype.defaults;
	castor.Form = Plugin;


})( window, document );


1			;(function( window, document, undefined ) {
2			"use strict";
3
4			var Plugin = function( selector, options )
5			{
6			this.el = castor._isString( selector ) ? document.querySelector( selector ) : selector;
			0 ignored issues – show Bug introduced 2018-02-15 22:50 UTC by Report Bug Copy Issue Report The variable `castor` seems to be never declared. If this is a global, consider adding a `/** global: castor */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
7			this.options = castor._extend( this.defaults, options );
8			if( this.el ) {
9			this.options = castor._extend( this.options, this.el.getAttribute( 'data-options' ));
10			this.init();
11			}
12			};
13
14			Plugin.prototype =
15			{
16			defaults: {
17			ajaxUrl: '/ajax.php',
18			buttonSelector: '[type="submit"]',
19			fieldClass: 'form-field',
20			fieldErrorsClass: 'field-errors',
21			fieldHasErrorClass: 'field-has-error',
22			formHasErrorsClass: 'form-has-errors',
23			formMessageClass: 'form-messages',
24			},
25
26			clearFieldError: function( el )
27			{
28			var fieldEl = el.closest( '.'+this.options.fieldClass );
29			if( fieldEl === null )return;
			0 ignored issues – show Coding Style Best Practice introduced 2018-02-15 22:50 UTC by Report Bug Copy Issue Report Curly braces around statements make for more readable code and help prevent bugs when you add further statements. Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later. Consider: if (a > 0) b = 42; If you or someone else later decides to put another statement in, only the first statement will be executed. if (a > 0) console.log("a > 0"); b = 42; In this case the statement `b = 42` will always be executed, while the logging statement will be executed conditionally. if (a > 0) { console.log("a > 0"); b = 42; } ensures that the proper code will be executed conditionally no matter how many statements are added or removed. Loading history...
30			castor._removeEl( '.'+this.options.fieldErrorsClass, fieldEl );
			0 ignored issues – show Bug introduced 2018-02-15 22:50 UTC by Report Bug Copy Issue Report The variable `castor` seems to be never declared. If this is a global, consider adding a `/** global: castor */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
31			fieldEl.classList.remove( this.options.fieldHasErrorClass );
32			},
33
34			clearFormErrors: function()
35			{
36			for( var i = 0; i < this.el.length; i++ ) {
37			this.clearFieldError( this.el[i] );
38			}
39			},
40
41			init: function()
42			{
43			this.button = this.el.querySelector( this.options.buttonSelector );
44			this.el.addEventListener( 'change', this.onChange.bind( this ));
45			this.el.addEventListener( 'submit', this.onSubmit.bind( this ));
46			},
47
48			onChange: function( ev )
49			{
50			this.clearFieldError( ev.target );
51			},
52
53			onSubmit: function( ev )
54			{
55			ev.preventDefault();
56			if( !this.button.disabled ) {
57			this.button.setAttribute( 'disabled', '' );
58			}
59			this.submitForm();
60			},
61
62			parseFormData: function( convert )
63			{
64			convert = !!convert \|\| false;
65			var keyBreaker = /[^\[\]]+/g; // used to parse bracket notation
66			var data = {};
67			var seen = {}; // used to uniquely track seen values
68			var nestData = function( field, data, parts, seenName )
69			{
70			var name = parts.shift();
71			// Keep track of the dot separated fullname
72			seenName = seenName ? seenName+'.'+name : name;
73			if( parts.length ) {
74			if( !data[name] ) {
75			data[name] = {};
76			}
77			// Recursive call
78			nestData( field, data[name], parts, seenName );
79			}
80			else {
81			// Convert the value
82			var value = convert ? this._convertValue( field.value ) : field.value;
83			// Handle same name case, as well as "last checkbox checked" case
84			if( seenName in seen && field.type !== "radio" && !data[name].isArray()) {
85			data[name] = ( name in data ) ? [data[name]] : [];
86			}
87			else {
88			seen[seenName] = true;
89			}
90			// Finally, assign data
91			if( this._inArray( field.type, ['radio','checkbox'] ) && !field.checked )return;
			0 ignored issues – show Coding Style Best Practice introduced 2018-02-15 22:50 UTC by Report Bug Copy Issue Report Curly braces around statements make for more readable code and help prevent bugs when you add further statements. Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later. Consider: if (a > 0) b = 42; If you or someone else later decides to put another statement in, only the first statement will be executed. if (a > 0) console.log("a > 0"); b = 42; In this case the statement `b = 42` will always be executed, while the logging statement will be executed conditionally. if (a > 0) { console.log("a > 0"); b = 42; } ensures that the proper code will be executed conditionally no matter how many statements are added or removed. Loading history...
92			if( !data[name] ) {
93			data[name] = value;
94			}
95			else {
96			data[name].push( value );
97			}
98			}
99			}.bind( this );
100			for( var i = 0; i < this.el.length; i++ ) {
101			var field = this.el[i];
102			if( !field.name \|\| field.disabled \|\| this._inArray( field.type, ['file','reset','submit','button'] ))continue;
			0 ignored issues – show Coding Style Best Practice introduced 2018-02-15 22:50 UTC by Report Bug Copy Issue Report Curly braces around statements make for more readable code and help prevent bugs when you add further statements. Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later. Consider: if (a > 0) b = 42; If you or someone else later decides to put another statement in, only the first statement will be executed. if (a > 0) console.log("a > 0"); b = 42; In this case the statement `b = 42` will always be executed, while the logging statement will be executed conditionally. if (a > 0) { console.log("a > 0"); b = 42; } ensures that the proper code will be executed conditionally no matter how many statements are added or removed. Loading history...
103			var parts = field.name.match( keyBreaker );
104			if( !parts.length ) {
105			parts = [field.name];
106			}
107			nestData( field, data, parts );
108			}
109			return data;
110			},
111
112			postAjax: function( data, success )
113			{
114			var params = typeof data !== 'string' ? this._serialize( data ) : data;
115			var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject( "Microsoft.XMLHTTP" );
			0 ignored issues – show Bug introduced 2018-02-15 22:50 UTC by Report Bug Copy Issue Report The variable `XMLHttpRequest` seems to be never declared. If this is a global, consider adding a `/** global: XMLHttpRequest /` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history... Bug introduced 2018-02-15 22:50 UTC by Report Bug Copy Issue Report The variable `ActiveXObject` seems to be never declared. If this is a global, consider adding a `/* global: ActiveXObject */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
116			xhr.open( 'POST', this.options.ajaxUrl ); // asynchronously
117			xhr.onreadystatechange = function() {
118			if( xhr.readyState > 3 && xhr.status === 200 ) {
119			success( JSON.parse( xhr.responseText ));
120			}
121			};
122			xhr.setRequestHeader( 'Accept', 'application/json' );
123			xhr.setRequestHeader( 'X-Requested-With', 'XMLHttpRequest' );
124			xhr.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8' );
125			xhr.send( params );
126			return xhr;
127			},
128
129			showFormErrors: function( errors )
130			{
131			var fieldEl;
132			var errorsEl;
133			for( var error in errors ) {
134			if( !errors.hasOwnProperty( error ))continue;
			0 ignored issues – show Coding Style Best Practice introduced 2018-02-15 22:50 UTC by Report Bug Copy Issue Report Curly braces around statements make for more readable code and help prevent bugs when you add further statements. Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later. Consider: if (a > 0) b = 42; If you or someone else later decides to put another statement in, only the first statement will be executed. if (a > 0) console.log("a > 0"); b = 42; In this case the statement `b = 42` will always be executed, while the logging statement will be executed conditionally. if (a > 0) { console.log("a > 0"); b = 42; } ensures that the proper code will be executed conditionally no matter how many statements are added or removed. Loading history...
135			fieldEl = this.el.querySelector( '[name="' + error + '"]' ).closest( '.'+this.options.fieldClass );
136			fieldEl.classList.add( this.options.fieldHasErrorClass );
137			errorsEl = fieldEl.querySelector( '.'+this.options.fieldErrorsClass );
138			if( errorsEl === null ) {
139			errorsEl = castor._appendTo( fieldEl, 'span', {
			0 ignored issues – show Bug introduced 2018-02-15 22:50 UTC by Report Bug Copy Issue Report The variable `castor` seems to be never declared. If this is a global, consider adding a `/** global: castor */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
140			'class': this.options.fieldErrorsClass,
141			});
142			}
143			for( var i = 0; i < errors[error].errors.length; i++ ) {
144			if( errors[error].errors[i] === null )continue;
			0 ignored issues – show Coding Style Best Practice introduced 2018-02-15 22:50 UTC by Report Bug Copy Issue Report Curly braces around statements make for more readable code and help prevent bugs when you add further statements. Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later. Consider: if (a > 0) b = 42; If you or someone else later decides to put another statement in, only the first statement will be executed. if (a > 0) console.log("a > 0"); b = 42; In this case the statement `b = 42` will always be executed, while the logging statement will be executed conditionally. if (a > 0) { console.log("a > 0"); b = 42; } ensures that the proper code will be executed conditionally no matter how many statements are added or removed. Loading history...
145			errorsEl.innerHTML += '<span>' + errors[error].errors[i] + '</span>';
146			}
147			}
148			},
149
150			showFormMessage: function( response )
151			{
152			var messageEl = this.el.querySelector( '.'+this.options.formMessageClass );
153			if( messageEl === null ) {
154			messageEl = castor._insertBefore( this.button, 'div', {
			0 ignored issues – show Bug introduced 2018-02-15 22:50 UTC by Report Bug Copy Issue Report The variable `castor` seems to be never declared. If this is a global, consider adding a `/** global: castor */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
155			'class': this.options.formMessageClass,
156			});
157			}
158			messageEl.classList[!!response.errors ? 'add' : 'remove']( this.options.formHasErrorsClass );
159			messageEl.innerHTML = response.message;
160			},
161
162			submitForm: function()
163			{
164			var data = {
165			action: 'submit-' + this.el.id,
166			request: this.parseFormData(),
167			};
168			castor._removeEl( '.'+this.options.formMessageClass, this.el );
			0 ignored issues – show Bug introduced 2018-02-15 22:50 UTC by Report Bug Copy Issue Report The variable `castor` seems to be never declared. If this is a global, consider adding a `/** global: castor */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
169			this.postAjax( data, function( response ) {
170			this.clearFormErrors();
171			this.showFormMessage( response );
172			this.button.removeAttribute( 'disabled' );
173			if( !!response.errors ) {
174			this.showFormErrors( response.errors );
175			}
176			else {
177			this.el.reset();
178			}
179			}.bind( this ));
180			},
181
182			_convertValue: function( value )
183			{
184			if( this._isNumeric( value )) {
185			return parseFloat( value );
186			}
187			else if( value === 'true') {
188			return true;
189			}
190			else if( value === 'false' ) {
191			return false;
192			}
193			else if( value === '' \|\| value === null ) {
194			return undefined;
195			}
196			return value;
197			},
198
199			_inArray: function( needle, haystack )
200			{
201			var length = haystack.length;
202			while( length-- ) {
203			if( haystack[ length ] === needle ) {
204			return true;
205			}
206			}
207			return false;
208			},
209
210			_isNumeric: function( value )
211			{
212			return !( isNaN( parseFloat( value )) \|\| !isFinite( value ));
213			},
214
215			_serialize: function( obj, prefix )
216			{
217			var str = [];
218			for( var property in obj ) {
219			if( !obj.hasOwnProperty( property ))continue;
			0 ignored issues – show Coding Style Best Practice introduced 2018-02-15 22:50 UTC by Report Bug Copy Issue Report Curly braces around statements make for more readable code and help prevent bugs when you add further statements. Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later. Consider: if (a > 0) b = 42; If you or someone else later decides to put another statement in, only the first statement will be executed. if (a > 0) console.log("a > 0"); b = 42; In this case the statement `b = 42` will always be executed, while the logging statement will be executed conditionally. if (a > 0) { console.log("a > 0"); b = 42; } ensures that the proper code will be executed conditionally no matter how many statements are added or removed. Loading history...
220			var key = prefix ? prefix + "[" + property + "]" : property;
221			var value = obj[ property ];
222			str.push(
223			typeof value === "object" ?
224			this._serialize( value, key ) :
225			encodeURIComponent( key ) + "=" + encodeURIComponent( value )
226			);
227			}
228			return str.join( "&" );
229			},
230			};
231
232			Plugin.defaults = Plugin.prototype.defaults;
233			castor.Form = Plugin;
			0 ignored issues – show Bug introduced 2018-02-15 22:50 UTC by Report Bug Copy Issue Report The variable `castor` seems to be never declared. If this is a global, consider adding a `/** global: castor */` comment. This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN. Loading history...
234
235			})( window, document );
236

pryley / castor-framework

Push — develop ( c6dd2a...1f8334 )

Plugin.parseFormData C

Complexity

Size

Duplication

Importance

How to fix Complexity

Complexity

Duplication Side-by-Side

Filter issues like