' )
.addClass( 'uls-icon-back' )
.data( 'i18n', 'ext-uls-back-to-input-settings' )
.i18n()
.text( ' ' );
$back.on( 'click', function () {
uls.hide();
inputSettings.$parent.show();
} );
$wrap = $( '
' )
.addClass( 'uls-search-wrapper-wrapper' );
uls.$menu.find( '.uls-search-wrapper' ).wrap( $wrap );
uls.$menu.find( '.uls-search-wrapper-wrapper' ).prepend( $back );
if ( $( '.uls-settings-trigger' ).offset().left > $( window ).width() / 2 ) {
uls.$menu.removeClass( 'selector-left' ).addClass( 'selector-right' );
} else {
uls.$menu.removeClass( 'selector-right' ).addClass( 'selector-left' );
}
},
onVisible: function () {
var $parent;
this.$menu.find( '.uls-languagefilter' )
.prop( 'placeholder', $.i18n( 'ext-uls-input-settings-ui-language' ) );
if ( !inputSettings.$parent.$window.hasClass( 'callout' ) ) {
// callout menus will have position rules. others use
// default position
return;
}
$parent = $( '#language-settings-dialog' );
// Re-position the element according to the window that called it
if ( parseInt( $parent.css( 'left' ), 10 ) ) {
this.$menu.css( 'left', $parent.css( 'left' ) );
}
if ( parseInt( $parent.css( 'top' ), 10 ) ) {
this.$menu.css( 'top', $parent.css( 'top' ) );
}
if ( inputSettings.$parent.$window.hasClass( 'callout' ) ) {
this.$menu.addClass( 'callout callout--languageselection' );
} else {
this.$menu.removeClass( 'callout' );
}
},
onSelect: function ( langCode ) {
$.ime.preferences.setLanguage( langCode );
inputSettings.$parent.show();
inputSettings.prepareLanguages();
inputSettings.markDirty();
},
languages: mw.ime.getLanguagesWithIME(),
ulsPurpose: 'input-settings'
} );
$moreLanguagesButton.on( 'click', function () {
inputSettings.$parent.hide();
mw.hook( 'mw.uls.ime.morelanguages' ).fire();
} );
},
prepareToggleButton: function () {
var $toggleButton, $toggleButtonDesc;
$toggleButton = this.$template.find( '.uls-input-toggle-button' );
$toggleButtonDesc = this.$template
.find( '.uls-input-settings-disable-info' );
if ( $.ime.preferences.isEnabled() ) {
$toggleButton.data( 'i18n', 'ext-uls-input-disable' );
$toggleButtonDesc.hide();
} else {
$toggleButton.data( 'i18n', 'ext-uls-input-enable' );
$toggleButtonDesc.data( 'i18n', 'ext-uls-input-disable-info' ).show();
}
$toggleButton.i18n();
$toggleButtonDesc.i18n();
},
/**
* Get previous languages
*
* @return {Array}
*/
frequentLanguageList: function () {
return mw.uls.getFrequentLanguageList();
},
/**
* Get the current user interface language.
*
* @return {string} Current UI language
*/
getInterfaceLanguage: function () {
return mw.config.get( 'wgUserLanguage' );
},
/**
* Get the current content language.
*
* @return {string} Current content language
*/
getContentLanguage: function () {
return mw.config.get( 'wgContentLanguage' );
},
/**
* Register general event listeners
*/
listen: function () {
var inputSettings = this,
$imeListContainer;
$imeListContainer = this.$template.find( '.uls-input-settings-inputmethods-list' );
$imeListContainer.on( 'change', 'input:radio[name=ime]:checked', function () {
inputSettings.markDirty();
$.ime.preferences.setIM( $( this ).val() );
} );
inputSettings.$template.find( 'button.uls-input-toggle-button' )
.on( 'click', function () {
inputSettings.markDirty();
if ( $.ime.preferences.isEnabled() ) {
inputSettings.disableInputTools();
} else {
inputSettings.enableInputTools();
}
} );
},
/**
* Disable input tools
*/
disableInputTools: function () {
$.ime.preferences.disable();
mw.ime.disable();
this.$template.find( '.enabled-only' ).addClass( 'hide' );
this.prepareToggleButton();
},
/**
* Enable input tools
*/
enableInputTools: function () {
$.ime.preferences.enable();
mw.ime.setup();
this.$template.find( '.enabled-only' ).removeClass( 'hide' );
this.$template.scrollIntoView();
this.prepareToggleButton();
},
/**
* Close the language settings window.
* Depending on the context, actions vary.
*/
close: function () {
this.$parent.close();
},
/**
* Callback for save preferences
*
* @param {boolean} success
*/
onSave: function ( success ) {
if ( success ) {
// Live ime update
this.$parent.hide();
// Disable apply button
this.$parent.disableApplyButton();
}
// FIXME in case of failure. what to do?!
},
/**
* Handle the apply button press.
* Note that the button press may not be from the input settings module.
* For example, a user can change input settings and then go to display settings panel,
* do some changes and press apply button there. That press is applicable for all
* modules.
*/
apply: function () {
var previousIM,
inputSettings = this,
previousLanguage = inputSettings.savedRegistry.language,
currentlyEnabled = $.ime.preferences.isEnabled(),
currentLanguage = $.ime.preferences.getLanguage(),
currentIM = $.ime.preferences.getIM( currentLanguage );
if ( !inputSettings.dirty ) {
// No changes to save in this module.
return;
}
inputSettings.$parent.setBusy( true );
if ( previousLanguage ) {
previousIM = inputSettings.savedRegistry.imes[ previousLanguage ];
}
if ( currentLanguage !== inputSettings.savedRegistry.language ||
currentIM !== previousIM
) {
mw.hook( 'mw.uls.ime.change' ).fire( currentIM );
}
if ( inputSettings.savedRegistry.enable !== currentlyEnabled ) {
mw.hook( currentlyEnabled ? 'mw.uls.ime.enable' : 'mw.uls.ime.disable' )
.fire( 'inputsettings' );
}
// Save the preferences
$.ime.preferences.save( function ( result ) {
// closure for not losing the scope
inputSettings.onSave( result );
inputSettings.dirty = false;
// Update the back-up preferences for the case of canceling
inputSettings.savedRegistry = $.extend( true, {}, $.ime.preferences.registry );
inputSettings.$parent.setBusy( false );
} );
},
/**
* Cancel the changes done by user for input settings
*/
cancel: function () {
if ( !this.dirty ) {
this.close();
return;
}
// Reload preferences
$.ime.preferences.registry = $.extend( true, {}, this.savedRegistry );
this.uiLanguage = this.getInterfaceLanguage();
this.contentLanguage = this.getContentLanguage();
// Restore the state of IME
if ( $.ime.preferences.isEnabled() ) {
mw.ime.setup();
} else {
mw.ime.disable();
}
this.close();
}
};
// Register this module to language settings modules
$.fn.languagesettings.modules = $.extend( $.fn.languagesettings.modules, {
input: InputSettings
} );
}() );