' ).addClass( 'row uls-language-block' ).append( columns ) );
columns = [];
}
}
}
}
$region.append( rows );
},
/**
* Creates dom node representing one item in language list.
* @param {string} code Language code
* @return {Element}
*/
renderItem: function ( code ) {
var a, name, autonym, li;
name = this.options.languages[ code ];
autonym = $.uls.data.getAutonym( code ) || name || code;
// Not using jQuery as this is performance hotspot
li = document.createElement( 'li' );
li.title = name;
li.setAttribute( 'data-code', code );
a = document.createElement( 'a' );
a.appendChild( document.createTextNode( autonym ) );
a.className = 'autonym';
a.lang = code;
a.dir = $.uls.data.getDir( code );
li.appendChild( a );
if ( this.options.languageDecorator ) {
this.options.languageDecorator( $( a ), code );
}
return li;
},
i18n: function () {
this.$element.find( '[data-i18n]' ).i18n();
},
/**
* Adds quicklist as a region.
*/
quicklist: function () {
this.$element.find( '.uls-lcd-quicklist' ).removeClass( 'hide' );
},
buildQuicklist: function () {
var quickList, $quickListSection, $quickListSectionTitle;
if ( this.cachedQuicklist !== null ) {
return this.cachedQuicklist;
}
if ( $.isFunction( this.options.quickList ) ) {
this.options.quickList = this.options.quickList();
}
if ( !this.options.quickList.length ) {
this.cachedQuicklist = $( [] );
return this.cachedQuicklist;
}
// Pick only the first elements, because we don't have room for more
quickList = this.options.quickList;
quickList = quickList.slice( 0, 16 );
quickList.sort( $.uls.data.sortByAutonym );
$quickListSection = $( '
' )
.addClass( 'uls-lcd-region-section uls-lcd-quicklist' );
$quickListSectionTitle = $( '
' )
.attr( 'data-i18n', 'uls-common-languages' )
.addClass( 'uls-lcd-region-title' )
.text( 'Suggested languages' ); // This is placeholder text if jquery.i18n not present
$quickListSection.append( $quickListSectionTitle );
this.renderRegion(
$quickListSection,
quickList,
this.options.itemsPerColumn,
this.options.columns
);
$quickListSectionTitle.i18n();
this.cachedQuicklist = $quickListSection;
return this.cachedQuicklist;
},
show: function () {
if ( !this.regionDivs ) {
this.render();
}
},
/**
* Called when a fresh search is started
*/
empty: function () {
this.$element.addClass( 'uls-lcd--no-quicklist' );
this.$element.find( '.uls-lcd-quicklist' ).addClass( 'hide' );
},
focus: function () {
this.$element.focus();
},
/**
* No-results event handler
* @param {Event} event
* @param {Object} data Information about the failed search query
*/
noResults: function ( event, data ) {
var $noResults;
this.$element.addClass( 'uls-no-results' );
this.$element.find( '.uls-no-results-view' ).remove();
if ( typeof this.options.noResultsTemplate === 'function' ) {
$noResults =
this.options.noResultsTemplate.call( this, data.query );
} else if ( this.options.noResultsTemplate instanceof jQuery ) {
$noResults = this.options.noResultsTemplate;
} else {
throw new Error( 'noResultsTemplate option must be ' +
'either jQuery or function returning jQuery' );
}
this.$element.append( $noResults.addClass( 'uls-no-results-view' ).i18n() );
},
listen: function () {
var lcd = this;
if ( this.options.clickhandler ) {
this.$element.on( 'click', '.row li', function ( event ) {
lcd.options.clickhandler.call( this, $( this ).data( 'code' ), event );
} );
}
}
};
$.fn.lcd = function ( option ) {
return this.each( function () {
var $this = $( this ),
data = $this.data( 'lcd' ),
options = typeof option === 'object' && option;
if ( !data ) {
$this.data( 'lcd', ( data = new LanguageCategoryDisplay( this, options ) ) );
}
if ( typeof option === 'string' ) {
data[ option ]();
}
} );
};
$.fn.lcd.defaults = {
// List of languages to show
languages: [],
// List of regions to show
showRegions: [ 'WW', 'AM', 'EU', 'ME', 'AF', 'AS', 'PA' ],
// Whether to group by region, defaults to true when columns > 1
groupByRegion: 'auto',
// How many items per column until new "row" starts
itemsPerColumn: 8,
// Number of columns, only 1, 2 and 4 are supported
columns: 4,
// Callback function for language item styling
languageDecorator: undefined,
// Likely candidates
quickList: [],
// Callback function for language selection
clickhandler: undefined,
// Callback function when no search results.
// If overloaded, it can accept the search string as an argument.
noResultsTemplate: function () {
var $suggestionsContainer, $suggestions,
$noResultsTemplate = $( noResultsTemplate );
$suggestions = this.buildQuicklist().clone();
$suggestions.removeClass( 'hide' )
.find( 'h3' )
.data( 'i18n', 'uls-no-results-suggestion-title' )
.text( 'You may be interested in:' )
.i18n();
$suggestionsContainer = $noResultsTemplate.find( '.uls-no-results-suggestions' );
$suggestionsContainer.append( $suggestions );
return $noResultsTemplate;
}
};
}( jQuery ) );