Using buddypress avatar upload and crop function on another bp page

问题

Currently I am using BP Avatar to create user profile picture in the website.

Now, I want to use the upload and crop + preview function of BP Avatar for another page and another image purpose with custom settings also.

I have tried to copy and edit the code in the new page but it can't work, even the preview.

Hope someone can help.

Thankyou.

回答1:

Here is the code. I detect the problems start when bbp not detect the user because in the bbp core they get the user id from url, and in my case that dont work. I number the need pieces of code to accomplish. In my case i insert the view inside an endpoint to my-account from woocommerce.

override the function where scripts get the data.
include all the necessary scripts.
insert into my content function.

I use this filter to bp_attachment_avatar_script_data

    /**
     * Override  the avatar script data
     *
     * @param $script_data
     * @param $object
     *
     * @return int
     */
    public function noys_avatar_script_data( $script_data, $object ) {
        $user_id  = get_current_user_id();

        if ( ! empty( $user_id ) ) {
            // Should we load the the Webcam Avatar javascript file.
            if ( bp_avatar_use_webcam() ) {
                $script_data['extra_js'] = array_merge( $script_data['extra_js'], array( 'bp-webcam' ) );
            }

            $script_data['bp_params'] = array(
                'object'     => 'user',
                'item_id'    => $user_id,
                'has_avatar' => bp_get_user_has_avatar( $user_id ),
                'nonces'     => array(
                    'set'    => wp_create_nonce( 'bp_avatar_cropstore' ),
                    'remove' => wp_create_nonce( 'bp_delete_avatar_link' ),
                ),
            );

            // Set feedback messages.
            $script_data['feedback_messages'] = array(
                1 => __( 'There was a problem cropping your profile photo.', 'buddypress' ),
                2 => __( 'Your new profile photo was uploaded successfully.', 'buddypress' ),
                3 => __( 'There was a problem deleting your profile photo. Please try again.', 'buddypress' ),
                4 => __( 'Your profile photo was deleted successfully!', 'buddypress' ),
            );
        }

        return $script_data;
    }

And this is my function to include the content to woocommerce endpoint.

/**
 * Endpoint HTML content.
 */
public function profile_picture_endpoints_content1() {
    $bd = buddypress();
    bp_core_register_common_scripts();
    wp_enqueue_style( 'thickbox' );
    wp_enqueue_script( 'media-upload' );

    bp_core_add_jquery_cropper();

    bp_attachments_enqueue_scripts( 'BP_Attachment_Avatar' );
    bp_attachments_get_template_part( 'avatars/index' );
}

That is all i need to resolve this undocumented problem!

来源：https://stackoverflow.com/questions/39092028/using-buddypress-avatar-upload-and-crop-function-on-another-bp-page

标签

image

upload

crop

preview

buddypress