Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
A
atlas
Project
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
dataplatform
atlas
Commits
57b52a29
Commit
57b52a29
authored
5 years ago
by
kevalbhatt
Committed by
Sarath Subramanian
5 years ago
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
ATLAS-3470: UI : Search completes late because of loading entity icons
Signed-off-by:
Sarath Subramanian
<
sarath@apache.org
>
parent
c3da6d5f
Show whitespace changes
Inline
Side-by-side
Showing
10 changed files
with
137 additions
and
26 deletions
+137
-26
loader.scss
dashboardv2/public/css/scss/loader.scss
+37
-0
theme.scss
dashboardv2/public/css/scss/theme.scss
+14
-3
Helper.js
dashboardv2/public/js/utils/Helper.js
+11
-2
SearchResultLayoutView.js
dashboardv2/public/js/views/search/SearchResultLayoutView.js
+5
-8
Header.js
dashboardv2/public/js/views/site/Header.js
+3
-2
loader.scss
dashboardv3/public/css/scss/loader.scss
+37
-0
theme.scss
dashboardv3/public/css/scss/theme.scss
+11
-0
Helper.js
dashboardv3/public/js/utils/Helper.js
+10
-2
GlobalSearchLayoutView.js
dashboardv3/public/js/views/search/GlobalSearchLayoutView.js
+4
-1
SearchResultLayoutView.js
dashboardv3/public/js/views/search/SearchResultLayoutView.js
+5
-8
No files found.
dashboardv2/public/css/scss/loader.scss
View file @
57b52a29
...
@@ -26,6 +26,7 @@
...
@@ -26,6 +26,7 @@
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
transform
:
rotate
(
0deg
);
transform
:
rotate
(
0deg
);
}
}
100
%
{
100
%
{
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
transform
:
rotate
(
359deg
);
transform
:
rotate
(
359deg
);
...
@@ -37,6 +38,7 @@
...
@@ -37,6 +38,7 @@
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
transform
:
rotate
(
0deg
);
transform
:
rotate
(
0deg
);
}
}
100
%
{
100
%
{
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
transform
:
rotate
(
359deg
);
transform
:
rotate
(
359deg
);
...
@@ -116,19 +118,53 @@
...
@@ -116,19 +118,53 @@
left
:
-200px
;
left
:
-200px
;
width
:
30%
;
width
:
30%
;
}
}
50
%
{
50
%
{
width
:
30%
;
width
:
30%
;
}
}
70
%
{
70
%
{
width
:
70%
;
width
:
70%
;
}
}
80
%
{
80
%
{
left
:
50%
;
left
:
50%
;
}
}
95
%
{
95
%
{
left
:
120%
;
left
:
120%
;
}
}
to
{
to
{
left
:
100%
;
left
:
100%
;
}
}
}
}
.searchTableLogoLoader
{
width
:
20px
;
-webkit-animation-duration
:
1
.5s
;
animation-duration
:
1
.5s
;
-webkit-animation-fill-mode
:
forwards
;
animation-fill-mode
:
forwards
;
-webkit-animation-iteration-count
:
infinite
;
animation-iteration-count
:
infinite
;
-webkit-animation-timing-function
:
linear
;
animation-timing-function
:
linear
;
-webkit-animation-name
:
placeHolderLoader
;
animation-name
:
placeHolderLoader
;
background
:
#f6f7f8
;
background
:
linear-gradient
(
to
right
,
#eeeeee
8%
,
#dddddd
18%
,
#eeeeee
33%
);
background-size
:
700px
10px
;
border-radius
:
8px
;
}
@keyframes
placeHolderLoader
{
0
%
{
background-position
:
-468px
0
;
}
100
%
{
background-position
:
468px
0
;
}
}
\ No newline at end of file
This diff is collapsed.
Click to expand it.
dashboardv2/public/css/scss/theme.scss
View file @
57b52a29
...
@@ -462,7 +462,7 @@ hr[size="10"] {
...
@@ -462,7 +462,7 @@ hr[size="10"] {
overflow-x
:
hidden
;
overflow-x
:
hidden
;
.ui-autocomplete-category
{
.ui-autocomplete-category
{
padding
:
10
px
;
padding
:
5px
15
px
;
color
:
#acacac
;
color
:
#acacac
;
text-transform
:
capitalize
;
text-transform
:
capitalize
;
}
}
...
@@ -477,7 +477,7 @@ hr[size="10"] {
...
@@ -477,7 +477,7 @@ hr[size="10"] {
}
}
.ui-menu-item
{
.ui-menu-item
{
padding
:
5
px
2px
;
padding
:
2
px
2px
;
color
:
$color_ironside_gray_approx
;
color
:
$color_ironside_gray_approx
;
&
.with-icon
{
&
.with-icon
{
...
@@ -505,7 +505,7 @@ hr[size="10"] {
...
@@ -505,7 +505,7 @@ hr[size="10"] {
a
,
a
,
span
{
span
{
padding
:
10px
;
padding
:
6px
10px
;
display
:
block
;
display
:
block
;
color
:
inherit
!
important
;
color
:
inherit
!
important
;
}
}
...
@@ -522,6 +522,17 @@ td.searchTableName:hover {
...
@@ -522,6 +522,17 @@ td.searchTableName:hover {
}
}
}
}
.globalsearchImgItem.isIncomplete
{
display
:
inline-block
!
important
;
position
:
relative
;
i
.fa
{
left
:
10px
;
top
:
7px
;
font-size
:
12px
;
}
}
.isIncomplete
{
.isIncomplete
{
&
.show
{
&
.show
{
img
{
img
{
...
...
This diff is collapsed.
Click to expand it.
dashboardv2/public/js/utils/Helper.js
View file @
57b52a29
...
@@ -77,6 +77,7 @@ define(['require',
...
@@ -77,6 +77,7 @@ define(['require',
}
else
if
(
isPopOverEl
.
$tip
)
{
}
else
if
(
isPopOverEl
.
$tip
)
{
$
(
'.popover'
).
not
(
isPopOverEl
.
$tip
).
popover
(
'hide'
);
$
(
'.popover'
).
not
(
isPopOverEl
.
$tip
).
popover
(
'hide'
);
}
}
$
(
".tooltip"
).
tooltip
(
"hide"
);
}
}
});
});
$
(
'body'
).
on
(
'hidden.bs.popover'
,
function
(
e
)
{
$
(
'body'
).
on
(
'hidden.bs.popover'
,
function
(
e
)
{
...
@@ -243,10 +244,17 @@ define(['require',
...
@@ -243,10 +244,17 @@ define(['require',
});
});
// For adding tooltip globally
// For adding tooltip globally
$
(
"body"
).
on
(
'mouseenter'
,
'.select2-selection__choice'
,
function
()
{
$
(
this
).
attr
(
"title"
,
""
);
});
if
(
$
(
'body'
).
tooltip
)
{
$
(
'body'
).
tooltip
({
$
(
'body'
).
tooltip
({
selector
:
'[title]'
,
selector
:
'[title]:not(".select2-selection__choice")'
,
placement
:
'bottom'
,
placement
:
function
()
{
return
this
.
$element
.
attr
(
"data-placement"
)
||
"bottom"
;
},
container
:
'body'
container
:
'body'
});
});
}
})
})
\ No newline at end of file
This diff is collapsed.
Click to expand it.
dashboardv2/public/js/views/search/SearchResultLayoutView.js
View file @
57b52a29
...
@@ -683,8 +683,7 @@ define(['require',
...
@@ -683,8 +683,7 @@ define(['require',
returnImgUrl
=
null
;
returnImgUrl
=
null
;
$
.
ajax
({
$
.
ajax
({
"url"
:
imagePath
,
"url"
:
imagePath
,
"method"
:
"get"
,
"method"
:
"get"
"async"
:
false
,
})
})
.
always
(
function
(
data
,
status
,
xhr
)
{
.
always
(
function
(
data
,
status
,
xhr
)
{
if
(
data
.
status
==
404
)
{
if
(
data
.
status
==
404
)
{
...
@@ -693,19 +692,17 @@ define(['require',
...
@@ -693,19 +692,17 @@ define(['require',
});
});
}
else
if
(
data
)
{
}
else
if
(
data
)
{
returnImgUrl
=
imagePath
;
returnImgUrl
=
imagePath
;
that
.
$
(
"img[data-imgGuid='"
+
obj
.
guid
+
"']"
).
removeClass
(
"searchTableLogoLoader"
).
attr
(
"src"
,
imagePath
);
}
}
});
});
return
returnImgUrl
;
}
}
var
imgPath
=
getImageData
({
imagePath
:
Utils
.
getEntityIconPath
({
entityData
:
obj
})
}),
var
img
=
""
,
img
=
""
,
isIncompleteClass
=
"isIncomplete search-result-page"
;
isIncompleteClass
=
"isIncomplete search-result-page"
;
if
(
obj
.
isIncomplete
===
true
)
{
if
(
obj
.
isIncomplete
===
true
)
{
isIncompleteClass
+=
" show"
;
isIncompleteClass
+=
" show"
;
}
}
if
(
imgPath
)
{
img
=
"<div class='"
+
isIncompleteClass
+
"'><img data-imgGuid='"
+
obj
.
guid
+
"' class='searchTableLogoLoader'><i class='fa fa-hourglass-half'></i></div>"
;
img
=
"<div class='"
+
isIncompleteClass
+
"'><img src='"
+
imgPath
+
"'><i class='fa fa-hourglass-half'></i></div>"
;
getImageData
({
imagePath
:
Utils
.
getEntityIconPath
({
entityData
:
obj
})
});
}
return
(
img
+
nameHtml
);
return
(
img
+
nameHtml
);
}
}
})
})
...
...
This diff is collapsed.
Click to expand it.
dashboardv2/public/js/views/site/Header.js
View file @
57b52a29
...
@@ -71,7 +71,7 @@ define(['require',
...
@@ -71,7 +71,7 @@ define(['require',
};
};
events
[
'click '
+
this
.
ui
.
signOut
]
=
function
()
{
events
[
'click '
+
this
.
ui
.
signOut
]
=
function
()
{
Utils
.
localStorage
.
setValue
(
"atlas_ui"
,
"classic"
);
Utils
.
localStorage
.
setValue
(
"atlas_ui"
,
"classic"
);
var
path
=
Utils
.
getBaseUrl
(
window
.
location
.
pathname
);
var
path
=
Utils
.
getBaseUrl
(
window
.
location
.
pathname
);
window
.
location
=
path
+
"/logout.html"
;
window
.
location
=
path
+
"/logout.html"
;
};
};
...
@@ -253,9 +253,10 @@ define(['require',
...
@@ -253,9 +253,10 @@ define(['require',
var
options
=
{},
var
options
=
{},
table
=
''
;
table
=
''
;
options
.
entityData
=
item
;
options
.
entityData
=
item
;
var
img
=
$
(
'<img src="'
+
Utils
.
getEntityIconPath
(
options
)
+
'">'
).
on
(
'error'
,
function
(
error
,
s
)
{
var
img
El
=
$
(
'<img src="'
+
Utils
.
getEntityIconPath
(
options
)
+
'">'
).
on
(
"error"
,
function
(
error
,
s
)
{
this
.
src
=
Utils
.
getEntityIconPath
(
_
.
extend
(
options
,
{
errorUrl
:
this
.
src
}));
this
.
src
=
Utils
.
getEntityIconPath
(
_
.
extend
(
options
,
{
errorUrl
:
this
.
src
}));
});
});
var
img
=
$
(
'<div class="globalsearchImgItem isIncomplete '
+
(
item
.
isIncomplete
?
"show"
:
""
)
+
'"><i class="fa fa-hourglass-half"></i><div>'
).
prepend
(
imgEl
);
var
span
=
$
(
"<span>"
+
(
getHighlightedTerm
(
item
.
itemText
))
+
"</span>"
)
var
span
=
$
(
"<span>"
+
(
getHighlightedTerm
(
item
.
itemText
))
+
"</span>"
)
.
prepend
(
img
);
.
prepend
(
img
);
li
=
$
(
"<li class='with-icon'>"
)
li
=
$
(
"<li class='with-icon'>"
)
...
...
This diff is collapsed.
Click to expand it.
dashboardv3/public/css/scss/loader.scss
View file @
57b52a29
...
@@ -26,6 +26,7 @@
...
@@ -26,6 +26,7 @@
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
transform
:
rotate
(
0deg
);
transform
:
rotate
(
0deg
);
}
}
100
%
{
100
%
{
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
transform
:
rotate
(
359deg
);
transform
:
rotate
(
359deg
);
...
@@ -37,6 +38,7 @@
...
@@ -37,6 +38,7 @@
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
transform
:
rotate
(
0deg
);
transform
:
rotate
(
0deg
);
}
}
100
%
{
100
%
{
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
//Instead of the line below you could use @include transform($scale, $rotate, $transx, $transy, $skewx, $skewy, $originx, $originy)
transform
:
rotate
(
359deg
);
transform
:
rotate
(
359deg
);
...
@@ -113,19 +115,53 @@
...
@@ -113,19 +115,53 @@
left
:
-200px
;
left
:
-200px
;
width
:
30%
;
width
:
30%
;
}
}
50
%
{
50
%
{
width
:
30%
;
width
:
30%
;
}
}
70
%
{
70
%
{
width
:
70%
;
width
:
70%
;
}
}
80
%
{
80
%
{
left
:
50%
;
left
:
50%
;
}
}
95
%
{
95
%
{
left
:
120%
;
left
:
120%
;
}
}
to
{
to
{
left
:
100%
;
left
:
100%
;
}
}
}
}
.searchTableLogoLoader
{
width
:
20px
;
-webkit-animation-duration
:
1
.5s
;
animation-duration
:
1
.5s
;
-webkit-animation-fill-mode
:
forwards
;
animation-fill-mode
:
forwards
;
-webkit-animation-iteration-count
:
infinite
;
animation-iteration-count
:
infinite
;
-webkit-animation-timing-function
:
linear
;
animation-timing-function
:
linear
;
-webkit-animation-name
:
placeHolderLoader
;
animation-name
:
placeHolderLoader
;
background
:
#f6f7f8
;
background
:
linear-gradient
(
to
right
,
#eeeeee
8%
,
#dddddd
18%
,
#eeeeee
33%
);
background-size
:
700px
10px
;
border-radius
:
8px
;
}
@keyframes
placeHolderLoader
{
0
%
{
background-position
:
-468px
0
;
}
100
%
{
background-position
:
468px
0
;
}
}
\ No newline at end of file
This diff is collapsed.
Click to expand it.
dashboardv3/public/css/scss/theme.scss
View file @
57b52a29
...
@@ -703,6 +703,17 @@ td.searchTableName:hover {
...
@@ -703,6 +703,17 @@ td.searchTableName:hover {
}
}
}
}
.globalsearchImgItem.isIncomplete
{
display
:
inline-block
!
important
;
position
:
relative
;
i
.fa
{
left
:
10px
;
top
:
7px
;
font-size
:
12px
;
}
}
.isIncomplete
{
.isIncomplete
{
&
.show
{
&
.show
{
img
{
img
{
...
...
This diff is collapsed.
Click to expand it.
dashboardv3/public/js/utils/Helper.js
View file @
57b52a29
...
@@ -262,10 +262,17 @@ define(['require',
...
@@ -262,10 +262,17 @@ define(['require',
});
});
// For adding tooltip globally
// For adding tooltip globally
$
(
"body"
).
on
(
'mouseenter'
,
'.select2-selection__choice'
,
function
()
{
$
(
this
).
attr
(
"title"
,
""
);
});
if
(
$
(
'body'
).
tooltip
)
{
$
(
'body'
).
tooltip
({
$
(
'body'
).
tooltip
({
selector
:
'[title]'
,
selector
:
'[title]:not(".select2-selection__choice")'
,
placement
:
'bottom'
,
placement
:
function
()
{
return
this
.
$element
.
attr
(
"data-placement"
)
||
"bottom"
;
},
container
:
'body'
container
:
'body'
});
});
}
})
})
\ No newline at end of file
This diff is collapsed.
Click to expand it.
dashboardv3/public/js/views/search/GlobalSearchLayoutView.js
View file @
57b52a29
...
@@ -295,9 +295,12 @@ define(["require",
...
@@ -295,9 +295,12 @@ define(["require",
var
options
=
{},
var
options
=
{},
table
=
""
;
table
=
""
;
options
.
entityData
=
item
;
options
.
entityData
=
item
;
var
img
=
$
(
'<img src="'
+
Utils
.
getEntityIconPath
(
options
)
+
'">'
).
on
(
"error"
,
function
(
error
,
s
)
{
var
img
El
=
$
(
'<img src="'
+
Utils
.
getEntityIconPath
(
options
)
+
'">'
).
on
(
"error"
,
function
(
error
,
s
)
{
this
.
src
=
Utils
.
getEntityIconPath
(
_
.
extend
(
options
,
{
errorUrl
:
this
.
src
}));
this
.
src
=
Utils
.
getEntityIconPath
(
_
.
extend
(
options
,
{
errorUrl
:
this
.
src
}));
});
});
var
img
=
$
(
'<div class="globalsearchImgItem isIncomplete '
+
(
item
.
isIncomplete
?
"show"
:
""
)
+
'"><i class="fa fa-hourglass-half"></i><div>'
).
prepend
(
imgEl
);
var
span
=
$
(
"<span>"
+
getHighlightedTerm
(
item
.
itemText
)
+
"</span>"
).
prepend
(
img
);
var
span
=
$
(
"<span>"
+
getHighlightedTerm
(
item
.
itemText
)
+
"</span>"
).
prepend
(
img
);
li
=
$
(
"<li class='with-icon'>"
).
append
(
span
);
li
=
$
(
"<li class='with-icon'>"
).
append
(
span
);
}
else
{
}
else
{
...
...
This diff is collapsed.
Click to expand it.
dashboardv3/public/js/views/search/SearchResultLayoutView.js
View file @
57b52a29
...
@@ -695,8 +695,7 @@ define(['require',
...
@@ -695,8 +695,7 @@ define(['require',
returnImgUrl
=
null
;
returnImgUrl
=
null
;
$
.
ajax
({
$
.
ajax
({
"url"
:
imagePath
,
"url"
:
imagePath
,
"method"
:
"get"
,
"method"
:
"get"
"async"
:
false
,
})
})
.
always
(
function
(
data
,
status
,
xhr
)
{
.
always
(
function
(
data
,
status
,
xhr
)
{
if
(
data
.
status
==
404
)
{
if
(
data
.
status
==
404
)
{
...
@@ -705,19 +704,17 @@ define(['require',
...
@@ -705,19 +704,17 @@ define(['require',
});
});
}
else
if
(
data
)
{
}
else
if
(
data
)
{
returnImgUrl
=
imagePath
;
returnImgUrl
=
imagePath
;
that
.
$
(
"img[data-imgGuid='"
+
obj
.
guid
+
"']"
).
removeClass
(
"searchTableLogoLoader"
).
attr
(
"src"
,
imagePath
);
}
}
});
});
return
returnImgUrl
;
}
}
var
imgPath
=
getImageData
({
imagePath
:
Utils
.
getEntityIconPath
({
entityData
:
obj
})
}),
var
img
=
""
,
img
=
""
,
isIncompleteClass
=
"isIncomplete search-result-page"
;
isIncompleteClass
=
"isIncomplete search-result-page"
;
if
(
obj
.
isIncomplete
===
true
)
{
if
(
obj
.
isIncomplete
===
true
)
{
isIncompleteClass
+=
" show"
;
isIncompleteClass
+=
" show"
;
}
}
if
(
imgPath
)
{
img
=
"<div class='"
+
isIncompleteClass
+
"'><img data-imgGuid='"
+
obj
.
guid
+
"' class='searchTableLogoLoader'><i class='fa fa-hourglass-half'></i></div>"
;
img
=
"<div class='"
+
isIncompleteClass
+
"'><img src='"
+
imgPath
+
"'><i class='fa fa-hourglass-half'></i></div>"
;
getImageData
({
imagePath
:
Utils
.
getEntityIconPath
({
entityData
:
obj
})
});
}
return
(
img
+
nameHtml
);
return
(
img
+
nameHtml
);
}
}
})
})
...
...
This diff is collapsed.
Click to expand it.
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment