Tweet to download js enqueues and inline javascript within a call to action templat

readme.md

Problems

wp_enqueue_script commands will not work in the admin_print_footer_scripts, but admin_print_footer_scripts is good for printing inline javascript code. wp_enqueue_script commands will work in the admin_enqueue_scripts hook, but get_current_screen() will not return any information from within the admin_enqueue_scripts hook.

Solutions

Break the enqueues and then inline js into two different hooks and methods using admin_print_footer_scripts for the inline js and admin_enqueue_scripts for the library enqueues.

In order to make sure we are only loading the js libraries on the call to action post type (without the use of get_current_screen()) we will have to use the global $post object, cause it is available inside the admin_enqueue_scripts hook:

/******
 * @ add a character counter to the tweet to download module
 * The code below uses two hooks to break the inline javascript a part from the enqueue   javascript 
 */


/**
*  Enqueue JS & CSS
*/
function cta_tweettodownload_enqueue_scripts() {
	global $post;
	if ( $post->post_type != 'wp-call-to-action' ) {
		return;
	}
	
	/* Get file locations */
	$key = basename(dirname(__FILE__));
	$this_path = WP_CTA_PATH.'templates/'.$key.'/';
	$url_path = WP_CTA_URLPATH.'templates/'.$key.'/';

	/* enqueue supportive scripts */
	wp_enqueue_script( 'jquery' );
	wp_enqueue_script( 'jquery-character-counter', $url_path . 'js/jqEasyCharCounter/jquery.jqEasyCharCounter.js', array('jquery'), '1.0', true );
	
}
add_action('admin_enqueue_scripts' , 'cta_tweettodownload_enqueue_scripts');

/**
*  Print inline js
*/
function cta_tweettodownload_print_admin_scripts() {

	$screen = get_current_screen();

	if ( !isset( $screen ) || $screen->id != 'wp-call-to-action' || $screen->parent_base != 'edit' ) {
	   return;
	}
	
	?>
	<script type="text/javascript">
		InboundQuery(document).ready(function($) {
			InboundQuery('.share-text .wp-call-to-action-option-td textarea').addClass('tweet-to-download-share-text');
			InboundQuery('.tweet-to-download-share-text').jqEasyCounter({
				maxChars: 120,                  // max number of characters
				maxCharsWarning: 100,           // max number of characters before warning is shown
				msgFontSize: '12px',            // css font size for counter
				msgFontColor: '#000000',        // css font color for counter
				msgFontFamily: 'Arial',         // css font family for counter
				msgTextAlign: 'right',          // css text-align for counter (left, right, center)
				msgWarningColor: '#FF0000',     // css font color for warning
				msgAppendMethod: 'insertAfter'  // position of counter relative to the input element(insertAfter, insertBefore)
			});
		});
	</script>

	<?php
}
add_action( 'admin_enqueue_scripts','cta_tweettodownload_print_admin_scripts' );

$() vrs. jQuery() vrs InboundQuery() when writing jquery code

In WordPress we experience a ton of javascript conflicts. More often then not using the $() method will throw conflict errors with something and over time it's been safer to use jQuery(). I'm not entirely sure what the problem is with all of it but even sometimes we find conflicts with jQuery(). So in order to try and further create a noconflict zone we are now using our own namespace InboundQuery. I'm not sure how or why it works but David has us wanting to use it and change it where we see it.

Regarding jQuery

since the library for the character count function is not written for WordPress, it used $() everywhere. For this reason I have modified the beginning of the function in the usual way jQuery(document).ready(function($)
When the library was enqueued in the enqueue class the character count worked perfectly after this modification so - one think - there should be no reason why the same library that used to work in another directory would stop working when moved. But we know that these things sometimes work in mysterious ways!

I'll try to change the whole library to use InboundQuery, at this point it worth trying.