You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@atlas.apache.org by su...@apache.org on 2016/07/27 21:09:18 UTC
incubator-atlas git commit: ATLAS-1046 : UI: Search pagination
refinements
Repository: incubator-atlas
Updated Branches:
refs/heads/master 425237d59 -> 9ab13a315
ATLAS-1046 : UI: Search pagination refinements
Project: http://git-wip-us.apache.org/repos/asf/incubator-atlas/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-atlas/commit/9ab13a31
Tree: http://git-wip-us.apache.org/repos/asf/incubator-atlas/tree/9ab13a31
Diff: http://git-wip-us.apache.org/repos/asf/incubator-atlas/diff/9ab13a31
Branch: refs/heads/master
Commit: 9ab13a315bca318eb63a98ea50e2305f6362b8dd
Parents: 425237d
Author: kalyanikk <ka...@freestoneinfotech.com>
Authored: Wed Jul 27 20:26:30 2016 +0530
Committer: Suma Shivaprasad <su...@gmail.com>
Committed: Wed Jul 27 14:08:03 2016 -0700
----------------------------------------------------------------------
dashboardv2/public/css/scss/main.scss | 2 +-
dashboardv2/public/css/scss/override.scss | 13 +++++
dashboardv2/public/css/scss/search.scss | 4 ++
.../audit/AuditTableLayoutView_tmpl.html | 5 +-
.../js/templates/common/TableLayout_tmpl.html | 8 +--
.../search/SearchResultLayoutView_tmpl.html | 7 ++-
dashboardv2/public/js/utils/TableLayout.js | 5 +-
.../js/views/audit/AuditTableLayoutView.js | 60 +++++++++++++++-----
.../js/views/search/SearchResultLayoutView.js | 60 +++++++++++++++-----
release-log.txt | 1 +
10 files changed, 123 insertions(+), 42 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/9ab13a31/dashboardv2/public/css/scss/main.scss
----------------------------------------------------------------------
diff --git a/dashboardv2/public/css/scss/main.scss b/dashboardv2/public/css/scss/main.scss
index 82dbfc2..cac2e94 100644
--- a/dashboardv2/public/css/scss/main.scss
+++ b/dashboardv2/public/css/scss/main.scss
@@ -249,8 +249,8 @@ ul {
.ellipsis {
text-overflow: ellipsis;
- max-width: 98%;
overflow: hidden;
+ margin-bottom: 10px;
}
.modal-body {
http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/9ab13a31/dashboardv2/public/css/scss/override.scss
----------------------------------------------------------------------
diff --git a/dashboardv2/public/css/scss/override.scss b/dashboardv2/public/css/scss/override.scss
index 8732423..7c4ab45 100644
--- a/dashboardv2/public/css/scss/override.scss
+++ b/dashboardv2/public/css/scss/override.scss
@@ -169,3 +169,16 @@
}
}
}
+
+.backgrid-paginator ul {
+ margin: 0px;
+ float: right;
+ border-radius: 10px;
+ overflow: hidden;
+}
+
+.backgrid-paginator ul > .disabled > span,
+.backgrid-paginator ul > .disabled > a,
+.backgrid-paginator ul > .disabled > a:hover {
+ cursor: pointer;
+}
http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/9ab13a31/dashboardv2/public/css/scss/search.scss
----------------------------------------------------------------------
diff --git a/dashboardv2/public/css/scss/search.scss b/dashboardv2/public/css/scss/search.scss
index e42224e..959405e 100644
--- a/dashboardv2/public/css/scss/search.scss
+++ b/dashboardv2/public/css/scss/search.scss
@@ -92,3 +92,7 @@ input {
margin-top: 10px;
cursor: pointer
}
+
+.labelShowRecord {
+ line-height: 40px;
+}
http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/9ab13a31/dashboardv2/public/js/templates/audit/AuditTableLayoutView_tmpl.html
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/templates/audit/AuditTableLayoutView_tmpl.html b/dashboardv2/public/js/templates/audit/AuditTableLayoutView_tmpl.html
index 533f596..056ecaa 100644
--- a/dashboardv2/public/js/templates/audit/AuditTableLayoutView_tmpl.html
+++ b/dashboardv2/public/js/templates/audit/AuditTableLayoutView_tmpl.html
@@ -20,8 +20,8 @@
</div>
</div>
<div class="auditTable">
- <div id="r_auditTableLayoutView"></div>
- <ul class="pager">
+ <span class="labelShowRecord pull-left" data-id="pageRecordText"></span>
+ <ul class="pager pull-right">
<li>
<button class="btn" data-id="previousAuditData">Previous</button>
</li>
@@ -29,4 +29,5 @@
<button class="btn" data-id="nextAuditData">Next</button>
</li>
</ul>
+ <div id="r_auditTableLayoutView"></div>
</div>
http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/9ab13a31/dashboardv2/public/js/templates/common/TableLayout_tmpl.html
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/templates/common/TableLayout_tmpl.html b/dashboardv2/public/js/templates/common/TableLayout_tmpl.html
index a2735c1..e1ae64f 100644
--- a/dashboardv2/public/js/templates/common/TableLayout_tmpl.html
+++ b/dashboardv2/public/js/templates/common/TableLayout_tmpl.html
@@ -14,6 +14,10 @@
* See the License for the specific language governing permissions and
* limitations under the License.
-->
+<div class="row banded">
+ <div data-id="r_footerRecords" class="col-sm-6 margin-top-10"></div>
+ <div data-id="r_pagination" class="col-sm-6 text-right"></div>
+</div>
<div class="clearfix">
<div class="form-group pull-right no-margin">
<div data-id="control" class="pull-right"></div>
@@ -33,7 +37,3 @@
<i class="fa fa-refresh fa-spin-custom"></i>
</div>
</div>
-<div class="row banded">
- <div data-id="r_footerRecords" class="col-sm-6 margin-top-10"></div>
- <div data-id="r_pagination" class="col-sm-6 text-right"></div>
-</div>
http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/9ab13a31/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html b/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html
index 8e860d8..609ec23 100644
--- a/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html
+++ b/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html
@@ -20,10 +20,9 @@
</div>
<div class="ellipsis"><span class="searchResult" style=" font-size: 16px;"></span></div>
<div class="searchTable">
- <div id="r_searchResultTableLayoutView">
- </div>
+ <span class="labelShowRecord pull-left" data-id="pageRecordText"></span>
<div data-id="paginationDiv" style="display:none">
- <ul class="pager">
+ <ul class="pager pull-right">
<li>
<button class="btn" data-id="previousData" disabled=true>Previous</button>
</li>
@@ -32,5 +31,7 @@
</li>
</ul>
</div>
+ <div id="r_searchResultTableLayoutView">
+ </div>
</div>
</div>
http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/9ab13a31/dashboardv2/public/js/utils/TableLayout.js
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/utils/TableLayout.js b/dashboardv2/public/js/utils/TableLayout.js
index 4f5e142..c83cf76 100644
--- a/dashboardv2/public/js/utils/TableLayout.js
+++ b/dashboardv2/public/js/utils/TableLayout.js
@@ -308,10 +308,9 @@ define(['require',
renderFooterRecords: function(collectionState) {
var collState = collectionState;
var totalRecords = collState.totalRecords || 0;
- var pageStartIndex = totalRecords ? (collState.currentPage * collState.pageSize) : 0;
+ var pageStartIndex = totalRecords ? (collState.currentPage * collState.pageSize) : 1;
var pageEndIndex = pageStartIndex + this.collection.length;
-
- this.$('[data-id="r_footerRecords"]').html('Showing ' + (totalRecords ? pageStartIndex + 1 : 0) + ' to ' + pageEndIndex + ' of ' + totalRecords + ' entries');
+ this.$('[data-id="r_footerRecords"]').html('<h5>Showing ' + (totalRecords ? pageStartIndex + 1 : 0) + ' - ' + pageEndIndex + '</h5>');
return this;
},
/**
http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/9ab13a31/dashboardv2/public/js/views/audit/AuditTableLayoutView.js
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/views/audit/AuditTableLayoutView.js b/dashboardv2/public/js/views/audit/AuditTableLayoutView.js
index 7e5216d..1822e57 100644
--- a/dashboardv2/public/js/views/audit/AuditTableLayoutView.js
+++ b/dashboardv2/public/js/views/audit/AuditTableLayoutView.js
@@ -41,7 +41,8 @@ define(['require',
auditValue: "[data-id='auditValue']",
auditCreate: "[data-id='auditCreate']",
previousAuditData: "[data-id='previousAuditData']",
- nextAuditData: "[data-id='nextAuditData']"
+ nextAuditData: "[data-id='nextAuditData']",
+ pageRecordText: "[data-id='pageRecordText']"
},
/** ui events hash */
events: function() {
@@ -58,7 +59,7 @@ define(['require',
initialize: function(options) {
_.extend(this, _.pick(options, 'globalVent', 'guid'));
this.entityCollection = new VEntityList();
- this.count = 25;
+ this.count = 26;
this.entityCollection.url = "/api/atlas/entities/" + this.guid + "/audit";
this.entityCollection.modelAttrName = "events"
this.entityModel = new this.entityCollection.model();
@@ -76,6 +77,9 @@ define(['require',
filterOpts: {},
paginatorOpts: {}
};
+ this.currPage = 1;
+ // this.pageFrom = 1;
+ // this.pageTo = this.count;
},
onRender: function() {
$.extend(this.entityCollection.queryParams, { count: this.count });
@@ -86,6 +90,32 @@ define(['require',
});
this.renderTableLayoutView();
},
+ getToOffset: function() {
+ var toOffset = 0;
+ if (this.entityCollection.models.length < this.count) {
+ toOffset = ((this.currPage - 1) * (this.count - 1) + (this.entityCollection.models.length));
+ } else {
+ toOffset = ((this.currPage - 1) * (this.count - 1) + (this.entityCollection.models.length - 1));
+ }
+ return toOffset;
+ },
+ renderOffset: function(options) {
+ var that = this;
+ if (options.nextClick) {
+ options.previous.removeAttr("disabled");
+ if (that.entityCollection.length != 0) {
+ that.currPage++;
+ that.ui.pageRecordText.html("Showing " + ((that.currPage - 1) * (that.count - 1) + 1) + " - " + that.getToOffset());
+ }
+ }
+ if (options.previousClick) {
+ options.next.removeAttr("disabled");
+ if (that.currPage > 1 && that.entityCollection.models.length) {
+ that.currPage--;
+ that.ui.pageRecordText.html("Showing " + ((that.currPage - 1) * (that.count - 1) + 1) + " - " + that.getToOffset());
+ }
+ }
+ },
fetchCollection: function(options) {
var that = this;
this.$('.fontLoader').show();
@@ -97,26 +127,23 @@ define(['require',
}
this.entityCollection.fetch({
success: function() {
- that.$('.fontLoader').hide();
- that.$('.auditTable').show();
- options.previous.attr('disabled', true);
- if (that.entityCollection.models.length <= 1) {
+ if (that.entityCollection.models.length < that.count) {
+ options.previous.attr('disabled', true);
options.next.attr('disabled', true);
}
- if (that.entityCollection.models.length == 1 && that.next == that.entityCollection.last().get('eventKey')) {
+ if (!options.nextClick && !options.previousClick) {
+ that.ui.pageRecordText.html("Showing " + ((that.currPage - 1) * (that.count - 1) + 1) + " - " + that.getToOffset());
+ }
+ that.$('.fontLoader').hide();
+ that.$('.auditTable').show();
+ that.renderOffset(options);
+ if ((that.entityCollection.models.length < that.count && that.currPage == 1) && that.next == that.entityCollection.last().get('eventKey')) {
options.next.attr('disabled', true);
options.previous.removeAttr("disabled");
- that.entityCollection.reset();
} else {
if (that.entityCollection.models.length > 0) {
that.next = that.entityCollection.last().get('eventKey');
- if (options.nextClick) {
- options.previous.removeAttr("disabled");
- }
- if (options.previousClick) {
- options.previous.removeAttr("disabled");
- }
- if (that.pervOld.length == 0) {
+ if (that.pervOld.length === 0) {
options.previous.attr('disabled', true);
}
}
@@ -134,6 +161,9 @@ define(['require',
globalVent: that.globalVent,
columns: cols
})));
+ if (!(that.entityCollection.models.length < that.count)) {
+ that.RAuditTableLayoutView.$el.find('table tr').last().hide()
+ }
});
},
getAuditTableColumns: function() {
http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/9ab13a31/dashboardv2/public/js/views/search/SearchResultLayoutView.js
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/views/search/SearchResultLayoutView.js b/dashboardv2/public/js/views/search/SearchResultLayoutView.js
index 964bb8a..f9f82f4 100644
--- a/dashboardv2/public/js/views/search/SearchResultLayoutView.js
+++ b/dashboardv2/public/js/views/search/SearchResultLayoutView.js
@@ -53,7 +53,8 @@ define(['require',
showMoreLessTerm: '[data-id="showMoreLessTerm"]',
paginationDiv: '[data-id="paginationDiv"]',
previousData: "[data-id='previousData']",
- nextData: "[data-id='nextData']"
+ nextData: "[data-id='nextData']",
+ pageRecordText: "[data-id='pageRecordText']"
},
/** ui events hash */
@@ -114,9 +115,11 @@ define(['require',
this.entityModel = new VEntity();
this.searchCollection = new VSearchList();
this.limit = 25;
+ this.firstFetch = true;
this.fetchList = 0;
- if (options.value.searchType == "dsl") {
+ if (options.value.searchType === "dsl" || options.value.type === "dsl") {
pagination = false;
+ this.offset = 0;
} else {
pagination = true;
}
@@ -125,7 +128,7 @@ define(['require',
includeFilter: false,
includePagination: pagination,
includePageSize: false,
- includeFooterRecords: false,
+ includeFooterRecords: pagination,
includeSizeAbleColumns: false,
gridOpts: {
emptyText: 'No Record found!',
@@ -216,15 +219,48 @@ define(['require',
}
Globals.searchApiCallRef = this.searchCollection.fetch({
success: function() {
- if (that.searchCollection.length === 0) {
+ if (that.searchCollection.models.length < that.limit) {
that.ui.nextData.attr('disabled', true);
}
Globals.searchApiCallRef = undefined;
- if (that.searchCollection.toJSON().length == 0) {
+ if (that.offset === 0) {
+ that.pageFrom = 1;
+ that.pageTo = that.limit;
+ if (that.searchCollection.length > 0) {
+ that.ui.pageRecordText.html("Showing " + that.pageFrom + " - " + that.searchCollection.length);
+ }
+ } else if (that.searchCollection.models.length && !that.previousClick) {
+ //on next click, adding "1" for showing the another records..
+ that.pageFrom = that.pageTo + 1;
+ that.pageTo = that.pageTo + that.searchCollection.models.length;
+ if (that.pageFrom && that.pageTo) {
+ that.ui.pageRecordText.html("Showing " + that.pageFrom + " - " + that.pageTo);
+ }
+ } else if (that.previousClick) {
+ that.pageTo = (that.pageTo - (that.pageTo - that.pageFrom)) - 1;
+ //if limit is 0 then result is change to 1 because page count is showing from 1
+ that.pageFrom = (that.pageFrom - that.limit === 0 ? 1 : that.pageFrom - that.limit);
+ that.ui.pageRecordText.html("Showing " + that.pageFrom + " - " + that.pageTo);
+ }
+ if (that.searchCollection.models.length === 0) {
that.checkTableFetch();
+ that.offset = that.offset - that.limit;
+ if (that.firstFetch) {
+ that.ui.paginationDiv.hide();
+ that.renderTableLayoutView();
+ }
+ }
+ if (that.firstFetch) {
+ that.firstFetch = false;
}
- that.renderTableLayoutView();
- var resultData = that.searchCollection.fullCollection.length + ' results for <b>' + that.searchCollection.queryParams.query + '</b>'
+ if (that.offset < that.limit) {
+ that.ui.previousData.attr('disabled', true);
+ }
+ // checking length for not rendering the table
+ if (that.searchCollection.models.length) {
+ that.renderTableLayoutView();
+ }
+ var resultData = 'Results for <b>' + that.searchCollection.queryParams.query + '</b>'
var multiAssignData = '<a href="javascript:void(0)" class="inputAssignTag multiSelect" style="display:none" data-id="addTerm"><i class="fa fa-folder-o"></i>' + " " + 'Assign Term</a>'
that.$('.searchResult').html(resultData + multiAssignData);
},
@@ -282,7 +318,7 @@ define(['require',
this.$('.fontLoader').hide();
this.$('.searchTable').show();
this.$('.searchResult').show();
- if (this.value.searchType == "dsl") {
+ if (this.value.searchType == "dsl" || this.value.type === "dsl") {
this.ui.paginationDiv.show();
} else {
this.ui.paginationDiv.hide();
@@ -591,9 +627,7 @@ define(['require',
return that.offset;
}
});
- if (this.offset > this.limit) {
- this.ui.nextData.attr('disabled', true);
- }
+ this.previousClick = false;
this.fetchCollection();
},
onClickpreviousData: function() {
@@ -605,9 +639,7 @@ define(['require',
return that.offset;
}
});
- if (this.offset <= that.limit) {
- this.ui.previousData.attr('disabled', true);
- }
+ this.previousClick = true;
this.fetchCollection();
},
});
http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/9ab13a31/release-log.txt
----------------------------------------------------------------------
diff --git a/release-log.txt b/release-log.txt
index 20accdd..47f8eb6 100644
--- a/release-log.txt
+++ b/release-log.txt
@@ -6,6 +6,7 @@ INCOMPATIBLE CHANGES:
ALL CHANGES:
+ATLAS-1046 UI: Search pagination refinements (Kalyanikashikar via sumasai)
ATLAS-1056 Differentiate between tag and term using attribute "taxonomy.namespace" (kevalbhat18 via sumasai)
ATLAS-1059 Change log level to debug for search APIs(sumasai)
ATLAS-1049 Fix validation while filtering by supertypes(mneethiraj via sumasai)