root / drupal7 / modules / dashboard / dashboard.js @ 76597ebf
1 |
/**
|
---|---|
2 |
* @file
|
3 |
* Attaches behaviors for the Dashboard module.
|
4 |
*/
|
5 |
|
6 |
(function ($) { |
7 |
|
8 |
/**
|
9 |
* Implements Drupal.behaviors for the Dashboard module.
|
10 |
*/
|
11 |
Drupal.behaviors.dashboard = { |
12 |
attach: function (context, settings) { |
13 |
$('#dashboard', context).once(function () { |
14 |
$(this).prepend('<div class="customize clearfix"><ul class="action-links"><li><a href="#">' + Drupal.t('Customize dashboard') + '</a></li></ul><div class="canvas"></div></div>'); |
15 |
$('.customize .action-links a', this).click(Drupal.behaviors.dashboard.enterCustomizeMode); |
16 |
}); |
17 |
Drupal.behaviors.dashboard.addPlaceholders(); |
18 |
if (Drupal.settings.dashboard.launchCustomize) {
|
19 |
Drupal.behaviors.dashboard.enterCustomizeMode(); |
20 |
} |
21 |
}, |
22 |
|
23 |
addPlaceholders: function() { |
24 |
$('#dashboard .dashboard-region .region').each(function () { |
25 |
var empty_text = ""; |
26 |
// If the region is empty
|
27 |
if ($('.block', this).length == 0) { |
28 |
// Check if we are in customize mode and grab the correct empty text
|
29 |
if ($('#dashboard').hasClass('customize-mode')) { |
30 |
empty_text = Drupal.settings.dashboard.emptyRegionTextActive; |
31 |
} else {
|
32 |
empty_text = Drupal.settings.dashboard.emptyRegionTextInactive; |
33 |
} |
34 |
// We need a placeholder.
|
35 |
if ($('.dashboard-placeholder', this).length == 0) { |
36 |
$(this).append('<div class="dashboard-placeholder"></div>'); |
37 |
} |
38 |
$('.dashboard-placeholder', this).html(empty_text); |
39 |
} |
40 |
else {
|
41 |
$('.dashboard-placeholder', this).remove(); |
42 |
} |
43 |
}); |
44 |
}, |
45 |
|
46 |
/**
|
47 |
* Enters "customize" mode by displaying disabled blocks.
|
48 |
*/
|
49 |
enterCustomizeMode: function () { |
50 |
$('#dashboard').addClass('customize-mode customize-inactive'); |
51 |
Drupal.behaviors.dashboard.addPlaceholders(); |
52 |
// Hide the customize link
|
53 |
$('#dashboard .customize .action-links').hide(); |
54 |
// Load up the disabled blocks
|
55 |
$('div.customize .canvas').load(Drupal.settings.dashboard.drawer, Drupal.behaviors.dashboard.setupDrawer); |
56 |
}, |
57 |
|
58 |
/**
|
59 |
* Exits "customize" mode by simply forcing a page refresh.
|
60 |
*/
|
61 |
exitCustomizeMode: function () { |
62 |
$('#dashboard').removeClass('customize-mode customize-inactive'); |
63 |
Drupal.behaviors.dashboard.addPlaceholders(); |
64 |
location.href = Drupal.settings.dashboard.dashboard; |
65 |
}, |
66 |
|
67 |
/**
|
68 |
* Sets up the drag-and-drop behavior and the 'close' button.
|
69 |
*/
|
70 |
setupDrawer: function () { |
71 |
$('div.customize .canvas-content input').click(Drupal.behaviors.dashboard.exitCustomizeMode); |
72 |
$('div.customize .canvas-content').append('<a class="button" href="' + Drupal.settings.dashboard.dashboard + '">' + Drupal.t('Done') + '</a>'); |
73 |
|
74 |
// Initialize drag-and-drop.
|
75 |
var regions = $('#dashboard div.region'); |
76 |
regions.sortable({ |
77 |
connectWith: regions,
|
78 |
cursor: 'move', |
79 |
cursorAt: {top:0}, |
80 |
dropOnEmpty: true, |
81 |
items: '> div.block, > div.disabled-block', |
82 |
placeholder: 'block-placeholder clearfix', |
83 |
tolerance: 'pointer', |
84 |
start: Drupal.behaviors.dashboard.start,
|
85 |
over: Drupal.behaviors.dashboard.over,
|
86 |
sort: Drupal.behaviors.dashboard.sort,
|
87 |
update: Drupal.behaviors.dashboard.update
|
88 |
}); |
89 |
}, |
90 |
|
91 |
/**
|
92 |
* Makes the block appear as a disabled block while dragging.
|
93 |
*
|
94 |
* This function is called on the jQuery UI Sortable "start" event.
|
95 |
*
|
96 |
* @param event
|
97 |
* The event that triggered this callback.
|
98 |
* @param ui
|
99 |
* An object containing information about the item that is being dragged.
|
100 |
*/
|
101 |
start: function (event, ui) { |
102 |
$('#dashboard').removeClass('customize-inactive'); |
103 |
var item = $(ui.item); |
104 |
|
105 |
// If the block is already in disabled state, don't do anything.
|
106 |
if (!item.hasClass('disabled-block')) { |
107 |
item.css({height: 'auto'}); |
108 |
} |
109 |
}, |
110 |
|
111 |
/**
|
112 |
* Adapts block's width to the region it is moved into while dragging.
|
113 |
*
|
114 |
* This function is called on the jQuery UI Sortable "over" event.
|
115 |
*
|
116 |
* @param event
|
117 |
* The event that triggered this callback.
|
118 |
* @param ui
|
119 |
* An object containing information about the item that is being dragged.
|
120 |
*/
|
121 |
over: function (event, ui) { |
122 |
var item = $(ui.item); |
123 |
|
124 |
// If the block is in disabled state, remove width.
|
125 |
if ($(this).closest('#disabled-blocks').length) { |
126 |
item.css('width', ''); |
127 |
} |
128 |
else {
|
129 |
item.css('width', $(this).width()); |
130 |
} |
131 |
}, |
132 |
|
133 |
/**
|
134 |
* Adapts a block's position to stay connected with the mouse pointer.
|
135 |
*
|
136 |
* This function is called on the jQuery UI Sortable "sort" event.
|
137 |
*
|
138 |
* @param event
|
139 |
* The event that triggered this callback.
|
140 |
* @param ui
|
141 |
* An object containing information about the item that is being dragged.
|
142 |
*/
|
143 |
sort: function (event, ui) { |
144 |
var item = $(ui.item); |
145 |
|
146 |
if (event.pageX > ui.offset.left + item.width()) {
|
147 |
item.css('left', event.pageX);
|
148 |
} |
149 |
}, |
150 |
|
151 |
/**
|
152 |
* Sends block order to the server, and expand previously disabled blocks.
|
153 |
*
|
154 |
* This function is called on the jQuery UI Sortable "update" event.
|
155 |
*
|
156 |
* @param event
|
157 |
* The event that triggered this callback.
|
158 |
* @param ui
|
159 |
* An object containing information about the item that was just dropped.
|
160 |
*/
|
161 |
update: function (event, ui) { |
162 |
$('#dashboard').addClass('customize-inactive'); |
163 |
var item = $(ui.item); |
164 |
|
165 |
// If the user dragged a disabled block, load the block contents.
|
166 |
if (item.hasClass('disabled-block')) { |
167 |
var module, delta, itemClass;
|
168 |
itemClass = item.attr('class');
|
169 |
// Determine the block module and delta.
|
170 |
module = itemClass.match(/\bmodule-(\S+)\b/)[1]; |
171 |
delta = itemClass.match(/\bdelta-(\S+)\b/)[1]; |
172 |
|
173 |
// Load the newly enabled block's content.
|
174 |
$.get(Drupal.settings.dashboard.blockContent + '/' + module + '/' + delta, {}, |
175 |
function (block) {
|
176 |
if (block) {
|
177 |
item.html(block); |
178 |
} |
179 |
|
180 |
if (item.find('div.content').is(':empty')) { |
181 |
item.find('div.content').html(Drupal.settings.dashboard.emptyBlockText);
|
182 |
} |
183 |
|
184 |
Drupal.attachBehaviors(item); |
185 |
}, |
186 |
'html'
|
187 |
); |
188 |
// Remove the "disabled-block" class, so we don't reload its content the
|
189 |
// next time it's dragged.
|
190 |
item.removeClass("disabled-block");
|
191 |
} |
192 |
|
193 |
Drupal.behaviors.dashboard.addPlaceholders(); |
194 |
|
195 |
// Let the server know what the new block order is.
|
196 |
$.post(Drupal.settings.dashboard.updatePath, {
|
197 |
'form_token': Drupal.settings.dashboard.formToken,
|
198 |
'regions': Drupal.behaviors.dashboard.getOrder
|
199 |
} |
200 |
); |
201 |
}, |
202 |
|
203 |
/**
|
204 |
* Returns the current order of the blocks in each of the sortable regions.
|
205 |
*
|
206 |
* @return
|
207 |
* The current order of the blocks, in query string format.
|
208 |
*/
|
209 |
getOrder: function () { |
210 |
var order = [];
|
211 |
$('#dashboard div.region').each(function () { |
212 |
var region = $(this).parent().attr('id').replace(/-/g, '_'); |
213 |
var blocks = $(this).sortable('toArray'); |
214 |
$.each(blocks, function() { |
215 |
order.push(region + '[]=' + this); |
216 |
}); |
217 |
}); |
218 |
order = order.join('&');
|
219 |
return order;
|
220 |
} |
221 |
}; |
222 |
|
223 |
})(jQuery); |