You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@atlas.apache.org by sa...@apache.org on 2019/10/23 19:18:58 UTC
[atlas] branch master updated: ATLAS-3484:Beta UI: Add more resize
flexibility for sidebar
This is an automated email from the ASF dual-hosted git repository.
sarath pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/atlas.git
The following commit(s) were added to refs/heads/master by this push:
new 848c799 ATLAS-3484:Beta UI: Add more resize flexibility for sidebar
848c799 is described below
commit 848c799e31591e1ac82471fc564689173b6bb522
Author: kevalbhatt <kb...@apache.org>
AuthorDate: Wed Oct 23 12:25:35 2019 +0530
ATLAS-3484:Beta UI: Add more resize flexibility for sidebar
Signed-off-by: Sarath Subramanian <sa...@apache.org>
---
dashboardv2/public/css/scss/table.scss | 5 +
dashboardv2/public/js/utils/Overrides.js | 18 ++++
.../js/views/entity/CreateEntityLayoutView.js | 2 +-
.../js/views/search/SearchResultLayoutView.js | 3 +-
dashboardv3/public/css/bootstrap-sidebar.css | 4 +-
dashboardv3/public/css/scss/leftsidebar.scss | 35 +++++--
dashboardv3/public/css/scss/table.scss | 5 +
dashboardv3/public/css/scss/theme.scss | 12 +--
dashboardv3/public/js/utils/Helper.js | 1 +
dashboardv3/public/js/utils/Overrides.js | 18 ++++
.../js/views/entity/CreateEntityLayoutView.js | 2 +-
.../views/search/SearchFilterBrowseLayoutView.js | 109 +++------------------
.../js/views/search/SearchResultLayoutView.js | 3 +-
.../js/views/search/save/SaveModalLayoutView.js | 16 +--
.../search/tree/ClassificationTreeLayoutView.js | 43 ++++----
.../search/tree/CustomFilterTreeLayoutView.js | 22 ++++-
.../js/views/search/tree/EntityTreeLayoutView.js | 50 ++++------
.../js/views/search/tree/GlossaryTreeLayoutView.js | 100 ++++---------------
18 files changed, 179 insertions(+), 269 deletions(-)
diff --git a/dashboardv2/public/css/scss/table.scss b/dashboardv2/public/css/scss/table.scss
index f14ebfb..4ed47ff 100644
--- a/dashboardv2/public/css/scss/table.scss
+++ b/dashboardv2/public/css/scss/table.scss
@@ -222,11 +222,14 @@ td {
}
&.searchTableName {
+ min-width: 150px;
+
&:hover {
img {
transform: scale(1.5);
transform-origin: 100% 50%;
transition: transform 0.2s;
+ outline-color: #f5f5f5;
}
}
@@ -241,6 +244,8 @@ td {
height: 20px;
margin: 0px 5px;
float: left;
+ outline: 1px #fff solid;
+ outline-offset: -1px;
}
}
}
\ No newline at end of file
diff --git a/dashboardv2/public/js/utils/Overrides.js b/dashboardv2/public/js/utils/Overrides.js
index 61c9595..fcb24e8 100644
--- a/dashboardv2/public/js/utils/Overrides.js
+++ b/dashboardv2/public/js/utils/Overrides.js
@@ -202,4 +202,22 @@ define(['require', 'utils/Utils', 'marionette', 'backgrid', 'asBreadcrumbs', 'jq
return this;
}
});
+
+ var HeaderDecodeCell = Backgrid.HeaderHTMLDecodeCell = Backgrid.HeaderCell.extend({
+ initialize: function(options) {
+ Backgrid.HeaderCell.prototype.initialize.apply(this, arguments);
+ this.name = _.unescape(this.column.get("name"))
+ // Add class
+ this.$el.addClass(this.name);
+ },
+ render: function() {
+ this.$el.empty();
+
+ // Add to header
+ this.$el.text(this.name);
+
+ this.delegateEvents();
+ return this;
+ }
+ });
});
\ No newline at end of file
diff --git a/dashboardv2/public/js/views/entity/CreateEntityLayoutView.js b/dashboardv2/public/js/views/entity/CreateEntityLayoutView.js
index 00f6d0e..4112988 100644
--- a/dashboardv2/public/js/views/entity/CreateEntityLayoutView.js
+++ b/dashboardv2/public/js/views/entity/CreateEntityLayoutView.js
@@ -496,7 +496,7 @@ define(['require',
},
getContainer: function(object) {
var value = object.value,
- entityLabel = this.capitalize(value.name);
+ entityLabel = this.capitalize(_.escape(value.name));
return '<div class=" row ' + value.isOptional + '"><span class="col-sm-3">' +
'<label><span class="' + (value.isOptional ? 'true' : 'false required') + '">' + entityLabel + '</span><span class="center-block ellipsis-with-margin text-gray" title="Data Type : ' + value.typeName + '">' + '(' + Utils.escapeHtml(value.typeName) + ')' + '</span></label></span>' +
diff --git a/dashboardv2/public/js/views/search/SearchResultLayoutView.js b/dashboardv2/public/js/views/search/SearchResultLayoutView.js
index d82ed97..bbff888 100644
--- a/dashboardv2/public/js/views/search/SearchResultLayoutView.js
+++ b/dashboardv2/public/js/views/search/SearchResultLayoutView.js
@@ -800,8 +800,9 @@ define(['require',
return;
}
col[obj.name] = {
- label: obj.name.capitalize(),
+ label: _.escape(obj.name).capitalize(),
cell: "Html",
+ headerCell: Backgrid.HeaderHTMLDecodeCell,
editable: false,
resizeable: true,
orderable: true,
diff --git a/dashboardv3/public/css/bootstrap-sidebar.css b/dashboardv3/public/css/bootstrap-sidebar.css
index 1597d18..c66e4e1 100644
--- a/dashboardv3/public/css/bootstrap-sidebar.css
+++ b/dashboardv3/public/css/bootstrap-sidebar.css
@@ -20,13 +20,13 @@
}
#sidebar-wrapper {
- z-index: 1000;
+ z-index: 2;
position: fixed;
/*left: 350px;*/
/*width: 0;*/
height: 100%;
/*margin-left: -350px;*/
- overflow-y: auto;
+ /*overflow-y: auto;*/
background: #fff;
-moz-transition: left 0.3s;
-o-transition: left 0.3s;
diff --git a/dashboardv3/public/css/scss/leftsidebar.scss b/dashboardv3/public/css/scss/leftsidebar.scss
index 734af6c..a0a7c71 100644
--- a/dashboardv3/public/css/scss/leftsidebar.scss
+++ b/dashboardv3/public/css/scss/leftsidebar.scss
@@ -24,6 +24,7 @@
&.panel-default>.panel-heading {
border-color: $color_mystic_approx;
border-width: 2px;
+ min-width: 222px;
button {
height: inherit;
@@ -77,8 +78,6 @@
overflow: auto;
height: calc(100vh - 188px);
-
-
.panel-collapse {
padding-top: 7px;
}
@@ -95,7 +94,7 @@
.jstree-default .jstree-node {
position: relative;
- max-width: 300px;
+ max-width: 100%;
}
.tag-tree>li.parent-node>div:hover {
@@ -278,8 +277,6 @@
color: $action_gray;
}
}
-
-
}
.sidebar-content {
@@ -333,17 +330,18 @@
.slider-bar {
position: absolute;
- right: 6px;
+ right: 0px;
height: 100%;
- width: 9px;
+ width: 13px;
cursor: col-resize;
z-index: 999;
+ background: $white;
.line {
position: absolute;
height: 100%;
background: $color_mystic_approx;
- left: 1px;
+ left: -2px;
width: 2px;
}
@@ -366,7 +364,7 @@
background-color: $white;
position: absolute;
color: $color_havelock_blue_approx;
- right: -6px;
+ right: 0px;
border-radius: 16px;
display: none;
top: 9px;
@@ -378,4 +376,23 @@
border: 2px solid $color_havelock_blue_approx;
}
}
+}
+
+span.tree-tooltip {
+ position: fixed;
+ display: none;
+ top: calc(346px - 39px);
+ left: 138px;
+ z-index: 1004;
+ background: #f9f9f9;
+ color: #2c2c2c;
+ padding: 5px;
+ height: 36px;
+ box-shadow: 0px 0px 3px 0px #8080806b;
+ border: 1px solid #80808057;
+ border-radius: 9px;
+
+ &.show {
+ display: block;
+ }
}
\ No newline at end of file
diff --git a/dashboardv3/public/css/scss/table.scss b/dashboardv3/public/css/scss/table.scss
index 06fb29b..4010599 100644
--- a/dashboardv3/public/css/scss/table.scss
+++ b/dashboardv3/public/css/scss/table.scss
@@ -216,11 +216,14 @@ td {
}
&.searchTableName {
+ min-width: 150px;
+
&:hover {
img {
transform: scale(1.5);
transform-origin: 100% 50%;
transition: transform 0.2s;
+ outline-color: #f5f5f5;
}
}
@@ -235,6 +238,8 @@ td {
height: 20px;
margin: 0px 5px;
float: left;
+ outline: 1px #fff solid;
+ outline-offset: -1px;
}
}
}
\ No newline at end of file
diff --git a/dashboardv3/public/css/scss/theme.scss b/dashboardv3/public/css/scss/theme.scss
index 59e8aef..cb8cc4d 100644
--- a/dashboardv3/public/css/scss/theme.scss
+++ b/dashboardv3/public/css/scss/theme.scss
@@ -33,6 +33,8 @@ body {
}
#page-wrapper {
+ height: calc(100vh - 90px);
+ overflow: auto;
padding-top: 15px !important;
padding-bottom: 10px !important;
}
@@ -72,7 +74,6 @@ body {
&:hover {
color: $gray;
}
-
}
.atlas-page-header {
@@ -210,7 +211,6 @@ header.atlas-header {
}
}
-
td {
padding: 0px 15px;
@@ -227,7 +227,6 @@ header.atlas-header {
font-size: 18px;
}
}
-
}
}
}
@@ -688,12 +687,10 @@ hr[size="10"] {
box-shadow: 0px 0px 3px 0px #8080806b;
}
-
.tooltip.bottom .tooltip-arrow {
border-bottom-color: #000;
}
-
td.searchTableName:hover {
.isIncomplete {
&.show.search-result-page {
@@ -718,7 +715,7 @@ td.searchTableName:hover {
.isIncomplete {
&.show {
img {
- opacity: .2;
+ opacity: 0.2;
//animation: blink 2.5s infinite;
}
@@ -735,7 +732,6 @@ td.searchTableName:hover {
}
}
-
foreignObject {
display: block;
@@ -759,9 +755,7 @@ td.searchTableName:hover {
font-size: 9px;
top: 5px;
}
-
}
-
}
foreignObject {
diff --git a/dashboardv3/public/js/utils/Helper.js b/dashboardv3/public/js/utils/Helper.js
index 508b8a0..f18cdc4 100644
--- a/dashboardv3/public/js/utils/Helper.js
+++ b/dashboardv3/public/js/utils/Helper.js
@@ -78,6 +78,7 @@ define(['require',
} else if (isPopOverEl.$tip) {
$('.popover').not(isPopOverEl.$tip).popover('hide');
}
+ $(".tree-tooltip").removeClass("show");
$(".tooltip").tooltip("hide");
}
});
diff --git a/dashboardv3/public/js/utils/Overrides.js b/dashboardv3/public/js/utils/Overrides.js
index 61c9595..fcb24e8 100644
--- a/dashboardv3/public/js/utils/Overrides.js
+++ b/dashboardv3/public/js/utils/Overrides.js
@@ -202,4 +202,22 @@ define(['require', 'utils/Utils', 'marionette', 'backgrid', 'asBreadcrumbs', 'jq
return this;
}
});
+
+ var HeaderDecodeCell = Backgrid.HeaderHTMLDecodeCell = Backgrid.HeaderCell.extend({
+ initialize: function(options) {
+ Backgrid.HeaderCell.prototype.initialize.apply(this, arguments);
+ this.name = _.unescape(this.column.get("name"))
+ // Add class
+ this.$el.addClass(this.name);
+ },
+ render: function() {
+ this.$el.empty();
+
+ // Add to header
+ this.$el.text(this.name);
+
+ this.delegateEvents();
+ return this;
+ }
+ });
});
\ No newline at end of file
diff --git a/dashboardv3/public/js/views/entity/CreateEntityLayoutView.js b/dashboardv3/public/js/views/entity/CreateEntityLayoutView.js
index d327848..05a9d49 100644
--- a/dashboardv3/public/js/views/entity/CreateEntityLayoutView.js
+++ b/dashboardv3/public/js/views/entity/CreateEntityLayoutView.js
@@ -498,7 +498,7 @@ define(['require',
},
getContainer: function(object) {
var value = object.value,
- entityLabel = this.capitalize(value.name);
+ entityLabel = this.capitalize(_.escape(value.name));
return '<div class=" row ' + value.isOptional + '"><span class="col-sm-3">' +
'<label><span class="' + (value.isOptional ? 'true' : 'false required') + '">' + entityLabel + '</span><span class="center-block ellipsis-with-margin text-gray" title="Data Type : ' + value.typeName + '">' + '(' + Utils.escapeHtml(value.typeName) + ')' + '</span></label></span>' +
diff --git a/dashboardv3/public/js/views/search/SearchFilterBrowseLayoutView.js b/dashboardv3/public/js/views/search/SearchFilterBrowseLayoutView.js
index dca2a51..4bc741c 100644
--- a/dashboardv3/public/js/views/search/SearchFilterBrowseLayoutView.js
+++ b/dashboardv3/public/js/views/search/SearchFilterBrowseLayoutView.js
@@ -58,6 +58,7 @@ define([
e.stopPropagation();
$("#sidebar-wrapper,#page-wrapper").addClass("animate-me");
$(".container-fluid.view-container").toggleClass("slide-in");
+ $("#page-wrapper>div").css({ width: "auto" });
$("#sidebar-wrapper,.search-browse-box,#page-wrapper").removeAttr("style");
setTimeout(function() {
$("#sidebar-wrapper,#page-wrapper").removeClass("animate-me");
@@ -122,7 +123,6 @@ define([
this.renderClassificationTree();
this.renderGlossaryTree();
this.renderCustomFilterTree();
- // this.renderSaveSearch();
this.showHideGlobalFilter();
this.showDefaultPage();
},
@@ -143,16 +143,25 @@ define([
onShow: function() {
var that = this;
this.$(".search-browse-box").resizable({
- handles: { 'e': '.slider-bar' },
- minWidth: 224,
- maxWidth: 360,
+ handles: { "e": ".slider-bar" },
+ minWidth: 30,
+ minHeight: window.screen.height,
resize: function(event, ui) {
var width = ui.size.width,
calcWidth = "calc(100% - " + width + "px)";
$("#sidebar-wrapper").width(width);
- $("#page-wrapper").css({ "width": calcWidth, marginLeft: width + "px" });
+ $("#page-wrapper").css({ width: calcWidth, marginLeft: width + "px" });
+ var selectedEl = $("#page-wrapper>div");
+ if (width > 700) {
+ $("#page-wrapper").css({ overflowX: "auto" });
+ selectedEl.css({ width: window.screen.width - 360 });
+ } else {
+ $("#page-wrapper").css({ overflow: "none" });
+ selectedEl.css({ width: "100%" });
+ }
},
start: function() {
+ $(".searchLayoutView").removeClass("open");
this.expanding = $(".container-fluid.view-container").hasClass("slide-in");
$(".container-fluid.view-container").removeClass("slide-in");
if (this.expanding) {
@@ -160,7 +169,7 @@ define([
}
},
stop: function(event, ui) {
- if (!this.expanding && ui.size.width < 225) {
+ if (!this.expanding && ui.size.width <= 30) {
$("#sidebar-wrapper,#page-wrapper").addClass("animate-me");
$("#sidebar-wrapper,#page-wrapper,.search-browse-box").removeAttr("style");
$(".container-fluid.view-container").addClass("slide-in");
@@ -169,7 +178,7 @@ define([
$("#sidebar-wrapper,#page-wrapper").removeClass("animate-me");
}, 301);
}
- })
+ });
},
showHideGlobalFilter: function() {
if (this.options.fromDefaultSearch) {
@@ -178,92 +187,6 @@ define([
this.$(".mainContainer").addClass("global-filter-browser");
}
},
- // renderSaveSearch: function() {
- // var that = this;
- // require(["views/search/save/SaveSearchView"], function(SaveSearchView) {
- // var saveSearchBaiscCollection = new VSearchList(),
- // saveSearchAdvanceCollection = new VSearchList(),
- // saveSearchCollection = new VSearchList();
- // saveSearchCollection.url = UrlLinks.saveSearchApiUrl();
- // saveSearchBaiscCollection.fullCollection.comparator = function(model) {
- // return getModelName(model);
- // };
- // saveSearchAdvanceCollection.fullCollection.comparator = function(model) {
- // return getModelName(model);
- // };
- // var obj = {
- // value: that.options.value,
- // searchVent: that.searchVent,
- // typeHeaders: that.typeHeaders,
- // fetchCollection: fetchSaveSearchCollection,
- // classificationDefCollection: that.classificationDefCollection,
- // entityDefCollection: that.entityDefCollection,
- // getValue: function() {
- // var queryObj = that.query[that.type],
- // entityObj = that.searchTableFilters["entityFilters"],
- // tagObj = that.searchTableFilters["tagFilters"],
- // urlObj = Utils.getUrlState.getQueryParams();
- // if (urlObj) {
- // // includeDE value in because we need to send "true","false" to the server.
- // urlObj.includeDE = urlObj.includeDE == "true" ? true : false;
- // urlObj.excludeSC = urlObj.excludeSC == "true" ? true : false;
- // urlObj.excludeST = urlObj.excludeST == "true" ? true : false;
- // }
- // return _.extend({}, queryObj, urlObj, {
- // entityFilters: entityObj ? entityObj[queryObj.type] : null,
- // tagFilters: tagObj ? tagObj[queryObj.tag] : null,
- // type: queryObj.type,
- // query: queryObj.query,
- // term: queryObj.term,
- // tag: queryObj.tag
- // });
- // },
- // applyValue: function(model, searchType) {
- // that.manualRender(
- // _.extend(
- // searchType,
- // CommonViewFunction.generateUrlFromSaveSearchObject({
- // value: { searchParameters: model.get("searchParameters"), uiParameters: model.get("uiParameters") },
- // classificationDefCollection: that.classificationDefCollection,
- // entityDefCollection: that.entityDefCollection
- // })
- // )
- // );
- // }
- // };
-
- // // will be shown as different tab on the screen.
- // that.RSaveSearchBasic.show(
- // new SaveSearchView(
- // _.extend(obj, {
- // isBasic: true,
- // displayButtons: false,
- // collection: saveSearchBaiscCollection.fullCollection
- // })
- // )
- // );
- // // that.RSaveSearchAdvance.show(new SaveSearchView(_.extend(obj, {
- // // isBasic: false,
- // // collection: saveSearchAdvanceCollection.fullCollection
- // // })));
- // function getModelName(model) {
- // if (model.get('name')) {
- // return model.get('name').toLowerCase();
- // }
- // }
-
- // function fetchSaveSearchCollection() {
- // saveSearchCollection.fetch({
- // success: function(collection, data) {
- // saveSearchAdvanceCollection.fullCollection.reset(_.where(data, { searchType: "ADVANCED" }));
- // saveSearchBaiscCollection.fullCollection.reset(_.where(data, { searchType: "BASIC" }));
- // },
- // silent: true
- // });
- // }
- // fetchSaveSearchCollection();
- // });
- // },
manualRender: function(options) {
var that = this;
if (options) {
diff --git a/dashboardv3/public/js/views/search/SearchResultLayoutView.js b/dashboardv3/public/js/views/search/SearchResultLayoutView.js
index cb0c6be..8abeafe 100644
--- a/dashboardv3/public/js/views/search/SearchResultLayoutView.js
+++ b/dashboardv3/public/js/views/search/SearchResultLayoutView.js
@@ -812,8 +812,9 @@ define(['require',
return;
}
col[obj.name] = {
- label: obj.name.capitalize(),
+ label: _.escape(obj.name).capitalize(),
cell: "Html",
+ headerCell: Backgrid.HeaderHTMLDecodeCell,
editable: false,
resizeable: true,
orderable: true,
diff --git a/dashboardv3/public/js/views/search/save/SaveModalLayoutView.js b/dashboardv3/public/js/views/search/save/SaveModalLayoutView.js
index ac31a00..bec5017 100644
--- a/dashboardv3/public/js/views/search/save/SaveModalLayoutView.js
+++ b/dashboardv3/public/js/views/search/save/SaveModalLayoutView.js
@@ -38,7 +38,7 @@ define(['require',
},
templateHelpers: function() {
return {
- selectedModel: this.selectedModel ? this.selectedModel : null
+ selectedModel: this.selectedModel ? this.selectedModel.toJSON() : null
};
},
events: function() {
@@ -48,12 +48,6 @@ define(['require',
initialize: function(options) {
var that = this;
_.extend(this, _.pick(options, 'selectedModel', 'collection', 'getValue', 'isBasic', 'saveObj'));
- if (this.selectedModel) {
- var modelDetail = this.selectedModel.toJSON();
- modelDetail.name = _.unescape(modelDetail.name);
- this.selectedModel = modelDetail;
- }
-
this.model = new VSearch();
if (this.saveObj) {
this.onCreateButton();
@@ -87,10 +81,10 @@ define(['require',
},
onCreateButton: function(modal) {
var that = this,
- obj = { name: this.ui.saveAsName.val ? _.escape(this.ui.saveAsName.val()) : null };
+ obj = { name: this.ui.saveAsName.val ? this.ui.saveAsName.val() : null };
if (this.selectedModel) {
// Update Name only.
- var saveObj = this.selectedModel;
+ var saveObj = this.selectedModel.toJSON();
saveObj.name = obj.name;
} else {
obj.value = this.getValue();
@@ -116,12 +110,12 @@ define(['require',
collectionRef.set(data);
}
Utils.notifySuccess({
- content: _.unescape(obj.name) + Messages.editSuccessMessage
+ content: obj.name + Messages.editSuccessMessage
});
} else {
that.collection.add(data);
Utils.notifySuccess({
- content: _.unescape(obj.name) + Messages.addSuccessMessage
+ content: obj.name + Messages.addSuccessMessage
});
}
}
diff --git a/dashboardv3/public/js/views/search/tree/ClassificationTreeLayoutView.js b/dashboardv3/public/js/views/search/tree/ClassificationTreeLayoutView.js
index 2022bf2..d395761 100644
--- a/dashboardv3/public/js/views/search/tree/ClassificationTreeLayoutView.js
+++ b/dashboardv3/public/js/views/search/tree/ClassificationTreeLayoutView.js
@@ -83,9 +83,7 @@ define([
var type = $(e.currentTarget).data("type");
e.stopPropagation();
this.isGroupView = !this.isGroupView;
- // this.ui.groupOrFlatTree.attr("data-original-title", (this.isGroupView ? "Show flat tree" : "Show group tree"));
this.ui.groupOrFlatTree.tooltip('hide');
- // this.ui.groupOrFlatTree.find("i").toggleClass("group-tree-deactivate");
this.ui.groupOrFlatTree.find("i").toggleClass("fa-sitemap fa-list-ul");
this.ui.groupOrFlatTree.find("span").html(this.isGroupView ? "Show flat tree" : "Show group tree");
that.ui[type + "SearchTree"].jstree(true).destroy();
@@ -210,7 +208,6 @@ define([
this.classificationSwitchBtnUpdate();
},
classificationSwitchBtnUpdate: function() {
- // this.ui.showEmptyClassifications.attr("title", (this.isEmptyClassification ? "Show" : "Hide") + " unused classification");
this.ui.showEmptyClassifications.attr("data-original-title", (this.isEmptyClassification ? "Show" : "Hide") + " unused classification");
this.ui.showEmptyClassifications.tooltip('hide');
this.ui.showEmptyClassifications.find("i").toggleClass("fa-toggle-on fa-toggle-off");
@@ -366,16 +363,14 @@ define([
flatViewList = [],
isSelectedChild = false,
openClassificationNodesState = function(treeDate) {
- // if (treeDate.length == 1) {
_.each(treeDate, function(model) {
model.state['opened'] = true;
})
- // }
},
generateNode = function(nodeOptions, options, isChild) {
var nodeStructure = {
- text: nodeOptions.name,
- name: nodeOptions.name,
+ text: _.escape(nodeOptions.name),
+ name: _.escape(nodeOptions.name),
children: that.isGroupView ? getChildren({
children: isChild ? nodeOptions.model.subTypes : nodeOptions.model.get("subTypes"),
parent: isChild ? options.parentName : nodeOptions.name
@@ -409,14 +404,14 @@ define([
var modelJSON = child.toJSON();
if (child) {
var nodeDetails = {
- name: name,
+ name: _.escape(name),
model: modelJSON,
children: child,
isSelectedChild: isSelectedChild
},
nodeProperties = {
parent: options.parentName,
- text: tagname,
+ text: _.escape(tagname),
guid: child.get("guid"),
model: child,
state: { selected: isSelectedChild, opened: true }
@@ -451,12 +446,12 @@ define([
}
}
var parentNodeDetails = {
- name: name,
+ name: _.escape(name),
model: model,
isSelectedChild: isSelectedChild
},
parentNodeProperties = {
- text: tagname,
+ text: _.escape(tagname),
state: {
disabled: tagEntityCount == 0 ? true : false,
selected: isSelected,
@@ -488,7 +483,6 @@ define([
var classificationTreeData = that.isEmptyClassification ? listWithEmptyParents : listOfParents;
var flatViewClassificaton = that.isEmptyClassification ? listWithEmptyParentsFlatView : flatViewList;
var classificationData = that.isGroupView ? classificationTreeData : flatViewClassificaton;
- // openClassificationNodesState(classificationData);
return classificationData;
},
generateSearchTree: function(options) {
@@ -517,9 +511,9 @@ define([
},
node_customize: {
default: function(el) {
- // if ($(el).find(".fa-ellipsis-h").length === 0) {
+ var aTag = $(el).find(">a.jstree-anchor");
+ aTag.append("<span class='tree-tooltip'>" + aTag.text() + "</span>");
$(el).append('<div class="tools"><i class="fa fa-ellipsis-h classificationPopover" rel="popover"></i></div>');
- // }
}
},
core: {
@@ -552,16 +546,23 @@ define([
} else {
$el.parents(".panel").removeClass("hide");
}
- })
+ }).on("hover_node.jstree", function(nodes, str, res) {
+ var aTag = that.$("#" + str.node.a_attr.id),
+ tagOffset = aTag.find(">.jstree-icon").offset();
+ that.$(".tree-tooltip").removeClass("show");
+ if (tagOffset.top && tagOffset.left) {
+ aTag.find(">span.tree-tooltip").css({
+ top: "calc(" + tagOffset.top + "px - 45px)",
+ left: "24px"
+ }).addClass("show");
+ }
+ }).on("dehover_node.jstree", function(nodes, str, res) {
+ that.$(".tree-tooltip").removeClass("show");
+ });
},
onClickCreateTag: function(e) {
var that = this;
- //nodeName = that.options.value && that.options.value.tag;
require(["views/tag/CreateTagLayoutView", "modules/Modal"], function(CreateTagLayoutView, Modal) {
-
- // var name = !(nodeName == "BUTTON") ? that.query[that.viewType].tagName : null;
- //var name = nodeName;
-
var view = new CreateTagLayoutView({ tagCollection: that.options.classificationDefCollection, enumDefCollection: enumDefCollection }),
modal = new Modal({
title: "Create a new classification",
@@ -593,7 +594,6 @@ define([
});
modal.on("closeModal", function() {
modal.trigger("cancel");
- // that.ui.createTag.removeAttr("disabled");
});
});
},
@@ -691,7 +691,6 @@ define([
new this.options.classificationDefCollection.model().set(this.json).save(null, {
success: function(model, response) {
var classificationDefs = model.get("classificationDefs");
- // that.ui.createTag.removeAttr("disabled");
that.createTag = true;
if (classificationDefs[0]) {
_.each(classificationDefs[0].superTypes, function(superType) {
diff --git a/dashboardv3/public/js/views/search/tree/CustomFilterTreeLayoutView.js b/dashboardv3/public/js/views/search/tree/CustomFilterTreeLayoutView.js
index 01c1a2c..f6e7a6a 100644
--- a/dashboardv3/public/js/views/search/tree/CustomFilterTreeLayoutView.js
+++ b/dashboardv3/public/js/views/search/tree/CustomFilterTreeLayoutView.js
@@ -208,6 +208,8 @@ define([
},
node_customize: {
default: function(el) {
+ var aFilter = $(el).find(">a.jstree-anchor");
+ aFilter.append("<span class='tree-tooltip'>" + _.escape(aFilter.text()) + "</span>");
if ($(el).find(".fa-ellipsis-h").length === 0) {
$(el).append('<div class="tools"><i class="fa fa-ellipsis-h customFilterPopover" rel="popover"></i></div>');
}
@@ -239,7 +241,19 @@ define([
} else {
$el.parents(".panel").removeClass("hide");
}
- })
+ }).on("hover_node.jstree", function(nodes, str, res) {
+ var aFilter = that.$("#" + str.node.a_attr.id),
+ filterOffset = aFilter.find(">.jstree-icon").offset();
+ that.$(".tree-tooltip").removeClass("show");
+ if (filterOffset.top && filterOffset.left) {
+ aFilter.find(">span.tree-tooltip").css({
+ top: "calc(" + filterOffset.top + "px - 45px)",
+ left: "24px"
+ }).addClass("show");
+ }
+ }).on("dehover_node.jstree", function(nodes, str, res) {
+ that.$(".tree-tooltip").removeClass("show");
+ });
},
createCustomFilterAction: function() {
var that = this;
@@ -262,7 +276,6 @@ define([
customFilterSwitchBtnUpdate: function() {
var that = this,
getTreeData, displayText;
- // that.ui.showCustomFilter.attr("title", (that.isBasic ? "Show Advanced search" : "Show Basic search"));
that.ui.showCustomFilter.attr("data-original-title", (that.isBasic ? "Show Advanced search" : "Show Basic search"));
that.ui.showCustomFilter.tooltip('hide');
that.ui.showCustomFilter.find("i").toggleClass("switch-button");
@@ -285,8 +298,8 @@ define([
generateNode = function(nodeOptions) {
var searchType = nodeOptions.get('searchType');
var nodeStructure = {
- text: nodeOptions.get('name'),
- name: nodeOptions.get('name'),
+ text: _.escape(nodeOptions.get('name')),
+ name: _.escape(nodeOptions.get('name')),
type: "customFilter",
id: nodeOptions.get('guid'),
icon: (searchType === 'BASIC' ? "fa fa-circle-thin basic-tree" : "fa fa-circle-thin advance-tree"),
@@ -306,7 +319,6 @@ define([
allCustomFilter.push(generateNode(filterNode));
});
- // var customFilterList = that.isBasic ? customFilterBasicList : customFilterAdvanceList;
var treeView = [{
icon: "fa fa-folder-o",
gType: "customFilter",
diff --git a/dashboardv3/public/js/views/search/tree/EntityTreeLayoutView.js b/dashboardv3/public/js/views/search/tree/EntityTreeLayoutView.js
index dfb2954..649632e 100644
--- a/dashboardv3/public/js/views/search/tree/EntityTreeLayoutView.js
+++ b/dashboardv3/public/js/views/search/tree/EntityTreeLayoutView.js
@@ -70,9 +70,7 @@ define([
var type = $(e.currentTarget).data("type");
e.stopPropagation();
this.isGroupView = !this.isGroupView;
- // this.ui.groupOrFlatTree.attr("data-original-title", (this.isGroupView ? "Show flat tree" : "Show group tree"));
this.ui.groupOrFlatTree.tooltip('hide');
- // this.ui.groupOrFlatTree.find("i").toggleClass("group-tree-deactivate");
this.ui.groupOrFlatTree.find("i").toggleClass("fa-sitemap fa-list-ul");
this.ui.groupOrFlatTree.find("span").html(this.isGroupView ? "Show flat tree" : "Show group tree");
@@ -158,11 +156,9 @@ define([
this.entitySwitchBtnUpdate();
},
entitySwitchBtnUpdate: function() {
- // this.ui.showEmptyServiceType.attr("title", (this.isEmptyServicetype ? "Show" : "Hide") + " empty service types");
this.ui.showEmptyServiceType.attr("data-original-title", (this.isEmptyServicetype ? "Show" : "Hide") + " empty service types");
this.ui.showEmptyServiceType.tooltip('hide');
this.ui.showEmptyServiceType.find("i").toggleClass("fa-toggle-on fa-toggle-off");
- // this.ui.showEmptyServiceType.find("span").html((this.isEmptyServicetype ? "Show" : "Hide") + " empty service types");
this.ui.entitySearchTree.jstree(true).refresh();
},
manualRender: function(options) {
@@ -219,7 +215,7 @@ define([
} else {
that.typeId = params["type"] = null;
that.ui.entitySearchTree.jstree(true).deselect_all(true);
- if (!that.options.value.type && !that.options.value.tag && !that.options.value.term && !that.options.value.query) {
+ if (!that.options.value.type && !that.options.value.tag && !that.options.value.term && !that.options.value.query && !this.options.value.udKeys && !this.options.value.ugLabels) {
that.showDefaultPage();
return;
}
@@ -297,24 +293,9 @@ define([
that.typeId = isSelected ? model.get("guid") : null;
}
}
- // var children = {
- // text: modelname,
- // name: model.get("name"),
- // type: model.get("category"),
- // gType: "serviceType",
- // guid: model.get("guid"),
- // id: model.get("guid"),
- // parent: serviceType,
- // model: model,
- // icon: "fa fa-file-o",
- // state: {
- // disabled: entityCount == 0 ? true : false,
- // selected: isSelected
- // },
- // };
var children = {
- text: modelname,
+ text: _.escape(modelname),
name: model.get("name"),
type: model.get("category"),
gType: "serviceType",
@@ -378,7 +359,7 @@ define([
type: type,
gType: "serviceType",
children: getParrent.children,
- text: textName,
+ text: _.escape(textName),
name: data[parents[i]].name,
id: i,
state: { opened: true }
@@ -432,7 +413,8 @@ define([
},
node_customize: {
default: function(el) {
- //$(el).find("a").append("<div><i class='fa fa-ellipsis-h'></i></div>");
+ var aType = $(el).find(">a.jstree-anchor");
+ aType.append("<span class='tree-tooltip'>" + aType.text() + "</span>");
if ($(el).find(".fa-ellipsis-h").length === 0) {
$(el).append('<div class="tools"><i class="fa fa-ellipsis-h entityPopover" rel="popover"></i></div>');
}
@@ -443,14 +425,6 @@ define([
data: function(node, cb) {
if (node.id === "#") {
cb(
- // {
- // text: "Service Types",
- // children: that.getEntityTree(),
- // icon: "fa fa-folder-o",
- // type: "ENTITY",
- // state: { opened: true },
- // parent: "#"
- // }
that.getEntityTree()
);
}
@@ -478,7 +452,19 @@ define([
} else {
$el.parents(".panel").removeClass("hide");
}
- })
+ }).on("hover_node.jstree", function(nodes, str, res) {
+ var aType = that.$("#" + str.node.a_attr.id),
+ typeOffset = aType.find(">.jstree-icon").offset();
+ that.$(".tree-tooltip").removeClass("show");
+ if (typeOffset.top && typeOffset.left) {
+ aType.find(">span.tree-tooltip").css({
+ top: "calc(" + typeOffset.top + "px - 45px)",
+ left: "24px"
+ }).addClass("show");
+ }
+ }).on("dehover_node.jstree", function(nodes, str, res) {
+ that.$(".tree-tooltip").removeClass("show");
+ });
},
refresh: function(options) {
var that = this,
diff --git a/dashboardv3/public/js/views/search/tree/GlossaryTreeLayoutView.js b/dashboardv3/public/js/views/search/tree/GlossaryTreeLayoutView.js
index 523d23e..a9cc4ef 100644
--- a/dashboardv3/public/js/views/search/tree/GlossaryTreeLayoutView.js
+++ b/dashboardv3/public/js/views/search/tree/GlossaryTreeLayoutView.js
@@ -50,25 +50,19 @@ define([
events["click " + this.ui.refreshTree] = function(e) {
var type = $(e.currentTarget).data("type");
e.stopPropagation();
- // that.ui[type + "SearchTree"].jstree(true).destroy();
that.refresh({ type: type });
};
events["click " + this.ui.createGlossary] = function(e) {
var that = this;
- if (e) {
- //$(e.currentTarget).attr("disabled", "true");
- }
CommonViewFunction.createEditGlossaryCategoryTerm({
isGlossaryView: true,
collection: that.glossaryCollection,
callback: function(rModel) {
that.glossaryCollection.fullCollection.add(rModel);
},
- onModalClose: function() {
- //that.ui.createGlossary.removeAttr("disabled");
- }
+ onModalClose: function() {}
})
};
@@ -85,7 +79,6 @@ define([
this.listenTo(
this.glossaryCollection.fullCollection, "reset add change",
function(skip) {
- // this.renderGlossaryTree()
if (this.ui.termSearchTree.jstree(true)) {
this.ui.termSearchTree.jstree(true).refresh();
} else {
@@ -106,21 +99,10 @@ define([
});
},
glossarySwitchBtnUpdate: function() {
- // this.ui.showGlossaryType.attr("title", (this.isTermView ? "Show Category" : "Show Term"));
this.ui.showGlossaryType.attr("data-original-title", (this.isTermView ? "Show Category" : "Show Term"));
this.ui.showGlossaryType.tooltip('hide');
this.ui.showGlossaryType.find("i").toggleClass("switch-button");
- // this.ui.showGlossaryType.find("span").html(this.isTermView ? "Show Category" : "Show Term");
this.ui.termSearchTree.jstree(true).refresh();
- //this.showDefaultPage();
- // if(this.isTermView){
- // $('.categoryPopover').popover('destroy');
- // this.createTermAction();
- // }
- // else{
- // $('.termPopover').popover('destroy');
- // this.createCategoryAction();
- // }
},
initialize: function(options) {
this.options = options;
@@ -150,9 +132,7 @@ define([
this.bindEvents();
},
onRender: function() {
- // $('#r_glossaryDetailLayoutView')
this.fetchGlossary();
-
},
onBeforeDestroy: function() {
@@ -210,15 +190,12 @@ define([
});
this.createTermAction();
- //this.createCategoryAction();
},
onNodeSelect: function(options, showCategory) {
var name, type, selectedNodeId, that = this,
glossaryType = options.node.original.gType;
if (glossaryType == "category") {
selectedNodeId = options.node.id;
- // that.onViewEdit();
-
if (that.glossaryTermId != selectedNodeId) {
that.glossaryTermId = selectedNodeId;
that.onViewEdit();
@@ -229,13 +206,12 @@ define([
} else if (glossaryType == "term") {
if (options) {
- name = options.node.original.name;
+ name = _.unescape(options.node.original.name);
selectedNodeId = options.node.id;
}
var termValue = null,
params = {
- searchType: "basic",
- // dslChecked: false
+ searchType: "basic"
};
if (this.options.value) {
if (this.options.value.isCF) {
@@ -252,9 +228,7 @@ define([
} else {
that.glossaryTermId = params["term"] = null;
- // options.instance.deselect_node(options.node);
that.ui.termSearchTree.jstree(true).deselect_all(true);
- // $(options.event.currentTarget).siblings('.tools').hide();
if (!that.options.value.type && !that.options.value.tag && !that.options.value.query) {
that.showDefaultPage();
return;
@@ -371,10 +345,7 @@ define([
glossaryName: parentNode ? parentNode.name ? parentNode.name : parentNode.displayText : obj.name,
glossaryId: parentNode ? parentNode.guid ? parentNode.guid : parentNode.categoryGuid : obj.guid,
model: model,
- icon: "fa fa-file-o",
- // state: {
- // selected: isSelected
- // }
+ icon: "fa fa-file-o"
};
return nodeStructure;
@@ -393,9 +364,6 @@ define([
_.each(obj.categories, function(category) {
if (that.options.value) {
isSelected = that.options.value.guid ? that.options.value.guid == category.categoryGuid : false;
- if (!that.glossaryTermId) {
- // that.glossaryTermId = isSelected ? that.options.value.guid : null;
- }
}
if (category.parentCategoryGuid) {
return;
@@ -423,16 +391,12 @@ define([
_.each(obj.terms, function(term) {
if (that.options.value) {
isSelected = that.options.value.term ? that.options.value.term.split('@')[0] == term.displayText : false;
- if (!that.glossaryTermId) {
- //that.glossaryTermId = isSelected ? term.termGuid : null;
- }
}
var parentNodeDetails = {
type: term.typeName || "GlossaryTerm",
guid: term.termGuid
},
parentNodeProperties = {},
- // isTerm = true,
getParentNodeDetails = generateNode(parentNodeDetails, term, that.isTermView),
termParentNode = (_.extend(parentNodeProperties, getParentNodeDetails));
parent.children.push(termParentNode);
@@ -477,12 +441,8 @@ define([
liString = "";
if (type == "glossary") {
liString = "<li data-type=" + type + " class='listTerm'><i class='fa fa-plus'></i> <a href='javascript:void(0)' data-fn='createSubNode'>Create Category</a></li>";
- // +"<li data-type=" + type + " class='listTerm'><i class='fa fa-trash-o'></i><a href='javascript:void(0)' data-fn='deleteNode'>Delete Category</a></li>"
-
} else {
liString = "<li data-type=" + type + " class='listTerm'><i class='fa fa-list-alt'></i><a href='javascript:void(0)' data-fn='createSubNode'>Create Sub-Category</a></li>";
- // +"<li data-type=" + type + " class='listTerm'><i class='fa fa-trash-o'></i><a href='javascript:void(0)' data-fn='deleteNode'>Delete Category</a></li>"
-
}
return "<ul>" + liString + "</ul>";
},
@@ -498,13 +458,7 @@ define([
"isCategoryView": true,
"collection": that.glossaryCollection,
"callback": function() {
- // if (selectednode[0].original.gType == "GLOSSARY") {
- // that.fetchGlossary();
- // } else {
- // that.ui.termSearchTree.jstree(true).refresh();
- // }
that.ui.termSearchTree.jstree(true).refresh();
-
},
"node": selectednode[0].original
})
@@ -543,39 +497,17 @@ define([
}
var glossary = that.glossaryCollection.fullCollection.get(gId);
if (type == "GlossaryTerm") {
- // var glossary = that.glossaryCollection.fullCollection.get(gId);
glossary.set('terms', _.reject(glossary.get('terms'), function(obj) {
return obj.termGuid == guid;
}), { silent: true });
}
- // else if (type == "GlossaryCategory") {
- // glossary.set('categories', _.reject(glossary.get('categories'), function(obj) {
- // return obj.categoryGuid == guid;
- // }), { silent: true });
- // } else {
- // glossary = that.glossaryCollection.fullCollection.first();
- // if (glossary) {
- // gId = glossary.get('guid');
- // } else {
- // gId = null
- // }
- // }
Utils.notifySuccess({
content: messageType + Messages.deleteSuccessMessage
});
that.ui.termSearchTree.jstree(true).refresh();
- // if (gId == null) {
- // that.glossary.selectedItem = {};
- // that.value = null;
- // that.query = {
- // term: {},
- // category: {}
- // };
- // }
var params = {
searchType: "basic",
- // dslChecked: false,
term: null
};
that.glossaryTermId = null;
@@ -663,14 +595,7 @@ define([
type = options && options.type,
that = this,
createAction = function(options) {
- // var $el = options.el,
- // type = options.type;
that.isTermView ? that.createTermAction() : that.createCategoryAction();
- // if (type == "term") {
- // that.createTermAction();
- // } else if (type == "category") {
- // that.createCategoryAction();
- // }
},
getEntityTreeConfig = function(opt) {
return {
@@ -683,6 +608,8 @@ define([
},
node_customize: {
default: function(el, node) {
+ var aTerm = $(el).find(">a.jstree-anchor");
+ aTerm.append("<span class='tree-tooltip'>" + _.escape(aTerm.text()) + "</span>");
var popoverClass = that.isTermView ? "fa fa-ellipsis-h termPopover " : "fa fa-ellipsis-h categoryPopover";
$(el).append('<div class="tools" data-type=' + node.original.gType + '><i class="' + popoverClass + '"rel="popover" data-detail=' + node.original.gType + '></i></div>');
}
@@ -723,19 +650,28 @@ define([
$el.parents(".panel").removeClass("hide");
}
}).on('loaded.jstree', function() {
- // that.showDefaultCategorySelection();
if (that.options.value) {
if (that.options.value.term) {
that.selectDefaultNode();
}
if (!that.isTermView) {
- // that.categoryValues = that.options.value;
- // that.triggerSearch(that.categoryValues);
that.selectDefaultNode();
that.options.categoryEvent.trigger("Success:Category", true);
}
}
+ }).on("hover_node.jstree", function(nodes, str, res) {
+ var aTerm = that.$("#" + str.node.a_attr.id),
+ termOffset = aTerm.find(">.jstree-icon").offset();
+ that.$(".tree-tooltip").removeClass("show");
+ if (termOffset.top && termOffset.left) {
+ aTerm.find(">span.tree-tooltip").css({
+ top: "calc(" + termOffset.top + "px - 45px)",
+ left: "24px"
+ }).addClass("show");
+ }
+ }).on("dehover_node.jstree", function(nodes, str, res) {
+ that.$(".tree-tooltip").removeClass("show");
});
},
selectDefaultNode: function() {