You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@zeppelin.apache.org by co...@apache.org on 2016/04/30 11:05:45 UTC
incubator-zeppelin git commit: [ZEPPELIN-672] Add feature to export
tables using Datatables
Repository: incubator-zeppelin
Updated Branches:
refs/heads/master c7b6eb6fb -> d481b56c5
[ZEPPELIN-672] Add feature to export tables using Datatables
### What is this PR for?
It is an extension of #6 #714
It allows user to export data in a paragraph to a TSV/CSV file.
### What type of PR is it?
Feature
### Todos
* [x] - Improves the current Table features like Search, Fixed Headers, Sorting
### Is there a relevant Jira issue?
[ZEPPELIN-672](https://issues.apache.org/jira/browse/ZEPPELIN-672)
### How should this be tested?
1. Create a paragraph with data in %table view
2. Click on TSV/CSV button to export CSV/TSV file
### Screenshots (if appropriate)
### Questions:
* Does the licenses files need update?
Need to have MIT license for Datatables.
* Is there breaking changes for older versions?
No
* Does this needs documentation?
No
Author: ankur_jain <an...@yash.com>
Author: Ankur Jain <an...@gmail.com>
Author: Damien CORNEAU <co...@gmail.com>
Closes #761 from ankurmitujjain/master and squashes the following commits:
4ddcc0f [Ankur Jain] Updated testcases for @corneadoug pull request
e6470aa [Ankur Jain] Merge pull request #1 from corneadoug/clean/dataframe
dd8901b [Damien CORNEAU] last fixes
5aca081 [Damien CORNEAU] Last Modifications
9c4412f [Damien CORNEAU] Remove buttons
2561630 [Ankur Jain] Updated for indent
c9b675d [Ankur Jain] Updated for indent
38ee3c3 [Ankur Jain] Updated for indent
b23cab4 [Ankur Jain] Updated for indent
09c87a0 [Ankur Jain] Updated for indent
e4b3abb [ankur_jain] Removed R.md accidentally added
d3aadc6 [ankur_jain] Updated testcase
210b7a6 [ankur_jain] Updates latest code of controller
80bd58c [ankur_jain] Merge branch 'upstream/master'
0ee76b1 [ankur_jain] Update 3 files
0c5f623 [ankur_jain] Revert "Merge branch 'upstream/master'"
adb66a3 [ankur_jain] Merge branch 'upstream/master'
6363e97 [ankur_jain] Merge branch 'master' of https://github.com/ankurmitujjain/incubator-zeppelin
0c94cab [ankur_jain] Merge branch 'master' of https://github.com/ankurmitujjain/incubator-zeppelin
d23202e [ankur_jain] Merge remote-tracking branch 'refs/remotes/origin/master' into apache/master
415c1f5 [ankur_jain] Merge branch 'apache/master'
7901f5e [ankur_jain] Merge branch 'refs/heads/master' into apache/master
6e6587b [ankur_jain] Updating codebase as per @prabhjyotsingh comments
aea8446 [ankur_jain] Merge branch 'apache/master'
df1620c [ankur_jain] Updated testcase as resultant paragraph have text of buttons and search box.
00b36e5 [ankur_jain] Reverted line 117 and 2122 as per previous code
9351a0d [ankur_jain] Committed for Datatables #6
Project: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/commit/d481b56c
Tree: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/tree/d481b56c
Diff: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/diff/d481b56c
Branch: refs/heads/master
Commit: d481b56c50d421d513d27adf0f72e516a40be944
Parents: c7b6eb6
Author: ankur_jain <an...@yash.com>
Authored: Mon Apr 18 11:12:01 2016 +0530
Committer: Damien CORNEAU <co...@gmail.com>
Committed: Sat Apr 30 18:05:33 2016 +0900
----------------------------------------------------------------------
zeppelin-web/Gruntfile.js | 5 +++
zeppelin-web/bower.json | 4 +-
.../notebook/paragraph/paragraph-results.html | 1 +
.../notebook/paragraph/paragraph.controller.js | 47 +++++++++++++-------
.../src/app/notebook/paragraph/paragraph.css | 15 +++++++
zeppelin-web/src/index.html | 10 +++++
6 files changed, 65 insertions(+), 17 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/d481b56c/zeppelin-web/Gruntfile.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/Gruntfile.js b/zeppelin-web/Gruntfile.js
index ce62d8b..71bdf15 100644
--- a/zeppelin-web/Gruntfile.js
+++ b/zeppelin-web/Gruntfile.js
@@ -356,6 +356,11 @@ module.exports = function (grunt) {
src: ['app/**/*.html', 'components/**/*.html']
}, {
expand: true,
+ cwd: 'bower_components/datatables/media/images',
+ src: '{,*/}*.{png,jpg,jpeg,gif}',
+ dest: '<%= yeoman.dist %>/images'
+ }, {
+ expand: true,
cwd: '.tmp/images',
dest: '<%= yeoman.dist %>/images',
src: ['generated/*']
http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/d481b56c/zeppelin-web/bower.json
----------------------------------------------------------------------
diff --git a/zeppelin-web/bower.json b/zeppelin-web/bower.json
index b5ec64e..b877303 100644
--- a/zeppelin-web/bower.json
+++ b/zeppelin-web/bower.json
@@ -30,7 +30,9 @@
"ngtoast": "~2.0.0",
"ng-focus-if": "~1.0.2",
"bootstrap3-dialog": "bootstrap-dialog#~1.34.7",
- "floatThead": "~1.3.2"
+ "floatThead": "~1.3.2",
+ "datatables.net-bs": "~1.10.11",
+ "datatables.net-buttons-bs": "~1.1.2"
},
"devDependencies": {
"angular-mocks": "1.5.0"
http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/d481b56c/zeppelin-web/src/app/notebook/paragraph/paragraph-results.html
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph-results.html b/zeppelin-web/src/app/notebook/paragraph/paragraph-results.html
index 77d7451..612fdbd 100644
--- a/zeppelin-web/src/app/notebook/paragraph/paragraph-results.html
+++ b/zeppelin-web/src/app/notebook/paragraph/paragraph-results.html
@@ -13,6 +13,7 @@ limitations under the License.
-->
<div
id="p{{paragraph.id}}_resize"
+ style='padding-bottom: 5px;'
resize='{"allowresize": "{{!asIframe && !viewOnly}}", "graphType": "{{getResultType()}}"}'
resizable on-resize="resizeParagraph(width, height);">
<div ng-include src="'app/notebook/paragraph/paragraph-graph.html'"></div>
http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/d481b56c/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js b/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
index c71e096..0de6584 100644
--- a/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
+++ b/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js
@@ -1265,40 +1265,55 @@ angular.module('zeppelinWebApp')
return '&#'+i.charCodeAt(0)+';';
});
}
- html += ' <td>'+formatTableContent(v)+'</td>';
+ html += ' <td>'+formatTableContent(v)+'</td>';
}
html += ' </tr>';
}
html += ' </tbody>';
html += '</table>';
- angular.element('#p' + $scope.paragraph.id + '_table').html(html);
+ var tableDomEl = angular.element('#p' + $scope.paragraph.id + '_table');
+ tableDomEl.html(html);
+ var oTable = tableDomEl.children(1).DataTable({
+ paging: false,
+ info: false,
+ autoWidth: false,
+ lengthChange: false,
+ searching: false,
+ dom: '<>'
+ });
+
if ($scope.paragraph.result.msgTable.length > 10000) {
- angular.element('#p' + $scope.paragraph.id + '_table').css('overflow', 'scroll');
- // set table height
- var height = $scope.paragraph.config.graph.height;
- angular.element('#p' + $scope.paragraph.id + '_table').css('height', height);
+ tableDomEl.css({
+ 'overflow': 'scroll',
+ 'height': $scope.paragraph.config.graph.height
+ });
} else {
+
var dataTable = angular.element('#p' + $scope.paragraph.id + '_table .table');
dataTable.floatThead({
- scrollContainer: function (dataTable) {
- return angular.element('#p' + $scope.paragraph.id + '_table');
+ scrollContainer: function(dataTable) {
+ return tableDomEl;
}
});
- angular.element('#p' + $scope.paragraph.id + '_table .table').on('remove', function () {
- angular.element('#p' + $scope.paragraph.id + '_table .table').floatThead('destroy');
+
+ dataTable.on('remove', function () {
+ dataTable.floatThead('destroy');
+ });
+
+ tableDomEl.css({
+ 'position': 'relative',
+ 'height': '100%'
});
+ tableDomEl.perfectScrollbar('destroy')
+ .perfectScrollbar({minScrollbarLength: 20});
- angular.element('#p' + $scope.paragraph.id + '_table').css('position', 'relative');
- angular.element('#p' + $scope.paragraph.id + '_table').css('height', '100%');
- angular.element('#p' + $scope.paragraph.id + '_table').perfectScrollbar('destroy');
- angular.element('#p' + $scope.paragraph.id + '_table').perfectScrollbar();
angular.element('.ps-scrollbar-y-rail').css('z-index', '1002');
// set table height
var psHeight = $scope.paragraph.config.graph.height;
- angular.element('#p' + $scope.paragraph.id + '_table').css('height', psHeight);
- angular.element('#p' + $scope.paragraph.id + '_table').perfectScrollbar('update');
+ tableDomEl.css('height', psHeight);
+ tableDomEl.perfectScrollbar('update');
}
};
http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/d481b56c/zeppelin-web/src/app/notebook/paragraph/paragraph.css
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph.css b/zeppelin-web/src/app/notebook/paragraph/paragraph.css
index b4873cf..60f3d7f 100644
--- a/zeppelin-web/src/app/notebook/paragraph/paragraph.css
+++ b/zeppelin-web/src/app/notebook/paragraph/paragraph.css
@@ -52,6 +52,21 @@
width: 100%;
}
+table.dataTable {
+ margin-top: 0px !important;
+ margin-bottom: 6px !important;
+}
+
+table.dataTable.table-condensed > thead > tr > th {
+ padding-right: 28px;
+}
+
+table.dataTable.table-condensed .sorting:after,
+table.dataTable.table-condensed .sorting_asc:after,
+table.dataTable.table-condensed .sorting_desc:after {
+ right: 12px;
+}
+
.graphContainer {
position: relative;
margin-bottom: 5px;
http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/d481b56c/zeppelin-web/src/index.html
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/index.html b/zeppelin-web/src/index.html
index f5be3ea..207320e 100644
--- a/zeppelin-web/src/index.html
+++ b/zeppelin-web/src/index.html
@@ -44,6 +44,8 @@ limitations under the License.
<link rel="stylesheet" href="bower_components/highlightjs/styles/github.css" />
<link rel="stylesheet" href="bower_components/ngtoast/dist/ngToast.css" />
<link rel="stylesheet" href="bower_components/bootstrap3-dialog/dist/css/bootstrap-dialog.min.css" />
+ <link rel="stylesheet" href="bower_components/datatables.net-bs/css/dataTables.bootstrap.css" />
+ <link rel="stylesheet" href="bower_components/datatables.net-buttons-bs/css/buttons.bootstrap.css" />
<!-- endbower -->
<link rel="stylesheet" href="bower_components/jquery-ui/themes/base/all.css" />
<!-- endbuild -->
@@ -132,6 +134,14 @@ limitations under the License.
<script src="bower_components/bootstrap3-dialog/dist/js/bootstrap-dialog.min.js"></script>
<script src="bower_components/floatThead/dist/jquery.floatThead.js"></script>
<script src="bower_components/floatThead/dist/jquery.floatThead.min.js"></script>
+ <script src="bower_components/datatables.net/js/jquery.dataTables.js"></script>
+ <script src="bower_components/datatables.net-bs/js/dataTables.bootstrap.js"></script>
+ <script src="bower_components/datatables.net-buttons/js/dataTables.buttons.js"></script>
+ <script src="bower_components/datatables.net-buttons/js/buttons.colVis.js"></script>
+ <script src="bower_components/datatables.net-buttons/js/buttons.flash.js"></script>
+ <script src="bower_components/datatables.net-buttons/js/buttons.html5.js"></script>
+ <script src="bower_components/datatables.net-buttons/js/buttons.print.js"></script>
+ <script src="bower_components/datatables.net-buttons-bs/js/buttons.bootstrap.js"></script>
<!-- endbower -->
<!-- endbuild -->
<!-- build:js({.tmp,src}) scripts/scripts.js -->