[MediaWiki-commits] [Gerrit] mediawiki...ContentTranslation[master]: Add OOjs UI based formatter tool
jenkins-bot has submitted this change and it was merged. (
https://gerrit.wikimedia.org/r/340923 )
Change subject: Add OOjs UI based formatter tool
..
Add OOjs UI based formatter tool
In this commit, the formatter get displayed on text selection.
Clicking on buttons does nothing.
Bug: T152586
Change-Id: I5aeb737e339777af9d12330368eae3baed66e448
---
M extension.json
A modules/tools/mw.cx.tools.FormatterTool.js
A modules/tools/styles/mw.cx.tools.FormatterTool.less
3 files changed, 98 insertions(+), 1 deletion(-)
Approvals:
jenkins-bot: Verified
Nikerabbit: Looks good to me, approved
diff --git a/extension.json b/extension.json
index eef093a..672d9a6 100644
--- a/extension.json
+++ b/extension.json
@@ -1719,7 +1719,8 @@
"mw.cx.tools.InstructionsTool",
"mw.cx.tools.DictionaryTool",
"mw.cx.tools.TemplateTool",
- "mw.cx.tools.LinkTool"
+ "mw.cx.tools.LinkTool",
+ "mw.cx.tools.FormatterTool"
]
},
"mw.cx.tools.MachineTranslationTool": {
@@ -1805,6 +1806,19 @@
"mw.cx.tools.TranslationTool"
]
},
+ "mw.cx.tools.FormatterTool": {
+ "scripts": [
+ "tools/mw.cx.tools.FormatterTool.js"
+ ],
+ "styles": [
+ "tools/styles/mw.cx.tools.FormatterTool.less"
+ ],
+ "dependencies": [
+ "mw.cx.tools.TranslationTool",
+ "oojs-ui.styles.icons-editing-styling",
+ "oojs-ui.styles.icons-editing-list"
+ ]
+ },
"mw.cx.tools.LinkTool": {
"scripts": [
"tools/mw.cx.tools.LinkTool.js"
diff --git a/modules/tools/mw.cx.tools.FormatterTool.js
b/modules/tools/mw.cx.tools.FormatterTool.js
new file mode 100644
index 000..bb8ef85
--- /dev/null
+++ b/modules/tools/mw.cx.tools.FormatterTool.js
@@ -0,0 +1,70 @@
+/**
+ * Formatter Tool
+ *
+ * @class
+ * @extends mw.cx.tools.TranslationTool
+ * @constructor
+ * @param {mw.cx.ui.TranslationUnit} ui
+ * @param {Object} config
+ */
+mw.cx.tools.FormatterTool = function CXFormatterTool( ui, config ) {
+ config.order = 1;
+ config.title = 'Formatter';
+ // Parent constructor
+ mw.cx.tools.FormatterTool.super.call( this, ui, config );
+ this.ui.connect( this, {
+ select: 'onSelect'
+ } );
+};
+
+/* Inheritance */
+OO.inheritClass( mw.cx.tools.FormatterTool, mw.cx.tools.TranslationTool );
+
+mw.cx.tools.FormatterTool.static.name = 'formatter';
+
+/**
+ * @inheritDoc
+ */
+mw.cx.tools.FormatterTool.prototype.getActions = function () {
+ var formatterButtonGroup, undoButton, redoButton, boldButton,
italicButton, orderedlistButton, unOrderedlistButton;
+ undoButton = new OO.ui.ButtonWidget( {
+ icon: 'undo'
+ } );
+ redoButton = new OO.ui.ButtonWidget( {
+ icon: 'redo'
+ } );
+ boldButton = new OO.ui.ButtonWidget( {
+ icon: 'bold'
+ } );
+ italicButton = new OO.ui.ButtonWidget( {
+ icon: 'italic'
+ } );
+ orderedlistButton = new OO.ui.ButtonWidget( {
+ icon: 'listBullet'
+ } );
+ unOrderedlistButton = new OO.ui.ButtonWidget( {
+ icon: 'listNumbered'
+ } );
+ formatterButtonGroup = new OO.ui.ButtonGroupWidget( {
+ items: [ undoButton, redoButton, boldButton, italicButton,
orderedlistButton, unOrderedlistButton ]
+ } );
+ return [ formatterButtonGroup ];
+};
+
+/**
+ * Text selection handler
+ * @param {string} selection Selected text
+ */
+mw.cx.tools.FormatterTool.prototype.onSelect = function ( selection ) {
+ // TODO: We need the selection object rather than selection string here
+ if ( selection ) {
+ this.showTool();
+ }
+};
+
+mw.cx.tools.FormatterTool.prototype.getContent = function () {
+ return '';
+};
+
+/* Register */
+mw.cx.tools.translationToolFactory.register( mw.cx.tools.FormatterTool );
diff --git a/modules/tools/styles/mw.cx.tools.FormatterTool.less
b/modules/tools/styles/mw.cx.tools.FormatterTool.less
new file mode 100644
index 000..28c49c2
--- /dev/null
+++ b/modules/tools/styles/mw.cx.tools.FormatterTool.less
@@ -0,0 +1,13 @@
+.cx-card-formatter {
+ .cx-widget-translationtool-container {
+ padding: 0;
+ }
+ .cx-widget-translationtool-header {
+ display: none;
+ }
+
[MediaWiki-commits] [Gerrit] mediawiki...ContentTranslation[master]: Add OOjs UI based formatter tool
Santhosh has uploaded a new change for review. (
https://gerrit.wikimedia.org/r/340923 )
Change subject: Add OOjs UI based formatter tool
..
Add OOjs UI based formatter tool
In this commit, the formatter get displayed on text selection.
Clicking on buttons does nothing.
Bug: T152586
Change-Id: I5aeb737e339777af9d12330368eae3baed66e448
---
M extension.json
A modules/tools/mw.cx.tools.FormatterTool.js
A modules/tools/styles/mw.cx.tools.FormatterTool.less
3 files changed, 98 insertions(+), 1 deletion(-)
git pull
ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/ContentTranslation
refs/changes/23/340923/1
diff --git a/extension.json b/extension.json
index eef093a..672d9a6 100644
--- a/extension.json
+++ b/extension.json
@@ -1719,7 +1719,8 @@
"mw.cx.tools.InstructionsTool",
"mw.cx.tools.DictionaryTool",
"mw.cx.tools.TemplateTool",
- "mw.cx.tools.LinkTool"
+ "mw.cx.tools.LinkTool",
+ "mw.cx.tools.FormatterTool"
]
},
"mw.cx.tools.MachineTranslationTool": {
@@ -1805,6 +1806,19 @@
"mw.cx.tools.TranslationTool"
]
},
+ "mw.cx.tools.FormatterTool": {
+ "scripts": [
+ "tools/mw.cx.tools.FormatterTool.js"
+ ],
+ "styles": [
+ "tools/styles/mw.cx.tools.FormatterTool.less"
+ ],
+ "dependencies": [
+ "mw.cx.tools.TranslationTool",
+ "oojs-ui.styles.icons-editing-styling",
+ "oojs-ui.styles.icons-editing-list"
+ ]
+ },
"mw.cx.tools.LinkTool": {
"scripts": [
"tools/mw.cx.tools.LinkTool.js"
diff --git a/modules/tools/mw.cx.tools.FormatterTool.js
b/modules/tools/mw.cx.tools.FormatterTool.js
new file mode 100644
index 000..bb8ef85
--- /dev/null
+++ b/modules/tools/mw.cx.tools.FormatterTool.js
@@ -0,0 +1,70 @@
+/**
+ * Formatter Tool
+ *
+ * @class
+ * @extends mw.cx.tools.TranslationTool
+ * @constructor
+ * @param {mw.cx.ui.TranslationUnit} ui
+ * @param {Object} config
+ */
+mw.cx.tools.FormatterTool = function CXFormatterTool( ui, config ) {
+ config.order = 1;
+ config.title = 'Formatter';
+ // Parent constructor
+ mw.cx.tools.FormatterTool.super.call( this, ui, config );
+ this.ui.connect( this, {
+ select: 'onSelect'
+ } );
+};
+
+/* Inheritance */
+OO.inheritClass( mw.cx.tools.FormatterTool, mw.cx.tools.TranslationTool );
+
+mw.cx.tools.FormatterTool.static.name = 'formatter';
+
+/**
+ * @inheritDoc
+ */
+mw.cx.tools.FormatterTool.prototype.getActions = function () {
+ var formatterButtonGroup, undoButton, redoButton, boldButton,
italicButton, orderedlistButton, unOrderedlistButton;
+ undoButton = new OO.ui.ButtonWidget( {
+ icon: 'undo'
+ } );
+ redoButton = new OO.ui.ButtonWidget( {
+ icon: 'redo'
+ } );
+ boldButton = new OO.ui.ButtonWidget( {
+ icon: 'bold'
+ } );
+ italicButton = new OO.ui.ButtonWidget( {
+ icon: 'italic'
+ } );
+ orderedlistButton = new OO.ui.ButtonWidget( {
+ icon: 'listBullet'
+ } );
+ unOrderedlistButton = new OO.ui.ButtonWidget( {
+ icon: 'listNumbered'
+ } );
+ formatterButtonGroup = new OO.ui.ButtonGroupWidget( {
+ items: [ undoButton, redoButton, boldButton, italicButton,
orderedlistButton, unOrderedlistButton ]
+ } );
+ return [ formatterButtonGroup ];
+};
+
+/**
+ * Text selection handler
+ * @param {string} selection Selected text
+ */
+mw.cx.tools.FormatterTool.prototype.onSelect = function ( selection ) {
+ // TODO: We need the selection object rather than selection string here
+ if ( selection ) {
+ this.showTool();
+ }
+};
+
+mw.cx.tools.FormatterTool.prototype.getContent = function () {
+ return '';
+};
+
+/* Register */
+mw.cx.tools.translationToolFactory.register( mw.cx.tools.FormatterTool );
diff --git a/modules/tools/styles/mw.cx.tools.FormatterTool.less
b/modules/tools/styles/mw.cx.tools.FormatterTool.less
new file mode 100644
index 000..28c49c2
--- /dev/null
+++ b/modules/tools/styles/mw.cx.tools.FormatterTool.less
@@ -0,0 +1,13 @@
+.cx-card-formatter {
+ .cx-widget-translationtool-container {
+ padding: 0;
+ }
+ .cx-widget-translationtool-header {
+ display: none;
+ }
+
