Divec has uploaded a new change for review.
https://gerrit.wikimedia.org/r/283197
Change subject: WIP DONTMERGE: IME UI integration
......................................................................
WIP DONTMERGE: IME UI integration
Change-Id: I796fa6b5425e108f9b6b17f1b0f1579616619b6e
---
M extension.json
A lib/ve-mw/ext.ve-mw-jquery.ime.init.js
A lib/ve-mw/ve.ui.MWCommandRegistry.js
A lib/ve-mw/ve.ui.MWImeDialog.css
A lib/ve-mw/ve.ui.MWImeDialog.js
A lib/ve-mw/ve.ui.MWImeDialogTool.js
A lib/ve-mw/ve.ui.MWInputMethodDialog.css
A lib/ve-mw/ve.ui.MWInputMethodDialog.js
8 files changed, 405 insertions(+), 2 deletions(-)
git pull
ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/UniversalLanguageSelector
refs/changes/97/283197/1
diff --git a/extension.json b/extension.json
index e46c4c4..59c234f 100644
--- a/extension.json
+++ b/extension.json
@@ -282,8 +282,20 @@
"remoteExtPath": "UniversalLanguageSelector/resources"
},
"jquery.ime": {
- "scripts": "jquery.ime/jquery.ime.js",
- "styles": "jquery.ime/css/jquery.ime.css",
+ "scripts": [
+ "jquery.ime/jquery.ime.js",
+ "ve-mw/ve.ui.MWCommandRegistry.js",
+ "ve-mw/ve.ui.MWImeDialog.js",
+ "ve-mw/ve.ui.MWImeDialogTool.js",
+ "ve-mw/ve.ui.MWInputMethodDialog.js",
+ "ve-mw/ext.ve-mw-jquery.ime.init.js"
+ ],
+ "styles": [
+ "jquery.ime/css/jquery.ime.css",
+ "ve-mw/ve.ui.MWImeDialog.css",
+ "ve-mw/ve.ui.MWInputMethodDialog.css"
+ ],
+ "dependencies": "ext.visualEditor.core",
"localBasePath": "lib",
"remoteExtPath": "UniversalLanguageSelector/lib"
},
diff --git a/lib/ve-mw/ext.ve-mw-jquery.ime.init.js
b/lib/ve-mw/ext.ve-mw-jquery.ime.init.js
new file mode 100644
index 0000000..26bcdad
--- /dev/null
+++ b/lib/ve-mw/ext.ve-mw-jquery.ime.init.js
@@ -0,0 +1,52 @@
+/*!
+ * ULS startup script - MediaWiki specific customization for jquery.uls
+ *
+ * Copyright (C) 2012-2013 Alolita Sharma, Amir Aharoni, Arun Ganesh, Brandon
Harris,
+ * Niklas Laxström, Pau Giner, Santhosh Thottingal, Siebrand Mazeland and other
+ * contributors. See CREDITS for a list.
+ *
+ * UniversalLanguageSelector is dual licensed GPLv2 or later and MIT. You don't
+ * have to do anything special to choose one license or the other and you don't
+ * have to notify anyone which license you are using. You are free to use
+ * UniversalLanguageSelector in commercial projects as long as the copyright
+ * header is left intact. See files GPL-LICENSE and MIT-LICENSE for details.
+ *
+ * @file
+ * @ingroup Extensions
+ * @licence GNU General Public Licence 2.0 or later
+ * @licence MIT License
+ */
+
+( function ( $, mw ) {
+ 'use strict';
+ function veInit() {
+ // Patch IME toolbar
+ //ve.init.target.constructor.static.toolbarGroups.splice( 6, 1
);
+ ve.init.target.constructor.static.toolbarGroups.push( {
+ type: 'list',
+ classes: [ 've-test-toolbar-ime' ],
+ indicator: 'down',
+ title: OO.ui.deferMsg(
'visualeditor-toolbar-ime-tooltip' ),
+ include: [ 'specialCharacter', 'mwIme' ],
+ icon: 'keyboard'
+ } );
+ ve.init.target.setupToolbar( ve.init.target.surface );
+ }
+
+ if ( window.ve ) {
+ // Wait until ve.init.target is available
+ // TODO: get rid of this ungainly hack
+ ( function () {
+ var f = function () {
+ if ( ve.init && ve.init.target ) {
+ veInit();
+ // ve.init.target.setupToolbar(
ve.init.target.surface );
+ //
ve.init.target.constructor.static.toolbarGroups
+ } else {
+ setTimeout( f );
+ }
+ };
+ setTimeout( f );
+ } () );
+ }
+}( jQuery, mediaWiki ) );
diff --git a/lib/ve-mw/ve.ui.MWCommandRegistry.js
b/lib/ve-mw/ve.ui.MWCommandRegistry.js
new file mode 100644
index 0000000..3ad26cc
--- /dev/null
+++ b/lib/ve-mw/ve.ui.MWCommandRegistry.js
@@ -0,0 +1,14 @@
+/*!
+ * VisualEditor MediaWiki CommandRegistry registrations.
+ *
+ * @copyright 2011-2016 VisualEditor Team and others; see AUTHORS.txt
+ * @license The MIT License (MIT); see LICENSE.txt
+ */
+
+/* MW-specific overrides of core command registrations */
+
+ve.ui.commandRegistry.register(
+ new ve.ui.Command( 'mwIme', 'window', 'toggle',
+ { args: [ 'mwIme' ], supportedSelections: [ 'linear', 'table' ]
}
+ )
+);
diff --git a/lib/ve-mw/ve.ui.MWImeDialog.css b/lib/ve-mw/ve.ui.MWImeDialog.css
new file mode 100644
index 0000000..34c8b7b
--- /dev/null
+++ b/lib/ve-mw/ve.ui.MWImeDialog.css
@@ -0,0 +1,27 @@
+/*!
+ * VisualEditor UserInterface ImeDialog styles.
+ *
+ * @copyright 2011-2016 VisualEditor Team and others; see
http://ve.mit-license.org
+ */
+
+.ve-ui-mwImeDialog-row {
+ display: table;
+ min-width: 30em;
+ padding-bottom: 0.3em;
+}
+
+.ve-ui-mwImeDialog-row:last-child {
+ /* Extra pixel for button shadows */
+ padding-bottom: 1px;
+}
+
+.ve-ui-mwImeDialog-cell {
+ display: table-cell;
+ vertical-align: middle;
+ white-space: nowrap;
+ padding-right: 1em;
+}
+
+.ve-ui-mwImeDialog-cell:last-child {
+ padding-right: 0;
+}
diff --git a/lib/ve-mw/ve.ui.MWImeDialog.js b/lib/ve-mw/ve.ui.MWImeDialog.js
new file mode 100644
index 0000000..8739594
--- /dev/null
+++ b/lib/ve-mw/ve.ui.MWImeDialog.js
@@ -0,0 +1,185 @@
+/*!
+ * VisualEditor UserInterface MWImeDialog class.
+ *
+ * @copyright 2011-2016 VisualEditor Team and others; see
http://ve.mit-license.org
+ */
+
+/**
+ * IME dialog
+ *
+ * @class
+ * @extends ve.ui.ToolbarDialog
+ *
+ * @constructor
+ * @param {Object} [config] Configuration options
+ */
+ve.ui.MWImeDialog = function VeUiMWImeDialog( config ) {
+ // Parent constructor
+ ve.ui.MWImeDialog.super.call( this, config );
+
+ // Pre-initialization
+ this.$element.addClass( 've-ui-mwImeDialog' );
+};
+
+/* Inheritance */
+
+OO.inheritClass( ve.ui.MWImeDialog, ve.ui.ToolbarDialog );
+
+ve.ui.MWImeDialog.static.name = 'mwIme';
+
+/* Methods */
+
+/**
+ * @inheritdoc
+ */
+ve.ui.MWImeDialog.prototype.initialize = function () {
+ var languageLabel, methodLabel, closeButton;
+
+ // Parent method
+ ve.ui.MWImeDialog.super.prototype.initialize.call( this );
+
+ // Properties
+ this.surface = null;
+ this.dialogs = null;
+
+ languageLabel = new OO.ui.LabelWidget( {
+ classes: [ 've-ui-mwImeDialog-cell
ve-ui-mwImeDialog-languageLabel' ],
+ label: ve.msg(
'visualeditor-imedialog-widget-label-inputlanguage' )
+ } );
+ this.chooseLanguageButton = new OO.ui.ButtonWidget( {
+ classes: [ 've-ui-mwImeDialog-cell
ve-ui-mwImeDialog-chooseLanguageButton' ],
+ label: ve.msg( 'visualeditor-imedialog-widget-chooselanguage' ),
+ indicator: 'next'
+ } );
+ methodLabel = new OO.ui.LabelWidget( {
+ classes: [ 've-ui-mwImeDialog-cell
ve-ui-mwImeDialog-methodLabel' ],
+ label: ve.msg(
'visualeditor-imedialog-widget-label-inputmethod' )
+ } );
+ this.chooseMethodButton = new OO.ui.ButtonWidget( {
+ classes: [ 've-ui-mwImeDialog-cell
ve-ui-mwImeDialog-chooseMethodButton' ],
+ label: ve.msg( 'visualeditor-imedialog-widget-choosemethod' ),
+ indicator: 'next'
+ } );
+ closeButton = new OO.ui.ButtonWidget( {
+ classes: [ 've-ui-mwImeDialog-cell
ve-ui-mwImeDialog-closeButton' ],
+ label: ve.msg( 'visualeditor-imedialog-widget-button-close' )
+ } );
+
+ // Events
+ this.chooseLanguageButton.connect( this, { click:
'onFindLanguageButtonClick' } );
+ this.chooseMethodButton.connect( this, { click:
'onChooseMethodButtonClick' } );
+ closeButton.connect( this, { click: 'close' } );
+
+ // Initialization
+ this.$body.append(
+ $( '<div>' ).addClass( 've-ui-mwImeDialog-row' )
+ .append(
+ languageLabel.$element,
+ this.chooseLanguageButton.$element,
+ methodLabel.$element,
+ this.chooseMethodButton.$element,
+ closeButton.$element
+ )
+ );
+};
+
+ve.ui.MWImeDialog.prototype.onFindLanguageButtonClick = function () {
+ var imeDialog = this;
+ this.dialogs.openWindow(
+ 'languageSearch',
+ { availableLanguages: this.ime.getLanguageCodes() }
+ ).then( function ( opened ) {
+ opened.then( function ( closing ) {
+ closing.then( function ( data ) {
+ data = data || {};
+ if ( data.action === 'apply' ) {
+ imeDialog.setLangCode( data.lang );
+ }
+ } );
+ } );
+ } );
+};
+
+ve.ui.MWImeDialog.prototype.setLangCode = function ( lang ) {
+ var imeDialog = this;
+ this.ime.setLanguage( lang );
+ imeDialog.onChooseMethodButtonClick();
+};
+
+ve.ui.MWImeDialog.prototype.onChooseMethodButtonClick = function () {
+ var imeDialog = this,
+ inputMethods = this.ime.getInputMethods( this.ime.getLanguage()
);
+ this.dialogs.openWindow(
+ 'mwInputMethods',
+ { inputMethods: inputMethods }
+ ).then( function ( opened ) {
+ opened.then( function ( closing ) {
+ closing.then( function ( data ) {
+ data = data || {};
+ if ( data.action === 'apply' ) {
+ imeDialog.ime.load( data.id ).done(
function () {
+ imeDialog.ime.setIM( data.id );
+ } );
+ }
+ } );
+ } );
+ } );
+};
+
+ve.ui.MWImeDialog.prototype.onImeLanguageChange = function () {
+ var lang = this.ime.getLanguage();
+ if ( lang ) {
+ this.chooseLanguageButton.setLabel( this.ime.getAutonym( lang )
);
+ this.chooseMethodButton.setDisabled( false );
+ } else {
+ this.chooseLanguageButton.setLabel(
+ ve.msg( 'visualeditor-imedialog-widget-chooselanguage' )
+ );
+ this.chooseMethodButton.setDisabled( true );
+ }
+ this.onImeMethodChange();
+};
+
+ve.ui.MWImeDialog.prototype.onImeMethodChange = function () {
+ var inputMethod = this.ime.getIM();
+ this.chooseMethodButton.setLabel(
+ inputMethod ?
+ this.ime.getInputMethodName( inputMethod.id ) :
+ ve.msg( 'visualeditor-imedialog-widget-choosemethod' )
+ );
+};
+
+/**
+ * @inheritdoc
+ */
+ve.ui.MWImeDialog.prototype.getSetupProcess = function ( data ) {
+ var imeDialog = this;
+ data = data || {};
+ return ve.ui.MWImeDialog.super.prototype.getSetupProcess.call( this,
data )
+ .first( function () {
+ this.surface = data.surface;
+ this.dialogs = this.surface.getDialogs();
+ this.$doc =
this.surface.view.documentView.getDocumentNode().$element;
+ this.ime = this.$doc.data( 'ime' );
+ this.$doc.on( 'imeLanguageChange',
imeDialog.onImeLanguageChange.bind( imeDialog ) );
+ this.$doc.on( 'imeMethodChange',
imeDialog.onImeMethodChange.bind( imeDialog ) );
+ imeDialog.onImeLanguageChange();
+ imeDialog.onImeMethodChange();
+ this.ime.enable();
+ }, this );
+};
+
+/**
+ * @inheritdoc
+ */
+ve.ui.MWImeDialog.prototype.getTeardownProcess = function ( data ) {
+ // Cannot use this.ime.disable(), because it unsets the IM
+ this.ime.toggle();
+ this.$element.off( 'imeMethodChange' );
+ this.$element.off( 'imeLanguageChange' );
+ return ve.ui.MWImeDialog.super.prototype.getTeardownProcess.call( this,
data );
+};
+
+/* Registration */
+
+ve.ui.windowFactory.register( ve.ui.MWImeDialog );
diff --git a/lib/ve-mw/ve.ui.MWImeDialogTool.js
b/lib/ve-mw/ve.ui.MWImeDialogTool.js
new file mode 100644
index 0000000..61ad435
--- /dev/null
+++ b/lib/ve-mw/ve.ui.MWImeDialogTool.js
@@ -0,0 +1,21 @@
+/**
+ * IME tool.
+ *
+ * @class
+ * @extends ve.ui.ToolbarDialogTool
+ * @constructor
+ * @param {OO.ui.ToolGroup} toolGroup
+ * @param {Object} [config] Configuration options
+ */
+ve.ui.MWImeDialogTool = function VeUiMWImeDialogTool() {
+ ve.ui.MWImeDialogTool.super.apply( this, arguments );
+};
+OO.inheritClass( ve.ui.MWImeDialogTool, ve.ui.ToolbarDialogTool );
+ve.ui.MWImeDialogTool.static.name = 'mwIme';
+ve.ui.MWImeDialogTool.static.group = 'dialog';
+ve.ui.MWImeDialogTool.static.icon = 'keyboard';
+ve.ui.MWImeDialogTool.static.title = OO.ui.deferMsg(
'visualeditor-ime-button-tooltip' );
+ve.ui.MWImeDialogTool.static.autoAddToCatchall = false;
+ve.ui.MWImeDialogTool.static.autoAddToGroup = false;
+ve.ui.MWImeDialogTool.static.commandName = 'mwIme';
+ve.ui.toolFactory.register( ve.ui.MWImeDialogTool );
diff --git a/lib/ve-mw/ve.ui.MWInputMethodDialog.css
b/lib/ve-mw/ve.ui.MWInputMethodDialog.css
new file mode 100644
index 0000000..3bee8dd
--- /dev/null
+++ b/lib/ve-mw/ve.ui.MWInputMethodDialog.css
@@ -0,0 +1,5 @@
+/*!
+ * VisualEditor UserInterface InputMethodDialog styles.
+ *
+ * @copyright 2011-2016 VisualEditor Team and others; see
http://ve.mit-license.org
+ */
diff --git a/lib/ve-mw/ve.ui.MWInputMethodDialog.js
b/lib/ve-mw/ve.ui.MWInputMethodDialog.js
new file mode 100644
index 0000000..98419c3
--- /dev/null
+++ b/lib/ve-mw/ve.ui.MWInputMethodDialog.js
@@ -0,0 +1,87 @@
+/*!
+ * VisualEditor UserInterface MWInputMethodDialog class.
+ *
+ * @copyright 2011-2016 VisualEditor Team and others; see
http://ve.mit-license.org
+ */
+
+/**
+ * Dialog for searching for and selecting an input method for a language.
+ *
+ * @class
+ * @extends OO.ui.ProcessDialog
+ *
+ * @constructor
+ * @param {Object} [config] Configuration options
+ */
+ve.ui.MWInputMethodDialog = function VeUiMWInputMethodDialog( config ) {
+ // Parent constructor
+ ve.ui.MWInputMethodDialog.super.call( this, config );
+};
+
+/* Inheritance */
+
+OO.inheritClass( ve.ui.MWInputMethodDialog, OO.ui.ProcessDialog );
+
+/* Static Properties */
+
+ve.ui.MWInputMethodDialog.static.name = 'mwInputMethods';
+
+ve.ui.MWInputMethodDialog.static.size = 'medium';
+
+ve.ui.MWInputMethodDialog.static.title =
+ OO.ui.deferMsg( 'visualeditor-inputmethodsdialog-input-methods-title' );
+
+ve.ui.MWInputMethodDialog.static.actions = [
+ {
+ label: OO.ui.deferMsg( 'visualeditor-dialog-action-cancel' ),
+ flags: [ 'back' ]
+ }
+];
+
+/* Methods */
+
+/**
+ * @inheritdoc
+ */
+ve.ui.MWInputMethodDialog.prototype.initialize = function () {
+ ve.ui.MWInputMethodDialog.super.prototype.initialize.apply( this,
arguments );
+ this.methodSelect = new OO.ui.SelectWidget( {
+ label: 'Select input method',
+ menu: { items: [] }
+ } );
+ this.$body.append( this.methodSelect.$element );
+};
+
+/**
+ * @inheritdoc
+ */
+ve.ui.MWInputMethodDialog.prototype.getSetupProcess = function ( data ) {
+ var inputMethods;
+ data = data || {};
+ inputMethods = data.inputMethods || [];
+
+ this.methodSelect.clearItems();
+ this.methodSelect.addItems( inputMethods.map( function ( inputMethod ) {
+ return new OO.ui.MenuOptionWidget( {
+ data: inputMethod.id,
+ label: inputMethod.name
+ } );
+ } ) );
+ this.methodSelect.connect( this, { choose: 'onMethodSelectChoose' } );
+ return ve.ui.MWInputMethodDialog.super.prototype.getSetupProcess.call(
this, data );
+};
+
+ve.ui.MWInputMethodDialog.prototype.onMethodSelectChoose = function ( item ) {
+ this.close( { action: 'apply', id: item.getData() } );
+};
+
+/**
+ * @inheritdoc
+ */
+ve.ui.MWInputMethodDialog.prototype.getBodyHeight = function () {
+ return 200;
+};
+
+/* Registration */
+
+ve.ui.windowFactory.register( ve.ui.MWInputMethodDialog );
--
To view, visit https://gerrit.wikimedia.org/r/283197
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I796fa6b5425e108f9b6b17f1b0f1579616619b6e
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/UniversalLanguageSelector
Gerrit-Branch: master
Gerrit-Owner: Divec <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
