root / drupal7 / sites / all / modules / media / js / media.js @ 5a4b9049
1 | 85ad3d82 | Assos Assos | /**
|
---|---|---|---|
2 | ca0757b9 | Assos Assos | * @file
|
3 | * Provides JavaScript additions to the media field widget.
|
||
4 | *
|
||
5 | * This file provides support for launching the media browser to select existing
|
||
6 | * files and disabling of other media fields during Ajax uploads (which prevents
|
||
7 | * separate media fields from accidentally attaching files).
|
||
8 | 85ad3d82 | Assos Assos | */
|
9 | |||
10 | (function ($) { |
||
11 | |||
12 | /**
|
||
13 | ca0757b9 | Assos Assos | * Attach behaviors to media element browse fields.
|
14 | 85ad3d82 | Assos Assos | */
|
15 | Drupal.behaviors.mediaElement = { |
||
16 | attach: function (context, settings) { |
||
17 | ca0757b9 | Assos Assos | if (settings.media && settings.media.elements) {
|
18 | $.each(settings.media.elements, function(selector) { |
||
19 | $(selector, context).once('media-browser-launch', function () { |
||
20 | var configuration = settings.media.elements[selector];
|
||
21 | // The user has JavaScript enabled, so display the browse field and hide
|
||
22 | // the upload and attach fields which are only used as a fallback in
|
||
23 | // case the user is unable to use the media browser.
|
||
24 | $(selector, context).children('.browse').show(); |
||
25 | $(selector, context).children('.upload').hide(); |
||
26 | $(selector, context).children('.attach').hide(); |
||
27 | $(selector, context).children('.browse').bind('click', {configuration: configuration}, Drupal.media.openBrowser); |
||
28 | }); |
||
29 | 85ad3d82 | Assos Assos | }); |
30 | ca0757b9 | Assos Assos | } |
31 | } |
||
32 | }; |
||
33 | 85ad3d82 | Assos Assos | |
34 | ca0757b9 | Assos Assos | /**
|
35 | * Attach behaviors to the media attach and remove buttons.
|
||
36 | */
|
||
37 | Drupal.behaviors.mediaButtons = { |
||
38 | attach: function (context) { |
||
39 | $('input.form-submit', context).bind('mousedown', Drupal.media.disableFields); |
||
40 | }, |
||
41 | detach: function (context) { |
||
42 | $('input.form-submit', context).unbind('mousedown', Drupal.media.disableFields); |
||
43 | } |
||
44 | }; |
||
45 | 85ad3d82 | Assos Assos | |
46 | ca0757b9 | Assos Assos | /**
|
47 | * Media attach utility functions.
|
||
48 | */
|
||
49 | Drupal.media = Drupal.media || {}; |
||
50 | |||
51 | /**
|
||
52 | * Opens the media browser with the element's configuration settings.
|
||
53 | */
|
||
54 | Drupal.media.openBrowser = function (event) { |
||
55 | var clickedButton = this; |
||
56 | var configuration = event.data.configuration.global;
|
||
57 | |||
58 | // Find the file ID, preview and upload fields.
|
||
59 | var fidField = $(this).siblings('.fid'); |
||
60 | var previewField = $(this).siblings('.preview'); |
||
61 | var uploadField = $(this).siblings('.upload'); |
||
62 | |||
63 | // Find the edit and remove buttons.
|
||
64 | var editButton = $(this).siblings('.edit'); |
||
65 | var removeButton = $(this).siblings('.remove'); |
||
66 | |||
67 | // Launch the media browser.
|
||
68 | Drupal.media.popups.mediaBrowser(function (mediaFiles) {
|
||
69 | // Ensure that there was at least one media file selected.
|
||
70 | if (mediaFiles.length < 0) { |
||
71 | return;
|
||
72 | } |
||
73 | |||
74 | // Grab the first of the selected media files.
|
||
75 | var mediaFile = mediaFiles[0]; |
||
76 | |||
77 | // Set the value of the hidden file ID field and trigger a change.
|
||
78 | uploadField.val(mediaFile.fid); |
||
79 | uploadField.trigger('change');
|
||
80 | |||
81 | // Find the attach button and automatically trigger it.
|
||
82 | var attachButton = uploadField.siblings('.attach'); |
||
83 | attachButton.trigger('mousedown');
|
||
84 | |||
85 | // Display a preview of the file using the selected media file's display.
|
||
86 | previewField.html(mediaFile.preview); |
||
87 | }, configuration); |
||
88 | |||
89 | return false; |
||
90 | }; |
||
91 | |||
92 | /**
|
||
93 | * Prevent media browsing when using buttons not intended to browse.
|
||
94 | */
|
||
95 | Drupal.media.disableFields = function (event) { |
||
96 | var clickedButton = this; |
||
97 | |||
98 | // Only disable browse fields for Ajax buttons.
|
||
99 | if (!$(clickedButton).hasClass('ajax-processed')) { |
||
100 | return;
|
||
101 | 85ad3d82 | Assos Assos | } |
102 | ca0757b9 | Assos Assos | |
103 | // Check if we're working with an "Attach" button.
|
||
104 | var $enabledFields = []; |
||
105 | if ($(this).closest('div.media-widget').length > 0) { |
||
106 | $enabledFields = $(this).closest('div.media-widget').find('input.attach'); |
||
107 | } |
||
108 | |||
109 | // Temporarily disable attach fields other than the one we're currently
|
||
110 | // working with. Filter out fields that are already disabled so that they
|
||
111 | // do not get enabled when we re-enable these fields at the end of behavior
|
||
112 | // processing. Re-enable in a setTimeout set to a relatively short amount
|
||
113 | // of time (1 second). All the other mousedown handlers (like Drupal's Ajax
|
||
114 | // behaviors) are excuted before any timeout functions are called, so we
|
||
115 | // don't have to worry about the fields being re-enabled too soon.
|
||
116 | // @todo If the previous sentence is true, why not set the timeout to 0?
|
||
117 | var $fieldsToTemporarilyDisable = $('div.media-widget input.attach').not($enabledFields).not(':disabled'); |
||
118 | $fieldsToTemporarilyDisable.attr('disabled', 'disabled'); |
||
119 | setTimeout(function (){
|
||
120 | $fieldsToTemporarilyDisable.attr('disabled', false); |
||
121 | }, 1000);
|
||
122 | 85ad3d82 | Assos Assos | }; |
123 | |||
124 | })(jQuery); |