Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

JSCS cleanup #26

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
148 changes: 79 additions & 69 deletions js/feedback-form.js
Original file line number Diff line number Diff line change
@@ -1,49 +1,51 @@
jQuery(document).ready(function($) {
var display_error, hide_error,
$textarea_feedback = $( '#feedback-text' ),
$first_screen = $( '.draftfeedback-first-screen' ),
$second_screen = $( '.draftfeedback-second-screen' );

display_error = function( id, notice, hide_on_keydown ) {
var error_container = $( '#draft-error' );
if ( error_container.length) {
hide_error( false, true ).done( function() {
display_error( id, notice, hide_on_keydown );
jQuery( document ).ready(function( $ ) {
var displayError, hideError,
$textareaFeedback = $( '#feedback-text' ),
$firstScreen = $( '.draftfeedback-first-screen' ),
$secondScreen = $( '.draftfeedback-second-screen' );

displayError = function( id, notice, hideOnKeydown ) {
var errorContainer = $( '#draft-error' );
if ( errorContainer.length ) {
hideError( false, true ).done( function() {
displayError( id, notice, hideOnKeydown );
});
return;
} else {
error_container = '<div id="draft-error" class="error"><p>' + notice + '</p></div>';
errorContainer = '<div id="draft-error" class="error"><p>' + notice + '</p></div>';
}

$(id).after(error_container);
if ( hide_on_keydown ) {
$( hide_on_keydown ).on( 'keydown', function() {
hide_error( false );
$( id ).after( errorContainer );
if ( hideOnKeydown ) {
$( hideOnKeydown ).on( 'keydown', function() {
hideError( false );
});
} else {
hide_error( true );
hideError( true );
}
}
};

hide_error = function( delayed, fast ) {
var error_container = $('#draft-error');
hideError = function( delayed, fast ) {
var errorContainer = $( '#draft-error' );

if ( delayed ) {
error_container = error_container.delay( 4000 );
errorContainer = errorContainer.delay( 4000 );
}

return error_container
return errorContainer
.fadeOut( fast ? 'fast' : 'slow' )
.promise()
.done( function() { $( '#draft-error' ).remove(); } );
.done( function() {
$( '#draft-error' ).remove();
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This change doesn't make sense to me, why not keep it all in one line? Also, indentation seems off.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The autoindenter sometimes gets things wrong. Fixed.

} );
};

$('#feedbackform').submit(function( e ) {
$( '#feedbackform' ).submit(function( e ) {
e.preventDefault();

// Don't send empty feedback
if ( $textarea_feedback.val().length < DraftFeedback.minimum_feedback_length ) {
display_error(
if ( $textareaFeedback.val().length < DraftFeedback.minimum_feedback_length ) {
displayError(
'#feedback-text',
DraftFeedback.i18n.error_minimum_feedback_length,
'#feedback-text'
Expand All @@ -56,128 +58,136 @@ jQuery(document).ready(function($) {
url: DraftFeedback.ajaxurl,
data: {
action: 'add_feedback',
feedback: $textarea_feedback.val(),
feedback: $textareaFeedback.val(),
shareadraft: DraftFeedback.shareadraft,
nonce: DraftFeedback.nonce,
post_ID: DraftFeedback.post_ID
},
dataType: 'jsonp',
beforeSend: function() {

// Disable the button so it can't be clicked more than once to submit
$( '#feedbackform input:submit' )
.val( DraftFeedback.i18n.button_sending_feedback )
.attr( 'disabled', true );
},
success: function(data, status, xhr) {
success: function( data, status, xhr ) {
var promise;

if (data['error']) {
display_error('#feedback-text', data['error']);
if ( data.error ) {
displayError( '#feedback-text', data.error );
} else {

// Starting to fade out the first screen of the feedback interface
promise = $first_screen.fadeOut( 400 ).promise();
promise = $firstScreen.fadeOut( 400 ).promise();

promise.done(function(){
promise.done(function() {

// Fading is done, resetting the form and fading in the thank you screen
$textarea_feedback.val( '' );
$second_screen.fadeIn( 400 );
$textareaFeedback.val( '' );
$secondScreen.fadeIn( 400 );
});
}
},
error: function(xhr, status, error) {
display_error(
error: function( xhr, status, error ) {
displayError(
'#feedback-text',
DraftFeedback.i18n.error_message.replace( '{error}', error )
);
},
complete: function() {
$( '#feedbackform input:submit' )
.val( DraftFeedback.i18n.button_send_feedback )
.removeAttr( 'disabled ');
.removeAttr( 'disabled ' );
}
});
});
$( '#feedback-more' ).on( 'click', function( event ) {
var promise = $second_screen.fadeOut( 400 ).promise();
var promise = $secondScreen.fadeOut( 400 ).promise();

promise.done(function() {

// When the second screen is completely faded away, we start fading the first screen in
$first_screen.fadeIn( 400 ).promise().done(function() {
$firstScreen.fadeIn( 400 ).promise().done(function() {

// After the first screen is visible, we focus on the textarea
$textarea_feedback.focus();
$textareaFeedback.focus();
});
});
});
$textarea_feedback.focus();
$textareaFeedback.focus();
});

/**
* Feedback form interface controls
*/
jQuery(document).ready(function($) {
var feedback_textarea = $( '#feedbackform textarea' ),
$button_activate = $( '#draftfeedback-activate' ),
$block_floater = $( '#feedback-floater' ),
$block_intro = $( "#draftfeedback-intro" ),
$buttons_return = $( '.draftfeedback-return' ),
scroll_top_offset;

$( 'body' ).addClass('draftfeedback');
jQuery( document ).ready(function( $ ) {
var feedbackTextarea = $( '#feedbackform textarea' ),
$buttonActivate = $( '#draftfeedback-activate' ),
$blockFloater = $( '#feedback-floater' ),
$blockIntro = $( '#draftfeedback-intro' ),
$buttonsReturn = $( '.draftfeedback-return' ),
scrollTopOffset,
matcher,
resizeHandler,
sidebarHeight,
introHeight,
textareaHeight;

$( 'body' ).addClass( 'draftfeedback' );

// If the body width matches this media selector, the feedback helper
// will start in minimized state
var matcher = window.matchMedia( DraftFeedback.handheld_media_query );
matcher = window.matchMedia( DraftFeedback.handheld_media_query );

var resize_handler = function() {
resizeHandler = function() {

// For smaller screens the feedback textarea is located below the
// post, so no action is required.
if ( matcher.matches ) {
return;
return;
}

var sidebar_height = $( '.draftfeedback-feedback-form' ).height();
var intro_height = $( '.draftfeedback-intro' ).height();
var textarea_height = sidebar_height - intro_height;
feedback_textarea.css( 'height', (textarea_height - 130) + 'px' );
sidebarHeight = $( '.draftfeedback-feedback-form' ).height();
introHeight = $( '.draftfeedback-intro' ).height();
textareaHeight = sidebarHeight - introHeight;
feedbackTextarea.css( 'height', ( textareaHeight - 130 ) + 'px' );
};

$( window ).resize( resize_handler );
resize_handler();
$( window ).resize( resizeHandler );
resizeHandler();

// Clicking the activate button should take us to the form
$button_activate.on( 'click', function( event ) {
scroll_top_offset = $( window ).scrollTop();
$buttons_return.show();
$buttonActivate.on( 'click', function( event ) {
scrollTopOffset = $( window ).scrollTop();
$buttonsReturn.show();
$( 'html, body' ).animate({
scrollTop: $( "#draftfeedback-intro" ).offset().top
scrollTop: $( '#draftfeedback-intro' ).offset().top
}, 400 );
});

// Clicking the return button should take us to where we were
$buttons_return.on( 'click', function( event) {
$buttonsReturn.on( 'click', function( event ) {
$( 'html, body' ).animate({
scrollTop: scroll_top_offset
scrollTop: scrollTopOffset
}, 400 );
});

// The feedback floater block should get hidden when the
// window is scrolled down to the form
$( window ).on( 'scroll resize', function() {
var offset;

if ( ! matcher.matches ) {
return;
return;
}

var offset = $block_intro.offset().top - window.innerHeight;
offset = $blockIntro.offset().top - window.innerHeight;

if ( $( window ).scrollTop() > offset ) {
$block_floater.fadeOut( 'fast' );
$blockFloater.fadeOut( 'fast' );
} else {
$block_floater.fadeIn( 'fast' );
$blockFloater.fadeIn( 'fast' );
}
});
});
Expand Down
Loading