view_mail.js: handle drag of row that was not selected.

If the row being dragged was previously selected, we will drag all
selected rows and show that count next to the icon.  If the row being
dragged is NOT selected, we drag only that row and set count to 1.

This appears to make the behavior consistent with other webmails.

diff --git a/webcit-ng/static/js/view_mail.js b/webcit-ng/static/js/view_mail.js
index 5558b6dbf7067e35124f8e8ef591d246dd45aa6f..407088d3e81dced99cc7458ab4bb50fd132cf1aa 100644 (file)
--- a/webcit-ng/static/js/view_mail.js
+++ b/webcit-ng/static/js/view_mail.js
@@ -86,16 +86,24 @@ function mail_dragstart(event) {
        var count = 0;
        var table = document.getElementById("ctdl-onscreen-mailbox");
 
-       // Figure out how many messages are being dragged
-       for (i=1; row=table.rows[i]; ++i) {
-               if (row.classList.contains("ctdl-mail-selected")) {
-                       count = count + 1;
+       if (event.target.classList.contains("ctdl-mail-selected")) {
+               // The row being dragged IS selected.  See if any OTHER rows are selected, and they will come along for the ride.
+               for (i=1; row=table.rows[i]; ++i) {
+                       if (row.classList.contains("ctdl-mail-selected")) {
+                               count = count + 1;
+                       }
                }
        }
+       else {
+               // The row being dragged is NOT selected.  It will be dragged on its own, ignoring the selected rows.
+               count = 1;
+       }
+
+       // FIXME tell the clipboard what's being moved.
 
        // Set the custom drag image to an envelope + number of messages being dragged
        d = document.getElementById("ctdl_draggo");
-       d.innerHTML = "<font size='+3'><i class='fa fa-envelope' style='color: red'></i> " + count + "</font>"
+       d.innerHTML = "<font size='+2'><i class='fa fa-envelope' style='color: red'></i> " + count + "</font>"
        event.dataTransfer.setDragImage(d, 0, 0);
        event.dataTransfer.setData("text/html", "blah blah blah");
 }
@@ -228,20 +236,6 @@ function mail_display_message(msgnum, target_div, include_controls) {
 }
 
 
-// after a message is selected or deselected, we call this to set or clear the drag handler.
-function enable_or_disable_draggable(row) {
-       if (row.classList.contains("ctdl-mail-selected")) {
-               row.draggable = "true"
-               row.addEventListener("dragstart", mail_dragstart);
-       }
-       else {
-               row.draggable = "false"
-               row.removeEventListener("dragstart", mail_dragstart);
-       }
-}
-
-
-
 // A message has been selected...
 function click_message(event, msgnum) {
        var table = document.getElementById("ctdl-onscreen-mailbox");
@@ -250,7 +244,6 @@ function click_message(event, msgnum) {
        // ctrl + click = toggle an individual message without changing existing selection
        if (event.ctrlKey) {
                document.getElementById("ctdl-msgsum-" + msgnum).classList.toggle("ctdl-mail-selected");
-               enable_or_disable_draggable(document.getElementById("ctdl-msgsum-" + msgnum));
        }
 
        // shift + click = select a range of messages (start with row 1 because row 0 is the header)
@@ -266,7 +259,6 @@ function click_message(event, msgnum) {
                        else {
                                row.classList.remove("ctdl-mail-selected");
                        }
-                       enable_or_disable_draggable(row);
                }
        }
 
@@ -279,7 +271,6 @@ function click_message(event, msgnum) {
                        else {
                                row.classList.remove("ctdl-mail-selected");
                        }
-                       enable_or_disable_draggable(row);
                }
        }
 
@@ -297,7 +288,9 @@ function mail_render_row(msg, is_selected) {
                + "id=\"ctdl-msgsum-" + msg["msgnum"] + "\" "
                + (is_selected ? "class=\"ctdl-mail-selected\" " : "")
                + "onClick=\"click_message(event," + msg["msgnum"] + ");\""
-               + "onselectstart=\"return false;\""
+               + "onselectstart=\"return false;\" "
+               + "draggable=\"true\" "
+               + "ondragstart=\"mail_dragstart(event)\" "
                + ">"
                + "<td class=\"ctdl-mail-subject\">" + msg["subject"] + "</td>"
                + "<td class=\"ctdl-mail-sender\">" + msg["author"] + "</td>"