jenkins-bot has submitted this change and it was merged.
Change subject: jquery.suggestions, mediawiki.searchSuggest: Don't use
jquery.autoEllipsis
......................................................................
jquery.suggestions, mediawiki.searchSuggest: Don't use jquery.autoEllipsis
(How's that for a loaded commit topic, huh?)
We can just use text-overflow: ellipsis, which is widely supported
these days. The result is a lot less code being loaded on every page
view and a lot less processing being done on the suggestions.
This changes the position of the ellipsis from the "middle" of the
text to the end of it. I don't think this is a problem.
Bug: 30309
Bug: 59172
Change-Id: I6fc229a292a90a3cbb945b58061ee99b0ac7f97d
---
M resources/Resources.php
M resources/jquery/jquery.suggestions.css
M resources/jquery/jquery.suggestions.js
M resources/mediawiki/mediawiki.searchSuggest.css
M resources/mediawiki/mediawiki.searchSuggest.js
5 files changed, 22 insertions(+), 31 deletions(-)
Approvals:
Ori.livneh: Looks good to me, approved
jenkins-bot: Verified
diff --git a/resources/Resources.php b/resources/Resources.php
index 72c17f3..708e25a 100644
--- a/resources/Resources.php
+++ b/resources/Resources.php
@@ -320,7 +320,7 @@
'jquery.suggestions' => array(
'scripts' => 'resources/jquery/jquery.suggestions.js',
'styles' => 'resources/jquery/jquery.suggestions.css',
- 'dependencies' => 'jquery.autoEllipsis',
+ 'dependencies' => 'jquery.highlightText',
),
'jquery.tabIndex' => array(
'scripts' => 'resources/jquery/jquery.tabIndex.js',
@@ -857,7 +857,6 @@
'searchsuggest-containing',
),
'dependencies' => array(
- 'jquery.autoEllipsis',
'jquery.client',
'jquery.placeholder',
'jquery.suggestions',
diff --git a/resources/jquery/jquery.suggestions.css
b/resources/jquery/jquery.suggestions.css
index e0ba647..ea65946 100644
--- a/resources/jquery/jquery.suggestions.css
+++ b/resources/jquery/jquery.suggestions.css
@@ -44,6 +44,11 @@
line-height: 1.5em;
padding: 0.01em 0.25em;
text-align: left;
+ /* Apply ellipsis to suggestions */
+ overflow: hidden;
+ -o-text-overflow: ellipsis; /* Opera 9 to 10 */
+ text-overflow: ellipsis;
+ white-space: nowrap;
}
.suggestions-result-current {
@@ -71,7 +76,6 @@
color: white;
}
-.autoellipsis-matched,
.highlight {
font-weight: bold;
}
diff --git a/resources/jquery/jquery.suggestions.js
b/resources/jquery/jquery.suggestions.js
index f9a225f..29be239 100644
--- a/resources/jquery/jquery.suggestions.js
+++ b/resources/jquery/jquery.suggestions.js
@@ -138,8 +138,8 @@
*/
configure: function ( context, property, value ) {
var newCSS,
- $autoEllipseMe, $result, $results, childrenWidth,
- i, expWidth, matchedText, maxWidth, text;
+ $result, $results, childrenWidth,
+ i, expWidth, maxWidth, text;
// Validate creation using fallback values
switch ( property ) {
@@ -237,8 +237,6 @@
$results =
context.data.$container.children( '.suggestions-results' );
$results.empty();
expWidth = -1;
- $autoEllipseMe = $( [] );
- matchedText = null;
for ( i = 0; i <
context.config.suggestions.length; i++ ) {
/*jshint loopfunc:true
*/
text =
context.config.suggestions[i];
@@ -259,15 +257,11 @@
if ( typeof
context.config.result.render === 'function' ) {
context.config.result.render.call( $result, context.config.suggestions[i],
context );
} else {
- // Add <span>
with text
- $result.append(
$( '<span>' )
-
.css( 'whiteSpace', 'nowrap' )
-
.text( text )
- );
+ $result.text(
text );
}
if (
context.config.highlightInput ) {
- matchedText =
context.data.prevText;
+
$result.highlightText( context.data.prevText );
}
// Widen results box if
needed
@@ -277,19 +271,13 @@
// factor in
any padding, margin, or border space on the parent
expWidth =
childrenWidth + ( context.data.$container.width() - $result.width() );
}
- $autoEllipseMe =
$autoEllipseMe.add( $result );
}
+
// Apply new width for results
box, if any
if ( expWidth >
context.data.$container.width() ) {
maxWidth =
context.config.maxExpandFactor * context.data.$textbox.width();
context.data.$container.width( Math.min( expWidth, maxWidth ) );
}
- // autoEllipse the results. Has
to be done after changing the width
- $autoEllipseMe.autoEllipsis( {
- hasSpan: true,
- tooltip: true,
- matchText: matchedText
- } );
}
}
break;
diff --git a/resources/mediawiki/mediawiki.searchSuggest.css
b/resources/mediawiki/mediawiki.searchSuggest.css
index 0fb862b..df144ce 100644
--- a/resources/mediawiki/mediawiki.searchSuggest.css
+++ b/resources/mediawiki/mediawiki.searchSuggest.css
@@ -4,8 +4,8 @@
.suggestions a.mw-searchSuggest-link:hover,
.suggestions a.mw-searchSuggest-link:active,
.suggestions a.mw-searchSuggest-link:focus {
- text-decoration: none;
color: black;
+ text-decoration: none;
}
.suggestions-result-current a.mw-searchSuggest-link,
@@ -14,3 +14,11 @@
.suggestions-result-current a.mw-searchSuggest-link:focus {
color: white;
}
+
+.suggestions a.mw-searchSuggest-link .special-query {
+ /* Apply ellipsis to suggestions */
+ overflow: hidden;
+ -o-text-overflow: ellipsis; /* Opera 9 to 10 */
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
diff --git a/resources/mediawiki/mediawiki.searchSuggest.js
b/resources/mediawiki/mediawiki.searchSuggest.js
index 6999610..8a8871d 100644
--- a/resources/mediawiki/mediawiki.searchSuggest.js
+++ b/resources/mediawiki/mediawiki.searchSuggest.js
@@ -62,13 +62,7 @@
resultRenderCache.linkParams[
resultRenderCache.textParam ] = text;
// this is the container <div>, jQueryfied
- this
- .append(
- // the <span> is needed for
$.autoEllipsis to work
- $( '<span>' )
- .css( 'whiteSpace', 'nowrap' )
- .text( text )
- )
+ this.text( text )
.wrap(
$( '<a>' )
.attr( 'href',
resultRenderCache.baseHref + $.param( resultRenderCache.linkParams ) )
@@ -95,13 +89,11 @@
$( '<div>' )
.addClass(
'special-query' )
.text( query )
- .autoEllipsis()
)
.show();
} else {
$el.find( '.special-query' )
- .text( query )
- .autoEllipsis();
+ .text( query );
}
if ( $el.parent().hasClass( 'mw-searchSuggest-link' ) )
{
--
To view, visit https://gerrit.wikimedia.org/r/111180
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I6fc229a292a90a3cbb945b58061ee99b0ac7f97d
Gerrit-PatchSet: 5
Gerrit-Project: mediawiki/core
Gerrit-Branch: master
Gerrit-Owner: Bartosz Dziewoński <[email protected]>
Gerrit-Reviewer: Bartosz Dziewoński <[email protected]>
Gerrit-Reviewer: Jack Phoenix <[email protected]>
Gerrit-Reviewer: Krinkle <[email protected]>
Gerrit-Reviewer: Manybubbles <[email protected]>
Gerrit-Reviewer: Ori.livneh <[email protected]>
Gerrit-Reviewer: Thiemo Mättig (WMDE) <[email protected]>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits