[Summary view] [Print] [Text view]

   1  <?php
   2  /**
   3   * Core component CSS & JS.
   4   *
   5   * @package BuddyPress
   6   * @subpackage Core
   7   * @since 1.0.0
   8   */
   9  
  10  // Exit if accessed directly.
  11  defined( 'ABSPATH' ) || exit;
  12  
  13  /**
  14   * Register scripts commonly used by BuddyPress.
  15   *
  16   * @since 2.1.0
  17   */
  18  function bp_core_register_common_scripts() {
  19      $min = bp_core_get_minified_asset_suffix();
  20      $url = buddypress()->plugin_url . 'bp-core/js/';
  21  
  22      /*
  23       * Moment.js locale.
  24       *
  25       * Try to map current WordPress locale to a moment.js locale file for loading.
  26       *
  27       * eg. French (France) locale for WP is fr_FR. Here, we try to find fr-fr.js
  28       *     (this file doesn't exist).
  29       */
  30      $wp_locale = sanitize_file_name( strtolower( get_locale() ) );
  31  
  32      // WP uses ISO 639-2 or -3 codes for some locales, which we must translate back to ISO 639-1.
  33      $iso_locales = array(
  34          'bel' => 'be',
  35          'bre' => 'br',
  36          'kir' => 'ky',
  37          'mri' => 'mi',
  38          'ssw' => 'ss',
  39      );
  40  
  41      if ( isset( $iso_locales[ $wp_locale ] ) ) {
  42          $locale = $iso_locales[ $wp_locale ];
  43      } else {
  44          $locale = $wp_locale;
  45      }
  46  
  47      $locale = str_replace( '_', '-', $locale );
  48      if ( file_exists( buddypress()->core->path . "bp-core/js/vendor/moment-js/locale/{$locale}{$min}.js" ) ) {
  49          $moment_locale_url = $url . "vendor/moment-js/locale/{$locale}{$min}.js";
  50  
  51      /*
  52       * Try to find the short-form locale.
  53       *
  54       * eg. French (France) locale for WP is fr_FR. Here, we try to find fr.js
  55       *     (this exists).
  56       */
  57      } else {
  58          $locale = substr( $locale, 0, strpos( $locale, '-' ) );
  59          if ( file_exists( buddypress()->core->path . "bp-core/js/vendor/moment-js/locale/{$locale}{$min}.js" ) ) {
  60              $moment_locale_url = $url . "vendor/moment-js/locale/{$locale}{$min}.js";
  61          }
  62      }
  63  
  64      // Set up default scripts to register.
  65      $scripts = array(
  66          // Legacy.
  67          'bp-confirm'        => array( 'file' => "{$url}confirm{$min}.js", 'dependencies' => array( 'jquery' ), 'footer' => false ),
  68          'bp-widget-members' => array( 'file' => "{$url}widget-members{$min}.js", 'dependencies' => array( 'jquery' ), 'footer' => false ),
  69          'bp-jquery-query'   => array( 'file' => "{$url}jquery-query{$min}.js", 'dependencies' => array( 'jquery' ), 'footer' => false ),
  70          'bp-jquery-cookie'  => array( 'file' => "{$url}vendor/jquery-cookie{$min}.js", 'dependencies' => array( 'jquery' ), 'footer' => false ),
  71          'bp-jquery-scroll-to' => array( 'file' => "{$url}vendor/jquery-scroll-to{$min}.js", 'dependencies' => array( 'jquery' ), 'footer' => false ),
  72  
  73          // Version 2.1.
  74          'jquery-caret' => array( 'file' => "{$url}vendor/jquery.caret{$min}.js", 'dependencies' => array( 'jquery' ), 'footer' => true ),
  75          'jquery-atwho' => array( 'file' => "{$url}vendor/jquery.atwho{$min}.js", 'dependencies' => array( 'jquery', 'jquery-caret' ), 'footer' => true ),
  76  
  77          // Version 2.3.
  78          'bp-plupload' => array( 'file' => "{$url}bp-plupload{$min}.js", 'dependencies' => array( 'plupload', 'jquery', 'json2', 'wp-backbone' ), 'footer' => true ),
  79          'bp-avatar'   => array( 'file' => "{$url}avatar{$min}.js", 'dependencies' => array( 'jcrop' ), 'footer' => true ),
  80          'bp-webcam'   => array( 'file' => "{$url}webcam{$min}.js", 'dependencies' => array( 'bp-avatar' ), 'footer' => true ),
  81  
  82          // Version 2.4.
  83          'bp-cover-image' => array( 'file' => "{$url}cover-image{$min}.js", 'dependencies' => array(), 'footer' => true ),
  84  
  85          // Version 2.7.
  86          'bp-moment'    => array( 'file' => "{$url}vendor/moment-js/moment{$min}.js", 'dependencies' => array(), 'footer' => true ),
  87          'bp-livestamp' => array( 'file' => "{$url}vendor/livestamp{$min}.js", 'dependencies' => array( 'jquery', 'bp-moment' ), 'footer' => true ),
  88  
  89          // Version 9.0.
  90          'bp-dynamic-widget-block-script' => array( 'file' => "{$url}dynamic-widget-block.js", 'dependencies' => array( 'lodash', 'wp-url' ), 'footer' => true ),
  91      );
  92  
  93      // Version 2.7 - Add Moment.js locale to our $scripts array if we found one.
  94      if ( isset( $moment_locale_url ) ) {
  95          $scripts['bp-moment-locale'] = array( 'file' => esc_url( $moment_locale_url ), 'dependencies' => array( 'bp-moment' ), 'footer' => true );
  96      }
  97  
  98      /**
  99       * Filters the BuddyPress Core javascript files to register.
 100       *
 101       * Default handles include 'bp-confirm', 'bp-widget-members',
 102       * 'bp-jquery-query', 'bp-jquery-cookie', and 'bp-jquery-scroll-to'.
 103       *
 104       * @since 2.1.0 'jquery-caret', 'jquery-atwho' added.
 105       * @since 2.3.0 'bp-plupload', 'bp-avatar', 'bp-webcam' added.
 106       * @since 2.4.0 'bp-cover-image' added.
 107       * @since 2.7.0 'bp-moment', 'bp-livestamp' added.
 108       *              'bp-moment-locale' is added conditionally if a moment.js locale file is found.
 109       *
 110       * @param array $value Array of javascript file information to register.
 111       */
 112      $scripts = apply_filters( 'bp_core_register_common_scripts', $scripts );
 113  
 114  
 115      $version = bp_get_version();
 116      foreach ( $scripts as $id => $script ) {
 117          wp_register_script( $id, $script['file'], $script['dependencies'], $version, $script['footer'] );
 118      }
 119  }
 120  add_action( 'bp_enqueue_scripts',       'bp_core_register_common_scripts', 1 );
 121  add_action( 'bp_admin_enqueue_scripts', 'bp_core_register_common_scripts', 1 );
 122  
 123  /**
 124   * Register styles commonly used by BuddyPress.
 125   *
 126   * @since 2.1.0
 127   */
 128  function bp_core_register_common_styles() {
 129      $min = bp_core_get_minified_asset_suffix();
 130      $url = buddypress()->plugin_url . 'bp-core/css/';
 131  
 132      /**
 133       * Filters the URL for the Admin Bar stylesheet.
 134       *
 135       * @since 1.1.0
 136       *
 137       * @param string $value URL for the Admin Bar stylesheet.
 138       */
 139      $admin_bar_file = apply_filters( 'bp_core_admin_bar_css', "{$url}admin-bar{$min}.css" );
 140  
 141      /**
 142       * Filters the BuddyPress Core stylesheet files to register.
 143       *
 144       * @since 2.1.0
 145       *
 146       * @param array $value Array of stylesheet file information to register.
 147       */
 148      $styles = apply_filters( 'bp_core_register_common_styles', array(
 149          'bp-admin-bar' => array(
 150              'file'         => $admin_bar_file,
 151              'dependencies' => array( 'admin-bar' )
 152          ),
 153          'bp-avatar' => array(
 154              'file'         => "{$url}avatar{$min}.css",
 155              'dependencies' => array( 'jcrop' )
 156          ),
 157      ) );
 158  
 159      foreach ( $styles as $id => $style ) {
 160          wp_register_style( $id, $style['file'], $style['dependencies'], bp_get_version() );
 161  
 162          wp_style_add_data( $id, 'rtl', 'replace' );
 163          if ( $min ) {
 164              wp_style_add_data( $id, 'suffix', $min );
 165          }
 166      }
 167  }
 168  add_action( 'bp_enqueue_scripts',       'bp_core_register_common_styles', 1 );
 169  add_action( 'bp_admin_enqueue_scripts', 'bp_core_register_common_styles', 1 );
 170  
 171  /**
 172   * Load the JS for "Are you sure?" confirm links.
 173   *
 174   * @since 1.1.0
 175   */
 176  function bp_core_confirmation_js() {
 177      if ( is_multisite() && ! bp_is_root_blog() ) {
 178          return false;
 179      }
 180  
 181      wp_enqueue_script( 'bp-confirm' );
 182  
 183      wp_localize_script( 'bp-confirm', 'BP_Confirm', array(
 184          'are_you_sure' => __( 'Are you sure?', 'buddypress' ),
 185      ) );
 186  
 187  }
 188  add_action( 'bp_enqueue_scripts',       'bp_core_confirmation_js' );
 189  add_action( 'bp_admin_enqueue_scripts', 'bp_core_confirmation_js' );
 190  
 191  /**
 192   * Enqueues the css and js required by the Avatar UI.
 193   *
 194   * @since 2.3.0
 195   */
 196  function bp_core_avatar_scripts() {
 197      if ( ! bp_avatar_is_front_edit() ) {
 198          return false;
 199      }
 200  
 201      // Enqueue the Attachments scripts for the Avatar UI.
 202      bp_attachments_enqueue_scripts( 'BP_Attachment_Avatar' );
 203  
 204      // Add Some actions for Theme backcompat.
 205      add_action( 'bp_after_profile_avatar_upload_content', 'bp_avatar_template_check' );
 206      add_action( 'bp_after_group_admin_content',           'bp_avatar_template_check' );
 207      add_action( 'bp_after_group_avatar_creation_step',    'bp_avatar_template_check' );
 208  }
 209  add_action( 'bp_enqueue_scripts', 'bp_core_avatar_scripts' );
 210  
 211  /**
 212   * Enqueues the css and js required by the Cover Image UI.
 213   *
 214   * @since 2.4.0
 215   */
 216  function bp_core_cover_image_scripts() {
 217      if ( ! bp_attachments_cover_image_is_edit() ) {
 218          return false;
 219      }
 220  
 221      // Enqueue the Attachments scripts for the Cover Image UI.
 222      bp_attachments_enqueue_scripts( 'BP_Attachment_Cover_Image' );
 223  }
 224  add_action( 'bp_enqueue_scripts', 'bp_core_cover_image_scripts' );
 225  
 226  /**
 227   * Enqueues jCrop library and hooks BP's custom cropper JS.
 228   *
 229   * @since 1.1.0
 230   */
 231  function bp_core_add_jquery_cropper() {
 232      wp_enqueue_style( 'jcrop' );
 233      wp_enqueue_script( 'jcrop', array( 'jquery' ) );
 234      add_action( 'wp_head', 'bp_core_add_cropper_inline_js' );
 235      add_action( 'wp_head', 'bp_core_add_cropper_inline_css' );
 236  }
 237  
 238  /**
 239   * Output the inline JS needed for the cropper to work on a per-page basis.
 240   *
 241   * @since 1.1.0
 242   */
 243  function bp_core_add_cropper_inline_js() {
 244  
 245      /**
 246       * Filters the return value of getimagesize to determine if an image was uploaded.
 247       *
 248       * @since 1.1.0
 249       *
 250       * @param array $value Array of data found by getimagesize.
 251       */
 252      $image = apply_filters( 'bp_inline_cropper_image', getimagesize( bp_core_avatar_upload_path() . buddypress()->avatar_admin->image->dir ) );
 253      if ( empty( $image ) ) {
 254          return;
 255      }
 256  
 257      // Get avatar full width and height.
 258      $full_height = bp_core_avatar_full_height();
 259      $full_width  = bp_core_avatar_full_width();
 260  
 261      // Calculate Aspect Ratio.
 262      if ( !empty( $full_height ) && ( $full_width != $full_height ) ) {
 263          $aspect_ratio = $full_width / $full_height;
 264      } else {
 265          $aspect_ratio = 1;
 266      }
 267  
 268      // Default cropper coordinates.
 269      // Smaller than full-width: cropper defaults to entire image.
 270      if ( $image[0] < $full_width ) {
 271          $crop_left  = 0;
 272          $crop_right = $image[0];
 273  
 274      // Less than 2x full-width: cropper defaults to full-width.
 275      } elseif ( $image[0] < ( $full_width * 2 ) ) {
 276          $padding_w  = round( ( $image[0] - $full_width ) / 2 );
 277          $crop_left  = $padding_w;
 278          $crop_right = $image[0] - $padding_w;
 279  
 280      // Larger than 2x full-width: cropper defaults to 1/2 image width.
 281      } else {
 282          $crop_left  = round( $image[0] / 4 );
 283          $crop_right = $image[0] - $crop_left;
 284      }
 285  
 286      // Smaller than full-height: cropper defaults to entire image.
 287      if ( $image[1] < $full_height ) {
 288          $crop_top    = 0;
 289          $crop_bottom = $image[1];
 290  
 291      // Less than double full-height: cropper defaults to full-height.
 292      } elseif ( $image[1] < ( $full_height * 2 ) ) {
 293          $padding_h   = round( ( $image[1] - $full_height ) / 2 );
 294          $crop_top    = $padding_h;
 295          $crop_bottom = $image[1] - $padding_h;
 296  
 297      // Larger than 2x full-height: cropper defaults to 1/2 image height.
 298      } else {
 299          $crop_top    = round( $image[1] / 4 );
 300          $crop_bottom = $image[1] - $crop_top;
 301      }
 302  
 303      ?>
 304  
 305      <script type="text/javascript">
 306          jQuery( window ).on( 'load', function() {
 307              jQuery( '#avatar-to-crop' ).Jcrop( {
 308                  onChange: showPreview,
 309                  onSelect: updateCoords,
 310                  aspectRatio: <?php echo (int) $aspect_ratio; ?>,
 311                  setSelect: [ <?php echo (int) $crop_left; ?>, <?php echo (int) $crop_top; ?>, <?php echo (int) $crop_right; ?>, <?php echo (int) $crop_bottom; ?> ]
 312              } );
 313          } );
 314  
 315  		function updateCoords(c) {
 316              jQuery('#x').val(c.x);
 317              jQuery('#y').val(c.y);
 318              jQuery('#w').val(c.w);
 319              jQuery('#h').val(c.h);
 320          }
 321  
 322  		function showPreview(coords) {
 323              if ( parseInt(coords.w) > 0 ) {
 324                  var fw = <?php echo (int) $full_width; ?>;
 325                  var fh = <?php echo (int) $full_height; ?>;
 326                  var rx = fw / coords.w;
 327                  var ry = fh / coords.h;
 328  
 329                  jQuery( '#avatar-crop-preview' ).css({
 330                      width: Math.round(rx * <?php echo (int) $image[0]; ?>) + 'px',
 331                      height: Math.round(ry * <?php echo (int) $image[1]; ?>) + 'px',
 332                      marginLeft: '-' + Math.round(rx * coords.x) + 'px',
 333                      marginTop: '-' + Math.round(ry * coords.y) + 'px'
 334                  });
 335              }
 336          }
 337      </script>
 338  
 339  <?php
 340  }
 341  
 342  /**
 343   * Output the inline CSS for the BP image cropper.
 344   *
 345   * @since 1.1.0
 346   */
 347  function bp_core_add_cropper_inline_css() {
 348  ?>
 349  
 350      <style type="text/css">
 351          .jcrop-holder { float: left; margin: 0 20px 20px 0; text-align: left; }
 352          #avatar-crop-pane { width: <?php echo bp_core_avatar_full_width() ?>px; height: <?php echo bp_core_avatar_full_height() ?>px; overflow: hidden; }
 353          #avatar-crop-submit { margin: 20px 0; }
 354          .jcrop-holder img,
 355          #avatar-crop-pane img,
 356          #avatar-upload-form img,
 357          #create-group-form img,
 358          #group-settings-form img { border: none !important; max-width: none !important; }
 359      </style>
 360  
 361  <?php
 362  }
 363  
 364  /**
 365   * Define the 'ajaxurl' JS variable, used by themes as an AJAX endpoint.
 366   *
 367   * @since 1.1.0
 368   */
 369  function bp_core_add_ajax_url_js() {
 370  ?>
 371  
 372      <script type="text/javascript">var ajaxurl = '<?php echo bp_core_ajax_url(); ?>';</script>
 373  
 374  <?php
 375  }
 376  add_action( 'wp_head', 'bp_core_add_ajax_url_js' );
 377  
 378  /**
 379   * Get the proper value for BP's ajaxurl.
 380   *
 381   * Designed to be sensitive to FORCE_SSL_ADMIN and non-standard multisite
 382   * configurations.
 383   *
 384   * @since 1.7.0
 385   *
 386   * @return string AJAX endpoint URL.
 387   */
 388  function bp_core_ajax_url() {
 389  
 390      /**
 391       * Filters the proper value for BuddyPress' ajaxurl.
 392       *
 393       * @since 1.7.0
 394       *
 395       * @param string $value Proper ajaxurl value for BuddyPress.
 396       */
 397      return apply_filters( 'bp_core_ajax_url', admin_url( 'admin-ajax.php', is_ssl() ? 'admin' : 'http' ) );
 398  }
 399  
 400  /**
 401   * Get the JavaScript dependencies for buddypress.js.
 402   *
 403   * @since 2.0.0
 404   *
 405   * @return array The JavaScript dependencies.
 406   */
 407  function bp_core_get_js_dependencies() {
 408  
 409      /**
 410       * Filters the javascript dependencies for buddypress.js.
 411       *
 412       * @since 2.0.0
 413       *
 414       * @param array $value Array of javascript dependencies for buddypress.js.
 415       */
 416      return apply_filters( 'bp_core_get_js_dependencies', array(
 417          'jquery',
 418          'bp-confirm',
 419          'bp-widget-members',
 420          'bp-jquery-query',
 421          'bp-jquery-cookie',
 422          'bp-jquery-scroll-to'
 423      ) );
 424  }
 425  
 426  /**
 427   * Add inline css to display the component's single item cover image.
 428   *
 429   * @since 2.4.0
 430   *
 431   * @param bool $return True to get the inline css.
 432   * @return null|array|false The inline css or an associative array containing
 433   *                          the css rules and the style handle.
 434   */
 435  function bp_add_cover_image_inline_css( $return = false ) {
 436      $bp = buddypress();
 437  
 438      // Find the component of the current item.
 439      if ( bp_is_user() ) {
 440  
 441          // User is not allowed to upload cover images
 442          // no need to carry on.
 443          if ( bp_disable_cover_image_uploads() ) {
 444              return;
 445          }
 446  
 447          $cover_image_object = array(
 448              'component' => 'members',
 449              'object' => $bp->displayed_user
 450          );
 451      } elseif ( bp_is_group() ) {
 452  
 453          // Users are not allowed to upload cover images for their groups
 454          // no need to carry on.
 455          if ( bp_disable_group_cover_image_uploads() ) {
 456              return;
 457          }
 458  
 459          $cover_image_object = array(
 460              'component' =>'groups',
 461              'object' => $bp->groups->current_group
 462          );
 463      } else {
 464          $cover_image_object = apply_filters( 'bp_current_cover_image_object_inline_css', array() );
 465      }
 466  
 467      // Bail if no component were found.
 468      if ( empty( $cover_image_object['component'] ) || empty( $cover_image_object['object'] ) || ! bp_is_active( $cover_image_object['component'], 'cover_image' ) ) {
 469          return;
 470      }
 471  
 472      // Get the settings of the cover image feature for the current component.
 473      $params = bp_attachments_get_cover_image_settings( $cover_image_object['component'] );
 474  
 475      // Bail if no params.
 476      if ( empty( $params ) ) {
 477          return;
 478      }
 479  
 480      // Try to call the callback.
 481      if ( is_callable( $params['callback'] ) ) {
 482  
 483          $object_dir = $cover_image_object['component'];
 484  
 485          if ( 'members' === $object_dir ) {
 486              $object_dir = 'members';
 487          }
 488  
 489          $cover_image = bp_attachments_get_attachment( 'url', array(
 490              'object_dir' => $object_dir,
 491              'item_id'    => $cover_image_object['object']->id,
 492          ) );
 493  
 494          if ( empty( $cover_image ) ) {
 495              if ( ! empty( $params['default_cover'] ) ) {
 496                  $cover_image = $params['default_cover'];
 497              }
 498          }
 499  
 500          $inline_css = call_user_func_array( $params['callback'], array( array(
 501              'cover_image' => esc_url_raw( $cover_image ),
 502              'component'   => sanitize_key( $cover_image_object['component'] ),
 503              'object_id'   => (int) $cover_image_object['object']->id,
 504              'width'       => (int) $params['width'],
 505              'height'      => (int) $params['height'],
 506          ) ) );
 507  
 508          // Finally add the inline css to the handle.
 509          if ( ! empty( $inline_css ) ) {
 510  
 511              // Used to get the css when Ajax setting the cover image.
 512              if ( true === $return ) {
 513                  return array(
 514                      'css_rules' => '<style type="text/css">' . "\n" . $inline_css . "\n" . '</style>',
 515                      'handle'    => $params['theme_handle'],
 516                  );
 517              }
 518  
 519              wp_add_inline_style( $params['theme_handle'], $inline_css );
 520          } else {
 521              return false;
 522          }
 523      }
 524  }
 525  add_action( 'bp_enqueue_scripts', 'bp_add_cover_image_inline_css', 11 );
 526  
 527  /**
 528   * Enqueues livestamp.js on BuddyPress pages.
 529   *
 530   * @since 2.7.0
 531   */
 532  function bp_core_add_livestamp() {
 533      if ( ! is_buddypress() ) {
 534          return;
 535      }
 536  
 537      bp_core_enqueue_livestamp();
 538  }
 539  add_action( 'bp_enqueue_scripts', 'bp_core_add_livestamp' );
 540  
 541  /**
 542   * Enqueue and localize livestamp.js script.
 543   *
 544   * @since 2.7.0
 545   */
 546  function bp_core_enqueue_livestamp() {
 547      // If bp-livestamp isn't enqueued, do it now.
 548      if ( wp_script_is( 'bp-livestamp' ) ) {
 549          return;
 550      }
 551  
 552      /*
 553       * Only enqueue Moment.js locale if we registered it in
 554       * bp_core_register_common_scripts().
 555       */
 556      if ( wp_script_is( 'bp-moment-locale', 'registered' ) ) {
 557          wp_enqueue_script( 'bp-moment-locale' );
 558          wp_add_inline_script ( 'bp-livestamp', bp_core_moment_js_config() );
 559      }
 560  
 561      wp_enqueue_script( 'bp-livestamp' );
 562  }
 563  
 564  /**
 565   * Return moment.js config.
 566   *
 567   * @since 2.7.0
 568   *
 569   * @return string
 570   */
 571  function bp_core_moment_js_config() {
 572      // Grab the locale from the enqueued JS.
 573      $moment_locale = wp_scripts()->query( 'bp-moment-locale' );
 574      $moment_locale = substr( $moment_locale->src, strpos( $moment_locale->src, '/moment-js/locale/' ) + 18 );
 575      $moment_locale = str_replace( '.js', '', $moment_locale );
 576  
 577      $inline_js = <<<EOD
 578  jQuery(function() {
 579      moment.locale( '{$moment_locale}' );
 580  });
 581  EOD;
 582  
 583      return $inline_js;
 584  }