Post ID for theme ajax video thumbnail integration

This topic contains 2 reply and 2 voices, and was last updated by charles 10 years, 1 month ago
Viewing 2 Posts - 1 through 2 (of 2 total)
Author Posts
March 9, 2014 at 11:54 am 16308
charles I am currently using a theme with video thumbnails that are loaded by ajax when a url is entered into a custom field. I have modified it to work(somewhat) with this plugin but i'm running into issues with the post ID. On the backend the themes JS looks for the hidden field #post_ID to determine the current ID. Is there a way I can do the same thing with this plugin on the front end? I used the wpuf_add_post_form_top hook because its jS. my hook:

		function wpuf_get_vide_thumbnail( ) {
			if ( !class_exists( 'WPZOOM_Video_Thumb' ) ) require_once WPZOOM_INC . '/components/video-thumb.php';
			return WPZOOM_Video_Thumb::admin_newpost_front();
			
		}
		  
		add_action( 'wpuf_add_post_form_top', 'wpuf_get_vide_thumbnail' );
I know this is fairly complex but any pointers will be greatly appreciated.
March 9, 2014 at 11:58 am 16309
Tareq Hasan Tareq Hasan

Where does it looks for hidden field, on the whole page or anything in particular?

As you are using the hook, you could print a hidden field in your wpuf_get_vide_thumbnail function? May be that would work?

March 13, 2014 at 4:14 am 16533
charles charles

Ya it uses jQuery(‘#post_ID’).val() to find the id. I tried using ID; ?> instead but it keeps giving me the same ID for every new post.

Heres the entire JS incase it helps. Sorry for the length.

<script type="text/javascript">
			var wpzVideoUrlInputTimeout,
					//wpzValidIframeRegex = /<iframe[^>]* src="[^"]+"[^>]*><\/iframe>/i; // This isn't super strict... It just loosely checks to see if the string kinda looks like it contains an embed code.
					wpzValidIframeRegex = /(http:\/\/|https:\/\/)(m.youtube|www.youtube|www.vimeo|youtu|vimeo)/i; // This isn't super strict... It just loosely checks to see if the string kinda looks like it contains an embed code.

					jQuery(function($){
				$('<div id="wpz_autothumb"><small id="wpz_ajax_loading" style="display:none">Loading...</small><p id="wpz_autothumb_error" style="display:none"><?php _e('<strong>ERROR!</strong><br/>Either an invalid embed code was provided, or there is no thumbnail available for the specified video&hellip;<br/><small><strong>REMINDER:</strong> You can always manually upload a featured image via the WordPress Media Uploader.</small>', 'wpzoom'); ?></p><p id="wpzoom_autothumb_preview"><img src=""/><small id="wpz_usethis" class="button">Use This as the Featured Image</small></p></div>')
					.insertAfter('#wpzoom_post_embed_code');

				$('#wpzoom_autothumb_preview img').on('load', function(){
					$('#wpz_ajax_loading, #wpz_autothumb_error').hide();
					$('#wpzoom_autothumb_preview').animate({height:'show',opacity:'show'});
				});

				$('#wpzoom_post_embed_code').on('input', function(){
					clearTimeout(wpzVideoUrlInputTimeout);
					val = $.trim($('#wpzoom_post_embed_code').val());
					replace =0;
					if(val.indexOf('m.')) { val = val.replace('m.',''); replace++; }
					if(val.indexOf('/#')) { val = val.replace('/#',''); replace++; }
					if(replace > 0){
							jQuery('#wpzoom_post_embed_code').val(val); 
					}
					if('' != val && wpzValidIframeRegex.test(val)) {
						$('#wpz_ajax_loading').fadeIn();

						wpzVideoUrlInputTimeout = setTimeout(WPZVideoUrlOnInput, 1000);
						WPZUseThisOnClick();
					} else {
						$('#wpz_ajax_loading, #wpz_autothumb_error').hide();

						WPZRemovePreviewImage();
					}
				}).triggerHandler('input');

				$('#wpz_usethis').on('click', WPZUseThisOnClick);

				$('#postimagediv').on('click', '#remove-post-thumbnail', WPZEnableSetFeaturedButton);
			});

			// This is called onInput if an actual embed code is provided
			function WPZVideoUrlOnInput() {
				var embed = jQuery.trim(jQuery('#wpzoom_post_embed_code').val());
				
				jQuery.ajax({
					url: ajaxurl,
					type: 'post',
					data: { action: 'wpzoom_autothumb_get', wpzoom_autothumb_embedcode: embed, wpzoom_autothumb_postid: jQuery('#post_ID').val() },
					dataType: 'json',
					complete: function(xhr,status){
						var response = xhr.responseText;

						if(response == 'ERROR') {
							WPZRemovePreviewImage();
							jQuery('#wpz_ajax_loading').hide();
							jQuery('#wpz_autothumb_error').show();
							return;
						}

						response = jQuery.parseJSON(response);

						var thumb_url = typeof response.thumb_url !== 'undefined' ? response.thumb_url : '',
								is_featured = typeof response.is_already_featured !== 'undefined' ? response.is_already_featured : false;

						if(thumb_url != '') {
							jQuery('#wpzoom_autothumb_preview img').attr('src', '' + thumb_url);

							if(is_featured == true) {
								WPZDisableSetFeaturedButton();
							} else {
								WPZEnableSetFeaturedButton();
							}
						} else {
							WPZRemovePreviewImage();
						}

						return;
					}
				});

				jQuery.ajax({
					url: ajaxurl,
					type: 'post',
					data: { action: 'wpzoom_autotitle_get',wpzoom_autothumb_embedcode: embed },
					dataType: 'json',
					complete: function(xhr,status){
						var response = xhr.responseText;

						if(response == 'ERROR') {
							jQuery('#title').val('Error');
							return;
						}

						response = jQuery.parseJSON(response);
						
						
						var title = typeof response.title !== 'undefined' ? response.title : '',
								is_featured = typeof response.is_already_featured !== 'undefined' ? response.is_already_featured : false;

						if(title != '') {
							jQuery('#title').val(title);

						} else {
							jQuery('#title').val('no title');
						}

						return;
					}
				});

				return;
			}

			// This is called when the "Use This as the Featured Image" button is clicked
			function WPZUseThisOnClick() {
				if('' != (embed = jQuery.trim(jQuery('#wpzoom_post_embed_code').val()))) {
					jQuery.ajax({
						url: ajaxurl,
						type: 'post',
						data: {
						        action: 'wpzoom_autothumb_attach',
						        wpzoom_autothumb_embedcode: embed,
						        wpzoom_autothumb_postid: jQuery('#post_ID').val(),
						        wpzoom_autothumb_nonce: '<?php global $post; echo wp_create_nonce('wpzoom_attach_thumbnail-' . $post->ID); ?>'
									},
						dataType: 'text',
						complete: function(xhr,status){
							var response = jQuery.trim(xhr.responseText);

							if(response != 'false' && response > 0) {
								WPZSetAsThumbnail(response, '<?php echo wp_create_nonce('set_post_thumbnail-' . $post->ID); ?>');
							}

							return;
						}
					});
				}

				return;
			}

			// Enable the "Use This as the Featured Image" button
			function WPZEnableSetFeaturedButton() {
				jQuery('#wpz_usethis')
					.html('Use This as the Featured Image')
					.off('click', WPZUseThisOnClick)
					.on('click', WPZUseThisOnClick)
					.removeClass('button-disabled');
			}

			// Disable the "Use This as the Featured Image" button
			function WPZDisableSetFeaturedButton() {
				jQuery('#wpz_usethis')
					.html('This is the Featured Image')
					.off('click', WPZUseThisOnClick)
					.addClass('button-disabled');
			}

			// Hide/Remove the preview image
			function WPZRemovePreviewImage() {
				jQuery('#wpzoom_autothumb_preview').hide().removeAttr('src');
			}

			// Almost the same as the core WPSetAsThumbnail function
			function WPZSetAsThumbnail(id, nonce) {
				jQuery.post(ajaxurl, {
					action: 'set-post-thumbnail',
					post_id: jQuery('#post_ID').val(),
					thumbnail_id: id,
					_ajax_nonce: nonce,
					cookie: encodeURIComponent(document.cookie)
				}, function(str){
					var win = window.dialogArguments || opener || parent || top;

					if(str != '0') {
						win.WPSetThumbnailID(id);
						win.WPSetThumbnailHTML(str);
						WPZDisableSetFeaturedButton();
					}
				}
				);
			}
		</script>
Viewing 2 Posts - 1 through 2 (of 2 total)