Merge pull request #256 from starccy/multiple-selection

Transfer multiple files

src/ui/common.tis

@@ -257,6 +257,10 @@ handler.msgbox = function(type, title, text, callback=null, height=180, width=50
     self.timer(150ms, function() { msgbox(type, title, text, callback, height, width, retry); });
 }
 
+handler.block_msgbox = function(type, title, text, callback=null, height=180, width=500, retry=0) {
+    msgbox(type, title, text, callback, height, width, retry);
+}
+
 var reconnectTimeout = 1;
 handler.msgbox_retry = function(type, title, text, hasRetry, callback=null, height=180, width=500) {
     handler.msgbox(type, title, text, callback, height, width, hasRetry ? reconnectTimeout : 0);

src/ui/file_transfer.css

@@ -30,6 +30,7 @@ table > thead {
 } 
 
 table > tbody {
+  behavior: select-multiple;
   overflow-y: scroll-indicator;
   size: *;
   background: white;
@@ -85,6 +86,15 @@ table.has_current tr:current /* current row */
   background-color: color(accent); 
 } 
 
+table.has_current tbody tr:checked
+{
+  background-color: color(accent);
+}
+
+table.has_current tbody tr:checked td {
+  color: highlighttext;
+}
+
 table td 
 { 
   padding: 4px; 

src/ui/file_transfer.tis

@@ -25,6 +25,12 @@ var svg_computer = <svg .computer viewBox="0 0 480 480">
 </g>
 </svg>;
 
+const TYPE_DIR = 1;
+const TYPE_DIR_LINK = 2;
+const TYPE_DIR_DRIVE = 3;
+const TYPE_FILE = 4;
+const TYPE_FILE_LINK = 5;
+
 function getSize(type, size) {
   if (!size) {
     if (type <= 3) return "";
@@ -374,7 +380,7 @@ class FolderView : Reactor.Component {
         path = this.joinPath(entry.name);
       }
       var tm = entry.time ? new Date(entry.time.toFloat() * 1000.).toLocaleString() : 0;
-      return <tr>
+      return <tr role="option">
         <td type={entry.type} filename={path}></td>
         <td>{entry.name}</td>
         <td value={entry.time || 0}>{tm || ""}</td>
@@ -401,20 +407,31 @@ class FolderView : Reactor.Component {
     }
 
     event click $(.trash) () {
-      var row = this.getCurrentRow();
-      if (!row) return;
-      var path = row[0];
-      var type = row[1];
-      var new_history = [];
-      for (var i = 0; i < this.history.length; ++i) {
-        var h = this.history[i];
-        if ((h + this.sep()).indexOf(path + this.sep()) == -1) new_history.push(h);
+      var rows = this.getCurrentRows();
+      if (!rows || rows.length == 0) return;
+
+      var delete_dirs = new Array();
+
+      for (var i = 0; i < rows.length; ++i) {
+        var row = rows[i];
+
+        var path = row[0];
+        var type = row[1];
+
+        var new_history = [];
+        for (var j = 0; j < this.history.length; ++j) {
+          var h = this.history[j];
+          if ((h + this.sep()).indexOf(path + this.sep()) == -1) new_history.push(h);
+        }
+        this.history = new_history;
+        if (type == 1) {
+          delete_dirs.push(path);
+        } else {
+          confirmDelete(path, this.is_remote);
+        }
       }
-      this.history = new_history;
-      if (type == 1) {
-        file_transfer.job_table.addDelDir(path, this.is_remote);
-      } else {
-        confirmDelete(path, this.is_remote);
+      for (var i = 0; i < delete_dirs.length; ++i) {
+        file_transfer.job_table.addDelDir(delete_dirs[i], this.is_remote);
       }
     }
 
@@ -463,10 +480,28 @@ class FolderView : Reactor.Component {
       return [this.joinPath(name), type];
     }
 
+    function getCurrentRows() {
+      var rows = this.table.getCurrentRows();
+      if (!rows || rows.length== 0) return;
+
+      var records = new Array();
+
+      for (var i = 0; i < rows.length; ++i) {
+        var name = rows[i][1].text;
+        if (!name || name == "..") continue;
+
+        var type = rows[i][0].attributes["type"];
+        records.push([this.joinPath(name), type]);
+      }
+      return records;
+    }
+
     event click $(.send) () {
-      var cur = this.getCurrentRow();
-      if (!cur) return;
-      file_transfer.job_table.send(cur[0], this.is_remote);
+      var rows = this.getCurrentRows();
+      if (!rows || rows.length == 0) return;
+      for (var i = 0; i < rows.length; ++i) {
+        file_transfer.job_table.send(rows[i][0], this.is_remote);
+      }
     }
 
     event change $(.select-dir) (_, el) {
@@ -570,7 +605,7 @@ var deleting_single_file_jobs = {};
 var create_dir_jobs = {}
 
 function confirmDelete(path, is_remote) {
-  handler.msgbox("custom-skip", "Confirm Delete", "<div .form> \
+  handler.block_msgbox("custom-skip", "Confirm Delete", "<div .form> \
         <div>Are you sure you want to delete this file?</div> \
         <div.ellipsis style=\"font-weight: bold;\">" + path + "</div> \
     </div>", function(res=null) {
@@ -590,7 +625,7 @@ handler.confirmDeleteFiles = function(id, i, name) {
   if (i >= n) return;
   var file_path = job.path;
   if (name) file_path += handler.get_path_sep(job.is_remote) + name;
-  handler.msgbox("custom-skip", "Confirm Delete", "<div .form> \
+  handler.block_msgbox("custom-skip", "Confirm Delete", "<div .form> \
         <div>Deleting #" + (i + 1) + " of " + n + " files.</div> \
         <div>Are you sure you want to delete this file?</div> \
         <div.ellipsis style=\"font-weight: bold;\" .text>" + name + "</div> \

src/ui/grid.tis

@@ -24,6 +24,11 @@ class Grid: Behavior {
     {
       return this.$(tbody>tr:current);
     }
+
+  function getCurrentRows() 
+  {
+    return this.$$(tbody>tr:checked);
+  }
   
   function getCurrentColumn()
   {