phillip/ingress-intel-total-conversion
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

add icon to search results

Browse Source
This commit is contained in:
fkloft
2015-02-12 15:33:17 +01:00
parent 4c7b8e0e70
commit d98737b3ba
3 changed files with 23 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
code/search.js
View File

@ -18,6 +18,7 @@ addHook('search', function(query) {});
- `bounds`: a L.LatLngBounds object describing the bounds of this result - `bounds`: a L.LatLngBounds object describing the bounds of this result
- `layer`: a ILayer to be added to the map when the user selects this search result. Will be generated if not set. - `layer`: a ILayer to be added to the map when the user selects this search result. Will be generated if not set.
Set to `null` to prevent the result from being added to the map. Set to `null` to prevent the result from being added to the map.
- `icon`: a URL to a icon to display in the result list. Should be 12x12.
- `onSelected(result, event)`: a handler to be called when the result is selected. May return `true` to prevent the map - `onSelected(result, event)`: a handler to be called when the result is selected. May return `true` to prevent the map
from being repositioned. You may reposition the map yourself or do other work. from being repositioned. You may reposition the map yourself or do other work.
- `onRemove(result)`: a handler to be called when the result is removed from the map (because another result has been - `onRemove(result)`: a handler to be called when the result is removed from the map (because another result has been
@ -93,10 +94,15 @@ window.search.Query.prototype.addResult = function(result) {
} }
}); });
$('<a>') var link = $('<a>')
.text(result.title) .text(result.title)
.appendTo(item); .appendTo(item);
if(result.icon) {
link.css('background-image', 'url("'+result.icon+'")');
item.css('list-style', 'none');
}
if(result.description) { if(result.description) {
item item
.append($('<br>')) .append($('<br>'))
@ -221,9 +227,12 @@ addHook('search', function(query) {
var term = query.term.toLowerCase(); var term = query.term.toLowerCase();
$.each(portals, function(guid, portal) { $.each(portals, function(guid, portal) {
if(portal.options.data.title.toLowerCase().indexOf(term) !== -1) { if(portal.options.data.title.toLowerCase().indexOf(term) !== -1) {
var team = portal.options.team;
var color = team==TEAM_NONE ? '#CCC' : COLORS[team];
query.addResult({ query.addResult({
title: portal.options.data.title, title: portal.options.data.title,
position: portal.getLatLng(), position: portal.getLatLng(),
icon: 'data:image/svg+xml;base64,'+btoa('@@INCLUDESTRING:images/icon-portal.svg@@'.replace(/%COLOR%/g, color)),
}); });
} }
}); });

7
images/icon-portal.svg Normal file
View File

@ -0,0 +1,7 @@
<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" width="12" height="12" version="1.1">
<g style="fill:%COLOR%;stroke:none">
<path d="m 6,12 -2,-12 4,0 z" />
<path d="m 6,12 -4, -8 8,0 z" />
<path d="m 6,12 -6, -4 12,0 z" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 280 B

6
style.css
View File

@ -540,6 +540,12 @@ input[type="search"], input[type="url"] {
#searchwrapper li { #searchwrapper li {
cursor: pointer; cursor: pointer;
} }
#searchwrapper li a {
margin-left: -14px;
padding-left: 14px;
background-position: 1px center;
background-repeat: no-repeat;
}
#searchwrapper li em { #searchwrapper li em {
color: #ccc; color: #ccc;
font-size: 0.9em; font-size: 0.9em;