Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
minerva
core
Commits
23094f85
Commit
23094f85
authored
Jan 11, 2017
by
Piotr Gawron
Browse files
autocomplete functionality for search panel
parent
66f09be9
Changes
10
Hide whitespace changes
Inline
Side-by-side
frontend-js/package.json
View file @
23094f85
...
...
@@ -13,6 +13,7 @@
"devDependencies"
:
{
"assert"
:
"1.4.1"
,
"bluebird"
:
"^3.4.6"
,
"bootstrap"
:
"^3.3.7"
,
"browserify"
:
"^13.1.1"
,
"chai"
:
"^3.5.0"
,
"exorcist"
:
"^0.4.0"
,
...
...
@@ -28,7 +29,7 @@
"dependencies"
:
{
"log4js"
:
"0.6.38"
,
"pileup"
:
"^0.6.8"
,
"js-cookie"
:
"^2.1.3"
,
"js-cookie"
:
"^2.1.3"
,
"request"
:
"^2.79.0"
}
}
frontend-js/src/main/js/ServerConnector.js
View file @
23094f85
...
...
@@ -594,6 +594,14 @@ ServerConnector.getProjectUrl = function(projectId, token) {
});
};
ServerConnector
.
getSuggestedQueryListUrl
=
function
(
params
)
{
return
this
.
getApiUrl
({
type
:
"
project
"
,
method
:
"
getSuggestedQueryList
"
,
params
:
params
,
});
};
ServerConnector
.
addCommentUrl
=
function
()
{
return
this
.
getApiUrl
({
type
:
"
comment
"
,
method
:
"
addComment
"
,
...
...
@@ -1042,4 +1050,20 @@ ServerConnector.addComment = function(params) {
});
};
ServerConnector
.
getSuggestedQueryList
=
function
(
projectId
)
{
var
self
=
this
;
return
new
Promise
(
function
(
resolve
,
reject
)
{
return
self
.
getProjectId
(
projectId
).
then
(
function
(
result
)
{
projectId
=
result
;
return
self
.
getToken
();
}).
then
(
function
(
token
)
{
return
self
.
sendPostRequest
(
self
.
getSuggestedQueryListUrl
(),{
projectId
:
projectId
,
token
:
token
});
}).
then
(
function
(
content
)
{
resolve
(
JSON
.
parse
(
content
));
}).
catch
(
function
(
exception
){
reject
(
exception
);
});
});
};
module
.
exports
=
ServerConnector
;
frontend-js/src/main/js/gui/SearchPanel.js
View file @
23094f85
...
...
@@ -29,6 +29,20 @@ function SearchPanel(params) {
}
};
$
(
self
.
getSearchInput
()).
typeahead
({
minLength
:
1
,
},{
source
:
function
(
query
,
callback
){
callback
(
self
.
getMap
().
getSearchAutocomplete
(
query
));
}
});
$
(
self
.
getSearchInput
()).
on
(
'
typeahead:select
'
,
function
(
evt
,
item
)
{
searchByQuery
();
});
if
(
searchDb
===
undefined
)
{
throw
new
Error
(
"
Cannot find search db overlay
"
);
}
...
...
@@ -205,6 +219,9 @@ SearchPanel.prototype.addResultTab = function(query, elements) {
var
navLink
=
document
.
createElement
(
"
a
"
);
navLink
.
href
=
"
#
"
+
tabId
;
if
(
name
!==
undefined
)
{
if
(
name
.
length
>
12
)
{
name
=
name
.
substring
(
0
,
10
)
+
"
...
"
;
}
navLink
.
innerHTML
=
name
;
}
navLink
.
onclick
=
function
(){
...
...
frontend-js/src/main/js/map/CustomMap.js
View file @
23094f85
...
...
@@ -1821,4 +1821,43 @@ CustomMap.prototype.fetchIdentifiedElements = function(elements, complete) {
};
CustomMap
.
prototype
.
refreshSearchAutocomplete
=
function
(){
var
self
=
this
;
self
.
_searchAutocomplete
=
[];
return
new
Promise
(
function
(
resolve
,
reject
){
return
ServerConnector
.
getSuggestedQueryList
().
then
(
function
(
queries
){
for
(
var
i
=
0
;
i
<
queries
.
length
;
i
++
)
{
var
mainString
=
queries
[
i
];
for
(
var
j
=
0
;
j
<
mainString
.
length
;
j
++
)
{
var
substring
=
mainString
.
substring
(
0
,
j
+
1
);
if
(
self
.
_searchAutocomplete
[
substring
]
!==
undefined
)
{
continue
;
}
var
list
=
[];
for
(
var
k
=
0
;
k
<
5
;
k
++
)
{
if
(
k
+
i
>=
queries
.
length
)
{
break
;
}
else
if
(
queries
[
k
+
i
].
toLowerCase
().
startsWith
(
substring
.
toLowerCase
()))
{
list
.
push
(
queries
[
k
+
i
]);
}
}
self
.
_searchAutocomplete
[
substring
]
=
list
;
}
}
resolve
(
self
.
_searchAutocomplete
);
}).
catch
(
reject
);
});
};
CustomMap
.
prototype
.
getSearchAutocomplete
=
function
(
query
){
if
(
this
.
_searchAutocomplete
===
undefined
)
{
this
.
refreshSearchAutocomplete
();
return
[];
}
return
this
.
_searchAutocomplete
[
query
];
};
module
.
exports
=
CustomMap
;
frontend-js/src/test/js/map/CustomMap-test.js
View file @
23094f85
...
...
@@ -201,6 +201,24 @@ describe('CustomMap', function() {
});
});
it
(
"
getSearchAutocomplete
"
,
function
()
{
var
map
=
helper
.
createCustomMap
();
var
t
=
map
.
getSearchAutocomplete
(
"
s
"
);
assert
.
ok
(
t
);
assert
.
equal
(
t
.
length
,
0
);
});
it
(
"
getSearchAutocomplete 2
"
,
function
()
{
var
map
=
helper
.
createCustomMap
();
return
map
.
refreshSearchAutocomplete
(
"
s
"
).
then
(
function
()
{
var
t
=
map
.
getSearchAutocomplete
(
"
s
"
);
assert
.
ok
(
t
);
assert
.
ok
(
t
.
length
>
0
);
});
});
it
(
"
openInfoWindowForMarker
"
,
function
()
{
var
onSendOverlayDetailDataRequest
=
0
;
...
...
@@ -421,20 +439,20 @@ describe('CustomMap', function() {
assert
.
equal
(
map
.
getId
(),
map
.
getActiveSubmapId
());
});
it
(
"
left click on map
"
,
function
()
{
var
map
=
helper
.
createCustomMap
();
map
.
getModel
().
setId
(
15781
);
var
searchOverlay
=
helper
.
createSearchDbOverlay
(
map
);
var
mev
=
{
stop
:
null
,
latLng
:
new
google
.
maps
.
LatLng
(
40.0
,
-
90.0
)
};
assert
.
notOk
(
map
.
getActiveSubmapId
());
return
google
.
maps
.
event
.
trigger
(
map
.
getGoogleMap
(),
'
click
'
,
mev
).
then
(
function
(){
return
google
.
maps
.
event
.
trigger
(
map
.
getGoogleMap
(),
'
click
'
,
mev
).
then
(
function
()
{
assert
.
equal
(
map
.
getId
(),
map
.
getActiveSubmapId
());
assert
.
ok
(
searchOverlay
.
aliasMarkers
[
329173
]);
});
...
...
@@ -443,16 +461,16 @@ describe('CustomMap', function() {
it
(
"
left click on reaction
"
,
function
()
{
var
map
=
helper
.
createCustomMap
();
map
.
getModel
().
setId
(
15781
);
var
searchOverlay
=
helper
.
createSearchDbOverlay
(
map
);
var
mev
=
{
stop
:
null
,
latLng
:
new
google
.
maps
.
LatLng
(
42.0
,
-
90.0
)
};
assert
.
notOk
(
map
.
getActiveSubmapId
());
return
google
.
maps
.
event
.
trigger
(
map
.
getGoogleMap
(),
'
click
'
,
mev
).
then
(
function
(){
return
google
.
maps
.
event
.
trigger
(
map
.
getGoogleMap
(),
'
click
'
,
mev
).
then
(
function
()
{
assert
.
equal
(
map
.
getId
(),
map
.
getActiveSubmapId
());
assert
.
ok
(
searchOverlay
.
reactionMarkers
[
153515
]);
assert
.
ok
(
searchOverlay
.
reactionMarkers
[
153515
].
isShown
());
...
...
@@ -550,7 +568,7 @@ describe('CustomMap', function() {
var
map
=
helper
.
createCustomMap
();
map
.
getModel
().
setId
(
15781
);
var
commentsOverlay
=
helper
.
createCommentDbOverlay
(
map
);
ServerConnector
.
getSessionData
().
setShowComments
(
true
);
return
map
.
refreshComments
().
then
(
function
()
{
assert
.
ok
(
commentsOverlay
.
pointMarkers
[
'
(241.01,372.35)
'
]);
...
...
frontend-js/src/test/js/mocha-config.js
View file @
23094f85
...
...
@@ -11,6 +11,10 @@ global.window = document.defaultView;
global
.
$
=
require
(
'
jQuery
'
);
global
.
jQuery
=
$
;
global
.
window
.
$
=
$
;
require
(
"
bootstrap
"
);
global
.
google
=
require
(
'
./google-map-mock
'
);
...
...
@@ -32,13 +36,25 @@ function removeCookies(){
}
}
beforeEach
(
function
()
{
function
mockBootstrap
()
{
$
.
fn
.
typeahead
=
function
()
{
logger
.
debug
(
"
Mock typeahead function call
"
);
}
}
before
(
function
()
{
Promise
.
longStackTraces
();
mockBootstrap
();
});
beforeEach
(
function
()
{
logger
.
flushBuffer
();
removeCookies
();
ServerConnector
.
init
();
ServerConnector
.
setToken
(
"
MOCK_TOKEN_ID
"
);
...
...
@@ -54,7 +70,7 @@ beforeEach(function() {
});
after
(
function
()
{
after
Each
(
function
()
{
document
.
body
.
removeChild
(
global
.
testDiv
);
document
.
body
.
removeChild
(
global
.
dialogDiv
);
delete
global
.
testDiv
;
...
...
frontend-js/testFiles/apiCalls/project/getSuggestedQueryList/projectId=sample&token=MOCK_TOKEN_ID&
0 → 100644
View file @
23094f85
["acetoacetate","adp","atp","bdh1","carney complex multiple neoplasia and lentiginosis","cnc","d-beta hydroxybutyrate","gdp","gfsdhj","gtp","h+","nad+","nadh","ncx1","s1","s10","s11","s12","s13","s14","s2","s22","s23","s3","s4","s5","s6","s7","s8","s9"]
\ No newline at end of file
web/src/main/webapp/WEB-INF/components/map/searchPanel.xhtml
View file @
23094f85
...
...
@@ -18,7 +18,7 @@
</tr>
<tr>
<td>
<input
name=
"searchInput"
class=
"input-field"
/>
<input
name=
"searchInput"
class=
"input-field
typeahead"
autocomplete=
"off
"
/>
</td>
<td>
<a
name=
"searchButton"
href=
"#"
>
...
...
web/src/main/webapp/index.xhtml
View file @
23094f85
...
...
@@ -18,7 +18,9 @@
<!-- Google Maps API version 3.20 -->
<script
src=
"https://maps.google.com/maps/api/js?libraries=drawing&v=3.22"
type=
"text/javascript"
/>
<
script
src
=
"
http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js
"
type
=
"
text/javascript
"
/>
<
script
src
=
"
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js
"
type
=
"
text/javascript
"
/>
<
script
src
=
"
http://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.min.js
"
type
=
"
text/javascript
"
/>
<
link
rel
=
"
shortcut icon
"
href
=
"
./resources/images/favicon.png
"
type
=
"
image/png
"
/>
...
...
web/src/main/webapp/resources/css/global.css
View file @
23094f85
...
...
@@ -27,4 +27,53 @@
border-spacing
:
2px
;
-webkit-border-horizontal-spacing
:
2px
;
-webkit-border-vertical-spacing
:
2px
;
}
\ No newline at end of file
}
/* twitter typeahead */
.tt-query
/* UPDATE: newer versions use tt-input instead of tt-query */
{
width
:
396px
;
height
:
30px
;
padding
:
8px
12px
;
font-size
:
24px
;
line-height
:
30px
;
border
:
2px
solid
#ccc
;
border-radius
:
8px
;
outline
:
none
;
}
.tt-query
{
/* UPDATE: newer versions use tt-input instead of tt-query */
box-shadow
:
inset
0
1px
1px
rgba
(
0
,
0
,
0
,
0.075
);
}
.tt-hint
{
color
:
#999
;
}
.tt-menu
{
/* UPDATE: newer versions use tt-menu instead of tt-dropdown-menu */
width
:
222px
;
margin-top
:
12px
;
padding
:
8px
0
;
background-color
:
#fff
;
border
:
1px
solid
#ccc
;
border
:
1px
solid
rgba
(
0
,
0
,
0
,
0.2
);
border-radius
:
8px
;
box-shadow
:
0
5px
10px
rgba
(
0
,
0
,
0
,
.2
);
}
.tt-suggestion
{
padding
:
3px
20px
;
line-height
:
24px
;
}
.tt-suggestion
:hover
{
cursor
:
pointer
;
color
:
#fff
;
background-color
:
#0097cf
;
}
.tt-suggestion.tt-cursor
{
color
:
#fff
;
background-color
:
#0097cf
;
}
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new 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