JGonera has uploaded a new change for review.
https://gerrit.wikimedia.org/r/94078
Change subject: [WIP] Separate stable and beta search JS code
......................................................................
[WIP] Separate stable and beta search JS code
Use a global search-results event rather than a write-results event of a
SearchOverlay.
Change-Id: Ia8d61ffcc4e4eb936380c5cd1493a3070f2131b4
---
M includes/Resources.php
M includes/skins/SkinMinerva.php
M javascripts/modules/lazyload.js
M javascripts/modules/mf-watchstar.js
M javascripts/modules/nearby/PagePreviewOverlay.js
M javascripts/modules/search/search.js
R javascripts/modules/searchNew/pageImages.js
A javascripts/modules/searchNew/search.js
8 files changed, 173 insertions(+), 25 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend
refs/changes/78/94078/1
diff --git a/includes/Resources.php b/includes/Resources.php
index fd13321..61f0f25 100644
--- a/includes/Resources.php
+++ b/includes/Resources.php
@@ -411,19 +411,22 @@
'styles' => array(
'less/common/OverlayNew.less',
'less/modules/talk.less',
+ 'less/modules/search.less',
),
'scripts' => array(
'javascripts/common/OverlayNew.js',
'javascripts/common/LoadingOverlayNew.js',
'javascripts/modules/mf-toggle-dynamic.js',
'javascripts/modules/talk/talk.js',
- 'javascripts/modules/search/pageImages.js',
+ 'javascripts/modules/searchNew/search.js',
+ 'javascripts/modules/searchNew/pageImages.js',
'javascripts/modules/languages/preferred.js',
'javascripts/modules/lastEdited/lastEditedBeta.js',
'javascripts/modules/keepgoing/keepgoing.js',
),
'templates' => array(
'OverlayNew',
+ 'overlays/search/search',
),
'position' => 'bottom',
'messages' => array(
@@ -442,6 +445,10 @@
'mobile-frontend-last-modified-with-user-months',
'mobile-frontend-last-modified-with-user-years',
'mobile-frontend-last-modified-with-user-just-now',
+
+ // for search.js
+ 'mobile-frontend-search-help',
+ 'mobile-frontend-search-noresults',
),
),
@@ -522,7 +529,6 @@
'styles' => array(
'less/common/common-js.less',
'less/modules/languages.less',
- 'less/modules/search.less',
'less/modules/issues.less',
'less/modules/watchstar.less',
'less/modules/tutorials.less',
@@ -548,9 +554,8 @@
'overlays/languages',
'overlay',
'overlays/cleanup',
- // search-2.js
+ // search.js and Nearby.js
'articleList',
- 'overlays/search/search',
// page.js
'page',
'languageSection',
@@ -635,7 +640,6 @@
'javascripts/modules/lastEdited/time.js',
'javascripts/modules/uploads/lead-photo-init.js',
'javascripts/modules/mainmenutweaks.js',
- 'javascripts/modules/search/search.js',
'javascripts/modules/mf-watchstar.js',
'javascripts/modules/mf-references.js',
'javascripts/common/ContentOverlay.js',
@@ -675,16 +679,34 @@
'mobile-frontend-watchlist-removed',
'mobile-frontend-watchlist-cta',
- // for search.js
- 'mobile-frontend-search-help',
- 'mobile-frontend-search-noresults',
-
// newbieEditor.js
'mobile-frontend-editor-tutorial-summary',
'mobile-frontend-editor-tutorial-confirm',
),
),
+ // FIXME: remove when new search overlay in stable
+ 'mobile.search.stable' => $wgMFMobileResourceBoilerplate + array(
+ 'dependencies' => array(
+ 'mobile.stable',
+ 'mobile.templates',
+ ),
+ 'scripts' => array(
+ 'javascripts/modules/search/search.js',
+ ),
+ 'styles' => array(
+ 'less/modules/search.less',
+ ),
+ 'templates' => array(
+ 'overlays/search/search',
+ ),
+ 'messages' => array(
+ // for search.js
+ 'mobile-frontend-search-help',
+ 'mobile-frontend-search-noresults',
+ ),
+ ),
+
'mobile.site' => array(
'dependencies' => array( 'mobile.startup' ),
'class' => 'MobileSiteModule',
diff --git a/includes/skins/SkinMinerva.php b/includes/skins/SkinMinerva.php
index 006f6c7..63353f4 100644
--- a/includes/skins/SkinMinerva.php
+++ b/includes/skins/SkinMinerva.php
@@ -425,7 +425,10 @@
$modules['watch'] = array();
$modules['search'] = array();
- $modules['stableonly'] = array( 'mobile.lastEdited.stable' );
+ $modules['stableonly'] = array(
+ 'mobile.search.stable',
+ 'mobile.lastEdited.stable',
+ );
$title = $this->getTitle();
diff --git a/javascripts/modules/lazyload.js b/javascripts/modules/lazyload.js
index dd1baaa..2ce1c8b 100644
--- a/javascripts/modules/lazyload.js
+++ b/javascripts/modules/lazyload.js
@@ -1,7 +1,6 @@
( function( M, $ ) {
- var searchOverlay = M.require( 'search' ).overlay,
- history = M.history,
+ var history = M.history,
// FIXME: use fuzzy link hijacking in the main namespace - core
should be updated to make links more explicit
useFuzzyLinkHijacking = M.inNamespace( '' );
@@ -23,11 +22,11 @@
history.hijackLinks( M.getLeadSection(),
useFuzzyLinkHijacking );
} );
- searchOverlay.on( 'write-results', function() {
- var $results = searchOverlay.$( 'ul' );
+ M.on( 'search-results', function( overlay ) {
+ var $results = overlay.$( 'ul' );
history.hijackLinks( $results );
$results.find( 'a' ).on( 'click', function() {
- searchOverlay.hide();
+ overlay.hide();
} );
} );
}
diff --git a/javascripts/modules/mf-watchstar.js
b/javascripts/modules/mf-watchstar.js
index 6224d1b..43fbb86 100644
--- a/javascripts/modules/mf-watchstar.js
+++ b/javascripts/modules/mf-watchstar.js
@@ -3,7 +3,6 @@
var api = M.require( 'api' ), w = ( function() {
var popup = M.require( 'notifications' ),
- searchOverlay = M.require( 'search' ).overlay,
CtaDrawer = M.require( 'CtaDrawer' ),
drawer = new CtaDrawer( {
content: mw.msg( 'mobile-frontend-watchlist-cta' ),
@@ -217,8 +216,8 @@
}
function upgradeUI() {
- searchOverlay.on( 'write-results', function() {
- initWatchListIconList( searchOverlay.$( 'ul' ) );
+ M.on( 'search-results', function( overlay ) {
+ initWatchListIconList( overlay.$( 'ul' ) );
} );
}
diff --git a/javascripts/modules/nearby/PagePreviewOverlay.js
b/javascripts/modules/nearby/PagePreviewOverlay.js
index e77cd94..afbf0b9 100644
--- a/javascripts/modules/nearby/PagePreviewOverlay.js
+++ b/javascripts/modules/nearby/PagePreviewOverlay.js
@@ -28,6 +28,7 @@
M.pageApi.getPage( options.title,
options.endpoint, true ).done( function( page ) {
options.page = new Page( page );
// FIXME [API]: This additional ajax
request should be unnecessary.
+ // FIXME: and if necessary, reuse
PageImageApi that search uses
api.get( {
action : 'query',
prop: 'pageimages',
diff --git a/javascripts/modules/search/search.js
b/javascripts/modules/search/search.js
index 1d22270..6e1dd41 100644
--- a/javascripts/modules/search/search.js
+++ b/javascripts/modules/search/search.js
@@ -72,7 +72,7 @@
};
}
$content.html( M.template.get( 'articleList' ).render( data ) );
- this.emit( 'write-results', results );
+ M.emit( 'search-results', this, results );
},
performSearch: function() {
@@ -125,7 +125,6 @@
M.define( 'search', {
SearchOverlay: SearchOverlay,
- overlay: searchOverlay,
highlightSearchTerm: highlightSearchTerm
} );
diff --git a/javascripts/modules/search/pageImages.js
b/javascripts/modules/searchNew/pageImages.js
similarity index 90%
rename from javascripts/modules/search/pageImages.js
rename to javascripts/modules/searchNew/pageImages.js
index b4066b9..cddb23c 100644
--- a/javascripts/modules/search/pageImages.js
+++ b/javascripts/modules/searchNew/pageImages.js
@@ -37,10 +37,9 @@
return result;
}
} ),
- piApi = new PageImageApi(),
- overlay = M.require( 'search' ).overlay;
+ piApi = new PageImageApi();
- function renderPageImages( results ) {
+ function renderPageImages( overlay, results ) {
var titles = $.map( results, function( r ) { return r.title; }
);
piApi.getPageImages( titles ).done( function( pages ) {
@@ -61,9 +60,9 @@
// Add event to retrieve page images when images not disabled
if ( !mw.config.get( 'wgImagesDisabled' ) ) {
- overlay.on( 'write-results', function( results ) {
+ M.on( 'search-results', function( overlay, results ) {
window.setTimeout( function() {
- renderPageImages( results );
+ renderPageImages( overlay, results );
}, delay );
} );
}
diff --git a/javascripts/modules/searchNew/search.js
b/javascripts/modules/searchNew/search.js
new file mode 100644
index 0000000..30d0a95
--- /dev/null
+++ b/javascripts/modules/searchNew/search.js
@@ -0,0 +1,126 @@
+( function( M, $ ) {
+
+var Overlay = M.require( 'Overlay' ), SearchOverlay,
+ api = M.require( 'api' ),
+ searchOverlay;
+
+/**
+ * Escapes regular expression wildcards (metacharacters) by adding a \\ prefix
+ * @param {String} str a string
+ * @return {String} a regular expression that can be used to search for that
str
+ */
+function createSearchRegEx( str ) {
+ str = str.replace( /[\-\[\]{}()*+?.,\\\^$|#\s]/g, '\\$&' );
+ return new RegExp( '^(' + str + ')' , 'ig' );
+}
+
+/**
+ * Takes a label potentially beginning with term
+ * and highlights term if it is present with strong
+ *
+ * @param {String} label a piece of text
+ * @param {String} term a string to search for from the start
+ * @return {String} safe html string with matched terms encapsulated in strong
tags
+ */
+function highlightSearchTerm( label, term ) {
+ label = $( '<span>' ).text( label ).html();
+ term = $( '<span>' ).text( term ).html();
+
+ return label.replace( createSearchRegEx( term ),'<strong>$1</strong>' );
+}
+
+SearchOverlay = Overlay.extend( {
+ template: M.template.get( 'overlays/search/search' ),
+ defaults: {
+ explanation: mw.msg( 'mobile-frontend-search-help' ),
+ noresults: mw.msg( 'mobile-frontend-search-noresults' ),
+ action: mw.config.get( 'wgScript' )
+ },
+ className: 'mw-mf-overlay',
+ postRender: function( options ) {
+ var self = this;
+
+ this._super( options );
+
+ this.data = this.defaults;
+
+ this.$( 'input' ).on( 'keyup', function( ev ) {
+ if ( ev.keyCode && ev.keyCode === 13 ) {
+ $( this ).parents( 'form' ).submit();
+ } else {
+ self.performSearch();
+ }
+ } );
+ this.results = [];
+ this.$( '.clear' ).on( 'click', function() {
+ self.$( 'input' ).val( '' ).focus();
+ } );
+ },
+ /**
+ * Renders a list of results
+ *
+ * @param {Array} results list of search results with label and url
properties set
+ */
+ writeResults: function( results ) {
+ var $content = this.$( 'div.suggestions-results' ),
+ data = {
+ pages: results || []
+ };
+ if ( results.length === 0 ) {
+ data.error = {
+ guidance: mw.msg(
'mobile-frontend-search-noresults' )
+ };
+ }
+ $content.html( M.template.get( 'articleList' ).render( data ) );
+ M.emit( 'search-results', this, results );
+ },
+
+ performSearch: function() {
+ var self = this,
+ term = this.$( 'input' ).val();
+
+ function completeSearch( data ) {
+ data = $.map( data[ 1 ], function( item ) {
+ return {
+ heading: highlightSearchTerm( item,
term ),
+ title: item,
+ url: mw.util.wikiGetlink( item )
+ };
+ } );
+
+ self.writeResults( data );
+
+ self.$( 'input' ).removeClass( 'searching' );
+ }
+
+ clearTimeout( this.timer );
+ if ( term.length > 0 ) {
+ this.timer = setTimeout( function () {
+ self.$( 'input' ).addClass( 'searching' );
+ api.get( {
+ search: term,
+ action: 'opensearch',
+ namespace: 0,
+ limit: 15
+ } ).done( completeSearch );
+ }, 500 );
+ }
+ },
+ showAndFocus: function() {
+ this.show();
+ this.$( 'input' ).focus().select();
+ }
+} );
+
+searchOverlay = new SearchOverlay();
+
+function init() {
+ // FIXME change when micro.tap.js in stable
+ // don't use focus event
(https://bugzilla.wikimedia.org/show_bug.cgi?id=47499)
+ $( '#searchInput' ).on( M.tapEvent( 'touchend mouseup' ), function() {
+ searchOverlay.showAndFocus();
+ } );
+}
+init();
+
+}( mw.mobileFrontend, jQuery ));
--
To view, visit https://gerrit.wikimedia.org/r/94078
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: Ia8d61ffcc4e4eb936380c5cd1493a3070f2131b4
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: JGonera <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
