From b1ed77d6b8342fab503f87fd3f74d5a8aa562644 Mon Sep 17 00:00:00 2001
From: Jermolene <jeremy@jermolene.com>
Date: Thu, 23 Mar 2017 17:02:26 +0000
Subject: [PATCH] Switch drag image to use draggable DOM node
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

We’ll still support dragging pills, but dragging the DOM node image
seems to look better in most situations.
---
 core/modules/utils/dom/dragndrop.js | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/core/modules/utils/dom/dragndrop.js b/core/modules/utils/dom/dragndrop.js
index 3594d4414..b5068f61d 100644
--- a/core/modules/utils/dom/dragndrop.js
+++ b/core/modules/utils/dom/dragndrop.js
@@ -16,12 +16,14 @@ Browser data transfer utilities, used with the clipboard and drag and drop
 Options:
 
 domNode: dom node to make draggable
+dragImageType: "pill" or "dom"
 dragTiddlerFn: optional function to retrieve the title of tiddler to drag
 dragFilterFn: optional function to retreive the filter defining a list of tiddlers to drag
 widget: widget to use as the contect for the filter
 */
 exports.makeDraggable = function(options) {
-	var dragImage,
+	var dragImageType = options.dragImageType || "dom",
+		dragImage,
 		domNode = options.domNode;
 	// Make the dom node draggable
 	domNode.setAttribute("draggable","true");
@@ -59,10 +61,16 @@ exports.makeDraggable = function(options) {
 				// Set up the image
 				dataTransfer.effectAllowed = "copy";
 				if(dataTransfer.setDragImage) {
-					dataTransfer.setDragImage(dragImage.firstChild,-16,-16);
+					if(dragImageType === "pill") {
+						dataTransfer.setDragImage(dragImage.firstChild,-16,-16);
+					} else {
+						dataTransfer.setDragImage(domNode,(event.clientX-r.left),(event.clientY-r.top));
+					}
 				}
 				// Set up the data transfer
-				dataTransfer.clearData();
+				if(dataTransfer.clearData) {
+					dataTransfer.clearData();					
+				}
 				var jsonData = [];
 				if(titles.length > 1) {
 					titles.forEach(function(title) {