Merge "Lazy initialization of language settings and ULS from interface triggers"

This commit is contained in:
jenkins-bot
2013-07-26 12:32:42 +00:00
committed by Gerrit Code Review

View File

@@ -270,10 +270,8 @@
$( document ).ready( function () { $( document ).ready( function () {
mw.uls.init( function () { mw.uls.init( function () {
var $ulsSettingsTrigger, var $triggers,
$triggers,
$pLang, $pLang,
ulsOptions,
$ulsTrigger = $( '.uls-trigger' ), $ulsTrigger = $( '.uls-trigger' ),
rtlPage = $( 'body' ).hasClass( 'rtl' ), rtlPage = $( 'body' ).hasClass( 'rtl' ),
anonMode = ( mw.user.isAnon() && anonMode = ( mw.user.isAnon() &&
@@ -281,16 +279,17 @@
ulsPosition = mw.config.get( 'wgULSPosition' ); ulsPosition = mw.config.get( 'wgULSPosition' );
if ( ulsPosition === 'interlanguage' ) { if ( ulsPosition === 'interlanguage' ) {
// TODO: Refactor this block
// The interlanguage links section // The interlanguage links section
$pLang = $( '#p-lang' ); $pLang = $( '#p-lang' );
// Add an element near the interlanguage links header // Add an element near the interlanguage links header
$ulsSettingsTrigger = $( '<span>' ) $ulsTrigger = $( '<span>' )
.addClass( 'uls-settings-trigger' ) .addClass( 'uls-settings-trigger' )
.attr( 'title', $.i18n( 'ext-uls-language-settings-title' ) ); .attr( 'title', $.i18n( 'ext-uls-language-settings-title' ) );
// Append ULS cog to languages section, but make sure it is visible. // Append ULS cog to languages section, but make sure it is visible.
$pLang.show().prepend( $ulsSettingsTrigger ); $pLang.show().prepend( $ulsTrigger );
// Take care of any other elements with this class. // Take care of any other elements with this class.
$ulsSettingsTrigger = $( '.uls-settings-trigger' ); $ulsTrigger = $( '.uls-settings-trigger' );
// Remove the dummy link, which was added to make sure that the section appears // Remove the dummy link, which was added to make sure that the section appears
$pLang.find( '.uls-p-lang-dummy' ).remove(); $pLang.find( '.uls-p-lang-dummy' ).remove();
@@ -305,68 +304,82 @@
$pLang.find( 'div.pBody' ).remove(); $pLang.find( 'div.pBody' ).remove();
} }
} }
}
// ULS options that are common to all modes of showing $ulsTrigger.attr( {
ulsOptions = {
onReady: function () {
if ( $.fn.languagesettings ) {
addDisplaySettings( this );
addInputSettings( this );
}
},
onSelect: function ( language ) {
mw.uls.changeLanguage( language );
},
languages: mw.config.get( 'wgULSLanguages' ),
searchAPI: mw.util.wikiScript( 'api' ) + '?action=languagesearch',
quickList: function () {
return mw.uls.getFrequentLanguageList();
}
};
if ( ulsPosition === 'interlanguage' ) {
$ulsSettingsTrigger.attr( {
title: $.i18n( 'ext-uls-select-language-settings-icon-tooltip' ) title: $.i18n( 'ext-uls-select-language-settings-icon-tooltip' )
} ); } );
$ulsTrigger.on( 'click', function ( e ) {
var languagesettings = $ulsTrigger.data( 'languagesettings' ),
langaugeSettingsOptions;
$ulsSettingsTrigger.languagesettings( { if ( !languagesettings ) {
defaultModule: 'display', langaugeSettingsOptions = {
onVisible: function () { defaultModule: 'display',
var topRowHeight, caretHeight, caretWidth, onVisible: function () {
$caretBefore = $( '<span>' ).addClass( 'caret-before' ), var topRowHeight, caretHeight, caretWidth,
$caretAfter = $( '<span>' ).addClass( 'caret-after' ), $caretBefore = $( '<span>' ).addClass( 'caret-before' ),
ulsTriggerWidth = this.$element.width(), $caretAfter = $( '<span>' ).addClass( 'caret-after' ),
ulsTriggerOffset = this.$element.offset(); ulsTriggerWidth = this.$element.width(),
ulsTriggerOffset = this.$element.offset();
// Add the callout caret triangle // Add the callout caret triangle
// pointing to the trigger icon // pointing to the trigger icon
this.$window.addClass( 'callout' ); this.$window.addClass( 'callout' );
this.$window.prepend( $caretBefore, $caretAfter ); this.$window.prepend( $caretBefore, $caretAfter );
// Calculate the positioning of the panel // Calculate the positioning of the panel
// according to the position of the trigger icon // according to the position of the trigger icon
if ( rtlPage ) { if ( rtlPage ) {
caretWidth = parseInt( $caretBefore.css( 'border-left-width' ), 10 ); caretWidth = parseInt( $caretBefore.css( 'border-left-width' ), 10 );
this.left = ulsTriggerOffset.left - this.$window.width() - caretWidth; this.left = ulsTriggerOffset.left - this.$window.width() - caretWidth;
} else { } else {
caretWidth = parseInt( $caretBefore.css( 'border-right-width' ), 10 ); caretWidth = parseInt( $caretBefore.css( 'border-right-width' ), 10 );
this.left = ulsTriggerOffset.left + ulsTriggerWidth + caretWidth; this.left = ulsTriggerOffset.left + ulsTriggerWidth + caretWidth;
} }
topRowHeight = this.$window.find( '.row' ).height(); topRowHeight = this.$window.find( '.row' ).height();
caretHeight = parseInt( $caretBefore.css( 'top' ), 10 ); caretHeight = parseInt( $caretBefore.css( 'top' ), 10 );
this.top = ulsTriggerOffset.top - topRowHeight - caretHeight / 2; this.top = ulsTriggerOffset.top - topRowHeight - caretHeight / 2;
this.position(); this.position();
}
};
$ulsTrigger.languagesettings( langaugeSettingsOptions ).click();
e.stopPropagation();
} }
} ); } );
} else if ( anonMode ) { } else if ( anonMode ) {
$ulsTrigger.languagesettings(); $ulsTrigger.on( 'click', function ( e ) {
} else { var languagesettings = $ulsTrigger.data( 'languagesettings' );
$ulsTrigger.uls( ulsOptions );
}
if ( !languagesettings ) {
$ulsTrigger.languagesettings().click();
e.stopPropagation();
}
} );
} else {
$ulsTrigger.on( 'click', function ( e ) {
var uls = $ulsTrigger.data( 'uls' ),
ulsOptions;
if ( !uls ) {
// ULS options that are common to all modes of showing
ulsOptions = {
onReady: function () {
if ( $.fn.languagesettings ) {
addDisplaySettings( this );
addInputSettings( this );
}
},
onSelect: function ( language ) {
mw.uls.changeLanguage( language );
}
};
$ulsTrigger.uls( ulsOptions ).click();
e.stopPropagation();
}
} );
}
// At this point we don't care which kind of trigger it is // At this point we don't care which kind of trigger it is
$triggers = $( '.uls-settings-trigger, .uls-trigger' ); $triggers = $( '.uls-settings-trigger, .uls-trigger' );
addAccessibilityFeatures( $triggers ); addAccessibilityFeatures( $triggers );