')
.parent().first().addClass('first').end().last().addClass('last');
- // Remove the 'Add ' prefix from the button labels since they're being palced
+ // Remove the 'Add ' prefix from the button labels since they're being placed
// in an 'Add' dropdown.
// @todo This assumes English, but so does $addDisplayDropdown above. Add
// support for translation.
@@ -273,6 +273,73 @@
* not written specifically for this UI, but I'm not sure where to put it.
*/
Drupal.behaviors.viewsUiRenderAddViewButton.toggleMenu = function ($trigger) {
+ $trigger.parent().toggleClass('open');
+ $trigger.next().slideToggle('fast');
+}
+
+/**
+ * The input field items that copy-to displays must be rendered as elements.
+ * The following behavior detaches the elements from the DOM, wraps them
+ * in an unordered list, then appends them to the list of tabs.
+ */
+Drupal.behaviors.viewsUiRenderCopyViewButton = {};
+
+Drupal.behaviors.viewsUiRenderCopyViewButton.attach = function (context, settings) {
+ var $ = jQuery;
+ // Build the copy display menu and pull the display input buttons into it.
+ var $menu = $('#views-display-menu-tabs', context).once('views-ui-render-copy-view-button-processed');
+
+ if (!$menu.length) {
+ return;
+ }
+ var $displayButtons = $menu.nextAll('input.copy-display').detach();
+ if (!$displayButtons.length) {
+ return;
+ }
+
+ var $addDisplayDropdown = $('
')
+ .parent().first().addClass('first').end().last().addClass('last');
+ // Remove the 'copy to ' prefix from the button labels since they're being placed
+ // in a 'Copy to' dropdown.
+ // @todo This assumes English, but so does $addDisplayDropdown above. Add
+ // support for translation.
+ $displayButtons.each(function () {
+ var label = $(this).val();
+ if (label.substr(0, 5) == 'Copy ') {
+ $(this).val(label.substr(5));
+ }
+ });
+ $addDisplayDropdown.appendTo($menu);
+
+ // Add the click handler for the copy display button
+ $('li.copy > a', $menu).bind('click', function (event) {
+ event.preventDefault();
+ var $trigger = $(this);
+ Drupal.behaviors.viewsUiRenderCopyViewButton.toggleMenu($trigger);
+ });
+ // Add a mouseleave handler to close the dropdown when the user mouses
+ // away from the item. We use mouseleave instead of mouseout because
+ // the user is going to trigger mouseout when she moves from the trigger
+ // link to the sub menu items.
+ //
+ // We use the 'li.copy' selector because the open class on this item will be
+ // toggled on and off and we want the handler to take effect in the cases
+ // that the class is present, but not when it isn't.
+ $menu.delegate('li.copy', 'mouseleave', function (event) {
+ var $this = $(this);
+ var $trigger = $this.children('a[href="#"]');
+ if ($this.children('.action-list').is(':visible')) {
+ Drupal.behaviors.viewsUiRenderCopyViewButton.toggleMenu($trigger);
+ }
+ });
+};
+
+/**
+ * @note [@jessebeach] I feel like the following should be a more generic function and
+ * not written specifically for this UI, but I'm not sure where to put it.
+ */
+Drupal.behaviors.viewsUiRenderCopyViewButton.toggleMenu = function ($trigger) {
$trigger.parent().toggleClass('open');
$trigger.next().slideToggle('fast');
}
--- a/css/views-admin.css
+++ b/css/views-admin.css
@@ -159,6 +159,7 @@
/* @group Attachment details new section button */
+.views-displays .secondary li.copy,
.views-displays .secondary li.add {
position: relative;
}