bp_core_add_cropper_inline_js

Output the inline JS needed for the cropper to work on a per-page basis.

Description

bp_core_add_cropper_inline_js(); 

Usage

  1. if ( !function_exists( 'bp_core_add_cropper_inline_js' ) ) { 
  2. require_once ABSPATH . PLUGINDIR . 'buddypress/bp-core/bp-core-cssjs.php'; 
  3.  
  4.  
  5. // NOTICE! Understand what this does before running. 
  6. $result = bp_core_add_cropper_inline_js(); 
  7.  

Defined (1)

The function is defined in the following location(s).

/bp-core/bp-core-cssjs.php  
  1. function bp_core_add_cropper_inline_js() { 
  2.  
  3. /** 
  4. * Filters the return value of getimagesize to determine if an image was uploaded. 
  5. * @since 1.1.0 
  6. * @param array $value Array of data found by getimagesize. 
  7. */ 
  8. $image = apply_filters( 'bp_inline_cropper_image', getimagesize( bp_core_avatar_upload_path() .buddypress)->avatar_admin->image->dir ) ); 
  9. if ( empty( $image ) ) { 
  10. return; 
  11.  
  12. // Get avatar full width and height. 
  13. $full_height = bp_core_avatar_full_height(); 
  14. $full_width = bp_core_avatar_full_width(); 
  15.  
  16. // Calculate Aspect Ratio. 
  17. if ( !empty( $full_height ) && ( $full_width != $full_height ) ) { 
  18. $aspect_ratio = $full_width / $full_height; 
  19. } else { 
  20. $aspect_ratio = 1; 
  21.  
  22. // Default cropper coordinates. 
  23. // Smaller than full-width: cropper defaults to entire image. 
  24. if ( $image[0] < $full_width ) { 
  25. $crop_left = 0; 
  26. $crop_right = $image[0]; 
  27.  
  28. // Less than 2x full-width: cropper defaults to full-width. 
  29. } elseif ( $image[0] < ( $full_width * 2 ) ) { 
  30. $padding_w = round( ( $image[0] - $full_width ) / 2 ); 
  31. $crop_left = $padding_w; 
  32. $crop_right = $image[0] - $padding_w; 
  33.  
  34. // Larger than 2x full-width: cropper defaults to 1/2 image width. 
  35. } else { 
  36. $crop_left = round( $image[0] / 4 ); 
  37. $crop_right = $image[0] - $crop_left; 
  38.  
  39. // Smaller than full-height: cropper defaults to entire image. 
  40. if ( $image[1] < $full_height ) { 
  41. $crop_top = 0; 
  42. $crop_bottom = $image[1]; 
  43.  
  44. // Less than double full-height: cropper defaults to full-height. 
  45. } elseif ( $image[1] < ( $full_height * 2 ) ) { 
  46. $padding_h = round( ( $image[1] - $full_height ) / 2 ); 
  47. $crop_top = $padding_h; 
  48. $crop_bottom = $image[1] - $padding_h; 
  49.  
  50. // Larger than 2x full-height: cropper defaults to 1/2 image height. 
  51. } else { 
  52. $crop_top = round( $image[1] / 4 ); 
  53. $crop_bottom = $image[1] - $crop_top; 
  54.  
  55. ?> 
  56.  
  57. <script type="text/javascript"> 
  58. jQuery(window).load( function() { 
  59. jQuery('#avatar-to-crop').Jcrop({ 
  60. onChange: showPreview,  
  61. onSelect: updateCoords,  
  62. aspectRatio: <?php echo (int) $aspect_ratio; ?>,  
  63. setSelect: [ <?php echo (int) $crop_left; ?>, <?php echo (int) $crop_top; ?>, <?php echo (int) $crop_right; ?>, <?php echo (int) $crop_bottom; ?> ] 
  64. }); 
  65. }); 
  66.  
  67. function updateCoords(c) { 
  68. jQuery('#x').val(c.x); 
  69. jQuery('#y').val(c.y); 
  70. jQuery('#w').val(c.w); 
  71. jQuery('#h').val(c.h); 
  72.  
  73. function showPreview(coords) { 
  74. if ( parseInt(coords.w) > 0 ) { 
  75. var fw = <?php echo (int) $full_width; ?>; 
  76. var fh = <?php echo (int) $full_height; ?>; 
  77. var rx = fw / coords.w; 
  78. var ry = fh / coords.h; 
  79.  
  80. jQuery( '#avatar-crop-preview' ).css({ 
  81. width: Math.round(rx * <?php echo (int) $image[0]; ?>) + 'px',  
  82. height: Math.round(ry * <?php echo (int) $image[1]; ?>) + 'px',  
  83. marginLeft: '-' + Math.round(rx * coords.x) + 'px',  
  84. marginTop: '-' + Math.round(ry * coords.y) + 'px' 
  85. }); 
  86. </script> 
  87.  
  88. <?php