diff -r 07239de796bb -r e756a8c72c3d cms/drupal/modules/dashboard/dashboard.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/cms/drupal/modules/dashboard/dashboard.js Fri Sep 08 12:04:06 2017 +0200 @@ -0,0 +1,223 @@ +/** + * @file + * Attaches behaviors for the Dashboard module. + */ + +(function ($) { + +/** + * Implements Drupal.behaviors for the Dashboard module. + */ +Drupal.behaviors.dashboard = { + attach: function (context, settings) { + $('#dashboard', context).once(function () { + $(this).prepend('
'); + $('.customize .action-links a', this).click(Drupal.behaviors.dashboard.enterCustomizeMode); + }); + Drupal.behaviors.dashboard.addPlaceholders(); + if (Drupal.settings.dashboard.launchCustomize) { + Drupal.behaviors.dashboard.enterCustomizeMode(); + } + }, + + addPlaceholders: function() { + $('#dashboard .dashboard-region .region').each(function () { + var empty_text = ""; + // If the region is empty + if ($('.block', this).length == 0) { + // Check if we are in customize mode and grab the correct empty text + if ($('#dashboard').hasClass('customize-mode')) { + empty_text = Drupal.settings.dashboard.emptyRegionTextActive; + } else { + empty_text = Drupal.settings.dashboard.emptyRegionTextInactive; + } + // We need a placeholder. + if ($('.dashboard-placeholder', this).length == 0) { + $(this).append(''); + } + $('.dashboard-placeholder', this).html(empty_text); + } + else { + $('.dashboard-placeholder', this).remove(); + } + }); + }, + + /** + * Enters "customize" mode by displaying disabled blocks. + */ + enterCustomizeMode: function () { + $('#dashboard').addClass('customize-mode customize-inactive'); + Drupal.behaviors.dashboard.addPlaceholders(); + // Hide the customize link + $('#dashboard .customize .action-links').hide(); + // Load up the disabled blocks + $('div.customize .canvas').load(Drupal.settings.dashboard.drawer, Drupal.behaviors.dashboard.setupDrawer); + }, + + /** + * Exits "customize" mode by simply forcing a page refresh. + */ + exitCustomizeMode: function () { + $('#dashboard').removeClass('customize-mode customize-inactive'); + Drupal.behaviors.dashboard.addPlaceholders(); + location.href = Drupal.settings.dashboard.dashboard; + }, + + /** + * Sets up the drag-and-drop behavior and the 'close' button. + */ + setupDrawer: function () { + $('div.customize .canvas-content input').click(Drupal.behaviors.dashboard.exitCustomizeMode); + $('div.customize .canvas-content').append('' + Drupal.t('Done') + ''); + + // Initialize drag-and-drop. + var regions = $('#dashboard div.region'); + regions.sortable({ + connectWith: regions, + cursor: 'move', + cursorAt: {top:0}, + dropOnEmpty: true, + items: '> div.block, > div.disabled-block', + placeholder: 'block-placeholder clearfix', + tolerance: 'pointer', + start: Drupal.behaviors.dashboard.start, + over: Drupal.behaviors.dashboard.over, + sort: Drupal.behaviors.dashboard.sort, + update: Drupal.behaviors.dashboard.update + }); + }, + + /** + * Makes the block appear as a disabled block while dragging. + * + * This function is called on the jQuery UI Sortable "start" event. + * + * @param event + * The event that triggered this callback. + * @param ui + * An object containing information about the item that is being dragged. + */ + start: function (event, ui) { + $('#dashboard').removeClass('customize-inactive'); + var item = $(ui.item); + + // If the block is already in disabled state, don't do anything. + if (!item.hasClass('disabled-block')) { + item.css({height: 'auto'}); + } + }, + + /** + * Adapts block's width to the region it is moved into while dragging. + * + * This function is called on the jQuery UI Sortable "over" event. + * + * @param event + * The event that triggered this callback. + * @param ui + * An object containing information about the item that is being dragged. + */ + over: function (event, ui) { + var item = $(ui.item); + + // If the block is in disabled state, remove width. + if ($(this).closest('#disabled-blocks').length) { + item.css('width', ''); + } + else { + item.css('width', $(this).width()); + } + }, + + /** + * Adapts a block's position to stay connected with the mouse pointer. + * + * This function is called on the jQuery UI Sortable "sort" event. + * + * @param event + * The event that triggered this callback. + * @param ui + * An object containing information about the item that is being dragged. + */ + sort: function (event, ui) { + var item = $(ui.item); + + if (event.pageX > ui.offset.left + item.width()) { + item.css('left', event.pageX); + } + }, + + /** + * Sends block order to the server, and expand previously disabled blocks. + * + * This function is called on the jQuery UI Sortable "update" event. + * + * @param event + * The event that triggered this callback. + * @param ui + * An object containing information about the item that was just dropped. + */ + update: function (event, ui) { + $('#dashboard').addClass('customize-inactive'); + var item = $(ui.item); + + // If the user dragged a disabled block, load the block contents. + if (item.hasClass('disabled-block')) { + var module, delta, itemClass; + itemClass = item.attr('class'); + // Determine the block module and delta. + module = itemClass.match(/\bmodule-(\S+)\b/)[1]; + delta = itemClass.match(/\bdelta-(\S+)\b/)[1]; + + // Load the newly enabled block's content. + $.get(Drupal.settings.dashboard.blockContent + '/' + module + '/' + delta, {}, + function (block) { + if (block) { + item.html(block); + } + + if (item.find('div.content').is(':empty')) { + item.find('div.content').html(Drupal.settings.dashboard.emptyBlockText); + } + + Drupal.attachBehaviors(item); + }, + 'html' + ); + // Remove the "disabled-block" class, so we don't reload its content the + // next time it's dragged. + item.removeClass("disabled-block"); + } + + Drupal.behaviors.dashboard.addPlaceholders(); + + // Let the server know what the new block order is. + $.post(Drupal.settings.dashboard.updatePath, { + 'form_token': Drupal.settings.dashboard.formToken, + 'regions': Drupal.behaviors.dashboard.getOrder + } + ); + }, + + /** + * Returns the current order of the blocks in each of the sortable regions. + * + * @return + * The current order of the blocks, in query string format. + */ + getOrder: function () { + var order = []; + $('#dashboard div.region').each(function () { + var region = $(this).parent().attr('id').replace(/-/g, '_'); + var blocks = $(this).sortable('toArray'); + $.each(blocks, function() { + order.push(region + '[]=' + this); + }); + }); + order = order.join('&'); + return order; + } +}; + +})(jQuery);