Contents

Code Reference Functions bp_core_add_cropper_inline_js()

bp_core_add_cropper_inline_js()

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

Description

Source

File: bp-core/bp-core-cssjs.php

441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
function bp_core_add_cropper_inline_js() {
 
    /**
     * Filters the return value of getimagesize to determine if an image was uploaded.
     *
     * @since BuddyPress 1.1.0
     *
     * @param array $value Array of data found by getimagesize.
     */
    $image = apply_filters( 'bp_inline_cropper_image', getimagesize( bp_core_avatar_upload_path() . buddypress()->avatar_admin->image->dir ) );
    if ( empty( $image ) ) {
        return;
    }
 
    // Get avatar full width and height.
    $full_height = bp_core_avatar_full_height();
    $full_width  = bp_core_avatar_full_width();
 
    // Calculate Aspect Ratio.
    if ( !empty( $full_height ) && ( $full_width != $full_height ) ) {
        $aspect_ratio = $full_width / $full_height;
    } else {
        $aspect_ratio = 1;
    }
 
    // Default cropper coordinates.
    // Smaller than full-width: cropper defaults to entire image.
    if ( $image[0] < $full_width ) {
        $crop_left  = 0;
        $crop_right = $image[0];
 
    // Less than 2x full-width: cropper defaults to full-width.
    } elseif ( $image[0] < ( $full_width * 2 ) ) {
        $padding_w  = round( ( $image[0] - $full_width ) / 2 );
        $crop_left  = $padding_w;
        $crop_right = $image[0] - $padding_w;
 
    // Larger than 2x full-width: cropper defaults to 1/2 image width.
    } else {
        $crop_left  = round( $image[0] / 4 );
        $crop_right = $image[0] - $crop_left;
    }
 
    // Smaller than full-height: cropper defaults to entire image.
    if ( $image[1] < $full_height ) {
        $crop_top    = 0;
        $crop_bottom = $image[1];
 
    // Less than double full-height: cropper defaults to full-height.
    } elseif ( $image[1] < ( $full_height * 2 ) ) {
        $padding_h   = round( ( $image[1] - $full_height ) / 2 );
        $crop_top    = $padding_h;
        $crop_bottom = $image[1] - $padding_h;
 
    // Larger than 2x full-height: cropper defaults to 1/2 image height.
    } else {
        $crop_top    = round( $image[1] / 4 );
        $crop_bottom = $image[1] - $crop_top;
    }
 
    ?>
 
    <script>
        jQuery(window).load( function(){
            jQuery('#avatar-to-crop').Jcrop({
                onChange: showPreview,
                onSelect: updateCoords,
                aspectRatio: <?php echo (int) $aspect_ratio; ?>,
                setSelect: [ <?php echo (int) $crop_left; ?>, <?php echo (int) $crop_top; ?>, <?php echo (int) $crop_right; ?>, <?php echo (int) $crop_bottom; ?> ]
            });
        });
 
        function updateCoords(c) {
            jQuery('#x').val(c.x);
            jQuery('#y').val(c.y);
            jQuery('#w').val(c.w);
            jQuery('#h').val(c.h);
        }
 
        function showPreview(coords) {
            if ( parseInt(coords.w) > 0 ) {
                var fw = <?php echo (int) $full_width; ?>;
                var fh = <?php echo (int) $full_height; ?>;
                var rx = fw / coords.w;
                var ry = fh / coords.h;
 
                jQuery( '#avatar-crop-preview' ).css({
                    width: Math.round(rx * <?php echo (int) $image[0]; ?>) + 'px',
                    height: Math.round(ry * <?php echo (int) $image[1]; ?>) + 'px',
                    marginLeft: '-' + Math.round(rx * coords.x) + 'px',
                    marginTop: '-' + Math.round(ry * coords.y) + 'px'
                });
            }
        }
    </script>
 
<?php
}

Expand full source code Collapse full source code

Changelog

Changelog
Version Description
BuddyPress 1.1.0 Introduced.

Uses

Uses
Uses Description
bp-loader.php: buddypress()

The main function responsible for returning the one true BuddyBoss Instance to functions everywhere.
bp-core/bp-core-cssjs.php: bp_inline_cropper_image

Filters the return value of getimagesize to determine if an image was uploaded.
bp-core/bp-core-avatars.php: bp_core_avatar_full_height()

Get the ‘full’ avatar height setting.
bp-core/bp-core-avatars.php: bp_core_avatar_full_width()

Get the ‘full’ avatar width setting.
bp-core/bp-core-avatars.php: bp_core_avatar_upload_path()

Get the absolute upload path for the WP installation.

Questions?

We're always happy to help with code or other questions you might have! Search our developer docs, contact support, or connect with our sales team.