From cfd4f2a9483c60942f72641740a69b59a932c37f Mon Sep 17 00:00:00 2001 From: Sebastien Ros Date: Thu, 30 May 2013 12:30:31 -0700 Subject: [PATCH] Fixing media UI glitches - drag and drop was contained in the list - drag and drop anchor is now the pointer --HG-- branch : 1.x --- .../Styles/orchard-medialibrary-admin.css | 7 +++++-- .../Modules/Orchard.MediaLibrary/Views/Admin/Index.cshtml | 5 ++++- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/src/Orchard.Web/Modules/Orchard.MediaLibrary/Styles/orchard-medialibrary-admin.css b/src/Orchard.Web/Modules/Orchard.MediaLibrary/Styles/orchard-medialibrary-admin.css index df8dc738e..f6a03df68 100644 --- a/src/Orchard.Web/Modules/Orchard.MediaLibrary/Styles/orchard-medialibrary-admin.css +++ b/src/Orchard.Web/Modules/Orchard.MediaLibrary/Styles/orchard-medialibrary-admin.css @@ -68,6 +68,7 @@ .media-library-folder-title { box-sizing: border-box; + -moz-box-sizing: border-box; border: 2px solid transparent; width: 100%; } @@ -310,10 +311,12 @@ display: none; } - .ui-draggable-dragging { - z-index: 3000; + /* the draggable element*/ + .dragged-selection { + z-index: 3000; /* above the checkmark */ } + /* the element representing the number of selected elements in the dragged element */ .draggable-selection { position: absolute; top: 25%; diff --git a/src/Orchard.Web/Modules/Orchard.MediaLibrary/Views/Admin/Index.cshtml b/src/Orchard.Web/Modules/Orchard.MediaLibrary/Views/Admin/Index.cshtml index c81c0f544..6275ba3b4 100644 --- a/src/Orchard.Web/Modules/Orchard.MediaLibrary/Views/Admin/Index.cshtml +++ b/src/Orchard.Web/Modules/Orchard.MediaLibrary/Views/Admin/Index.cshtml @@ -340,6 +340,7 @@ $(ui.helper).removeClass('over'); $(this).removeClass('dropping'); }, + tolerance: "pointer", drop: function(event, ui) { $(this).removeClass('dropping'); var targetId = $(this).data('term-id'); @@ -383,8 +384,9 @@ revert: 'invalid', //containment: 'li', helper: function(event) { - var clone = $(event.currentTarget).clone(); + var clone = $(event.currentTarget).clone().removeAttr('id'); clone.removeClass('selected'); + clone.addClass('dragged-selection'); if (viewModel.selection().length > 1) { clone.append($('

' + viewModel.selection().length + '

')); @@ -395,6 +397,7 @@ }, cursor: 'move', distance: 10, + appendTo: 'body', create: function() { // position the handler a little left to the center to let the number of selected items to appear $(this).draggable("option", "cursorAt", { left: $(this).width() / 2 - 20, top: $(this).height() / 2 });