',
+ '#markup' => t('Select the Context/Layer to Edit'),
+ '#suffix' => '
',
+ '#weight' => -2,
+ );
+
+ //add some help text to the top of the form
+ $form['help'] = array (
+ '#prefix' => '
',
+ '#markup' => t('Select which context, or layer of blocks, to edit.
+ Each context is configured to appear on different sets of pages so read the description carefully.
+ When you are done editing click Done and save your changes.
+ You may use the Stop Editing Layout link to close the editor.'),
+ '#suffix' => '
");
// add block item to region
+ //TODO : Fix it so long blocks don't get stuck when added to top regions and dragged towards bottom regions
var base = "context-blockform-region-"+ region;
Drupal.tableDrag[base].makeDraggable(block);
$('table#'+base).append(block);
@@ -146,295 +151,322 @@ DrupalContextBlockEditor = function(editor) {
this.blocks = {};
this.regions = {};
- // Category selector handler.
- // Also set to "Choose a category" option as browsers can retain
- // form values from previous page load.
- $('select.context-block-browser-categories', editor).change(function() {
- var category = $(this).val();
- var params = {
- containment: 'document',
- revert: true,
- dropOnEmpty: true,
- placeholder: 'draggable-placeholder',
- forcePlaceholderSize: true,
- helper: 'clone',
- appendTo: 'body',
- connectWith: ($.ui.version === '1.6') ? ['.ui-sortable'] : '.ui-sortable'
- };
- $('div.category', editor).hide().sortable('destroy');
- $('div.category-'+category, editor).show().sortable(params);
- });
- $('select.context-block-browser-categories', editor).val(0).change();
-
return this;
};
-DrupalContextBlockEditor.prototype.initBlocks = function(blocks) {
- var self = this;
- this.blocks = blocks;
- blocks.each(function() {
- if($(this).hasClass('context-block-empty')) {
- $(this).removeClass('context-block-hidden');
- }
- $(this).addClass('draggable');
- $(this).prepend($(''));
- $(this).prepend($('').click(function() {
- $(this).parent ('.block').eq(0).fadeOut('medium', function() {
- $(this).remove();
- self.updateBlocks();
+DrupalContextBlockEditor.prototype = {
+ initBlocks : function(blocks) {
+ var self = this;
+ this.blocks = blocks;
+ blocks.each(function() {
+ if($(this).hasClass('context-block-empty')) {
+ $(this).removeClass('context-block-hidden');
+ }
+ $(this).addClass('draggable');
+ $(this).prepend($(''));
+ $(this).prepend($('').click(function() {
+ $(this).parent ('.block').eq(0).fadeOut('medium', function() {
+ $(this).remove();
+ self.updateBlocks();
+ });
+ return false;
+ }));
+ });
+ },
+ initRegions : function(regions) {
+ this.regions = regions;
+ var ref = this;
+
+ $(regions).not('.context-ui-processed')
+ .each(function(index, el) {
+ $('.context-ui-add-link', el).click(function(e){
+ ref.showBlockBrowser($(this).parent());
+ }).addClass('context-ui-processed');
});
- return false;
- }));
- });
-};
-
-DrupalContextBlockEditor.prototype.initRegions = function(regions) {
- this.regions = regions;
-};
-
-/**
- * Update UI to match the current block states.
- */
-DrupalContextBlockEditor.prototype.updateBlocks = function() {
- var browser = $('div.context-block-browser');
-
- // For all enabled blocks, mark corresponding addables as having been added.
- $('.block, .admin-block').each(function() {
- var bid = $(this).attr('id').split('block-')[1]; // Ugh.
- $('#context-block-addable-'+bid, browser).draggable('disable').addClass('context-block-added').removeClass('context-block-addable');
- });
- // For all hidden addables with no corresponding blocks, mark as addable.
- $('.context-block-item', browser).each(function() {
- var bid = $(this).attr('id').split('context-block-addable-')[1];
- if ($('#block-'+bid).size() === 0) {
- $(this).draggable('enable').removeClass('context-block-added').addClass('context-block-addable');
- }
- });
-
- // Mark empty regions.
- $(this.regions).each(function() {
- if ($('.block:has(a.context-block)', this).size() > 0) {
- $(this).removeClass('context-block-region-empty');
- }
- else {
- $(this).addClass('context-block-region-empty');
+ $('.context-block-browser').hide();
+ },
+ showBlockBrowser : function(region) {
+ var toggled = false;
+
+ //figure out the id of the context
+ var activeId = $('.context-editing', this.editor).attr('id').replace('-trigger', ''),
+ context = $('#' + activeId)[0];
+
+ this.browser = $('.context-block-browser', context).addClass('active');
+
+ //add the filter element to the block browser
+ if (!this.browser.has('input.filter').size()) {
+ var parent = $('.block-browser-sidebar .filter', this.browser);
+ var list = $('.blocks', this.browser);
+ new Drupal.Filter (list, false, '.context-block-addable', parent);
}
- });
-};
+ //show a dialog for the blocks list
+ this.browser.show().dialog({
+ modal : true,
+ close : function() {
+ $(this).dialog('destroy');
+ //reshow all the categories
+ $('.category', this).show();
+ $(this).hide().appendTo(context).removeClass('active');
+ },
+ height: (.8 * $(window).height()),
+ minHeight:400,
+ minWidth:630,
+ width:630,
+ });
-/**
- * Live update a region.
- */
-DrupalContextBlockEditor.prototype.updateRegion = function(event, ui, region, op) {
- switch (op) {
- case 'over':
- $(region).removeClass('context-block-region-empty');
- break;
- case 'out':
- if (
- // jQuery UI 1.8
- $('.draggable-placeholder', region).size() === 1 &&
- $('.block:has(a.context-block)', region).size() == 0
- // jQuery UI 1.6
- // $('div.draggable-placeholder', region).size() === 0 &&
- // $('div.block:has(a.context-block)', region).size() == 1 &&
- // $('div.block:has(a.context-block)', region).attr('id') == ui.item.attr('id')
- ) {
- $(region).addClass('context-block-region-empty');
+ //handle showing / hiding block items when a different category is selected
+ $('.context-block-browser-categories', this.browser).change(function(e) {
+ //if no category is selected we want to show all the items
+ if ($(this).val() == 0) {
+ $('.category', self.browser).show();
+ } else {
+ $('.category', self.browser).hide();
+ $('.category-' + $(this).val(), self.browser).show();
}
- break;
- }
-};
+ });
+
+ //if we already have the function for a different context, rebind it so we don't get dupes
+ if(this.addToRegion) {
+ $('.context-block-addable', this.browser).unbind('click', this.addToRegion)
+ }
-/**
- * Remove script elements while dragging & dropping.
- */
-DrupalContextBlockEditor.prototype.scriptFix = function(event, ui, editor, context) {
- if ($('script', ui.item)) {
- var placeholder = $(Drupal.settings.contextBlockEditor.scriptPlaceholder);
- var label = $('div.handle label', ui.item).text();
- placeholder.children('strong').html(label);
- $('script', ui.item).parent().empty().append(placeholder);
- }
-};
+ //protected function for adding a clicked block to a region
+ var self = this;
+ this.addToRegion = function(e){
+ var ui = {
+ 'item' : $(this).clone(),
+ 'sender' : $(region)
+ };
+ $(this).parents('.context-block-browser.active').dialog('close');
+ $(region).after(ui.item);
+ self.addBlock(e, ui, this.editor, activeId.replace('context-editable-', ''));
+ };
+
+ $('.context-block-addable', this.browser).bind('click', this.addToRegion);
+ },
+ // Update UI to match the current block states.
+ updateBlocks : function() {
+ var browser = $('div.context-block-browser');
+
+ // For all enabled blocks, mark corresponding addables as having been added.
+ $('.block, .admin-block').each(function() {
+ var bid = $(this).attr('id').split('block-')[1]; // Ugh.
+ });
+ // For all hidden addables with no corresponding blocks, mark as addable.
+ $('.context-block-item', browser).each(function() {
+ var bid = $(this).attr('id').split('context-block-addable-')[1];
+ });
-/**
- * Add a block to a region through an AHAH load of the block contents.
- */
-DrupalContextBlockEditor.prototype.addBlock = function(event, ui, editor, context) {
- var self = this;
- if (ui.item.is('.context-block-addable')) {
- var bid = ui.item.attr('id').split('context-block-addable-')[1];
-
- // Construct query params for our AJAX block request.
- var params = Drupal.settings.contextBlockEditor.params;
- params.context_block = bid + ',' + context;
-
- // Replace item with loading block.
- var blockLoading = $('
');
- ui.item.addClass('context-block-added');
- ui.item.after(blockLoading);
- ui.sender.append(ui.item);
-
- $.getJSON(Drupal.settings.contextBlockEditor.path, params, function(data) {
- if (data.status) {
- var newBlock = $(data.block);
- if ($('script', newBlock)) {
- $('script', newBlock).remove();
- }
- blockLoading.fadeOut(function() {
- $(this).replaceWith(newBlock);
- self.initBlocks(newBlock);
- self.updateBlocks();
- Drupal.attachBehaviors();
- });
+ // Mark empty regions.
+ $(this.regions).each(function() {
+ if ($('.block:has(a.context-block)', this).size() > 0) {
+ $(this).removeClass('context-block-region-empty');
}
else {
- blockLoading.fadeOut(function() { $(this).remove(); });
+ $(this).addClass('context-block-region-empty');
}
});
- }
- else if (ui.item.is(':has(a.context-block)')) {
- self.updateBlocks();
- }
-};
+ },
+ // Live update a region
+ updateRegion : function(event, ui, region, op) {
+ switch (op) {
+ case 'over':
+ $(region).removeClass('context-block-region-empty');
+ break;
+ case 'out':
+ if (
+ // jQuery UI 1.8
+ $('.draggable-placeholder', region).size() === 1 &&
+ $('.block:has(a.context-block)', region).size() == 0
+ ) {
+ $(region).addClass('context-block-region-empty');
+ }
+ break;
+ }
+ },
+ // Remove script elements while dragging & dropping.
+ scriptFix : function(event, ui, editor, context) {
+ if ($('script', ui.item)) {
+ var placeholder = $(Drupal.settings.contextBlockEditor.scriptPlaceholder);
+ var label = $('div.handle label', ui.item).text();
+ placeholder.children('strong').html(label);
+ $('script', ui.item).parent().empty().append(placeholder);
+ }
+ },
+ // Add a block to a region through an AJAX load of the block contents.
+ addBlock : function(event, ui, editor, context) {
+ var self = this;
+ if (ui.item.is('.context-block-addable')) {
+ var bid = ui.item.attr('id').split('context-block-addable-')[1];
+
+ // Construct query params for our AJAX block request.
+ var params = Drupal.settings.contextBlockEditor.params;
+ params.context_block = bid + ',' + context;
+
+ // Replace item with loading block.
+ //ui.sender.append(ui.item);
+
+ var blockLoading = $('
');
+ ui.item.addClass('context-block-added');
+ ui.item.after(blockLoading);
+
+
+ $.getJSON(Drupal.settings.contextBlockEditor.path, params, function(data) {
+ if (data.status) {
+ var newBlock = $(data.block);
+ if ($('script', newBlock)) {
+ $('script', newBlock).remove();
+ }
+ blockLoading.fadeOut(function() {
+ $(this).replaceWith(newBlock);
+ self.initBlocks(newBlock);
+ self.updateBlocks();
+ Drupal.attachBehaviors(newBlock);
+ });
+ }
+ else {
+ blockLoading.fadeOut(function() { $(this).remove(); });
+ }
+ });
+ }
+ else if (ui.item.is(':has(a.context-block)')) {
+ self.updateBlocks();
+ }
+ },
+ // Update form hidden field with JSON representation of current block visibility states.
+ setState : function() {
+ var self = this;
-/**
- * Update form hidden field with JSON representation of current block visibility states.
- */
-DrupalContextBlockEditor.prototype.setState = function() {
- var self = this;
-
- $(this.regions).each(function() {
- var region = $('a.context-block-region', this).attr('id').split('context-block-region-')[1];
- var blocks = [];
- $('a.context-block', $(this)).each(function() {
- if ($(this).attr('class').indexOf('edit-') != -1) {
- var bid = $(this).attr('id').split('context-block-')[1];
- var context = $(this).attr('class').split('edit-')[1].split(' ')[0];
- context = context ? context : 0;
- var block = {'bid': bid, 'context': context};
- blocks.push(block);
- }
+ $(this.regions).each(function() {
+ var region = $('.context-block-region', this).attr('id').split('context-block-region-')[1];
+ var blocks = [];
+ $('a.context-block', $(this)).each(function() {
+ if ($(this).attr('class').indexOf('edit-') != -1) {
+ var bid = $(this).attr('id').split('context-block-')[1];
+ var context = $(this).attr('class').split('edit-')[1].split(' ')[0];
+ context = context ? context : 0;
+ var block = {'bid': bid, 'context': context};
+ blocks.push(block);
+ }
+ });
+ self.state[region] = blocks;
+ });
+ // Serialize here and set form element value.
+ $('input.context-block-editor-state', this.editor).val(JSON.stringify(this.state));
+ },
+ //Disable text selection.
+ disableTextSelect : function() {
+ if ($.browser.safari) {
+ $('.block:has(a.context-block):not(:has(input,textarea))').css('WebkitUserSelect','none');
+ }
+ else if ($.browser.mozilla) {
+ $('.block:has(a.context-block):not(:has(input,textarea))').css('MozUserSelect','none');
+ }
+ else if ($.browser.msie) {
+ $('.block:has(a.context-block):not(:has(input,textarea))').bind('selectstart.contextBlockEditor', function() { return false; });
+ }
+ else {
+ $(this).bind('mousedown.contextBlockEditor', function() { return false; });
+ }
+ },
+ //Enable text selection.
+ enableTextSelect : function() {
+ if ($.browser.safari) {
+ $('*').css('WebkitUserSelect','');
+ }
+ else if ($.browser.mozilla) {
+ $('*').css('MozUserSelect','');
+ }
+ else if ($.browser.msie) {
+ $('*').unbind('selectstart.contextBlockEditor');
+ }
+ else {
+ $(this).unbind('mousedown.contextBlockEditor');
+ }
+ },
+ // Start editing. Attach handlers, begin draggable/sortables.
+ editStart : function(editor, context) {
+ var self = this;
+ // This is redundant to the start handler found in context_ui.js.
+ // However it's necessary that we trigger this class addition before
+ // we call .sortable() as the empty regions need to be visible.
+ $(document.body).addClass('context-editing');
+ this.editor.addClass('context-editing');
+ this.disableTextSelect();
+ this.initBlocks($('.block:has(a.context-block.edit-'+context+')'));
+ this.initRegions($('.context-block-region').parent());
+ this.updateBlocks();
+
+ $('a.context_ui_dialog-stop').hide();
+
+ $('.editing-context-label').remove();
+ var label = $('#context-editable-trigger-'+context+' .label').text();
+ label = Drupal.t('Now Editing: ') + label;
+ editor.parent().parent()
+ .prepend('
'+ label + '
');
+
+ // First pass, enable sortables on all regions.
+ $(this.regions).each(function() {
+ var region = $(this);
+ var params = {
+ revert: true,
+ dropOnEmpty: true,
+ placeholder: 'draggable-placeholder',
+ forcePlaceholderSize: true,
+ items: '> .block:has(a.context-block.editable)',
+ handle: 'a.context-block-handle',
+ start: function(event, ui) { self.scriptFix(event, ui, editor, context); },
+ stop: function(event, ui) { self.addBlock(event, ui, editor, context); },
+ receive: function(event, ui) { self.addBlock(event, ui, editor, context); },
+ over: function(event, ui) { self.updateRegion(event, ui, region, 'over'); },
+ out: function(event, ui) { self.updateRegion(event, ui, region, 'out'); },
+ cursorAt: {left: 300, top: 0}
+ };
+ region.sortable(params);
});
- self.state[region] = blocks;
- });
-
- // Serialize here and set form element value.
- $('input.context-block-editor-state', this.editor).val(JSON.stringify(this.state));
-};
-/**
- * Disable text selection.
- */
-DrupalContextBlockEditor.prototype.disableTextSelect = function() {
- if ($.browser.safari) {
- $('.block:has(a.context-block):not(:has(input,textarea))').css('WebkitUserSelect','none');
- }
- else if ($.browser.mozilla) {
- $('.block:has(a.context-block):not(:has(input,textarea))').css('MozUserSelect','none');
- }
- else if ($.browser.msie) {
- $('.block:has(a.context-block):not(:has(input,textarea))').bind('selectstart.contextBlockEditor', function() { return false; });
- }
- else {
- $(this).bind('mousedown.contextBlockEditor', function() { return false; });
- }
-};
+ // Second pass, hook up all regions via connectWith to each other.
+ $(this.regions).each(function() {
+ $(this).sortable('option', 'connectWith', ['.ui-sortable']);
+ });
-/**
- * Enable text selection.
- */
-DrupalContextBlockEditor.prototype.enableTextSelect = function() {
- if ($.browser.safari) {
- $('*').css('WebkitUserSelect','');
- }
- else if ($.browser.mozilla) {
- $('*').css('MozUserSelect','');
- }
- else if ($.browser.msie) {
- $('*').unbind('selectstart.contextBlockEditor');
- }
- else {
- $(this).unbind('mousedown.contextBlockEditor');
- }
-};
+ // Terrible, terrible workaround for parentoffset issue in Safari.
+ // The proper fix for this issue has been committed to jQuery UI, but was
+ // not included in the 1.6 release. Therefore, we do a browser agent hack
+ // to ensure that Safari users are covered by the offset fix found here:
+ // http://dev.jqueryui.com/changeset/2073.
+ if ($.ui.version === '1.6' && $.browser.safari) {
+ $.browser.mozilla = true;
+ }
+ },
+ // Finish editing. Remove handlers.
+ editFinish : function() {
+ this.editor.removeClass('context-editing');
+ this.enableTextSelect();
+
+ $('.editing-context-label').remove();
+
+ // Remove UI elements.
+ $(this.blocks).each(function() {
+ $('a.context-block-handle, a.context-block-remove', this).remove();
+ if($(this).hasClass('context-block-empty')) {
+ $(this).addClass('context-block-hidden');
+ }
+ $(this).removeClass('draggable');
+ });
-/**
- * Start editing. Attach handlers, begin draggable/sortables.
- */
-DrupalContextBlockEditor.prototype.editStart = function(editor, context) {
- var self = this;
-
- // This is redundant to the start handler found in context_ui.js.
- // However it's necessary that we trigger this class addition before
- // we call .sortable() as the empty regions need to be visible.
- $(document.body).addClass('context-editing');
- this.editor.addClass('context-editing');
-
- this.disableTextSelect();
- this.initBlocks($('.block:has(a.context-block.edit-'+context+')'));
- this.initRegions($('a.context-block-region').parent());
- this.updateBlocks();
-
- // First pass, enable sortables on all regions.
- $(this.regions).each(function() {
- var region = $(this);
- var params = {
- containment: 'document',
- revert: true,
- dropOnEmpty: true,
- placeholder: 'draggable-placeholder',
- forcePlaceholderSize: true,
- items: '> .block:has(a.context-block.editable)',
- handle: 'a.context-block-handle',
- start: function(event, ui) { self.scriptFix(event, ui, editor, context); },
- stop: function(event, ui) { self.addBlock(event, ui, editor, context); },
- receive: function(event, ui) { self.addBlock(event, ui, editor, context); },
- over: function(event, ui) { self.updateRegion(event, ui, region, 'over'); },
- out: function(event, ui) { self.updateRegion(event, ui, region, 'out'); }
- };
- region.sortable(params);
- });
+ $('a.context_ui_dialog-stop').show();
- // Second pass, hook up all regions via connectWith to each other.
- $(this.regions).each(function() {
- $(this).sortable('option', 'connectWith', ['.ui-sortable']);
- });
+ this.regions.sortable('destroy');
- // Terrible, terrible workaround for parentoffset issue in Safari.
- // The proper fix for this issue has been committed to jQuery UI, but was
- // not included in the 1.6 release. Therefore, we do a browser agent hack
- // to ensure that Safari users are covered by the offset fix found here:
- // http://dev.jqueryui.com/changeset/2073.
- if ($.ui.version === '1.6' && $.browser.safari) {
- $.browser.mozilla = true;
- }
-};
+ this.setState();
-/**
- * Finish editing. Remove handlers.
- */
-DrupalContextBlockEditor.prototype.editFinish = function() {
- this.editor.removeClass('context-editing');
- this.enableTextSelect();
-
- // Remove UI elements.
- $(this.blocks).each(function() {
- $('a.context-block-handle, a.context-block-remove', this).remove();
- if($(this).hasClass('context-block-empty')) {
- $(this).addClass('context-block-hidden');
+ // Unhack the user agent.
+ if ($.ui.version === '1.6' && $.browser.safari) {
+ $.browser.mozilla = false;
}
- $(this).removeClass('draggable');
- });
- this.regions.sortable('destroy');
-
- this.setState();
-
- // Unhack the user agent.
- if ($.ui.version === '1.6' && $.browser.safari) {
- $.browser.mozilla = false;
}
-};
+}; //End of DrupalContextBlockEditor prototype
})(jQuery);
diff --git a/theme/context-block-browser.tpl.php b/theme/context-block-browser.tpl.php
index 2359951..69e8a15 100644
--- a/theme/context-block-browser.tpl.php
+++ b/theme/context-block-browser.tpl.php
@@ -1,17 +1,21 @@
+
+ $module_blocks): ?>
-
+
+
+
+
+ $block)); ?>
+
+
+
- $module_blocks): ?>
-
-
-
-
- $block)); ?>
-
-
-
-
+
+
+
+
+
diff --git a/theme/context_reaction_block.theme.inc b/theme/context_reaction_block.theme.inc
index 06c6bbe..b794342 100644
--- a/theme/context_reaction_block.theme.inc
+++ b/theme/context_reaction_block.theme.inc
@@ -72,7 +72,7 @@ function theme_context_block_script_placeholder($text = '') {
function template_preprocess_context_block_browser(&$vars) {
$categories = array(
'#type' => 'select',
- '#options' => array(0 => '<' . t('Choose a category') . '>'),
+ '#options' => array(0 => '<' . t('All Categories') . '>'),
'#attributes' => array('class' => array('context-block-browser-categories')),
'#value' => 0,
'#size' => 1,
@@ -95,8 +95,25 @@ function template_preprocess_context_block_browser(&$vars) {
}
$blocks[$group][$block->bid] = $block; // Don't call theme('context_block_browser_item') to allow others to alter.
}
+
+ //add help text to tell people how to use the block browser
+ $help_text = array(
+ '#prefix' => '
',
+ '#markup' => t('To add a block to the current region, simply click on the block. You may use the category filter to filter by
+ block type or the search filter to find the block that you wish to add.'),
+ '#suffix' => '