Fixed Issue 454: Reselect Files after Configuring Parsing Options does not allow Select.

Also polished up file selection panel of new importer UI.

git-svn-id: http://google-refine.googlecode.com/svn/trunk@2267 7d457c2a-affb-35e4-300a-418c747d4874

main/webapp/modules/core/scripts/index/default-importing-controller/controller.js

@@ -151,7 +151,7 @@ Refine.DefaultImportingController.prototype._prepareData = function() {
 
     var slash = file.fileName.lastIndexOf('/');
     var dot = file.fileName.lastIndexOf('.');
-    if (dot > slash + 1) {
+    if (dot > slash) {
       var extension = file.fileName.substring(dot);
       if (extension in extensionMap) {
         extensionMap[extension].count++;

main/webapp/modules/core/scripts/index/default-importing-controller/file-selection-panel.html

@@ -8,8 +8,8 @@
   <div class="grid-layout layout-full layout-tighter"><table>
     <tr>
       <td colspan="3">
-        There are several files available to import.
+        There are several files available.
-        Please select the desired ones.
+        Please select the ones to import.
       </td>
     </tr>
     <tr>

main/webapp/modules/core/scripts/index/default-importing-controller/file-selection-panel.js

@@ -34,6 +34,7 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 Refine.DefaultImportingController.prototype._showFileSelectionPanel = function() {
   var self = this;
 
+  this._selectedMap = {};
   this._prepareFileSelectionPanel();
 
   this._fileSelectionPanelElmts.nextButton.click(function() {
@@ -92,34 +93,68 @@ Refine.DefaultImportingController.prototype._renderFileSelectionPanel = function
 
 Refine.DefaultImportingController.prototype._renderFileSelectionPanelFileTable = function() {
   var self = this;
+  var files = this._job.config.retrievalRecord.files;
 
   this._fileSelectionPanelElmts.filePanel.empty();
 
-  var fileTable = $('<table><tr><th></th><th>Name</th><th>Mime-type</th><th>Format</th><th>Size</th></tr></table>')
+  var fileTable = $('<table><tr><th>Import?</th><th>Name</th><th>Mime-type</th><th>Format</th><th>Size</th></tr></table>')
-  .appendTo(this._fileSelectionPanelElmts.filePanel)[0];
+    .appendTo(this._fileSelectionPanelElmts.filePanel)[0];
 
-  var files = this._job.config.retrievalRecord.files;
+  var round = function(n) {
+    return Math.round(n * 10) / 10;
+  };
+  var renderSize = function(fileRecord) {
+    var bytes = fileRecord.size;
+    var gigabytes = bytes / 1073741824;
+    var megabytes = bytes / 1048576;
+    var kilobytes = bytes / 1024;
+    if (gigabytes > 1) {
+      return round(gigabytes) + " GB";
+    } else if (megabytes > 1) {
+      return round(megabytes) + " MB";
+    } else if (kilobytes > 1) {
+      return round(kilobytes) + " KB";
+    } else {
+      return fileRecord.size + " bytes";
+    }
+  };
   var renderFile = function(fileRecord, index) {
+    var id = "import-file-selection-" + Math.round(Math.random() * 1000000);
     var tr = fileTable.insertRow(fileTable.rows.length);
     $(tr).addClass(index % 2 == 0 ? 'even' : 'odd');
     
-    var tdSelect = $('<td>').appendTo(tr);
+    var createLabeledCell = function(className) {
+      var td = $('<td>').appendTo(tr);
+      if (className) {
+        td.addClass(className);
+      }
+      return $('<label>').attr('for', id).appendTo(td);
+    };
+    
     var checkbox = $('<input>')
+    .attr("id", id)
     .attr("type", "checkbox")
     .attr("index", index)
-    .appendTo(tdSelect)
+    .appendTo(createLabeledCell())
     .click(function() {
-      files[index].selected = this.checked;
+      var fileRecord = files[index];
+      if (this.checked) {
+        self._selectedMap[fileRecord.location] = fileRecord;
+      } else {
+        delete self._selectedMap[fileRecord.location];
+      }
       self._updateFileSelectionSummary();
     });
     if (fileRecord.selected) {
+      // Initial selection determined on server side.
       checkbox.attr("checked", "checked");
+      self._selectedMap[fileRecord.location] = fileRecord;
     }
 
-    $('<td>').text(fileRecord.fileName).addClass("default-importing-file-selection-filename").appendTo(tr);
+    createLabeledCell("default-importing-file-selection-filename").text(fileRecord.fileName);
-    $('<td>').text(fileRecord.declaredMimeType || fileRecord.mimeType || "unknown").appendTo(tr);
+    createLabeledCell().text(fileRecord.declaredMimeType || fileRecord.mimeType || "unknown");
-    $('<td>').text(fileRecord.format || "unknown").appendTo(tr);
+    createLabeledCell().text(fileRecord.format || "unknown");
-    $('<td>').text(fileRecord.size + " bytes").appendTo(tr);
+    createLabeledCell().text(renderSize(fileRecord));
   };
 
   for (var i = 0; i < files.length; i++) {
@@ -134,15 +169,14 @@ Refine.DefaultImportingController.prototype._renderFileSelectionPanelControlPane
   this._fileSelectionPanelElmts.extensionContainer.empty();
   this._fileSelectionPanelElmts.selectAllButton.unbind().click(function(evt) {
     for (var i = 0; i < files.length; i++) {
-      files[i].selected = true;
+      var fileRecord = files[i];
+      self._selectedMap[fileRecord.location] = fileRecord;
     }
     self._fileSelectionPanelElmts.filePanel.find("input").attr("checked", "checked");
     self._updateFileSelectionSummary();
   });
   this._fileSelectionPanelElmts.unselectAllButton.unbind().click(function(evt) {
-    for (var i = 0; i < files.length; i++) {
+    self._selectedMap = {};
-      files[i].selected = false;
-    }
     self._fileSelectionPanelElmts.filePanel.find("input").removeAttr("checked");
     self._updateFileSelectionSummary();
   });
@@ -161,9 +195,9 @@ Refine.DefaultImportingController.prototype._renderFileSelectionPanelControlPane
     .click(function() {
       for (var i = 0; i < files.length; i++) {
         var file = files[i];
-        if (!file.selected) {
+        if (!(file.location in self._selectedMap)) {
           if (file.fileName.endsWith(extension.extension)) {
-            file.selected = true;
+            self._selectedMap[file.location] = file;
             self._fileSelectionPanelElmts.filePanel
             .find("input[index='" + i + "']")
             .attr("checked", "checked");
@@ -179,9 +213,9 @@ Refine.DefaultImportingController.prototype._renderFileSelectionPanelControlPane
     .click(function() {
       for (var i = 0; i < files.length; i++) {
         var file = files[i];
-        if (file.selected) {
+        if (file.location in self._selectedMap) {
           if (file.fileName.endsWith(extension.extension)) {
-            file.selected = false;
+            delete self._selectedMap[file.location];
             self._fileSelectionPanelElmts.filePanel
             .find("input[index='" + i + "']")
             .removeAttr("checked");
@@ -223,9 +257,9 @@ Refine.DefaultImportingController.prototype._renderFileSelectionPanelControlPane
       var regex = new RegExp(self._fileSelectionPanelElmts.regexInput[0].value);
       for (var i = 0; i < files.length; i++) {
         var file = files[i];
-        if (!file.selected) {
+        if (!(file.location in self._selectedMap)) {
           if (regex.test(file.fileName)) {
-            file.selected = true;
+            self._selectedMap[file.location] = file;
             self._fileSelectionPanelElmts.filePanel
             .find("input[index='" + i + "']")
             .attr("checked", "checked");
@@ -245,9 +279,9 @@ Refine.DefaultImportingController.prototype._renderFileSelectionPanelControlPane
       var regex = new RegExp(self._fileSelectionPanelElmts.regexInput[0].value);
       for (var i = 0; i < files.length; i++) {
         var file = files[i];
-        if (file.selected) {
+        if (file.location in self._selectedMap) {
           if (regex.test(file.fileName)) {
-            file.selected = false;
+            delete self._selectedMap[file.location];
             self._fileSelectionPanelElmts.filePanel
             .find("input[index='" + i + "']")
             .removeAttr("checked");
@@ -265,7 +299,7 @@ Refine.DefaultImportingController.prototype._updateFileSelectionSummary = functi
   var fileSelection = [];
   var files = this._job.config.retrievalRecord.files;
   for (var i = 0; i < files.length; i++) {
-    if (files[i].selected) {
+    if (files[i].location in this._selectedMap) {
       fileSelection.push(i);
     }
   }

main/webapp/modules/core/scripts/index/default-importing-controller/parsing-panel.js

@@ -40,6 +40,10 @@ Refine.DefaultImportingController.prototype._showParsingPanel = function(hasFile
   if (!(this._parserOptions)) {
     this._parserOptions = {};
   }
+  if (this._formatParserUI) {
+    this._formatParserUI.dispose();
+    delete this._formatParserUI;
+  }
 
   this._prepareParsingPanel();
   this._parsingPanelElmts.nextButton.click(function() {

main/webapp/modules/core/styles/index/default-importing-file-selection-panel.less

@@ -38,6 +38,7 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
   position: absolute;
   background: @chrome_secondary;
   padding: @padding_looser;
+  border-right: 1px solid @chrome_primary;
   }
 .default-importing-file-selection-file-panel {
   font-size: 1.3em;
@@ -49,16 +50,20 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
   border-collapse: collapse;
   width: 100%;
   }
-.default-importing-file-selection-file-panel > table > tbody > tr > td,
-.default-importing-file-selection-file-panel > table > tbody > tr > th {
-  padding: @padding_tight @padding_normal;
-  }
 .default-importing-file-selection-file-panel > table > tbody > tr > th {
   text-align: left;
-  background: @faint_grey;
+  padding: @padding_tight @padding_normal;
+  background: @chrome_secondary;
   }
 .default-importing-file-selection-file-panel > table > tbody > tr.odd {
-  background: @fainter_grey;
+  }
+.default-importing-file-selection-file-panel > table > tbody > tr > td {
+  padding: 0;
+  border-bottom: 1px solid @chrome_secondary;
+  }
+.default-importing-file-selection-file-panel > table > tbody > tr > td > label {
+  display: block;
+  padding: @padding_tight @padding_normal;
   }
 
 .default-importing-file-selection-control-panel h2 {
@@ -69,5 +74,5 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 
 .default-importing-file-selection-file-panel > table > tbody > tr >
     td.default-importing-file-selection-filename.highlighted {
-  background: #fffee0;
+  background: @fill_editable;
   }