wmde /
FundraisingFrontend
| Conditions | 1 |
| Paths | 1 |
| Total Lines | 99 |
| Lines | 0 |
| Ratio | 0 % |
| Changes | 5 | ||
| Bugs | 0 | Features | 0 |
Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.
For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.
Commonly applied refactorings include:
If many parameters/temporary variables are present:
| 1 | (function ($) { |
||
| 2 | |||
| 3 | var form = $('#comment-form'); |
||
| 4 | |||
| 5 | var inputElements = form.find('input, textarea'); |
||
| 6 | var submitButton = form.find('input[type="submit"]'); |
||
| 7 | |||
| 8 | setupForm(); |
||
| 9 | |||
| 10 | function setupForm() { |
||
| 11 | setupFormValidation(); |
||
| 12 | form.bind( 'submit', handleFormSubmission ); |
||
| 13 | } |
||
| 14 | |||
| 15 | function setupFormValidation() { |
||
| 16 | form.submit(onFormSubmit); |
||
| 17 | submitButton.click(onFormSubmit); |
||
| 18 | |||
| 19 | inputElements.keypress(function () { |
||
| 20 | $(this).data('data-entered', true); |
||
| 21 | }); |
||
| 22 | |||
| 23 | inputElements.blur(function () { |
||
| 24 | if ($(this).data('data-entered')) { |
||
| 25 | updateElementValidationState.apply( this ); |
||
| 26 | } |
||
| 27 | }); |
||
| 28 | } |
||
| 29 | |||
| 30 | function onFormSubmit() { |
||
| 31 | inputElements.each(updateElementValidationState); |
||
| 32 | return inputElements.filter(elementIsInvalid).length === 0; |
||
| 33 | } |
||
| 34 | |||
| 35 | function updateElementValidationState() { |
||
| 36 | if ($(this).val() === "" || !this.checkValidity()) { |
||
| 37 | $(this).removeClass('valid'); |
||
| 38 | $(this).parent().removeClass('valid'); |
||
| 39 | $(this).addClass('invalid'); |
||
| 40 | $(this).parent().addClass('invalid'); |
||
| 41 | } |
||
| 42 | else { |
||
| 43 | $(this).removeClass('invalid'); |
||
| 44 | $(this).parent().removeClass('invalid'); |
||
| 45 | $(this).addClass('valid'); |
||
| 46 | $(this).parent().addClass('valid'); |
||
| 47 | } |
||
| 48 | } |
||
| 49 | |||
| 50 | function elementIsInvalid() { |
||
| 51 | return $(this).val() === "" || !this.checkValidity(); |
||
| 52 | } |
||
| 53 | |||
| 54 | function handleFormSubmission( event ) { |
||
| 55 | event.preventDefault(); |
||
| 56 | |||
| 57 | submitButton.attr( 'disabled', 'disabled' ); |
||
| 58 | form.find( '.message' ).remove(); |
||
| 59 | |||
| 60 | $.ajax( form.attr( 'action' ), { |
||
| 61 | data: $( this ).serialize(), |
||
| 62 | dataType: 'json', |
||
| 63 | type: 'POST', |
||
| 64 | success: function( response ) { |
||
| 65 | if ( response.status === 'success' ) { |
||
| 66 | onSubmitSuccess( response.message ); |
||
| 67 | } |
||
| 68 | else { |
||
| 69 | onSubmitFailure( response.message ); |
||
| 70 | } |
||
| 71 | }, |
||
| 72 | error: function ( e ) { |
||
|
|
|||
| 73 | onSubmitFailure(); |
||
| 74 | } |
||
| 75 | }); |
||
| 76 | } |
||
| 77 | |||
| 78 | function onSubmitSuccess( message ) { |
||
| 79 | submitButton.after( |
||
| 80 | $( '<div />' ) |
||
| 81 | .addClass( 'message' ) // TODO: proper positioning |
||
| 82 | .addClass( 'success' ) // TODO: create class |
||
| 83 | .text( message || 'Vielen Dank! Die Nachricht wurde verschickt!' ) // TODO: is this default needed? |
||
| 84 | ); |
||
| 85 | |||
| 86 | $( '#cancel-link' ).text( 'Zurück zur Spendenbestätigung' ); // TODO: i18n |
||
| 87 | } |
||
| 88 | |||
| 89 | function onSubmitFailure( message ) { |
||
| 90 | submitButton.removeAttr( 'disabled' ); |
||
| 91 | submitButton.after( |
||
| 92 | $( '<div />' ) |
||
| 93 | .addClass( 'message' ) |
||
| 94 | .addClass( 'error' ) // TODO: create class |
||
| 95 | .text( message || 'Die Nachricht konnte auf Grund eines Fehlers nicht verschickt werden.' ) // TODO: is this default needed? |
||
| 96 | ); |
||
| 97 | } |
||
| 98 | |||
| 99 | })(jQuery); |
||
| 100 |
This check looks for parameters in functions that are not used in the function body and are not followed by other parameters which are used inside the function.