diff --git a/misc/tabledrag.js b/misc/tabledrag.js index ef45f79..b1f7638 100644 --- a/misc/tabledrag.js +++ b/misc/tabledrag.js @@ -272,6 +272,13 @@ Drupal.tableDrag.prototype.makeDraggable = function (item) { $('td:first', item).prepend(handle); } + // Add hover action for the handle. + handle.hover(function () { + self.dragObject == null ? $(this).addClass('tabledrag-handle-hover') : null; + }, function () { + self.dragObject == null ? $(this).removeClass('tabledrag-handle-hover') : null; + }); + if (('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch) { handle.bind('touchstart', function (event) { event.preventDefault(); @@ -291,14 +298,15 @@ Drupal.tableDrag.prototype.makeDraggable = function (item) { return false; }); - // Set blur cleanup when a handle is focused. + // Similar to the hover event, add a class when the handle is focused. handle.focus(function () { + $(this).addClass('tabledrag-handle-hover'); self.safeBlur = true; }); - // On blur, fire the same function as a touchend/mouseup. This is used to - // update values after a row has been moved through the keyboard support. + // Remove the handle class on blur and fire the same function as a mouseup. handle.blur(function (event) { + $(this).removeClass('tabledrag-handle-hover'); if (self.rowObject && self.safeBlur) { self.dropRow(event, self); } @@ -429,11 +437,11 @@ Drupal.tableDrag.prototype.makeDraggable = function (item) { * Pointer event initiator, creates drag object and information. * * @param jQuery.Event event - * The event object that trigger the drag. + * The event object that triggered the drag. * @param Drupal.tableDrag self * The drag handle. * @param DOM item - * The item that that is being dragged. + * The item that is being dragged. */ Drupal.tableDrag.prototype.dragStart = function (event, self, item) { // Create a new dragObject recording the pointer information. @@ -457,6 +465,7 @@ Drupal.tableDrag.prototype.dragStart = function (event, self, item) { self.table.bottomY = self.table.topY + self.table.offsetHeight; // Add classes to the handle and row. + $(this).addClass('tabledrag-handle-hover'); $(item).addClass('drag'); // Set the document to use the move cursor during drag. @@ -464,6 +473,19 @@ Drupal.tableDrag.prototype.dragStart = function (event, self, item) { if (self.oldRowElement) { $(self.oldRowElement).removeClass('drag-previous'); } + + // Hack for IE6 that flickers uncontrollably if select lists are moved. + if (navigator.userAgent.indexOf('MSIE 6.') != -1) { + $('select', this.table).css('display', 'none'); + } + + // Hack for Konqueror, prevent the blur handler from firing. + // Konqueror always gives links focus, even after returning false on mousedown. + self.safeBlur = false; + + // Call optional placeholder function. + self.onDrag(); + return false; } /** @@ -564,6 +586,7 @@ Drupal.tableDrag.prototype.dropRow = function (event, self) { // Functionality specific only to pointerup events. if (self.dragObject != null) { + $('.tabledrag-handle', droppedRow).removeClass('tabledrag-handle-hover'); self.dragObject = null; $('body').removeClass('drag'); diff --git a/modules/system/system.base.css b/modules/system/system.base.css index 7157bc1..7e9220d 100644 --- a/modules/system/system.base.css +++ b/modules/system/system.base.css @@ -109,6 +109,9 @@ a.tabledrag-handle .handle { padding: 0.42em 0.5em; /* LTR */ width: 13px; } +a.tabledrag-handle-hover .handle { + background-position: 6px -11px; +} div.indentation { float: left; /* LTR */ height: 1.7em;