Skip to content

Commit 718844c

Browse files
heathermillerheathermiller
authored
Merge pull request #684 from MasseGuillaume/feature/scaladex-autocomplete
Scaladex autocomplete
2 parents a488a97 + e38f276 commit 718844c

File tree

5 files changed

+180
-205
lines changed

5 files changed

+180
-205
lines changed

‎_layouts/frontpage.html

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -237,10 +237,6 @@ <h2>The Scala Library Index</h2>
237237
<div class="input-control">
238238
<span><i class="fa fa-search"></i></span>
239239
<input type="text" placeholder="Search" id="scaladex-search">
240-
<div class="autocomplete-suggestions">
241-
<div class="autocomplete-suggestion autocomplete-selected"></div>
242-
<div class="autocomplete-suggestion"></div>
243-
</div>
244240
</div>
245241
</div>
246242
</div>

‎_sass/layout/scala-ecosystem.scss

Lines changed: 43 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -93,33 +93,52 @@
9393
}
9494
}
9595

96-
.autocomplete-suggestions {
97-
border: 1px solid $gray-light;
98-
background: #FFF;
99-
overflow: auto;
100-
}
96+
}
10197

102-
.autocomplete-suggestion {
103-
padding: 2px 5px;
104-
white-space: nowrap;
105-
overflow: hidden;
106-
}
98+
.autocomplete-suggestions {
99+
width: 100%;
100+
background: #fff;
101+
top: 42px;
102+
left: 0;
103+
position: absolute;
104+
z-index: 9999;
105+
-webkit-box-shadow: 0 2px 20px rgba(0, 0, 0, 0.2);
106+
box-shadow: 0 2px 20px rgba(0, 0, 0, 0.2);
107+
}
107108

108-
.autocomplete-selected {
109-
background: $gray-lighter;
110-
}
109+
.autocomplete-suggestions {
110+
padding: 0;
111+
margin: 0;
112+
}
111113

112-
.autocomplete-suggestions strong {
113-
font-weight: normal;
114-
color: $gray-dark;
115-
}
114+
.autocomplete-suggestions .autocomplete-suggestion {
115+
padding: 15px;
116+
list-style: none;
117+
border-bottom: 1px solid rgba(0, 43, 55, 0.1);
118+
}
116119

117-
.autocomplete-group {
118-
padding: 2px 5px;
119-
}
120+
.autocomplete-suggestions .autocomplete-suggestion:last-child {
121+
border-bottom: none;
122+
}
120123

121-
.autocomplete-group strong {
122-
display: block;
123-
border-bottom: 1px solid $gray-light;
124-
}
124+
.autocomplete-suggestions .autocomplete-suggestion a {
125+
color: #586e75;
126+
}
127+
128+
.autocomplete-suggestions .autocomplete-suggestion a:hover,
129+
.autocomplete-suggestions .autocomplete-suggestion a:active,
130+
.autocomplete-suggestions .autocomplete-suggestion a:focus {
131+
text-decoration: none;
132+
}
133+
134+
.autocomplete-suggestions .autocomplete-suggestion a p {
135+
color: #224951;
136+
margin: 0;
137+
font-weight: 400;
138+
}
139+
140+
.autocomplete-suggestions .autocomplete-suggestion:hover,
141+
.autocomplete-suggestions .autocomplete-suggestion.selected {
142+
background: #edf1f1;
143+
cursor: default;
125144
}

‎index.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,5 +62,5 @@ scalaIDEs:
6262

6363
# Scala ecosystem
6464
ecosystemTitle: "Scala ecosystem"
65-
ecosystemDescription: "The Scala Library Index (or Scaladex) is a representation of a map of all published Scala libraries. With Scaladex, a developer can now query more than 100,000 releases of Scala libraries. Scaladex is officially supported by Scala Center."
65+
ecosystemDescription: "The Scala Library Index (or Scaladex) is a representation of a map of all published Scala libraries. With Scaladex, a developer can now query more than 175,000 releases of Scala libraries. Scaladex is officially supported by Scala Center."
6666
---

‎resources/js/functions.js

Lines changed: 33 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -102,88 +102,52 @@ $('#tweet-feed').tweetMachine('', {
102102
});
103103

104104
// Scaladex autocomplete search
105-
var prevResult = "";
106-
var lastElementClicked;
107105

108-
$(document).mousedown(function(e) {
109-
lastElementClicked = $(e.target);
110-
});
111-
112-
$(document).mouseup(function(e) {
113-
lastElementClicked = null;
114-
});
106+
var scaladexUrlBase = 'https://index.scala-lang.org';
115107

116-
function hideSuggestions() {
117-
$('.autocomplete-suggestions').hide();
118-
$('.autocomplete-suggestion').hide();
108+
function scaladexUrl(item) {
109+
return scaladexUrlBase + "/" + item.organization + "/" + item.repository;
119110
}
120111

121-
function showSuggestions() {
122-
$('.autocomplete-suggestions').show();
123-
$('.autocomplete-suggestion').show();
124-
}
125-
126-
hideSuggestions();
127-
$('#scaladex-search').on('input', function(e) {
128-
if ($("#scaladex-search").val() == "") hideSuggestions();
129-
});
130-
131-
$('#scaladex-search').on('focus', function(e) {
132-
if ($("#scaladex-search").val() != "") showSuggestions();
133-
});
134-
135-
$('#scaladex-search').on('blur', function(e) {
136-
if (!$(e.target).is('.autocomplete-suggestion')) {
137-
if (lastElementClicked != null && !lastElementClicked.is('.autocomplete-suggestion')) {
138-
hideSuggestions();
139-
}
140-
} else {
141-
hideSuggestions();
142-
}
112+
$('#scaladex-search').keypress(function(e){
113+
var RETURN = 13;
114+
if (e.which == RETURN ) {
115+
e.stopImmediatePropagation();
116+
e.preventDefault();
117+
window.open(scaladexUrlBase + "/search?q=" + e.target.value);
118+
}
143119
});
144120

145121
$('#scaladex-search').autocomplete({
146122
paramName: 'q',
147-
serviceUrl: 'https://index.scala-lang.org/api/autocomplete',
123+
serviceUrl: scaladexUrlBase + '/api/autocomplete',
148124
dataType: 'json',
149-
beforeRender: function() {
150-
showSuggestions();
151-
},
152-
onSearchStart: function(query) {
153-
if (query == "") {
154-
hideSuggestions()
155-
} else {
156-
showSuggestions();
157-
}
158-
},
159125
transformResult: function(response) {
160-
return {
161-
suggestions: $.map(response, function(dataItem) {
162-
return { value: dataItem.repository, data: 'https://scaladex.scala-lang.org/' + dataItem.organization + "/" + dataItem.repository };
163-
})
164-
};
165-
},
166-
onSearchComplete: function (query, suggestions) {
167-
suggestions.length > 0 ? showSuggestions() : hideSuggestions();
126+
return {
127+
suggestions: $.map(response, function(dataItem) {
128+
return {
129+
value: dataItem.organization + " / " + dataItem.repository,
130+
data: dataItem
131+
};
132+
})
133+
};
168134
},
135+
noCache: true,
169136
onSelect: function (suggestion) {
170-
if (suggestion.data != prevResult) {
171-
prevResult = suggestion.data;
172-
hideSuggestions();
173-
$("#scaladex-search").blur();
174-
window.open(suggestion.data, '_blank');
175-
}
137+
console.log(suggestion);
138+
window.open(scaladexUrl(suggestion.data), '_blank');
139+
},
140+
formatResult: function(suggestion){
141+
var item = suggestion.data;
142+
var url = scaladexUrl(item);
143+
var title = item.organization + " / " + item.repository;
144+
return '<a href="' + url + '">' + '\n' +
145+
' <p>' + title + '</p>' + '\n' +
146+
' <span>' + '\n' +
147+
item.description
148+
' </span>' + '\n' +
149+
'</a>';
176150
}
177-
178-
});
179-
180-
$(document).ready(function() {
181-
$(window).on("blur", function() {
182-
if ($("#scaladex-search").length) {
183-
$("#scaladex-search").blur();
184-
$("#scaladex-search").autocomplete().clear();
185-
}
186-
});
187151
});
188152

189153
// TOC:

0 commit comments

Comments
 (0)