Skip to content

A
atlas
Commit c8f525bf by kevalbhatt Committed by Sarath Subramanian
Options

ATLAS-3244: UI : Allows user to search the entities from any page (quick-search)

Signed-off-by: 's avatarSarath Subramanian <sarath@apache.org>
parent c24029bf
Showing with 354 additions and 99 deletions
dashboardv2/public/css/scss/__mixin.scss
...@@ -17,11 +17,13 @@ ...@@ -17,11 +17,13 @@
*/ */
@mixin clearfix() { @mixin clearfix() {
&:before, &:before,
&:after { &:after {
content: " "; // 1 content: " "; // 1
display: table; // 2 display: table; // 2
} }
&:after { &:after {
clear: both; clear: both;
} }
...@@ -30,6 +32,7 @@ ...@@ -30,6 +32,7 @@
@mixin ellipsis() { @mixin ellipsis() {
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
white-space: nowrap;
} }
@mixin transition($transition...) { @mixin transition($transition...) {
......
dashboardv2/public/css/scss/__variable.scss
...@@ -28,16 +28,16 @@ $white: #fff; ...@@ -28,16 +28,16 @@ $white: #fff;
$black: #000; $black: #000;
$red: #f00; $red: #f00;
$gray: #808080; $gray: #808080;
$dark_gray:#666; $dark_gray: #666;
$action_gray:#999999; $action_gray: #999999;
$color_keppel_approx: #37bb9b; $color_keppel_approx: #37bb9b;
$color_gallery_approx: #eee; $color_gallery_approx: #eee;
$color_tuna_approx: #323544; $color_tuna_approx: #323544;
$color_celeste_approx: #ccc; $color_celeste_approx: #ccc;
$color_cornflower_blue_approx: #66afe9; $color_cornflower_blue_approx: #66afe9;
$color_mystic_approx: #e8e9ee; $color_mystic_approx: #e8e9ee;
$color_jungle_green_approx: #38BB9B; $color_jungle_green_approx: #38bb9b;
$color_jungle_green_light:#7ed3be; $color_jungle_green_light: #7ed3be;
$color_froly_approx: #ee6e73; $color_froly_approx: #ee6e73;
$color_manatee_approx: #9398a0; $color_manatee_approx: #9398a0;
$color_havelock_blue_approx: #4a90e2; $color_havelock_blue_approx: #4a90e2;
...@@ -50,11 +50,13 @@ $color_puerto_rico_approx: #3dd4af; ...@@ -50,11 +50,13 @@ $color_puerto_rico_approx: #3dd4af;
$color_star_dust_approx: #9a9a9a; $color_star_dust_approx: #9a9a9a;
$color_mirage_approx: #1c1e2a; $color_mirage_approx: #1c1e2a;
$concrete: #f2f2f2; $concrete: #f2f2f2;
$lightGrey:#e1e2e4; $lightGrey: #e1e2e4;
$color_form_control: #e8e8e8;
$attribute-dash-box: #cbcbcb;
//old - style color //old - style color
$color_bali_hai_approx: #8fa5b1; $color_bali_hai_approx: #8fa5b1;
$transparent:transparent; $transparent: transparent;
$black_7_5: rgba(0, 0, 0, .075); $black_7_5: rgba(0, 0, 0, 0.075);
$color_hoki_approx: #698797; $color_hoki_approx: #698797;
$color_curious_blue_approx: #1ba9e2; $color_curious_blue_approx: #1ba9e2;
$color_blue_bayoux_approx: #44697d; $color_blue_bayoux_approx: #44697d;
...@@ -66,7 +68,7 @@ $color_trinidad_approx: #e14f00; ...@@ -66,7 +68,7 @@ $color_trinidad_approx: #e14f00;
$color_grenadier_approx: #c74600; $color_grenadier_approx: #c74600;
$color_athens_gray_approx: #e9ecf2; $color_athens_gray_approx: #e9ecf2;
$color_green_house_approx: #26530c; $color_green_house_approx: #26530c;
$color_dark_grey_approx:#333; $color_dark_grey_approx: #333;
$black_10: rgba(0, 0, 0, 0.1); $black_10: rgba(0, 0, 0, 0.1);
$color_cararra_approx: #ececec; $color_cararra_approx: #ececec;
$black_30: rgba(0, 0, 0, 0.3); $black_30: rgba(0, 0, 0, 0.3);
...@@ -92,9 +94,9 @@ $black_80: rgba(0, 0, 0, 0.8); ...@@ -92,9 +94,9 @@ $black_80: rgba(0, 0, 0, 0.8);
$color_bright_turquoise_approx: #00ffd0; $color_bright_turquoise_approx: #00ffd0;
$color_mountain_mist_approx: #999; $color_mountain_mist_approx: #999;
$color_suva_gray_approx: #868686; $color_suva_gray_approx: #868686;
$tag_color:#4A90E2; $tag_color: #4a90e2;
$delete_link:#BB5838; $delete_link: #bb5838;
//urls //urls
$url_0: url(../img/loading.gif); $url_0: url(../img/loading.gif);
$switchTransition: .4s ease-out; $switchTransition: 0.4s ease-out;
\ No newline at end of file \ No newline at end of file
dashboardv2/public/css/scss/form.scss
...@@ -16,7 +16,6 @@ ...@@ -16,7 +16,6 @@
* limitations under the License. * limitations under the License.
*/ */
/* form.scss */ /* form.scss */
.form-horizontal { .form-horizontal {
...@@ -39,7 +38,7 @@ ...@@ -39,7 +38,7 @@
.required:after { .required:after {
content: "*"; content: "*";
padding-left: 1%; padding-left: 1%;
color: $red color: $red;
} }
.control-label { .control-label {
...@@ -73,7 +72,7 @@ ...@@ -73,7 +72,7 @@
.form-group span[class^="select2-selection select2-selection--"], .form-group span[class^="select2-selection select2-selection--"],
.form-control { .form-control {
background-color: #e8e8e8 !important; background-color: $color_form_control !important;
} }
} }
...@@ -216,7 +215,7 @@ button:focus { ...@@ -216,7 +215,7 @@ button:focus {
margin-bottom: 10px; margin-bottom: 10px;
border: 1px $color_keppel_approx solid; //Instead of the line below you could use @include border-radius($radius, $vertical-radius) border: 1px $color_keppel_approx solid; //Instead of the line below you could use @include border-radius($radius, $vertical-radius)
border-radius: 4px; //Instead of the line below you could use @include transition($transition-1, $transition-2, $transition-3, $transition-4, $transition-5, $transition-6, $transition-7, $transition-8, $transition-9, $transition-10) border-radius: 4px; //Instead of the line below you could use @include transition($transition-1, $transition-2, $transition-3, $transition-4, $transition-5, $transition-6, $transition-7, $transition-8, $transition-9, $transition-10)
transition: all .3s ease; transition: all 0.3s ease;
margin: 2px; margin: 2px;
&:hover { &:hover {
...@@ -455,8 +454,51 @@ button:focus { ...@@ -455,8 +454,51 @@ button:focus {
list-style: disc; list-style: disc;
} }
.create-entity-form { .has-feedback.align-left {
.form-control {
padding-left: 32.5px;
padding-right: 12px;
}
.form-control-feedback {
top: 10px;
left: 0px;
height: 14px
}
}
.has-feedback.align-left-right-icon {
position: relative;
.form-control {
padding-left: 32.5px;
padding-right: 32.5px;
}
.form-control-feedback {
top: 10px;
height: 14px;
&:first-child {
left: 0;
}
&.clearable:last-child {
right: 0;
overflow: hidden;
padding-left: 33px;
transition: padding 0.4s;
pointer-events: all;
cursor: pointer;
&.in {
padding-left: 0;
}
}
}
}
.create-entity-form {
&.all { &.all {
.attribute-dash-box { .attribute-dash-box {
&.alloptional { &.alloptional {
...@@ -470,7 +512,7 @@ button:focus { ...@@ -470,7 +512,7 @@ button:focus {
border-width: 2px; border-width: 2px;
border-spacing: 8px; border-spacing: 8px;
border-radius: 12px; border-radius: 12px;
border-color: #cbcbcb; border-color: $attribute-dash-box;
position: relative; position: relative;
padding: 18px 10px 0px 10px; padding: 18px 10px 0px 10px;
margin-top: 25px; margin-top: 25px;
...@@ -478,7 +520,7 @@ button:focus { ...@@ -478,7 +520,7 @@ button:focus {
span.required:after { span.required:after {
content: "*"; content: "*";
padding-left: 1%; padding-left: 1%;
color: $red color: $red;
} }
&.alloptional { &.alloptional {
......
dashboardv2/public/css/scss/override.scss
...@@ -90,7 +90,6 @@ ...@@ -90,7 +90,6 @@
overflow: scroll !important; overflow: scroll !important;
max-height: 500px; max-height: 500px;
width: 100%; width: 100%;
table-layout: fixed;
.resizeHandler { .resizeHandler {
&.grid-draggable { &.grid-draggable {
...@@ -351,12 +350,12 @@ td { ...@@ -351,12 +350,12 @@ td {
.group-conditions { .group-conditions {
.btn-primary { .btn-primary {
color: #333 !important; color: #333 !important;
background-color: #fff !important; background-color: $white !important;
border-color: #ccc !important; border-color: #ccc !important;
} }
.active { .active {
color: #fff !important; color: $white !important;
background-color: #5bc0de !important; background-color: #5bc0de !important;
border-color: #46b8da !important; border-color: #46b8da !important;
} }
...@@ -375,8 +374,8 @@ div.columnmanager-visibilitycontrol { ...@@ -375,8 +374,8 @@ div.columnmanager-visibilitycontrol {
margin-bottom: 5px; margin-bottom: 5px;
&.open .btn-action { &.open .btn-action {
background-color: #37bb9b; background-color: $color_keppel_approx;
color: #fff; color: $white;
} }
} }
......
dashboardv2/public/css/scss/search.scss
...@@ -221,30 +221,6 @@ ul.type-filter-ul { ...@@ -221,30 +221,6 @@ ul.type-filter-ul {
color: black; color: black;
} }
.type-filter-dropdown {
position: absolute;
top: 5px;
background-color: #323544;
}
.filter-sticky-div {
text-align: center;
position: sticky;
position: -webkit-sticky;
top: 0px;
background-color: white;
padding-top: 8px;
& .row {
margin-right: -10px;
margin-left: -10px;
}
& input.form-control {
border: 1px #c9c9c9 solid;
}
}
hr.hr-filter { hr.hr-filter {
margin-top: 7px; margin-top: 7px;
margin-bottom: 7px; margin-bottom: 7px;
......
dashboardv2/public/css/scss/stats.scss
...@@ -47,7 +47,7 @@ ...@@ -47,7 +47,7 @@
&.panel-primary>.panel-heading { &.panel-primary>.panel-heading {
color: #686868; color: #686868;
background-color: #fff; background-color: $white;
font-size: 14px; font-size: 14px;
font-weight: bold; font-weight: bold;
} }
......
dashboardv2/public/css/scss/theme.scss
...@@ -25,45 +25,86 @@ body { ...@@ -25,45 +25,86 @@ body {
overflow-x: hidden; overflow-x: hidden;
} }
header { .detail-page {
header.atlas-header {
.nav.navbar-nav {
width: 16%;
@media screen and (max-width: 1024px) {
width: 24%;
}
}
.global-search-container {
width: 65%;
@media screen and (max-width: 1024px) {
width: 45%;
}
}
}
}
header.atlas-header {
background-color: $white; background-color: $white;
border-bottom: 1px $color_mystic_approx solid; border-bottom: 1px $color_mystic_approx solid;
}
.header-menu { .nav.navbar-nav {
.dropdown-menu>li>a { width: 5%;
color: $color_ironside_gray_approx; }
&:hover { .global-search-container {
color: $color_jungle_green_approx; top: 8px;
} width: 76%;
i { @media screen and (max-width: 1024px) {
padding-right: 3px; width: 65%;
} }
} }
>a { .header-menu {
display: inline-block; width: 18%;
color: $color_ironside_gray_approx;
padding: 15px 14px;
&:hover { @media screen and (max-width: 1024px) {
border-bottom: 2px solid $color_jungle_green_approx; width: 30%;
padding: 14px 14px;
color: $color_jungle_green_approx;
} }
span { .dropdown-menu>li>a {
padding: 5px; color: $color_ironside_gray_approx;
&:hover {
color: $color_jungle_green_approx;
}
i {
padding-right: 3px;
}
} }
i { >a {
font-size: 18px; display: inline-block;
color: $color_ironside_gray_approx;
padding: 15px 14px;
&:hover {
border-bottom: 2px solid $color_jungle_green_approx;
padding: 14px 14px;
color: $color_jungle_green_approx;
}
span {
padding: 5px;
}
i {
font-size: 18px;
}
} }
} }
} }
.main-search { .main-search {
.form-control { .form-control {
border: none; border: none;
...@@ -88,18 +129,24 @@ header { ...@@ -88,18 +129,24 @@ header {
font-size: 2em; font-size: 2em;
} }
#sideNav-wrapper { #sidebar-wrapper {
color: $white; background: $color_tuna_approx;
font-size: 16px !important;
#sideNav-wrapper {
color: $white;
font-size: 16px !important;
.well { .well {
background-color: $color_tuna_approx; background: transparent;
border: 1px solid #666363; border: 1px solid #666363;
overflow: hidden; overflow: hidden;
@include clearfix(); @include clearfix();
}
} }
} }
.page-title { .page-title {
background-color: $color_white_lilac_approx; background-color: $color_white_lilac_approx;
padding: 10px 15px 0px 15px; padding: 10px 15px 0px 15px;
...@@ -324,11 +371,15 @@ hr[size="10"] { ...@@ -324,11 +371,15 @@ hr[size="10"] {
margin-top: 15px; margin-top: 15px;
} }
.ellipsis { .ellipsis-with-margin {
@include ellipsis(); @include ellipsis();
margin-bottom: 10px; margin-bottom: 10px;
} }
.ellipsis {
@include ellipsis();
}
.readOnlyLink { .readOnlyLink {
@include ellipsis(); @include ellipsis();
...@@ -395,6 +446,19 @@ hr[size="10"] { ...@@ -395,6 +446,19 @@ hr[size="10"] {
} }
} }
.search-entity-icon-box {
padding: 10px;
border-radius: 50%;
width: 25px;
height: 25px;
img {
width: 25px;
height: 25px;
cursor: default;
}
}
.entity-icon-box { .entity-icon-box {
display: inline-block; display: inline-block;
background: #cee0fa; background: #cee0fa;
...@@ -410,4 +474,46 @@ hr[size="10"] { ...@@ -410,4 +474,46 @@ hr[size="10"] {
img { img {
height: 50px; height: 50px;
} }
}
.ui-menu.ui-widget-content.ui-autocomplete {
box-shadow: 0px 11px 30px -8px grey;
max-width: 60% !important;
.ui-menu-item {
padding: 5px 2px;
color: $color_ironside_gray_approx;
&.with-icon {
img {
height: 25px;
width: 30px;
margin-right: 10px;
background: none;
}
}
.ui-state-active {
margin: 0px;
&.empty {
background: transparent;
color: inherit !important;
cursor: default;
}
border: none;
background: #cee0fa;
color: $black !important;
//color: #686868 !important;
}
a,
span {
padding: 10px;
display: block;
color: inherit !important;
}
}
} }
\ No newline at end of file
dashboardv2/public/css/scss/wizard.scss
...@@ -195,7 +195,7 @@ $color_falu_red_approx: #8a1f11; ...@@ -195,7 +195,7 @@ $color_falu_red_approx: #8a1f11;
a { a {
padding: 10px 20px; padding: 10px 20px;
background-color: $color_keppel_approx; background-color: $color_keppel_approx;
color: #fff; color: $white;
margin-bottom: 10px; margin-bottom: 10px;
border: 1px $color_keppel_approx solid; border: 1px $color_keppel_approx solid;
border-radius: 4px; border-radius: 4px;
......
dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
<div class="fontLoader" style="z-index:999"> <div class="fontLoader" style="z-index:999">
<i class="fa fa-refresh fa-spin-custom"></i> <i class="fa fa-refresh fa-spin-custom"></i>
</div> </div>
<div class="ellipsis" style="display: none;"><span class="searchResult" style=" font-size: 16px;"></span> <div class="ellipsis-with-margin" style="display: none;"><span class="searchResult" style=" font-size: 16px;"></span>
</div> </div>
<div class="searchTable"> <div class="searchTable">
<div class="row no-data" style="display: none;"> <div class="row no-data" style="display: none;">
......
dashboardv2/public/js/templates/site/Header.html
...@@ -14,14 +14,19 @@ ...@@ -14,14 +14,19 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
--> -->
<header class="clearfix"> <header class="clearfix atlas-header">
<ul class="nav navbar-nav"> <ul class="nav navbar-nav">
<li> <li>
<a href="javascript:void(0);" data-id="menuHamburger"><i class="fa fa-bars"></i></a> <a href="javascript:void(0);" data-id="menuHamburger"><i class="fa fa-bars"></i></a>
</li> </li>
<li class="details-backbutton"><a href="javascript:void(0);" data-id="backButton"><i class="fa fa-chevron-left"></i> Back To Results</a></li> <li class="details-backbutton"><a href="javascript:void(0);" data-id="backButton"><i class="fa fa-chevron-left"></i> Back To Results</a></li>
</ul> </ul>
<div class="btn-group pull-right header-menu "> <div class="form-group has-feedback align-left-right-icon search-box pull-left global-search-container">
<span class="fa fa-search form-control-feedback"></span>
<input type="text" class="form-control global-search" name="global search" placeholder="Search entities" data-id="globalSearch" />
<span class="fa fa-times form-control-feedback clearable" data-id="clearGlobalSearch"></span>
</div>
<div class="btn-group pull-right header-menu">
<a class="show-stat" href="javascript:void(0);" title="Statistics"><i class="fa fa-bar-chart"></i></a> <a class="show-stat" href="javascript:void(0);" title="Statistics"><i class="fa fa-bar-chart"></i></a>
<a target="_blank" href="http://atlas.apache.org/"><i class="fa fa-question-circle"></i></a> <a target="_blank" href="http://atlas.apache.org/"><i class="fa fa-question-circle"></i></a>
<a href="javascript:void(0);" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="user-dropdown"><i class="fa fa-user user-circle "></i><span class="userName"></span></a> <a href="javascript:void(0);" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="user-dropdown"><i class="fa fa-user user-circle "></i><span class="userName"></span></a>
......
dashboardv2/public/js/templates/tag/CreateTagLayoutView_tmpl.html
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
<input class="form-control" data-id="tagName" placeholder="Name(required)" autofocus/> <input class="form-control" data-id="tagName" placeholder="Name(required)" autofocus/>
</div> </div>
{{else}} {{else}}
<span class="ellipsis control-label text-left col-sm-10" data-id="title"></span> {{/if}} <span class="ellipsis-with-margin control-label text-left col-sm-10" data-id="title"></span> {{/if}}
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="control-label col-sm-2" for="description">Description</label> <label class="control-label col-sm-2" for="description">Description</label>
......
dashboardv2/public/js/views/detail_page/DetailPageLayoutView.js
...@@ -354,7 +354,7 @@ define(['require', ...@@ -354,7 +354,7 @@ define(['require',
CommonViewFunction.deleteTag(_.extend({}, { CommonViewFunction.deleteTag(_.extend({}, {
guid: that.id, guid: that.id,
associatedGuid: that.id != entityGuid ? entityGuid : null, associatedGuid: that.id != entityGuid ? entityGuid : null,
msg: "<div class='ellipsis'>Remove: " + "<b>" + _.escape(tagName) + "</b> assignment from" + " " + "<b>" + this.name + "?</b></div>", msg: "<div class='ellipsis-with-margin'>Remove: " + "<b>" + _.escape(tagName) + "</b> assignment from" + " " + "<b>" + this.name + "?</b></div>",
titleMessage: Messages.removeTag, titleMessage: Messages.removeTag,
okText: "Remove", okText: "Remove",
showLoader: that.showLoader.bind(that), showLoader: that.showLoader.bind(that),
...@@ -378,7 +378,7 @@ define(['require', ...@@ -378,7 +378,7 @@ define(['require',
relationshipGuid: termObj.relationshipGuid relationshipGuid: termObj.relationshipGuid
}, },
collection: that.glossaryCollection, collection: that.glossaryCollection,
msg: "<div class='ellipsis'>Remove: " + "<b>" + _.escape(termName) + "</b> assignment from" + " " + "<b>" + this.name + "?</b></div>", msg: "<div class='ellipsis-with-margin'>Remove: " + "<b>" + _.escape(termName) + "</b> assignment from" + " " + "<b>" + this.name + "?</b></div>",
titleMessage: Messages.glossary.removeTermfromEntity, titleMessage: Messages.glossary.removeTermfromEntity,
isEntityView: true, isEntityView: true,
buttonText: "Remove", buttonText: "Remove",
......
dashboardv2/public/js/views/entity/CreateEntityLayoutView.js
...@@ -498,7 +498,7 @@ define(['require', ...@@ -498,7 +498,7 @@ define(['require',
entityLabel = this.capitalize(value.name); entityLabel = this.capitalize(value.name);
return '<div class=" row ' + value.isOptional + '"><span class="col-sm-3">' + 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 text-gray" title="Data Type : ' + value.typeName + '">' + '(' + Utils.escapeHtml(value.typeName) + ')' + '</span></label></span>' + '<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>' +
'<span class="col-sm-9">' + (this.getElement(object)) + '<span class="col-sm-9">' + (this.getElement(object)) +
'</input></span></div>'; '</input></span></div>';
}, },
......
dashboardv2/public/js/views/glossary/GlossaryDetailLayoutView.js
...@@ -389,7 +389,7 @@ define(['require', ...@@ -389,7 +389,7 @@ define(['require',
tagName = $(e.currentTarget).text(), tagName = $(e.currentTarget).text(),
termName = this.data.name; termName = this.data.name;
CommonViewFunction.deleteTag(_.extend({}, { CommonViewFunction.deleteTag(_.extend({}, {
msg: "<div class='ellipsis'>Remove: " + "<b>" + _.escape(tagName) + "</b> assignment from" + " " + "<b>" + termName + "?</b></div>", msg: "<div class='ellipsis-with-margin'>Remove: " + "<b>" + _.escape(tagName) + "</b> assignment from" + " " + "<b>" + termName + "?</b></div>",
titleMessage: Messages.removeTag, titleMessage: Messages.removeTag,
okText: "Remove", okText: "Remove",
showLoader: that.showLoader.bind(that), showLoader: that.showLoader.bind(that),
...@@ -410,7 +410,7 @@ define(['require', ...@@ -410,7 +410,7 @@ define(['require',
selectedGuid: guid, selectedGuid: guid,
model: that.data, model: that.data,
collection: that.glossaryCollection, collection: that.glossaryCollection,
msg: "<div class='ellipsis'>Remove: " + "<b>" + _.escape(name) + "</b> assignment from" + " " + "<b>" + that.data.name + "?</b></div>", msg: "<div class='ellipsis-with-margin'>Remove: " + "<b>" + _.escape(name) + "</b> assignment from" + " " + "<b>" + that.data.name + "?</b></div>",
titleMessage: Messages.glossary[that.isTermView ? "removeCategoryfromTerm" : "removeTermfromCategory"], titleMessage: Messages.glossary[that.isTermView ? "removeCategoryfromTerm" : "removeTermfromCategory"],
isCategoryView: that.isCategoryView, isCategoryView: that.isCategoryView,
isTermView: that.isTermView, isTermView: that.isTermView,
......
dashboardv2/public/js/views/schema/SchemaLayoutView.js
...@@ -288,7 +288,7 @@ define(['require', ...@@ -288,7 +288,7 @@ define(['require',
CommonViewFunction.deleteTag({ CommonViewFunction.deleteTag({
tagName: tagName, tagName: tagName,
guid: guid, guid: guid,
msg: "<div class='ellipsis'>Remove: " + "<b>" + _.escape(tagName) + "</b> assignment from" + " " + "<b>" + assetName + " ?</b></div>", msg: "<div class='ellipsis-with-margin'>Remove: " + "<b>" + _.escape(tagName) + "</b> assignment from" + " " + "<b>" + assetName + " ?</b></div>",
titleMessage: Messages.removeTag, titleMessage: Messages.removeTag,
okText: "Remove", okText: "Remove",
showLoader: that.showLoader.bind(that), showLoader: that.showLoader.bind(that),
......
dashboardv2/public/js/views/search/SearchResultLayoutView.js
...@@ -575,7 +575,7 @@ define(['require', ...@@ -575,7 +575,7 @@ define(['require',
} else { } else {
that.ui.containerCheckBox.hide(); that.ui.containerCheckBox.hide();
} }
that.$(".ellipsis .inputAssignTag").hide(); that.$(".ellipsis-with-margin .inputAssignTag").hide();
table.trigger("grid:refresh"); /*Event fire when table rendered*/ table.trigger("grid:refresh"); /*Event fire when table rendered*/
// that.REntityTableLayoutView.$el.find('.colSort thead tr th:not(:first)').addClass('dragHandler'); // that.REntityTableLayoutView.$el.find('.colSort thead tr th:not(:first)').addClass('dragHandler');
if (that.isTableDropDisable !== true) { if (that.isTableDropDisable !== true) {
...@@ -956,7 +956,7 @@ define(['require', ...@@ -956,7 +956,7 @@ define(['require',
}, },
hideLoader: function(options) { hideLoader: function(options) {
this.$('.fontLoader:not(.for-ignore)').removeClass('show'); this.$('.fontLoader:not(.for-ignore)').removeClass('show');
options && options.type === 'error' ? this.$('.ellipsis,.pagination-box').hide() : this.$('.ellipsis,.pagination-box').show(); // only show for first time and hide when type is error options && options.type === 'error' ? this.$('.ellipsis-with-margin,.pagination-box').hide() : this.$('.ellipsis-with-margin,.pagination-box').show(); // only show for first time and hide when type is error
this.$('.tableOverlay').removeClass('show'); this.$('.tableOverlay').removeClass('show');
}, },
checkedValue: function(e) { checkedValue: function(e) {
...@@ -995,7 +995,7 @@ define(['require', ...@@ -995,7 +995,7 @@ define(['require',
tagName: tagName, tagName: tagName,
guid: guid, guid: guid,
associatedGuid: guid != entityGuid ? entityGuid : null, associatedGuid: guid != entityGuid ? entityGuid : null,
msg: "<div class='ellipsis'>Remove: " + "<b>" + _.escape(tagName) + "</b> assignment from" + " " + "<b>" + assetName + " ?</b></div>", msg: "<div class='ellipsis-with-margin'>Remove: " + "<b>" + _.escape(tagName) + "</b> assignment from" + " " + "<b>" + assetName + " ?</b></div>",
titleMessage: Messages.removeTag, titleMessage: Messages.removeTag,
okText: "Remove", okText: "Remove",
showLoader: that.showLoader.bind(that), showLoader: that.showLoader.bind(that),
...@@ -1022,7 +1022,7 @@ define(['require', ...@@ -1022,7 +1022,7 @@ define(['require',
relationshipGuid: termObj.relationGuid relationshipGuid: termObj.relationGuid
}, },
collection: that.glossaryCollection, collection: that.glossaryCollection,
msg: "<div class='ellipsis'>Remove: " + "<b>" + _.escape(termName) + "</b> assignment from" + " " + "<b>" + assetname + "?</b></div>", msg: "<div class='ellipsis-with-margin'>Remove: " + "<b>" + _.escape(termName) + "</b> assignment from" + " " + "<b>" + assetname + "?</b></div>",
titleMessage: Messages.glossary.removeTermfromEntity, titleMessage: Messages.glossary.removeTermfromEntity,
isEntityView: true, isEntityView: true,
buttonText: "Remove", buttonText: "Remove",
......
dashboardv2/public/js/views/site/Header.js
...@@ -20,8 +20,10 @@ define(['require', ...@@ -20,8 +20,10 @@ define(['require',
'hbs!tmpl/site/Header', 'hbs!tmpl/site/Header',
'utils/CommonViewFunction', 'utils/CommonViewFunction',
'utils/Globals', 'utils/Globals',
'utils/Utils' 'utils/Utils',
], function(require, tmpl, CommonViewFunction, Globals, Utils) { 'utils/UrlLinks',
'jquery-ui'
], function(require, tmpl, CommonViewFunction, Globals, Utils, UrlLinks) {
'use strict'; 'use strict';
var Header = Marionette.LayoutView.extend({ var Header = Marionette.LayoutView.extend({
...@@ -30,6 +32,8 @@ define(['require', ...@@ -30,6 +32,8 @@ define(['require',
ui: { ui: {
backButton: "[data-id='backButton']", backButton: "[data-id='backButton']",
menuHamburger: "[data-id='menuHamburger']", menuHamburger: "[data-id='menuHamburger']",
globalSearch: "[data-id='globalSearch']",
clearGlobalSearch: "[data-id='clearGlobalSearch']"
}, },
events: function() { events: function() {
var events = {}; var events = {};
...@@ -39,7 +43,7 @@ define(['require', ...@@ -39,7 +43,7 @@ define(['require',
if (queryParams && queryParams.from) { if (queryParams && queryParams.from) {
if (queryParams.from == "classification") { if (queryParams.from == "classification") {
urlPath = "tagUrl"; urlPath = "tagUrl";
} else if(queryParams.from == "glossary"){ } else if (queryParams.from == "glossary") {
urlPath = "glossaryUrl"; urlPath = "glossaryUrl";
} }
} }
...@@ -51,6 +55,11 @@ define(['require', ...@@ -51,6 +55,11 @@ define(['require',
}); });
}; };
events['click ' + this.ui.clearGlobalSearch] = function() {
this.ui.globalSearch.val("");
this.ui.globalSearch.autocomplete("search");
this.ui.clearGlobalSearch.removeClass("in");
};
events['click ' + this.ui.menuHamburger] = function() { events['click ' + this.ui.menuHamburger] = function() {
$('body').toggleClass("full-screen"); $('body').toggleClass("full-screen");
}; };
...@@ -64,7 +73,118 @@ define(['require', ...@@ -64,7 +73,118 @@ define(['require',
if (Globals.userLogedIn.status) { if (Globals.userLogedIn.status) {
that.$('.userName').html(Globals.userLogedIn.response.userName); that.$('.userName').html(Globals.userLogedIn.response.userName);
} }
this.initializeGlobalSearch();
},
getSearchUrlQueryParam: function(request) {
var term = request.term;
return {
"excludeDeletedEntities": true,
"includeSubClassifications": true,
"includeSubTypes": true,
"includeClassificationAttributes": true,
"entityFilters": null,
"tagFilters": null,
"attributes": null,
"query": this.getSearchString(term),
"limit": 5,
"offset": 0,
"typeName": null,
"classification": null,
"termName": null
}
},
getSearchString: function(str) {
if (str && str.length) {
return (str.match(/[+\-&|!(){}[\]^"~*?:/]/g) === null ? (str + "*") : str);
} else {
return str;
}
}, },
initializeGlobalSearch: function() {
var that = this;
this.cache = {};
this.ui.globalSearch.autocomplete({
minLength: 1,
autoFocus: false,
search: function() {
$(this).siblings('span.fa-search').removeClass("fa-search").addClass("fa-refresh fa-spin-custom");
},
focus: function(event, ui) {
//$(this).val(ui.item.itemText);
return false;
},
open: function() {
$(this).siblings('span.fa-refresh').removeClass("fa-refresh fa-spin-custom").addClass("fa-search");
},
select: function(event, ui) {
if (ui && ui.item && ui.item.value == "Empty") {
return false
} else {
Utils.setUrl({
url: '#!/detailPage/' + ui.item.guid,
mergeBrowserUrl: false,
trigger: true
});
return true
}
},
source: function(request, response) {
var term = request.term;
if (term in that.cache) {
response(that.cache[term]);
return;
}
$.ajax({
type: 'POST',
url: UrlLinks.searchApiUrl('basic'),
contentType: 'application/json',
data: JSON.stringify(that.getSearchUrlQueryParam(request)),
cache: true,
success: function(data) {
var data = data.entities;
if (data === undefined) {
data = ["Empty"];
}
that.cache[term] = data;
response(data);
}
});
}
}).focus(function() {
$(this).autocomplete("search");
}).keyup(function(event) {
if ($(this).val().trim() === "") {
that.ui.clearGlobalSearch.removeClass("in");
} else {
that.ui.clearGlobalSearch.addClass("in");
if (event.keyCode == 13) {
Utils.setUrl({
url: '#!/search/searchResult?query=' + encodeURIComponent(that.getSearchString($(this).val())) + '&searchType=basic',
mergeBrowserUrl: false,
trigger: true
});
}
}
}).autocomplete("instance")._renderItem = function(ul, item) {
if (item && item.value == "Empty") {
return $("<li>")
.append("<span class='empty'>No record found</span>")
.appendTo(ul);
}
item.itemText = Utils.getName(item) + " (" + item.typeName + ")";
var options = {},
table = '';
options.entityData = item;
var img = $('<img src="' + Utils.getEntityIconPath(options) + '">').on('error', function(error, s) {
this.src = Utils.getEntityIconPath(_.extend(options, { errorUrl: this.src }));
});
var link = $("<a class='search-entity-anchor ellipsis' href='#!/detailPage/" + item.guid + "'>" + item.itemText + "</a>").prepend(img);
return $("<li class='with-icon'>")
.append(link)
.appendTo(ul);
};
}
}); });
return Header; return Header;
}); });
\ No newline at end of file
dashboardv2/public/js/views/tag/TagDetailTableLayoutView.js
...@@ -205,7 +205,7 @@ define(['require', ...@@ -205,7 +205,7 @@ define(['require',
tagName: tagName, tagName: tagName,
guid: that.guid, guid: that.guid,
associatedGuid: that.guid != entityGuid ? entityGuid : null, associatedGuid: that.guid != entityGuid ? entityGuid : null,
msg: "<div class='ellipsis'>Remove: " + "<b>" + _.escape(tagName) + "</b> assignment from" + " " + "<b>" + this.entityName + "?</b></div>", msg: "<div class='ellipsis-with-margin'>Remove: " + "<b>" + _.escape(tagName) + "</b> assignment from" + " " + "<b>" + this.entityName + "?</b></div>",
titleMessage: Messages.removeTag, titleMessage: Messages.removeTag,
okText: "Remove", okText: "Remove",
showLoader: function() { showLoader: function() {
......
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