Various performance fixes for CompactInterlanguageList
T122341: * Move hideOriginal() call to right before render() to reduce repaint flash. * Use plain css() instead of show() and hide(). * Use native getAttribute() instead of jQuery().attr. Other minor clean up: * Fix jsduck syntax. * Consistently use 'location' instead of 'window.location' (mostly the case already except for one). Bug: T122341 Change-Id: Ief76fe7c0fb2bfca3468361ebab14c1dfb1df4c2
This commit is contained in:
committed by
Santhosh Thottingal
parent
d08ebb9e77
commit
862fafb9ab
@@ -23,7 +23,7 @@
|
|||||||
/**
|
/**
|
||||||
* For the given array, remove duplicates
|
* For the given array, remove duplicates
|
||||||
* @param {Array} originalArray
|
* @param {Array} originalArray
|
||||||
* @return de-duplicated array
|
* @return {Array} de-duplicated array
|
||||||
*/
|
*/
|
||||||
function unique( originalArray ) {
|
function unique( originalArray ) {
|
||||||
var uniqueArray = [];
|
var uniqueArray = [];
|
||||||
@@ -56,18 +56,20 @@
|
|||||||
* Initialize the plugin
|
* Initialize the plugin
|
||||||
*/
|
*/
|
||||||
init: function () {
|
init: function () {
|
||||||
|
var max = this.options.max;
|
||||||
this.interlanguageList = this.getInterlanguageList();
|
this.interlanguageList = this.getInterlanguageList();
|
||||||
this.listSize = this.getListSize();
|
this.listSize = this.getListSize();
|
||||||
|
|
||||||
if ( this.listSize <= this.options.max ) {
|
if ( this.listSize <= max ) {
|
||||||
// Not enough languages to compact the list
|
// Not enough languages to compact the list
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// If the interlanguage list is of moderate size, the compact size is 7.
|
// If we're only a bit beyond max, limit to 7 instead of 9.
|
||||||
this.compactSize = ( this.listSize <= 12 ) ? 7 : this.options.max;
|
// FIXME: This assumes the max is 9.
|
||||||
this.hideOriginal();
|
this.compactSize = ( this.listSize <= 12 ) ? 7 : max;
|
||||||
this.compactList = this.getCompactList();
|
this.compactList = this.getCompactList();
|
||||||
|
this.hideOriginal();
|
||||||
this.render();
|
this.render();
|
||||||
this.listen();
|
this.listen();
|
||||||
},
|
},
|
||||||
@@ -120,7 +122,7 @@
|
|||||||
previousLanguages.push( language );
|
previousLanguages.push( language );
|
||||||
previousLanguages = unique( previousLanguages );
|
previousLanguages = unique( previousLanguages );
|
||||||
mw.uls.setPreviousLanguages( previousLanguages );
|
mw.uls.setPreviousLanguages( previousLanguages );
|
||||||
window.location.href = compactLinks.interlanguageList[ language ].href;
|
location.href = compactLinks.interlanguageList[ language ].href;
|
||||||
},
|
},
|
||||||
onVisible: function () {
|
onVisible: function () {
|
||||||
// Calculate the positioning of the panel
|
// Calculate the positioning of the panel
|
||||||
@@ -153,17 +155,17 @@
|
|||||||
* @return {Object}
|
* @return {Object}
|
||||||
*/
|
*/
|
||||||
getCompactList: function () {
|
getCompactList: function () {
|
||||||
var language, languages, compactLanguages, index,
|
var language, languages, compactLanguages, i,
|
||||||
compactedList = {};
|
compactedList = {};
|
||||||
|
|
||||||
languages = $.map( this.interlanguageList, function ( element, index ) {
|
languages = $.map( this.interlanguageList, function ( item, languageCode ) {
|
||||||
return index;
|
return languageCode;
|
||||||
} );
|
} );
|
||||||
|
|
||||||
compactLanguages = this.compact( languages );
|
compactLanguages = this.compact( languages );
|
||||||
|
|
||||||
for ( index = 0; index < compactLanguages.length; index++ ) {
|
for ( i = 0; i < compactLanguages.length; i++ ) {
|
||||||
language = compactLanguages[ index ];
|
language = compactLanguages[ i ];
|
||||||
compactedList[ language ] = this.interlanguageList[ language ];
|
compactedList[ language ] = this.interlanguageList[ language ];
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -173,27 +175,28 @@
|
|||||||
/**
|
/**
|
||||||
* Compact a given array of languages
|
* Compact a given array of languages
|
||||||
* @param {Array} languages
|
* @param {Array} languages
|
||||||
* @return {Array} compacted array
|
* @return {Array} Compacted array
|
||||||
*/
|
*/
|
||||||
compact: function ( languages ) {
|
compact: function ( languages ) {
|
||||||
var compactLanguages = [];
|
var compactLanguages = [];
|
||||||
|
|
||||||
|
compactLanguages = compactLanguages.concat(
|
||||||
// Add user-defined assistant languages on wikis with Translate extension.
|
// Add user-defined assistant languages on wikis with Translate extension.
|
||||||
compactLanguages = compactLanguages.concat( this.filterByAssistantLanguages() );
|
this.filterByAssistantLanguages( languages ),
|
||||||
|
|
||||||
// Add previously selected languages.
|
// Add previously selected languages.
|
||||||
// Previous languages are always the better suggestion
|
// Previous languages are always the better suggestion
|
||||||
// because the user has explicitly chosen them.
|
// because the user has explicitly chosen them.
|
||||||
compactLanguages = compactLanguages.concat( this.filterByPreviousLanguages() );
|
this.filterByPreviousLanguages( languages ),
|
||||||
|
|
||||||
// Add all common languages to the beginning of array.
|
// Add all common languages to the beginning of array.
|
||||||
// These are the most probable languages predicted by ULS.
|
// These are the most probable languages predicted by ULS.
|
||||||
compactLanguages = compactLanguages.concat( this.filterByCommonLanguages( languages ) );
|
this.filterByCommonLanguages( languages ),
|
||||||
|
|
||||||
// Finally add the whole languages array too.
|
// Finally add the whole languages array too.
|
||||||
// We will remove duplicates and cut down to required size.
|
// We will remove duplicates and cut down to required size.
|
||||||
compactLanguages = compactLanguages.concat( languages );
|
languages
|
||||||
|
);
|
||||||
// Remove duplicates
|
// Remove duplicates
|
||||||
compactLanguages = unique( compactLanguages );
|
compactLanguages = unique( compactLanguages );
|
||||||
|
|
||||||
@@ -252,15 +255,13 @@
|
|||||||
* by the article and fetch their href.
|
* by the article and fetch their href.
|
||||||
* @return {Object} List of existing language codes and their hrefs
|
* @return {Object} List of existing language codes and their hrefs
|
||||||
*/
|
*/
|
||||||
getInterlanguageList: function getInterlanguageList() {
|
getInterlanguageList: function () {
|
||||||
var interlanguageList = {};
|
var interlanguageList = {};
|
||||||
|
|
||||||
this.$interlanguageList.find( 'li.interlanguage-link > a' ).each( function () {
|
this.$interlanguageList.find( 'li.interlanguage-link > a' ).each( function () {
|
||||||
var $this = $( this );
|
interlanguageList[ this.getAttribute( 'lang' ) ] = {
|
||||||
|
href: this.getAttribute( 'href' ),
|
||||||
interlanguageList[ $this.attr( 'lang' ) ] = {
|
autonym: $( this ).text()
|
||||||
href: $this.attr( 'href' ),
|
|
||||||
autonym: $this.text()
|
|
||||||
};
|
};
|
||||||
} );
|
} );
|
||||||
|
|
||||||
@@ -271,8 +272,8 @@
|
|||||||
* Get the size of the interlanguage list
|
* Get the size of the interlanguage list
|
||||||
*/
|
*/
|
||||||
getListSize: function () {
|
getListSize: function () {
|
||||||
return $.map( this.interlanguageList, function ( item, index ) {
|
return $.map( this.interlanguageList, function ( item, languageCode ) {
|
||||||
return index;
|
return languageCode;
|
||||||
} ).length;
|
} ).length;
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -280,7 +281,7 @@
|
|||||||
* Hide the original interlanguage list
|
* Hide the original interlanguage list
|
||||||
*/
|
*/
|
||||||
hideOriginal: function () {
|
hideOriginal: function () {
|
||||||
this.$interlanguageList.find( '.interlanguage-link' ).hide();
|
this.$interlanguageList.find( '.interlanguage-link' ).css( 'display', 'none' );
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -305,7 +306,7 @@
|
|||||||
* @param {string} language
|
* @param {string} language
|
||||||
*/
|
*/
|
||||||
showLanguage: function ( language ) {
|
showLanguage: function ( language ) {
|
||||||
this.$interlanguageList.find( '.interwiki-' + language ).show();
|
this.$interlanguageList.find( '.interwiki-' + language ).css( 'display', '' );
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -320,7 +321,8 @@
|
|||||||
options = typeof option === 'object' && option;
|
options = typeof option === 'object' && option;
|
||||||
|
|
||||||
if ( !data ) {
|
if ( !data ) {
|
||||||
$this.data( 'compactinterlanguagelist', ( data = new CompactInterlanguageList( this, options ) ) );
|
data = new CompactInterlanguageList( this, options );
|
||||||
|
$this.data( 'compactinterlanguagelist', data );
|
||||||
}
|
}
|
||||||
|
|
||||||
if ( typeof option === 'string' ) {
|
if ( typeof option === 'string' ) {
|
||||||
@@ -333,7 +335,8 @@
|
|||||||
* Defaults
|
* Defaults
|
||||||
*/
|
*/
|
||||||
$.fn.compactInterlanguageList.defaults = {
|
$.fn.compactInterlanguageList.defaults = {
|
||||||
max: 9 // Compact the list to this size
|
// Compact the list to this size
|
||||||
|
max: 9
|
||||||
};
|
};
|
||||||
|
|
||||||
$( document ).ready( function () {
|
$( document ).ready( function () {
|
||||||
|
|||||||
Reference in New Issue
Block a user