|
1 (function($) { |
|
2 $(document).ready(function() { |
|
3 var bgImage = $("#custom-background-image"), |
|
4 frame; |
|
5 |
|
6 $('#background-color').wpColorPicker({ |
|
7 change: function( event, ui ) { |
|
8 bgImage.css('background-color', ui.color.toString()); |
|
9 }, |
|
10 clear: function() { |
|
11 bgImage.css('background-color', ''); |
|
12 } |
|
13 }); |
|
14 |
|
15 $('input[name="background-position-x"]').change(function() { |
|
16 bgImage.css('background-position', $(this).val() + ' top'); |
|
17 }); |
|
18 |
|
19 $('input[name="background-repeat"]').change(function() { |
|
20 bgImage.css('background-repeat', $(this).val()); |
|
21 }); |
|
22 |
|
23 $('#choose-from-library-link').click( function( event ) { |
|
24 var $el = $(this); |
|
25 |
|
26 event.preventDefault(); |
|
27 |
|
28 // If the media frame already exists, reopen it. |
|
29 if ( frame ) { |
|
30 frame.open(); |
|
31 return; |
|
32 } |
|
33 |
|
34 // Create the media frame. |
|
35 frame = wp.media.frames.customBackground = wp.media({ |
|
36 // Set the title of the modal. |
|
37 title: $el.data('choose'), |
|
38 |
|
39 // Tell the modal to show only images. |
|
40 library: { |
|
41 type: 'image' |
|
42 }, |
|
43 |
|
44 // Customize the submit button. |
|
45 button: { |
|
46 // Set the text of the button. |
|
47 text: $el.data('update'), |
|
48 // Tell the button not to close the modal, since we're |
|
49 // going to refresh the page when the image is selected. |
|
50 close: false |
|
51 } |
|
52 }); |
|
53 |
|
54 // When an image is selected, run a callback. |
|
55 frame.on( 'select', function() { |
|
56 // Grab the selected attachment. |
|
57 var attachment = frame.state().get('selection').first(); |
|
58 |
|
59 // Run an AJAX request to set the background image. |
|
60 $.post( ajaxurl, { |
|
61 action: 'set-background-image', |
|
62 attachment_id: attachment.id, |
|
63 size: 'full' |
|
64 }).done( function() { |
|
65 // When the request completes, reload the window. |
|
66 window.location.reload(); |
|
67 }); |
|
68 }); |
|
69 |
|
70 // Finally, open the modal. |
|
71 frame.open(); |
|
72 }); |
|
73 }); |
|
74 })(jQuery); |