wp-admin/js/custom-header.js

   1 (function($) {
   2         var frame;
   3
   4         $( function() {
   5                 // Fetch available headers and apply jQuery.masonry
   6                 // once the images have loaded.
   7                 var $headers = $('.available-headers');
   8
   9                 $headers.imagesLoaded( function() {
  10                         $headers.masonry({
  11                                 itemSelector: '.default-header',
  12                                 isRTL: !! ( 'undefined' != typeof isRtl && isRtl )
  13                         });
  14                 });
  15
  16                 // Build the choose from library frame.
  17                 $('#choose-from-library-link').click( function( event ) {
  18                         var $el = $(this);
  19                         event.preventDefault();
  20
  21                         // If the media frame already exists, reopen it.
  22                         if ( frame ) {
  23                                 frame.open();
  24                                 return;
  25                         }
  26
  27                         // Create the media frame.
  28                         frame = wp.media.frames.customHeader = wp.media({
  29                                 // Set the title of the modal.
  30                                 title: $el.data('choose'),
  31
  32                                 // Tell the modal to show only images.
  33                                 library: {
  34                                         type: 'image'
  35                                 },
  36
  37                                 // Customize the submit button.
  38                                 button: {
  39                                         // Set the text of the button.
  40                                         text: $el.data('update'),
  41                                         // Tell the button not to close the modal, since we're
  42                                         // going to refresh the page when the image is selected.
  43                                         close: false
  44                                 }
  45                         });
  46
  47                         // When an image is selected, run a callback.
  48                         frame.on( 'select', function() {
  49                                 // Grab the selected attachment.
  50                                 var attachment = frame.state().get('selection').first(),
  51                                         link = $el.data('updateLink');
  52
  53                                 // Tell the browser to navigate to the crop step.
  54                                 window.location = link + '&file=' + attachment.id;
  55                         });
  56
  57                         frame.open();
  58                 });
  59         });
  60 }(jQuery));