From 2b351233e7baa73c81f928c657792bdc6b41918a Mon Sep 17 00:00:00 2001
From: David Huynh <dfhuynh@gmail.com>
Date: Sun, 28 Aug 2011 22:43:45 +0000
Subject: [PATCH] Added a dialog box for custom tabular exporting. No back-end
 implementation yet.

git-svn-id: http://google-refine.googlecode.com/svn/trunk@2223 7d457c2a-affb-35e4-300a-418c747d4874
---
 .../webapp/modules/core/MOD-INF/controller.js |  23 +-
 main/webapp/modules/core/project.vt           |   1 +
 .../custom-tabular-exporter-dialog.html       | 143 ++++++++++
 .../dialogs/custom-tabular-exporter-dialog.js | 263 ++++++++++++++++++
 .../core/scripts/index/create-project-ui.js   |  59 ----
 .../fixed-width-parser-ui.js                  |  18 +-
 .../parser-interfaces/line-based-parser-ui.js |   6 +-
 .../separator-based-parser-ui.js              |  22 +-
 .../modules/core/scripts/project/exporters.js |   6 +-
 .../modules/core/scripts/util/encoding.js     |  79 ++++++
 .../scripts/util/select-encoding-dialog.html  |  22 ++
 .../modules/core/scripts/util/string.js       |  14 +-
 .../custom-tabular-exporter-dialog.less       |  66 +++++
 .../core/styles/index/create-project-ui.less  |  12 -
 .../modules/core/styles/util/encoding.less    |  46 +++
 15 files changed, 666 insertions(+), 114 deletions(-)
 create mode 100644 main/webapp/modules/core/scripts/dialogs/custom-tabular-exporter-dialog.html
 create mode 100644 main/webapp/modules/core/scripts/dialogs/custom-tabular-exporter-dialog.js
 create mode 100644 main/webapp/modules/core/scripts/util/encoding.js
 create mode 100644 main/webapp/modules/core/scripts/util/select-encoding-dialog.html
 create mode 100644 main/webapp/modules/core/styles/dialogs/custom-tabular-exporter-dialog.less
 create mode 100644 main/webapp/modules/core/styles/util/encoding.less

diff --git a/main/webapp/modules/core/MOD-INF/controller.js b/main/webapp/modules/core/MOD-INF/controller.js
index a2fa1beff..3d0a62bd7 100644
--- a/main/webapp/modules/core/MOD-INF/controller.js
+++ b/main/webapp/modules/core/MOD-INF/controller.js
@@ -39,10 +39,15 @@ var bundle = false;
 var templatedFiles = {
   // Requests with last path segments mentioned here 
   // will get served from .vt files with the same names
-  "import" : true,
-  "index" : true,
-  "preferences" : true,
-  "project" : true
+  "index" : {
+    outputEncodings: true
+  },
+  "preferences" : {
+    outputEncodings: false
+  },
+  "project" : {
+    outputEncodings: true
+  }
 };
 
 function registerCommands() {
@@ -293,6 +298,7 @@ function init() {
       "scripts/util/menu.js",
       "scripts/util/dialog.js",
       "scripts/util/dom.js",
+      "scripts/util/encoding.js",
 
       "scripts/index.js",
       "scripts/index/create-project-ui.js",
@@ -323,6 +329,7 @@ function init() {
       "styles/common.less",
       "styles/pure.css",
       "styles/util/dialog.less",
+      "styles/util/encoding.less",
       
       "styles/index.less",
       "styles/index/create-project-ui.less",
@@ -363,6 +370,7 @@ function init() {
       "scripts/util/dialog.js",
       "scripts/util/dom.js",
       "scripts/util/custom-suggest.js",
+      "scripts/util/encoding.js",
 
       "scripts/widgets/histogram-widget.js",
       "scripts/widgets/slider-widget.js",
@@ -398,7 +406,8 @@ function init() {
       "scripts/dialogs/clustering-dialog.js",
       "scripts/dialogs/scatterplot-dialog.js",
       "scripts/dialogs/templating-exporter-dialog.js",
-      "scripts/dialogs/column-reordering-dialog.js"
+      "scripts/dialogs/column-reordering-dialog.js",
+      "scripts/dialogs/custom-tabular-exporter-dialog.js"
     ]
   );
 
@@ -417,6 +426,7 @@ function init() {
       "styles/util/menu.less",
       "styles/util/dialog.less",
       "styles/util/custom-suggest.less",
+      "styles/util/encoding.less",
 
       "styles/project.less",
       "styles/project/sidebar.less",
@@ -432,6 +442,7 @@ function init() {
       "styles/dialogs/clustering-dialog.less",
       "styles/dialogs/scatterplot-dialog.less",
       "styles/dialogs/column-reordering-dialog.less",
+      "styles/dialogs/custom-tabular-exporter-dialog.less",
 
       "styles/reconciliation/recon-dialog.less",
       "styles/reconciliation/standard-service-panel.less"
@@ -558,7 +569,7 @@ function process(path, request, response) {
           context.scriptInjection = scriptInjection.join("\n");
         }
         
-        if (path == "/index") {
+        if (templatedFiles[lastSegment].outputEncodings) {
           var encodings = [];
           
           var sortedCharsetMap = Packages.java.nio.charset.Charset.availableCharsets();
diff --git a/main/webapp/modules/core/project.vt b/main/webapp/modules/core/project.vt
index 36626cf96..20bc1e451 100644
--- a/main/webapp/modules/core/project.vt
+++ b/main/webapp/modules/core/project.vt
@@ -40,6 +40,7 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
     <link rel="icon" type="image/png" href="images/favicon.png">
     $scriptInjection
     $styleInjection
+    <script>Refine.encodings = $encodingJson;</script>
   </head>
   <body>
     <div id="header">
diff --git a/main/webapp/modules/core/scripts/dialogs/custom-tabular-exporter-dialog.html b/main/webapp/modules/core/scripts/dialogs/custom-tabular-exporter-dialog.html
new file mode 100644
index 000000000..fd885169f
--- /dev/null
+++ b/main/webapp/modules/core/scripts/dialogs/custom-tabular-exporter-dialog.html
@@ -0,0 +1,143 @@
+<div class="dialog-frame" style="width: 800px;">
+  <div class="dialog-header" bind="dialogHeader">Custom Tabular Exporter</div>
+  <div class="dialog-body" bind="dialogBody">
+    <div id="custom-tabular-exporter-tabs" class="refine-tabs">
+      <ul>
+        <li><a href="#custom-tabular-exporter-tabs-format">File Format</a></li>
+        <li><a href="#custom-tabular-exporter-tabs-content">Content</a></li>
+        <li><a href="#custom-tabular-exporter-tabs-code">Option Code</a></li>
+      </ul>
+      
+      <div id="custom-tabular-exporter-tabs-format" style="display: none;"><div class="grid-layout grid-layout-for-ui layout-loose layout-full"><table>
+        <tr>
+          <th>Line-based text formats</th>
+          <th>Other formats</th>
+        </tr>
+        <tr>
+          <td width="60%"><div class="grid-layout grid-layout-for-text layout-tightest"><table>
+            <tr><td width="1%"><input type="radio" name="custom-tabular-exporter-format" value="tsv" /></td><td>Tab-separated values (TSV)</td></tr>
+            <tr><td width="1%"><input type="radio" name="custom-tabular-exporter-format" value="csv" /></td><td>Comma-separated values (CSV)</td></tr>
+            <tr><td width="1%"><input type="radio" name="custom-tabular-exporter-format" value="*sv" /></td><td>Custom separator
+              <input type="text" class="lightweight" size="5" bind="separatorInput" />
+            </td></tr>
+          </table></div></td>
+          
+          <td><div class="grid-layout grid-layout-for-text layout-tightest"><table>
+            <tr>
+              <td width="1%"><input type="radio" name="custom-tabular-exporter-format" value="excel" /></td>
+              <td>Excel <input type="checkbox" bind="xlsxCheckbox" /> in XML (.xlsx)</td>
+            </tr>
+            <tr>
+              <td width="1%"><input type="radio" name="custom-tabular-exporter-format" value="html" /></td>
+              <td>HTML table</td>
+            </tr>
+          </table></div></td>
+        </tr>
+        
+        <tr>
+          <td><div class="grid-layout grid-layout-for-text layout-tightest"><table>
+            <tr><td>Line separator</td><td><input type="text" size="5" class="lightweight" bind="lineSeparatorInput" /></td></tr>
+            <tr><td>Character encoding</td><td><input type="text" size="10" class="lightweight" bind="encodingInput" /></td></tr>
+          </table></div></td>
+        </tr>
+      </table></div></div>
+      
+      <div id="custom-tabular-exporter-tabs-content"><div class="grid-layout grid-layout-for-ui layout-normal layout-full"><table>
+        <tr>
+          <th>Select and Order Columns to Export</th>
+          <th>Configure Options for Column "<span bind="columnNameSpan"></span>"</th>
+        </tr>
+        <tr>
+          <td width="40%"><div bind="columnList" class="custom-tabular-exporter-columns"></div></td>
+          <td><div bind="columnOptionPane" class="custom-tabular-exporter-column-options"><div class="grid-layout layout-normal"><table>
+            <tr><td colspan="2">For reconciled cells, output</td></tr>
+            <tr><td><div class="grid-layout layout-tightest"><table>
+              <tr>
+                <td width="1%"><input type="radio" name="custom-tabular-exporter-recon" value="entity-name" /></td>
+                <td>Matched entity's name</td>
+              </tr>
+              <tr>
+                <td width="1%"><input type="radio" name="custom-tabular-exporter-recon" value="entity-id" /></td>
+                <td>Matched entity's ID</td>
+              </tr>
+              <tr>
+                <td width="1%"><input type="radio" name="custom-tabular-exporter-recon" value="cell-content" /></td>
+                <td>Cell's content</td>
+              </tr>
+              <tr>
+                <td width="1%"><input type="checkbox" bind="reconBlankUnmatchedCheckbox" /></td>
+                <td>Output nothing for unmatched cells</td>
+              </tr>
+              <tr>
+                <td width="1%"><input type="checkbox" bind="reconLinkCheckbox" /></td>
+                <td>Link to matched entity's page</td>
+              </tr>
+            </table></td></tr>
+            
+            <tr><td colspan="2">For date/time values, use format</td></tr>
+            <tr><td><div class="grid-layout layout-tightest"><table>
+              <tr>
+                <td width="1%"><input type="radio" name="custom-tabular-exporter-date" value="iso-8601" /></td>
+                <td colspan="3">ISO 8601, e.g., 2011-08-24T18:36:10+08:00</td>
+              </tr>
+              <tr>
+                <td width="1%"><input type="radio" name="custom-tabular-exporter-date" value="locale-short" /></td>
+                <td width="50%">Short locale format</td>
+                <td width="1%"><input type="radio" name="custom-tabular-exporter-date" value="locale-medium" /></td>
+                <td width="50%">Medium locale format</td>
+              </tr>
+              <tr>
+                <td width="1%"><input type="radio" name="custom-tabular-exporter-date" value="locale-long" /></td>
+                <td width="50%">Long locale format</td>
+                <td width="1%"><input type="radio" name="custom-tabular-exporter-date" value="locale-full" /></td>
+                <td width="50%">Full locale format</td>
+              </tr>
+              <tr>
+                <td width="1%"><input type="radio" name="custom-tabular-exporter-date" value="custom" /></td>
+                <td colspan="3">
+                  Custom <input size="35" class="lightweight" bind="dateCustomInput" />
+                  <a href="" target="_blank">Help</a>
+                </td>
+              </tr>
+              <tr>
+                <td width="1%"><input type="checkbox" bind="dateLocalTimeZoneCheckbox" /></td>
+                <td width="50%">Use local time zone</td>
+                <td width="1%"><input type="checkbox" bind="omitTimeCheckbox" /></td>
+                <td width="50%">Omit time</td>
+              </tr>
+            </table></td></tr>
+          </table></div></div></td>
+        </tr>
+        <tr>
+          <td>
+            <button class="button" bind="selectAllButton">Select All</button>
+            <button class="button" bind="deselectAllButton">De-select All</button>
+          </td>
+          <td><div class="grid-layout layout-tighter"><table>
+            <tr>
+              <td width="1%"><input type="checkbox" bind="outputColumnHeadersCheckbox" checked /></td><td>Output column headers</td>
+              <td width="1%"><input type="checkbox" bind="outputBlankRowsCheckbox" /></td><td>Output blank rows</td>
+            </tr>
+          </table></div></td>
+        </tr>
+      </table></div></div>
+      
+      
+      <div id="custom-tabular-exporter-tabs-code" style="display: none;"><div class="grid-layout grid-layout-for-ui layout-loose layout-full"><table>
+        <tr>
+          <td>The following JSON text encodes the options you have set in the other tabs.
+            You can copy it out and save it for later, and paste it back in and click Apply
+            to re-use the same options.
+          </td>
+          <td width="30%" style="text-align: right;"><button class="button" bind="applyOptionCodeButton">Apply</button></td>
+        </tr>
+        <tr><td colspan="2"><textarea class="custom-tabular-exporter-code" bind="optionCodeInput"></textarea></td></tr>
+      </table></div></div>
+    </div>
+  </div>
+  <div class="dialog-footer" bind="dialogFooter"><div class="grid-layout layout-tightest layout-full"><table><tr>
+    <td><button class="button" bind="previewButton">Preview</button></td>
+    <td width="1%"><button class="button button-primary" bind="exportButton">Export</button></td>
+    <td width="1%"><button class="button" bind="cancelButton">Cancel</button></td>
+  </tr></table></div></div>
+</div>
\ No newline at end of file
diff --git a/main/webapp/modules/core/scripts/dialogs/custom-tabular-exporter-dialog.js b/main/webapp/modules/core/scripts/dialogs/custom-tabular-exporter-dialog.js
new file mode 100644
index 000000000..6dfc009e0
--- /dev/null
+++ b/main/webapp/modules/core/scripts/dialogs/custom-tabular-exporter-dialog.js
@@ -0,0 +1,263 @@
+/*
+
+Copyright 2010, Google Inc.
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are
+met:
+
+ * Redistributions of source code must retain the above copyright
+notice, this list of conditions and the following disclaimer.
+ * Redistributions in binary form must reproduce the above
+copyright notice, this list of conditions and the following disclaimer
+in the documentation and/or other materials provided with the
+distribution.
+ * Neither the name of Google Inc. nor the names of its
+contributors may be used to endorse or promote products derived from
+this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+"AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,           
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY           
+THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+ */
+
+function CustomTabularExporterDialog(options) {
+  options = options || {
+    format: 'tsv',
+    lineSeparator: '\n',
+    separator: '\t',
+    encoding: 'UTF-8',
+    outputColumnHeaders: true,
+    outputBlankRows: false,
+    xlsx: false,
+    columns: null
+  };
+  
+  this._columnOptionMap = {};
+  this._createDialog(options);
+};
+
+CustomTabularExporterDialog.prototype._createDialog = function(options) {
+  var self = this;
+  
+  this._dialog = $(DOM.loadHTML("core", "scripts/dialogs/custom-tabular-exporter-dialog.html"));
+  this._elmts = DOM.bind(this._dialog);
+  this._level = DialogSystem.showDialog(this._dialog);
+  
+  $("#custom-tabular-exporter-tabs-format").css("display", "");
+  $("#custom-tabular-exporter-tabs-content").css("display", "");
+  $("#custom-tabular-exporter-tabs-code").css("display", "");
+  $("#custom-tabular-exporter-tabs").tabs();
+  
+  /*
+   * Populate column list.
+   */
+  for (var i = 0; i < theProject.columnModel.columns.length; i++) {
+    var column = theProject.columnModel.columns[i];
+    var name = column.name;
+    var div = $('<div>')
+        .addClass("custom-tabular-exporter-dialog-column")
+        .attr("column", name)
+        .appendTo(this._elmts.columnList);
+    
+    $('<input>')
+      .attr('type', 'checkbox')
+      .attr('checked', 'checked')
+      .appendTo(div);
+    $('<span>')
+      .text(name)
+      .appendTo(div);
+    
+    this._columnOptionMap[name] = {
+      name: name,
+      reconSettings: {
+        output: 'entity-name',
+        blankUnmatchedCells: false,
+        linkToEntityPages: true
+      },
+      dateSettings: {
+        format: 'iso-8601',
+        custom: '',
+        useLocalTimeZone: false,
+        omitTime: false
+      }
+    };
+  }
+  this._elmts.columnList.sortable({});
+  
+  /*
+   * Hook up event handlers.
+   */
+  this._elmts.encodingInput.click(function(evt) {
+    Encoding.selectEncoding($(this), function() {
+      self._updateOptionCode();
+    });
+  });
+  
+  this._elmts.columnList.find('.custom-tabular-exporter-dialog-column').click(function() {
+    self._elmts.columnList.find('.custom-tabular-exporter-dialog-column').removeClass('selected');
+    $(this).addClass('selected');
+    self._selectColumn(this.getAttribute('column'));
+    self._updateOptionCode();
+  });
+  this._elmts.selectAllButton.click(function() {
+    self._elmts.columnList.find('input[type="checkbox"]').attr('checked', 'checked');
+    self._updateOptionCode();
+  });
+  this._elmts.deselectAllButton.click(function() {
+    self._elmts.columnList.find('input[type="checkbox"]').attr('checked', '');
+    self._updateOptionCode();
+  });
+  
+  this._elmts.columnOptionPane.find('input').bind('change', function() {
+    self._updateCurrentColumnOptions();
+  });
+  $('#custom-tabular-exporter-tabs-content').find('input').bind('change', function() {
+    self._updateOptionCode();
+  });
+  $('#custom-tabular-exporter-tabs-format').find('input').bind('change', function() {
+    self._updateOptionCode();
+  });
+  
+  this._elmts.applyOptionCodeButton.click(function(evt) { self._applyOptionCode(); });
+  this._elmts.cancelButton.click(function() { self._dismiss(); });
+  this._elmts.exportButton.click(function() { self._commit(); });
+  this._elmts.previewButton.click(function(evt) { self._preview(); });
+  
+  this._configureUIFromOptionCode(options);
+  this._updateOptionCode();
+};
+
+CustomTabularExporterDialog.prototype._configureUIFromOptionCode = function(options) {
+  this._dialog.find('input[name="custom-tabular-exporter-format"][value="' + options.format + '"]').attr('checked', 'checked');
+  this._elmts.separatorInput[0].value = String.encodeSeparator(options.separator || ',');
+  this._elmts.lineSeparatorInput[0].value = String.encodeSeparator(options.lineSeparator || '\n');
+  this._elmts.encodingInput[0].value = options.encoding;
+  this._elmts.outputColumnHeadersCheckbox.attr('checked', (options.outputColumnHeaders) ? 'checked' : '');
+  this._elmts.outputBlankRowsCheckbox.attr('checked', (options.outputBlankRows) ? 'checked' : '');
+  this._elmts.xlsxCheckbox.attr('checked', (options.xlsx) ? 'checked' : '');
+  
+  if (options.columns != null) {
+    var self = this;
+    this._elmts.columnList.find('.custom-tabular-exporter-dialog-column input[type="checkbox"]').attr('checked', '');
+    $.each(options.columns, function() {
+      var name = this.name;
+      self._columnOptionMap[name] = this;
+      self._elmts.columnList.find('.custom-tabular-exporter-dialog-column').each(function() {
+        if (this.getAttribute('column') == name) {
+          $(this).find('input[type="checkbox"]').attr('checked', 'checked');
+        }
+      });
+    });
+  }
+  this._elmts.columnList.find('.custom-tabular-exporter-dialog-column').first().addClass('selected');
+  this._selectColumn(theProject.columnModel.columns[0].name);
+};
+
+CustomTabularExporterDialog.prototype._dismiss = function() {
+    DialogSystem.dismissUntil(this._level - 1);
+};
+
+CustomTabularExporterDialog.prototype._preview = function() {
+  var options = this._getOptionCode();
+  console.log(options);
+};
+
+CustomTabularExporterDialog.prototype._selectColumn = function(columnName) {
+  this._elmts.columnNameSpan.text(columnName);
+  
+  var columnOptions = this._columnOptionMap[columnName];
+  
+  this._elmts.columnOptionPane.find('input[name="custom-tabular-exporter-recon"][value="' +
+    columnOptions.reconSettings.output + '"]').attr('checked', 'checked');
+  this._elmts.reconBlankUnmatchedCheckbox.attr('checked', columnOptions.reconSettings.blankUnmatchedCells ? 'checked' : '');
+  this._elmts.reconLinkCheckbox.attr('checked', columnOptions.reconSettings.linkToEntityPages ? 'checked' : '');
+  
+  this._elmts.columnOptionPane.find('input[name="custom-tabular-exporter-date"][value="' +
+    columnOptions.dateSettings.format + '"]').attr('checked', 'checked');
+  this._elmts.dateCustomInput.val(columnOptions.dateSettings.custom);
+  this._elmts.dateLocalTimeZoneCheckbox.attr('checked', columnOptions.dateSettings.useLocalTimeZone ? 'checked' : '');
+  this._elmts.omitTimeCheckbox.attr('checked', columnOptions.dateSettings.omitTime ? 'checked' : '');
+};
+
+CustomTabularExporterDialog.prototype._updateCurrentColumnOptions = function() {
+  var selectedColumnName = this._elmts.columnList
+    .find('.custom-tabular-exporter-dialog-column.selected').attr('column');
+  
+  var columnOptions = this._columnOptionMap[selectedColumnName];
+  
+  columnOptions.reconSettings.output = this._elmts.columnOptionPane
+    .find('input[name="custom-tabular-exporter-recon"]:checked').val();
+  columnOptions.reconSettings.blankUnmatchedCells = this._elmts.reconBlankUnmatchedCheckbox[0].checked;
+  columnOptions.reconSettings.linkToEntityPages = this._elmts.reconLinkCheckbox[0].checked;
+  
+  columnOptions.dateSettings.format = this._elmts.columnOptionPane
+    .find('input[name="custom-tabular-exporter-date"]:checked').val();
+  columnOptions.dateSettings.custom = this._elmts.dateCustomInput.val();
+  columnOptions.dateSettings.useLocalTimeZone = this._elmts.dateLocalTimeZoneCheckbox[0].checked;
+  columnOptions.dateSettings.omitTime = this._elmts.omitTimeCheckbox[0].checked;
+};
+
+CustomTabularExporterDialog.prototype._updateOptionCode = function() {
+  this._elmts.optionCodeInput.val(JSON.stringify(this._getOptionCode(), null, 2));
+};
+
+CustomTabularExporterDialog.prototype._applyOptionCode = function() {
+  var s = this._elmts.optionCodeInput.val();
+  try {
+    var json = JSON.parse(s);
+    this._configureUIFromOptionCode(json);
+    
+    alert('Option code successfully applied.');
+  } catch (e) {
+    alert('Error applying option code: ' + e);
+  }
+};
+
+CustomTabularExporterDialog.prototype._getOptionCode = function() {
+  var options = {
+    format: this._dialog.find('input[name="custom-tabular-exporter-format"]:checked').val()
+  };
+  
+  if (options.format == 'excel') {
+    options.xlsx = this._elmts.xlsxCheckbox[0].checked;
+  } else if (options.format != 'html') {
+    options.separator = String.decodeSeparator(this._elmts.separatorInput.val());
+    options.lineSeparator = String.decodeSeparator(this._elmts.lineSeparatorInput.val());
+    options.encoding = this._elmts.encodingInput.val();
+  }
+  options.outputColumnHeaders = this._elmts.outputColumnHeadersCheckbox[0].checked;
+  options.outputBlankRows = this._elmts.outputBlankRowsCheckbox[0].checked;
+  
+  options.columns = [];
+  
+  var self = this;
+  this._elmts.columnList.find('.custom-tabular-exporter-dialog-column').each(function() {
+    if ($(this).find('input[type="checkbox"]')[0].checked) {
+      var name = this.getAttribute('column');
+      var fullColumnOptions = self._columnOptionMap[name];
+      var columnOptions = {
+        name: name,
+        reconSettings: $.extend({}, fullColumnOptions.reconSettings),
+        dateSettings: $.extend({}, fullColumnOptions.dateSettings)
+      };
+      if (columnOptions.dateSettings.format != 'custom') {
+        delete columnOptions.dateSettings.custom;
+      }
+      options.columns.push(columnOptions);
+    }
+  });
+  
+  return options;
+};
+
diff --git a/main/webapp/modules/core/scripts/index/create-project-ui.js b/main/webapp/modules/core/scripts/index/create-project-ui.js
index 92b02ff04..9f9027ba5 100644
--- a/main/webapp/modules/core/scripts/index/create-project-ui.js
+++ b/main/webapp/modules/core/scripts/index/create-project-ui.js
@@ -245,62 +245,3 @@ Refine.CreateProjectUI.prototype.showImportJobError = function(message, stack) {
     self.showSourceSelectionPanel();
   });
 };
-
-Refine.CreateProjectUI.populateEncodings = function(select) {
-  $('<option>')
-    .text('Unspecified')
-    .attr('value', '')
-    .appendTo(select);
-    
-  $.each(Refine.encodings, function() {
-    $('<option>')
-      .text(this.name + ' (' + this.aliases.join(', ') + ')')
-      .attr('value', this.code)
-      .appendTo(select);
-  });
-};
-
-Refine.CreateProjectUI.selectEncoding = function(input, onDone) {
-  var self = this;
-  var frame = $(DOM.loadHTML("core", "scripts/index/select-encoding-dialog.html"));
-  var elmts = DOM.bind(frame);
-  var level = DialogSystem.showDialog(frame);
-  
-  $("#select-encodings-tabs").tabs({ selected: 0 });
-  $("#select-encodings-tabs-all").css("display", "");
-  
-  var pickEncoding = function(encoding) {
-    input[0].value = encoding.code;
-    DialogSystem.dismissUntil(level - 1);
-    
-    if (onDone) {
-      onDone();
-    }
-  };
-  var renderEncoding = function(table, encoding) {
-    var tr = table.insertRow(table.rows.length);
-    $('<a>')
-      .text(encoding.name)
-      .attr('href', 'javascript:{}')
-      .click(function() {
-        return pickEncoding(encoding);
-      })
-      .appendTo(tr.insertCell(0));
-    $(tr.insertCell(1)).text(encoding.aliases.join(', '));
-  };
-  var generateEncodingList = function(container, filter) {
-    var table = $('<table>').html('<tr><th>Encoding</th><th>Aliases</th></tr>').appendTo(container)[0];
-    $.each(Refine.encodings, function() {
-      if (filter == null || this.code in filter) {
-        renderEncoding(table, this);
-      }
-    });
-  };
-  generateEncodingList(elmts.commonList,
-    { 'US-ASCII':1, 'ISO-8859-1':1, 'UTF-8':1, 'UTF-16BE':1, 'UTF-16LE':1, 'UTF-16':1 });
-  generateEncodingList(elmts.allList, null);
-  
-  elmts.cancelButton.click(function() {
-    DialogSystem.dismissUntil(level - 1);
-  });
-};
diff --git a/main/webapp/modules/core/scripts/index/parser-interfaces/fixed-width-parser-ui.js b/main/webapp/modules/core/scripts/index/parser-interfaces/fixed-width-parser-ui.js
index 3c3440176..2bbd4afce 100644
--- a/main/webapp/modules/core/scripts/index/parser-interfaces/fixed-width-parser-ui.js
+++ b/main/webapp/modules/core/scripts/index/parser-interfaces/fixed-width-parser-ui.js
@@ -50,18 +50,6 @@ Refine.FixedWidthParserUI = function(controller, jobID, job, format, config,
 };
 Refine.DefaultImportingController.parserUIs["FixedWidthParserUI"] = Refine.FixedWidthParserUI;
 
-Refine.FixedWidthParserUI.encodeSeparator = function(s) {
-  return s.replace("\\", "\\\\")
-  .replace("\n", "\\n")
-  .replace("\t", "\\t");
-};
-
-Refine.FixedWidthParserUI.decodeSeparator = function(s) {
-  return s.replace("\\n", "\n")
-  .replace("\\t", "\t")
-  .replace("\\\\", "\\");
-};
-
 Refine.FixedWidthParserUI.prototype.dispose = function() {
   if (this._timerID != null) {
     window.clearTimeout(this._timerID);
@@ -89,7 +77,7 @@ Refine.FixedWidthParserUI.prototype.getOptions = function() {
     options.lineSeparator = "\n";
     break;
   default:
-    options.lineSeparator = Refine.FixedWidthParserUI.decodeSeparator(
+    options.lineSeparator = String.decodeSeparator(
         this._optionContainerElmts.rowSeparatorInput[0].value);
   }
 
@@ -145,7 +133,7 @@ Refine.FixedWidthParserUI.prototype._initialize = function() {
   this._optionContainerElmts.encodingInput
     .attr('value', this._config.encoding || '')
     .click(function() {
-      Refine.CreateProjectUI.selectEncoding($(this), function() {
+      Encoding.selectEncoding($(this), function() {
         self.updatePreview();
       });
     });
@@ -159,7 +147,7 @@ Refine.FixedWidthParserUI.prototype._initialize = function() {
   this._optionContainer.find(
       "input[name='row-separator'][value='" + rowSeparatorValue + "']").attr("checked", "checked");
   this._optionContainerElmts.rowSeparatorInput[0].value =
-    Refine.FixedWidthParserUI.encodeSeparator(this._config.lineSeparator);
+    String.encodeSeparator(this._config.lineSeparator);
 
   if (this._config.ignoreLines > 0) {
     this._optionContainerElmts.ignoreCheckbox.attr("checked", "checked");
diff --git a/main/webapp/modules/core/scripts/index/parser-interfaces/line-based-parser-ui.js b/main/webapp/modules/core/scripts/index/parser-interfaces/line-based-parser-ui.js
index 311935c76..d7d8c2a77 100644
--- a/main/webapp/modules/core/scripts/index/parser-interfaces/line-based-parser-ui.js
+++ b/main/webapp/modules/core/scripts/index/parser-interfaces/line-based-parser-ui.js
@@ -85,7 +85,7 @@ Refine.LineBasedParserUI.prototype.getOptions = function() {
     options.lineSeparator = "\n";
     break;
   default:
-    options.lineSeparator = Refine.FixedWidthParserUI.decodeSeparator(
+    options.lineSeparator = String.decodeSeparator(
         this._optionContainerElmts.rowSeparatorInput[0].value);
   }
 
@@ -122,7 +122,7 @@ Refine.LineBasedParserUI.prototype._initialize = function() {
   this._optionContainerElmts.encodingInput
     .attr('value', this._config.encoding || '')
     .click(function() {
-      Refine.CreateProjectUI.selectEncoding($(this), function() {
+      Encoding.selectEncoding($(this), function() {
         self._updatePreview();
       });
     });
@@ -134,7 +134,7 @@ Refine.LineBasedParserUI.prototype._initialize = function() {
   this._optionContainer.find(
       "input[name='row-separator'][value='" + rowSeparatorValue + "']").attr("checked", "checked");
   this._optionContainerElmts.rowSeparatorInput[0].value =
-    Refine.SeparatorBasedParserUI.encodeSeparator(this._config.lineSeparator);
+    String.encodeSeparator(this._config.lineSeparator);
 
   if (this._config.ignoreLines > 0) {
     this._optionContainerElmts.ignoreCheckbox.attr("checked", "checked");
diff --git a/main/webapp/modules/core/scripts/index/parser-interfaces/separator-based-parser-ui.js b/main/webapp/modules/core/scripts/index/parser-interfaces/separator-based-parser-ui.js
index 66dd9f316..36d228b5c 100644
--- a/main/webapp/modules/core/scripts/index/parser-interfaces/separator-based-parser-ui.js
+++ b/main/webapp/modules/core/scripts/index/parser-interfaces/separator-based-parser-ui.js
@@ -49,18 +49,6 @@ Refine.SeparatorBasedParserUI = function(controller, jobID, job, format, config,
 };
 Refine.DefaultImportingController.parserUIs["SeparatorBasedParserUI"] = Refine.SeparatorBasedParserUI;
 
-Refine.SeparatorBasedParserUI.encodeSeparator = function(s) {
-  return s.replace("\\", "\\\\")
-  .replace("\n", "\\n")
-  .replace("\t", "\\t");
-};
-
-Refine.SeparatorBasedParserUI.decodeSeparator = function(s) {
-  return s.replace("\\n", "\n")
-  .replace("\\t", "\t")
-  .replace("\\\\", "\\");
-};
-
 Refine.SeparatorBasedParserUI.prototype.dispose = function() {
   if (this._timerID != null) {
     window.clearTimeout(this._timerID);
@@ -82,7 +70,7 @@ Refine.SeparatorBasedParserUI.prototype.getOptions = function() {
     options.lineSeparator = "\n";
     break;
   default:
-    options.lineSeparator = Refine.SeparatorBasedParserUI.decodeSeparator(
+    options.lineSeparator = String.decodeSeparator(
         this._optionContainerElmts.rowSeparatorInput[0].value);
   }
   switch (this._optionContainer.find("input[name='column-separator']:checked")[0].value) {
@@ -93,7 +81,7 @@ Refine.SeparatorBasedParserUI.prototype.getOptions = function() {
     options.separator = "\t";
     break;
   default:
-    options.separator = Refine.SeparatorBasedParserUI.decodeSeparator(
+    options.separator = String.decodeSeparator(
         this._optionContainerElmts.columnSeparatorInput[0].value);
   }
 
@@ -150,7 +138,7 @@ Refine.SeparatorBasedParserUI.prototype._initialize = function() {
   this._optionContainerElmts.encodingInput
     .attr('value', this._config.encoding || '')
     .click(function() {
-      Refine.CreateProjectUI.selectEncoding($(this), function() {
+      Encoding.selectEncoding($(this), function() {
         self._updatePreview();
       });
     });
@@ -159,14 +147,14 @@ Refine.SeparatorBasedParserUI.prototype._initialize = function() {
   this._optionContainer.find(
       "input[name='row-separator'][value='" + rowSeparatorValue + "']").attr("checked", "checked");
   this._optionContainerElmts.rowSeparatorInput[0].value =
-    Refine.SeparatorBasedParserUI.encodeSeparator(this._config.lineSeparator);
+    String.encodeSeparator(this._config.lineSeparator);
 
   var columnSeparatorValue = (this._config.separator == ",") ? 'comma' :
     ((this._config.separator == "\t") ? 'tab' : 'custom');
   this._optionContainer.find(
       "input[name='column-separator'][value='" + columnSeparatorValue + "']").attr("checked", "checked");
   this._optionContainerElmts.columnSeparatorInput[0].value =
-    Refine.SeparatorBasedParserUI.encodeSeparator(this._config.separator);
+    String.encodeSeparator(this._config.separator);
 
   if (this._config.ignoreLines > 0) {
     this._optionContainerElmts.ignoreCheckbox.attr("checked", "checked");
diff --git a/main/webapp/modules/core/scripts/project/exporters.js b/main/webapp/modules/core/scripts/project/exporters.js
index 27edbeb9a..e21d0c2cd 100644
--- a/main/webapp/modules/core/scripts/project/exporters.js
+++ b/main/webapp/modules/core/scripts/project/exporters.js
@@ -77,6 +77,11 @@ ExporterManager.MenuItems = [
     "click": function() { ExporterManager.handlers.exportTripleloader("mqlwrite"); }
   },
   {},
+  {
+    "id" : "core/export-custom-tabular",
+    "label": "Custom tabular exporter...",
+    "click": function() { new CustomTabularExporterDialog(); }
+  },
   {
     "id" : "core/export-templating",
     "label": "Templating...",
@@ -158,4 +163,3 @@ ExporterManager.handlers.exportProject = function() {
 
   document.body.removeChild(form);
 };
-
diff --git a/main/webapp/modules/core/scripts/util/encoding.js b/main/webapp/modules/core/scripts/util/encoding.js
new file mode 100644
index 000000000..6f716c6da
--- /dev/null
+++ b/main/webapp/modules/core/scripts/util/encoding.js
@@ -0,0 +1,79 @@
+/*
+
+Copyright 2011, Google Inc.
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are
+met:
+
+ * Redistributions of source code must retain the above copyright
+notice, this list of conditions and the following disclaimer.
+ * Redistributions in binary form must reproduce the above
+copyright notice, this list of conditions and the following disclaimer
+in the documentation and/or other materials provided with the
+distribution.
+ * Neither the name of Google Inc. nor the names of its
+contributors may be used to endorse or promote products derived from
+this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+"AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,           
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY           
+THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+ */
+
+var Encoding = {};
+
+Encoding.selectEncoding = function(input, onDone) {
+  var self = this;
+  var frame = $(DOM.loadHTML("core", "scripts/util/select-encoding-dialog.html"));
+  var elmts = DOM.bind(frame);
+  var level = DialogSystem.showDialog(frame);
+  
+  $("#select-encodings-tabs").tabs({ selected: 0 });
+  $("#select-encodings-tabs-all").css("display", "");
+  
+  var pickEncoding = function(encoding) {
+    input[0].value = encoding.code;
+    DialogSystem.dismissUntil(level - 1);
+    
+    if (onDone) {
+      onDone();
+    }
+  };
+  var renderEncoding = function(table, encoding) {
+    var tr = table.insertRow(table.rows.length);
+    $('<a>')
+      .text(encoding.name)
+      .attr('href', 'javascript:{}')
+      .click(function() {
+        return pickEncoding(encoding);
+      })
+      .appendTo(tr.insertCell(0));
+    $(tr.insertCell(1)).text(encoding.aliases.join(', '));
+  };
+  var generateEncodingList = function(container, filter) {
+    var table = $('<table>').html('<tr><th>Encoding</th><th>Aliases</th></tr>').appendTo(container)[0];
+    $.each(Refine.encodings, function() {
+      if (filter == null || this.code in filter) {
+        renderEncoding(table, this);
+      }
+    });
+  };
+  generateEncodingList(elmts.commonList,
+    { 'US-ASCII':1, 'ISO-8859-1':1, 'UTF-8':1, 'UTF-16BE':1, 'UTF-16LE':1, 'UTF-16':1 });
+  generateEncodingList(elmts.allList, null);
+  
+  elmts.cancelButton.click(function() {
+    DialogSystem.dismissUntil(level - 1);
+  });
+};
diff --git a/main/webapp/modules/core/scripts/util/select-encoding-dialog.html b/main/webapp/modules/core/scripts/util/select-encoding-dialog.html
new file mode 100644
index 000000000..03bfb83d0
--- /dev/null
+++ b/main/webapp/modules/core/scripts/util/select-encoding-dialog.html
@@ -0,0 +1,22 @@
+<div class="dialog-frame" style="width: 600px;">
+  <div class="dialog-border">
+    <div class="dialog-header" bind="dialogHeader">Select Encoding</div>
+    <div class="dialog-body" bind="dialogBody">
+      <div id="select-encodings-tabs" class="refine-tabs">
+        <ul>
+          <li><a href="#select-encodings-tabs-common">Common Encodings</a></li>
+          <li><a href="#select-encodings-tabs-all">All Encodings</a></li>
+        </ul>
+        <div id="select-encodings-tabs-common">
+          <div class="select-encoding-dialog-encoding-list" bind="commonList"></div>
+        </div>
+        <div id="select-encodings-tabs-all" style="display: none;">
+          <div class="select-encoding-dialog-encoding-list" bind="allList"></div>
+        </div>
+      </div>
+    </div>
+    <div class="dialog-footer" bind="dialogFooter">
+      <button class="button" bind="cancelButton">Cancel</button>
+    </div>
+  </div>
+</div>
\ No newline at end of file
diff --git a/main/webapp/modules/core/scripts/util/string.js b/main/webapp/modules/core/scripts/util/string.js
index 4162a29b6..16091e52d 100644
--- a/main/webapp/modules/core/scripts/util/string.js
+++ b/main/webapp/modules/core/scripts/util/string.js
@@ -45,4 +45,16 @@ String.prototype.endsWith = function(s) {
 
 String.prototype.contains = function(s) {
   return this.indexOf(s) >= 0;
-};
\ No newline at end of file
+};
+
+String.encodeSeparator = function(s) {
+  return s.replace("\\", "\\\\")
+  .replace("\n", "\\n")
+  .replace("\t", "\\t");
+};
+
+String.decodeSeparator = function(s) {
+  return s.replace("\\n", "\n")
+  .replace("\\t", "\t")
+  .replace("\\\\", "\\");
+};
diff --git a/main/webapp/modules/core/styles/dialogs/custom-tabular-exporter-dialog.less b/main/webapp/modules/core/styles/dialogs/custom-tabular-exporter-dialog.less
new file mode 100644
index 000000000..de622a37c
--- /dev/null
+++ b/main/webapp/modules/core/styles/dialogs/custom-tabular-exporter-dialog.less
@@ -0,0 +1,66 @@
+/*
+
+Copyright 2010, Google Inc.
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are
+met:
+
+    * Redistributions of source code must retain the above copyright
+notice, this list of conditions and the following disclaimer.
+    * Redistributions in binary form must reproduce the above
+copyright notice, this list of conditions and the following disclaimer
+in the documentation and/or other materials provided with the
+distribution.
+    * Neither the name of Google Inc. nor the names of its
+contributors may be used to endorse or promote products derived from
+this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+"AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,           
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY           
+THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+*/
+
+@import-less url("../theme.less");
+
+#custom-tabular-exporter-tabs .ui-tabs-panel {
+  padding: @padding_looser;
+  }
+
+.custom-tabular-exporter-columns, .custom-tabular-exporter-column-options {
+  border: 1px solid @chrome_primary;
+  height: 22em;
+  padding: @padding_loose;
+  }
+.custom-tabular-exporter-columns {
+  overflow: auto;
+  }
+
+.custom-tabular-exporter-dialog-column {
+  border: 1px solid @chrome_primary;
+  background: @fill_secondary;
+  padding: @padding_tighter;
+  margin: @padding_tight;
+  cursor: move;
+  .rounded_corners();
+  }
+.custom-tabular-exporter-dialog-column.selected {
+  background: @chrome_primary;
+  font-weight: bold;
+  }
+  
+textarea.custom-tabular-exporter-code {
+  width: 100%;
+  border: 1px solid @chrome_primary;
+  height: 25em;
+  }
diff --git a/main/webapp/modules/core/styles/index/create-project-ui.less b/main/webapp/modules/core/styles/index/create-project-ui.less
index 341d20604..e64350f96 100644
--- a/main/webapp/modules/core/styles/index/create-project-ui.less
+++ b/main/webapp/modules/core/styles/index/create-project-ui.less
@@ -143,15 +143,3 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
   padding: @padding_normal;
   border: 1px solid @chrome_primary;
   }
-
-.select-encoding-dialog-encoding-list {
-  height: 20em;
-  overflow: auto;
-  }
-.select-encoding-dialog-encoding-list > table > tbody > tr > td,
-.select-encoding-dialog-encoding-list > table > tbody > tr > th {
-  padding: @padding_tight;
-  }
-.select-encoding-dialog-encoding-list a {
-  white-space: pre;
-  }
\ No newline at end of file
diff --git a/main/webapp/modules/core/styles/util/encoding.less b/main/webapp/modules/core/styles/util/encoding.less
new file mode 100644
index 000000000..1c64fccad
--- /dev/null
+++ b/main/webapp/modules/core/styles/util/encoding.less
@@ -0,0 +1,46 @@
+/*
+
+Copyright 2011, Google Inc.
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are
+met:
+
+    * Redistributions of source code must retain the above copyright
+notice, this list of conditions and the following disclaimer.
+    * Redistributions in binary form must reproduce the above
+copyright notice, this list of conditions and the following disclaimer
+in the documentation and/or other materials provided with the
+distribution.
+    * Neither the name of Google Inc. nor the names of its
+contributors may be used to endorse or promote products derived from
+this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+"AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,           
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY           
+THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+*/
+
+@import-less url("../theme.less");
+
+.select-encoding-dialog-encoding-list {
+  height: 20em;
+  overflow: auto;
+  }
+.select-encoding-dialog-encoding-list > table > tbody > tr > td,
+.select-encoding-dialog-encoding-list > table > tbody > tr > th {
+  padding: @padding_tight;
+  }
+.select-encoding-dialog-encoding-list a {
+  white-space: pre;
+  }
\ No newline at end of file