root / drupal7 / sites / all / modules / media / js / media.browser.js @ 74f6bef0
1 | 85ad3d82 | Assos Assos | /**
|
---|---|---|---|
2 | * @file
|
||
3 | * Provides default functions for the media browser
|
||
4 | */
|
||
5 | |||
6 | (function ($) { |
||
7 | namespace('Drupal.media.browser');
|
||
8 | |||
9 | Drupal.media.browser.selectedMedia = []; |
||
10 | Drupal.media.browser.activeTab = 0;
|
||
11 | Drupal.media.browser.mediaAdded = function () {}; |
||
12 | Drupal.media.browser.selectionFinalized = function (selectedMedia) { |
||
13 | // This is intended to be overridden if a callee wants to be triggered
|
||
14 | // when the media selection is finalized from inside the browser.
|
||
15 | // This is used for the file upload form for instance.
|
||
16 | }; |
||
17 | |||
18 | Drupal.behaviors.MediaBrowser = { |
||
19 | attach: function (context) { |
||
20 | if (Drupal.settings.media && Drupal.settings.media.selectedMedia) {
|
||
21 | Drupal.media.browser.selectMedia(Drupal.settings.media.selectedMedia); |
||
22 | // Fire a confirmation of some sort.
|
||
23 | Drupal.media.browser.finalizeSelection(); |
||
24 | } |
||
25 | |||
26 | // Instantiate the tabs.
|
||
27 | $('#media-browser-tabset').tabs({ |
||
28 | // Ensure that the modal resizes to the content on each tab switch.
|
||
29 | show: Drupal.media.browser.resizeIframe, // jquery ui < 1.8 |
||
30 | activate: Drupal.media.browser.resizeIframe // jquery ui >= 1.8 |
||
31 | }); |
||
32 | |||
33 | $('.ui-tabs-nav li').mouseup(function() { |
||
34 | Drupal.media.browser.activeTab = $(this).index(); |
||
35 | }); |
||
36 | |||
37 | $('.media-browser-tab').each( Drupal.media.browser.validateButtons ); |
||
38 | |||
39 | Drupal.media.browser.selectActiveTab(); |
||
40 | Drupal.media.browser.selectErrorTab(); |
||
41 | |||
42 | } |
||
43 | // Wait for additional params to be passed in.
|
||
44 | }; |
||
45 | |||
46 | Drupal.media.browser.launch = function () { |
||
47 | |||
48 | }; |
||
49 | |||
50 | Drupal.media.browser.validateButtons = function() { |
||
51 | // The media browser runs in an IFRAME. The Drupal.media.popups.mediaBrowser()
|
||
52 | // function sets up the IFRAME and "OK" and "Cancel" buttons that are outside
|
||
53 | // of the IFRAME, so that their click handlers can destroy the IFRAME while
|
||
54 | // retaining information about what media items were selected. However,
|
||
55 | // Drupal UI convention is to place all action buttons on the same "line"
|
||
56 | // at the bottom of the form, so if the form within the IFRAME contains a
|
||
57 | // "Submit" button or other action buttons, then the "OK" and "Cancel"
|
||
58 | // buttons below the IFRAME break this convention and confuse the user.
|
||
59 | // Therefore, we add "Submit" and "Cancel" buttons inside the IFRAME, and
|
||
60 | // have their click action trigger the click action of the corresonding
|
||
61 | // "OK" and "Cancel" buttons that are outside the IFRAME. media.css contains
|
||
62 | // CSS rules that hide the outside buttons.
|
||
63 | |||
64 | // If a submit button is present, another round-trip to the server is needed
|
||
65 | // before the user's selection is finalized. For these cases, when the form's
|
||
66 | // real Submit button is clicked, the server either returns another form for
|
||
67 | // the user to fill out, or else a completion page that contains or sets the
|
||
68 | // Drupal.media.browser.selectedMedia variable. If the latter, then
|
||
69 | // Drupal.media.popups.mediaBrowser.mediaBrowserOnLoad() auto-triggers the
|
||
70 | // "OK" button action to finalize the selection and remove the IFRAME.
|
||
71 | |||
72 | // We need to check for the fake submit/cancel buttons that are used on
|
||
73 | // non-form based pane content. On these items we need to bind the clicks
|
||
74 | // so that media can be selected or the window can be closed. This is still a
|
||
75 | // hacky approach, but it is a step in the right direction.
|
||
76 | |||
77 | $('a.button.fake-submit', this).once().bind('click', Drupal.media.browser.submit); |
||
78 | $('a.button.fake-cancel', this).once().bind('click', Drupal.media.browser.submit); |
||
79 | }; |
||
80 | |||
81 | Drupal.media.browser.submit = function () { |
||
82 | // @see Drupal.media.browser.validateButtons().
|
||
83 | var buttons = $(parent.window.document.body).find('#mediaBrowser').parent('.ui-dialog').find('.ui-dialog-buttonpane button'); |
||
84 | if ($(this).hasClass('fake-cancel')) { |
||
85 | buttons[1].click();
|
||
86 | } |
||
87 | else {
|
||
88 | buttons[0].click();
|
||
89 | } |
||
90 | |||
91 | // Return false to prevent the fake link "click" from continuing.
|
||
92 | return false; |
||
93 | } |
||
94 | |||
95 | Drupal.media.browser.selectMedia = function (selectedMedia) { |
||
96 | Drupal.media.browser.selectedMedia = selectedMedia; |
||
97 | }; |
||
98 | |||
99 | Drupal.media.browser.finalizeSelection = function () { |
||
100 | if (!Drupal.media.browser.selectedMedia) {
|
||
101 | throw new exception(Drupal.t('Cannot continue, nothing selected')); |
||
102 | } |
||
103 | else {
|
||
104 | Drupal.media.browser.selectionFinalized(Drupal.media.browser.selectedMedia); |
||
105 | } |
||
106 | }; |
||
107 | |||
108 | /**
|
||
109 | * Resize the Media Browser to the content height.
|
||
110 | */
|
||
111 | Drupal.media.browser.resizeIframe = function (event) { |
||
112 | var h = $('body').height(); |
||
113 | $(parent.window.document).find('#mediaBrowser').height(h); |
||
114 | }; |
||
115 | |||
116 | Drupal.media.browser.selectErrorTab = function() { |
||
117 | // Find the ID of a tab with an error in it
|
||
118 | var errorTabID = $('#media-browser-tabset') |
||
119 | .find('.error')
|
||
120 | .parents('.media-browser-tab')
|
||
121 | .attr('id');
|
||
122 | |||
123 | if (errorTabID !== undefined) { |
||
124 | // Find the Tab Link with errorTabID
|
||
125 | var tab = $('a[href="#' + errorTabID + '"]'); |
||
126 | // Find the index of the tab
|
||
127 | var index = $('#media-browser-tabset a').index(tab); |
||
128 | // Select the tab
|
||
129 | Drupal.media.browser.selectTab(index); |
||
130 | } |
||
131 | } |
||
132 | |||
133 | Drupal.media.browser.selectActiveTab = function() { |
||
134 | // Find the index of the last active tab.
|
||
135 | setTimeout(function() {
|
||
136 | Drupal.media.browser.selectTab(Drupal.media.browser.activeTab); |
||
137 | Drupal.media.browser.resizeIframe(); |
||
138 | }, 10);
|
||
139 | }; |
||
140 | |||
141 | /**
|
||
142 | * Helper function to change the media browser jQuery UI tabs
|
||
143 | * since it requires two different methods dependingon the version.
|
||
144 | */
|
||
145 | Drupal.media.browser.selectTab = function(index) { |
||
146 | var ver = jQuery.ui.version.split('.'); |
||
147 | if (ver[0] == '1' && parseInt(ver[1]) <= 8) { |
||
148 | // jQuery UI <= 1.8
|
||
149 | $('#media-browser-tabset').tabs('select', index); |
||
150 | } |
||
151 | else {
|
||
152 | // jQuery UI 1.9+
|
||
153 | $('#media-browser-tabset').tabs('option', 'active', index); |
||
154 | } |
||
155 | |||
156 | // Update the active tab variable.
|
||
157 | Drupal.media.browser.activeTab = index; |
||
158 | }; |
||
159 | |||
160 | }(jQuery)); |