Skip to content

A
atlas
Commit 70f71570 by Hemanth Yamijala
Options

ATLAS-821 Atlas UI - Add arrow to navigate to child term (kevalbhatt18 via yhemanth)

parent 705014eb
Showing with 127 additions and 200 deletions
dashboardv2/public/css/scss/tree.scss
/* tree.scss */
/* .fuelux {
margin-top: 10px;
.tree {
padding-left: 0;
position: relative;
list-style: none;
ul {
padding-left: 0;
margin-top: 0;
margin-bottom: 0;
list-style: none;
}
li {
margin: 0;
margin-top: 5px;
margin-bottom: 5px;
}
.tree-loader {
margin-left: 45px;
}
.tree-branch {
.tree-branch-header {
color: $white;
position: relative;
white-space: nowrap;
padding: 4px 0;
.tree-branch-name {
white-space: nowrap;
background-color: transparent;
border: 0;
&:hover {
color: $white;
}
}
.glyphicon-menu-right {
font-size: 10px;
padding-right: 5px;
padding-left: 7px;
&:before {
position: relative;
top: -2px;
}
}
label {
font-weight: normal;
padding-left: 3px;
margin-bottom: 0;
cursor: pointer;
}
}
.tree-branch-children {
margin-left: 25px;
}
}
.tree-item {
white-space: nowrap;
position: relative;
cursor: pointer;
padding: 4px 0;
.tree-item-name {
color: $white;
white-space: nowrap;
background-color: transparent;
border: 0;
&:hover {
color: $white;
}
}
&.tree-selected {
background-color: $color_keppel_approx;
&:before {
content: "";
position: absolute;
background-color: $color_keppel_approx;
height: 33px;
top: 0;
left: -100%;
right: -100%;
z-index: -1;
}
}
label {
font-weight: normal;
padding-left: 7px;
margin-bottom: 0;
cursor: pointer;
}
}
*:focus {
outline: none;
}
button:focus {
color: $white;
}
.tree-open > .tree-branch-header .glyphicon-menu-right {
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
transform: rotate(90deg);
position: relative;
}
[data-children=false] > .tree-branch-header .icon-caret:before {
content: '\00a0';
}
.tree-branch[haschildren='false'] .icon-caret {
visibility: hidden;
}
.tree-branch[data-has-children='false'] .icon-caret {
visibility: hidden;
}
.icon-caret:hover + .tree-branch-name {
color: $white;
}
&.tree-folder-select .tree-branch {
.icon-folder {
visibility: hidden;
}
.icon-caret {
background-color: transparent;
border: 0;
&:hover {
cursor: pointer;
color: $white;
}
}
> .tree-branch-name {
padding: 1px 5px 0;
&.tree-selected {
background-color: $color_gallery_approx;
}
}
&.tree-selected > .tree-branch-header {
background-color: $color_keppel_approx;
&:before {
content: "";
position: absolute;
background-color: $color_keppel_approx;
height: 33px;
top: 0;
left: -100%;
right: -100%;
z-index: -1;
}
.tree-branch-name:hover {
background-color: $color_keppel_approx;
}
> .action-icons {
visibility: visible;
}
}
}
}
.action-icons {
visibility: hidden;
float: right;
a {
display: inline-block;
margin-left: 4px;
color: $white;
}
}
} */
.jstree-container-ul {
padding-left: 0px;
......@@ -216,7 +56,7 @@
width: 91%;
}
a {
max-width: 92%;
max-width: 90%;
}
}
}
......@@ -240,7 +80,7 @@
display: block;
color: $concrete;
white-space: nowrap;
padding: 5px 18px;
padding: 5px 25px;
text-overflow: ellipsis;
overflow: hidden;
cursor: pointer;
......@@ -249,8 +89,8 @@
background: $color_jungle_green_approx;
display: none;
position: absolute;
right: 3px;
padding: 5px 10px;
right: 2px;
padding: 5px;
}
}
}
......@@ -284,3 +124,10 @@
padding: 5px;
}
}
.toggleArrow {
position: absolute;
left: 0px;
padding: 8px;
cursor: pointer;
}
dashboardv2/public/js/router/Router.js
......@@ -108,6 +108,7 @@ define([
'views/business_catalog/SideNavLayoutView',
'collection/VCatalogList'
], function(BusinessCatalogHeader, BusinessCatalogDetailLayoutView, SideNavLayoutView, VCatalogList) {
var paramObj = Utils.getUrlState.getQueryParams();
this.collection = new VCatalogList();
this.collection.url = url;
App.rNHeader.show(new BusinessCatalogHeader({ 'globalVent': that.globalVent, 'url': url, 'collection': this.collection }));
......@@ -117,15 +118,13 @@ define([
} else {
var view = App.rSideNav.currentView.RBusinessCatalogLayoutView.currentView;
if (view.dblClick == false && view.singleClick == false && !Globals.saveApplicationState.tabState.stateChanged) {
if (paramObj && paramObj.back == "true") {
App.rSideNav.currentView.RBusinessCatalogLayoutView.currentView.manualRender(url, true, true);
} else {
App.rSideNav.currentView.RBusinessCatalogLayoutView.currentView.manualRender(url, true);
view.dblClick == false;
}
/* else if (view.firstManualClick) {
view.firstManualClick = false;
App.rSideNav.currentView.RBusinessCatalogLayoutView.currentView.manualRender(url);
}*/
else if (view.singleClick) {
view.dblClick == false;
} else if (view.singleClick) {
view.singleClick = false;
}
App.rSideNav.currentView.selectTab();
......
dashboardv2/public/js/views/business_catalog/BusinessCatalogHeader.js
......@@ -76,7 +76,7 @@ define(['require',
value = this.value,
that = this;
_.each(value, function(object) {
li += '<li><a href="/#!/taxonomy/detailCatalog/api/atlas/v1/taxonomies/' + object.href + '">' + object.value + '</a></li>';
li += '<li><a href="/#!/taxonomy/detailCatalog/api/atlas/v1/taxonomies/' + object.href + '?back=true">' + object.value + '</a></li>';
});
this.$('.breadcrumb').html(li);
//this.$(".breadcrumb").asBreadcrumbs("destroy");
......
dashboardv2/public/js/views/business_catalog/BusinessCatalogLayoutView.js
......@@ -40,6 +40,7 @@ define(['require',
chiledList: '[data-id="chiledList"]',
liClick: 'li a[data-href]',
backTaxanomy: '[data-id="backTaxanomy"]',
expandArrow: '[data-id="expandArrow"]'
},
/** ui events hash */
events: function() {
......@@ -53,9 +54,8 @@ define(['require',
this.dblClick = false;
this.forwardClick(e);
};
events['click ' + this.ui.backTaxanomy] = function(e) {
this.backButtonTaxanomy();
};
events['click ' + this.ui.backTaxanomy] = 'backButtonTaxanomy';
events['click ' + this.ui.expandArrow] = 'changeArrowState';
return events;
},
/**
......@@ -115,8 +115,48 @@ define(['require',
}
});
},
manualRender: function(url, isParent) {
manualRender: function(url, isParent, back) {
if (back) {
this.backButton = back;
}
if (this.ui.Parent.children().length <= 0 || this.backButton) {
this.fetchCollection(url, isParent);
}
if (url && isParent && !this.backButton) {
this.fetchCollection(url, isParent);
}
if (!url && !back && isParent) {
var url = this.$('.taxonomyTree').find('.active a').data('href');
this.forwardClick(undefined, undefined, url);
}
if (this.backButton) {
this.backButton = false;
}
},
changeArrowState: function(e) {
var scope = this.$('[data-id="expandArrow"]');
if (e) {
scope = $(e.currentTarget);
}
if (scope.hasClass('fa-chevron-down')) {
scope.removeClass('fa-chevron-down');
scope.addClass('fa-chevron-right');
this.addActiveClass(scope[0]);
this.ui.chiledList.hide();
} else {
if (e && $(e.currentTarget).parents('li.parentChiled').length) {
scope.parent('li').find('.tools .taxanomyloader').show();
this.forwardClick(e, true);
} else {
scope.addClass('fa-chevron-down');
scope.removeClass('fa-chevron-right');
this.singleClick = false;
this.ui.chiledList.show();
}
}
},
fetchCollection: function(url, isParent) {
if (url) {
......@@ -142,10 +182,18 @@ define(['require',
this.chiledCollection.fetch({ reset: true });
}
},
forwardClick: function(e, forward) {
var hrefUrl = $(e.currentTarget).data('href');
forwardClick: function(e, forward, url) {
var hrefUrl = "";
if (e) {
hrefUrl = $(e.currentTarget).data('href');
}
if (url) {
hrefUrl = url;
}
if (forward) {
this.dblClick = true;
this.ui.chiledList.show();
this.fetchCollection(hrefUrl, true);
} else {
this.singleClick = true;
......@@ -158,7 +206,9 @@ define(['require',
},
trigger: true
});
if (e) {
this.addActiveClass(e);
}
},
addActiveClass: function(e) {
$(e.currentTarget).parents('ul.taxonomyTree').find('li').removeClass('active');
......@@ -175,6 +225,8 @@ define(['require',
if (model.get('terms')) {
href = model.get('terms').href;
} else if (model.get('href')) {
href = model.get('href') + "/terms";
}
var hrefUrl = "/api" + model.get('href').split("/api")[1];
if (hrefUrl) {
......@@ -187,11 +239,12 @@ define(['require',
}
}
}
var name = model.get('name').split('.');
parentLi = '<div class="tools"><i class="fa fa-refresh fa-spin-custom taxanomyloader"></i><i class="fa fa-ellipsis-h termPopover"></i></div><a href="javascript:void(0)" data-href="' + hrefUrl + '">' + name[name.length - 1] + '</a>';
var name = Utils.checkTagOrTerm(model.get('name'));
parentLi = '<div class="tools"><i class="fa fa-refresh fa-spin-custom taxanomyloader"></i><i class="fa fa-ellipsis-h termPopover"></i></div><i class="fa fa-chevron-right toggleArrow" data-id="expandArrow" data-href="' + hrefUrl + '"></i><a href="javascript:void(0)" data-href="' + hrefUrl + '" data-name="`' + model.get('name') + '`">' + name.name + '</a>';
});
if (href) {
that.fetchCollection(href);
var hrefUrl = "/api" + href.split("/api")[1];
that.fetchCollection(hrefUrl);
}
that.ui.chiledList.html('');
that.ui.Parent.addClass('active');
......@@ -200,8 +253,9 @@ define(['require',
function createTerm() {
_.each(that.chiledCollection.fullCollection.models, function(model, key) {
var name = model.get('name').split('.');
chiledLi += '<li class="children"><div class="tools"><i class="fa fa-refresh fa-spin-custom taxanomyloader"></i><i class="fa fa-ellipsis-h termPopover" ></i></div><a href="javascript:void(0)" data-href="/api' + model.get('href').split("/api")[1] + '">' + name[name.length - 1] + '</a></li>';
var name = Utils.checkTagOrTerm(model.get('name'));
var hrefUrl = "/api" + model.get('href').split("/api")[1]
chiledLi += '<li class="children"><div class="tools"><i class="fa fa-refresh fa-spin-custom taxanomyloader"></i><i class="fa fa-ellipsis-h termPopover" ></i></div><i class="fa fa-chevron-right toggleArrow" data-id="expandArrow" data-href="' + hrefUrl + '"></i><a href="javascript:void(0)" data-href="' + hrefUrl + '" data-name="`' + model.get('name') + '`">' + name.name + '</a></li>';
});
that.ui.chiledList.html(chiledLi);
}
......@@ -209,6 +263,12 @@ define(['require',
if (isParent) {
createTaxonomy();
} else {
this.changeArrowState();
/* if (!this.create) {
this.changeArrowState();
} else {
this.create = false;
}*/
createTerm();
}
......@@ -221,7 +281,7 @@ define(['require',
container: 'body',
content: function() {
return "<ul class='termPopoverList'>" +
"<li class='listTerm' ><i class='fa fa-search'></i> <a href='javascript:void(0)' data-fn='onSearchTerm'>Search Asset</a></li>" +
"<li class='listTerm' ><i class='fa fa-search'></i> <a href='javascript:void(0)' data-fn='onSearchTerm'>Search Assets</a></li>" +
"<li class='listTerm'><i class='fa fa-plus'></i> <a href='javascript:void(0)' data-fn='onAddTerm'>Add Subterm</a></li>" +
/* "<li class='listTerm' ><i class='fa fa-arrow-right'></i> <a href='javascript:void(0)' data-fn='moveTerm'>Move Term</a></li>" +
"<li class='listTerm' ><i class='fa fa-edit'></i> <a href='javascript:void(0)' data-fn='onEditTerm'>Edit Term</a></li>" +
......@@ -265,12 +325,15 @@ define(['require',
},
saveAddTerm: function(view) {
var that = this;
view.model.url = view.url + "/terms/" + view.ui.termName.val();
var url = view.url;
view.model.url = url + "/terms/" + view.ui.termName.val();
view.model.set({ description: view.ui.termDetail.val() }).save(null, {
success: function(model, response) {
that.fetchCollection(that.url);
that.create = true;
that.forwardClick(undefined, true, url);
//that.fetchCollection(that.url);
Utils.notifySuccess({
content: "Term Created successfully"
content: "Term " + view.ui.termName.val() + " Created successfully"
});
},
error: function(model, response) {
......@@ -330,9 +393,9 @@ define(['require',
Utils.setUrl({
url: '#!/search/searchResult',
urlParams: {
query: this.$('.taxonomyTree').find('li.active').find("a").text(),
searchType: "fulltext",
dslChecked: false
query: this.$('.taxonomyTree').find('li.active').find("a").data('name'),
searchType: "dsl",
dslChecked: true
},
updateTabState: function() {
return { searchUrl: this.url, stateChanged: true };
......@@ -344,6 +407,7 @@ define(['require',
backButtonTaxanomy: function(e) {
var that = this;
this.dblClick = false;
this.backButton = true;
var dataURL = this.$('.taxonomyTree').find('li[data-id="Parent"]').find("a").data('href').split("/terms");
var backUrl = dataURL.pop();
if (dataURL.join("/terms").length) {
......
dashboardv2/public/js/views/graph/LineageLayoutView.js
......@@ -124,7 +124,17 @@ define(['require',
obj['toolTiplabel'] = values.name;
}
obj['class'] = "type-TOP";
if (data.GUID) {
that.g.setNode(data.GUID, obj);
} else {
if (data && data.definition) {
if (_.isString(data.definition.id)) {
that.g.setNode(data.definition.id, obj);
} else if (_.isString(data.definition.id.id)) {
that.g.setNode(data.definition.id.id, obj);
}
}
}
--that.fetchList;
if (that.fetchList <= 0) {
if (that.edgesAndvertices) {
......@@ -169,7 +179,9 @@ define(['require',
obj['class'] = "type-TOP";
obj['shape'] = "img";
obj['typeName'] = vertices[val].values.vertexId.values.typeName;
if (val && obj) {
that.g.setNode(val, obj);
}
} else {
fetchLoadProcess(val);
}
......@@ -186,7 +198,6 @@ define(['require',
};
_.each(valuObj.edges, function(val, key, obj) {
_.each(val, function(val1, key1, obj1) {
var chiledParent = {};
if (!obj[val1]) {
that.startingPoint.push(val1);
}
......@@ -215,18 +226,13 @@ define(['require',
}
},
createGraph: function(edgesAndvertices, startingPoint) {
var that = this;
this.g.nodes().forEach(function(v) {
var node = that.g.node(v);
// Round the corners of the nodes
node.rx = node.ry = 5;
});
// Set up edges, no special attributes.
// For input
var lastVal = "";
var that = this,
lastVal = "";
_.each(startingPoint, function(val, key, obj) {
_.each(edgesAndvertices.edges[val], function(val1) {
if (val && val1) {
that.g.setEdge(val, val1);
}
createRemaningEdge(edgesAndvertices.edges, val1);
});
});
......@@ -234,11 +240,21 @@ define(['require',
function createRemaningEdge(obj, starting) {
if (obj[starting] && obj[starting].length) {
_.each(obj[starting], function(val, key) {
if (starting && val) {
that.g.setEdge(starting, val);
}
createRemaningEdge(obj, val);
});
}
}
this.g.nodes().forEach(function(v) {
var node = that.g.node(v);
// Round the corners of the nodes
if (node) {
node.rx = node.ry = 5;
}
});
if (this.outputState) {
// Create the renderer
var render = new dagreD3.render();
......
release-log.txt
......@@ -22,6 +22,7 @@ ATLAS-409 Atlas will not import avro tables with schema read from a file (dosset
ATLAS-379 Create sqoop and falcon metadata addons (venkatnrangan,bvellanki,sowmyaramesh via shwethags)
ALL CHANGES:
ATLAS-821 Atlas UI - Add arrow to navigate to child term (kevalbhatt18 via yhemanth)
ATLAS-812 Atlas UI - Associate Terms with Assets (kevalbhatt18 via yhemanth)
ATLAS-809 JAAS configuration needed for Kafka interaction via Atlas config file (abhayk via shwethags)
ATLAS-817 Asset details page -- generate schema dynamically based on attributeDefinitions (kevalbhatt18 via yhemanth)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment