jenkins-bot has submitted this change and it was merged.
Change subject: Conditionally add switch buttons
......................................................................
Conditionally add switch buttons
There should be no switch button if the other editor isn't supported.
Since the switch-button under wikitext textarea may not be added, I
also had to change how that border is added. I've added it on the
parent div, where textarea & switcher are both children of. With or
without the switcher, there'll be a complete border.
I'm not too happy with the editors depending on one another (that
sort of logic should probably be outside of editors) but hey, it works.
VE depends on none through Resources.php. None depends in VE in JS.
I couldn't add VE as a dependency because VE has no mobile target.
Since VE won't work on mobile, the resource won't be able to load in
JS & the switcher won't be attached.
Meanwhile also slightly cleaned up some jsdoc
Bug: T94676
Change-Id: Ia4a0d4e2b10564afe68a567fd5fa93b20324b7dd
---
M Resources.php
M handlebars/flow_editor_switcher.partial.handlebars
M i18n/en.json
M i18n/qqq.json
M modules/editor/editors/ext.flow.editors.none.js
M modules/editor/editors/visualeditor/ext.flow.editors.visualeditor.js
M modules/editor/editors/visualeditor/mw.flow.ve.Target.js
M modules/editor/ext.flow.editor.js
M modules/engine/components/board/features/flow-board-switcheditor.js
M modules/styles/board/editor-switcher.less
10 files changed, 73 insertions(+), 61 deletions(-)
Approvals:
EBernhardson: Looks good to me, approved
jenkins-bot: Verified
diff --git a/Resources.php b/Resources.php
index 1e39a70..9511d0a 100644
--- a/Resources.php
+++ b/Resources.php
@@ -239,6 +239,7 @@
"flow-board-header-browse-topics-link",
// editor switching
"flow-wikitext-editor-help",
+ "flow-wikitext-editor-help-and-preview",
"flow-wikitext-editor-help-uses-wikitext",
"flow-wikitext-editor-help-preview-the-result",
),
@@ -478,6 +479,7 @@
'site',
'user',
'mediawiki.api',
+ 'ext.flow.editors.none', // needed to figure out if
that editor is supported, for switch button
),
'messages' => array(
'flow-ve-mention-context-item-label',
diff --git a/handlebars/flow_editor_switcher.partial.handlebars
b/handlebars/flow_editor_switcher.partial.handlebars
index ad0f49c..812b093 100644
--- a/handlebars/flow_editor_switcher.partial.handlebars
+++ b/handlebars/flow_editor_switcher.partial.handlebars
@@ -3,15 +3,16 @@
{{! this message is manually constructed in
ext.flow.editors.none.js !}}
<p class="flow-wikitext-editor-help">{{html help_text}}</p>
- <a href="#"
- title="{{l10n "flow-wikitext-switch-editor-tooltip"}}"
- class="mw-ui-button mw-ui-constructive flow-js
flow-editor-color"
- data-flow-interactive-handler="switchEditor"
- data-flow-load-handler="requiresVisualEditor"
- data-flow-target="< form textarea"
- >
- </>
- </a>
+ {{#if enable_switcher}}
+ <a href="#"
+ title="{{l10n
"flow-wikitext-switch-editor-tooltip"}}"
+ class="mw-ui-button mw-ui-constructive flow-js
flow-editor-color"
+ data-flow-interactive-handler="switchEditor"
+ data-flow-target="< form textarea"
+ >
+ </>
+ </a>
+ {{/if}}
</div>
<div class="flow-ui-clear"></div>
</div>
diff --git a/i18n/en.json b/i18n/en.json
index 85032a9..89bc118 100644
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -540,7 +540,8 @@
"flow-ve-mention-tool-title": "Mention a user",
"flow-ve-mention-template": "ping",
"flow-ve-mention-inspector-invalid-user": "The username '$1' is not
registered.",
- "flow-wikitext-editor-help": "Wikitext $1 and you can $2 anytime.",
+ "flow-wikitext-editor-help": "Wikitext $1.",
+ "flow-wikitext-editor-help-and-preview": "Wikitext $1 and you can $2
anytime.",
"flow-wikitext-editor-help-uses-wikitext": "[[mw:Help:Formatting|uses
markup]]",
"flow-wikitext-editor-help-preview-the-result": "preview the result",
"flow-wikitext-switch-editor-tooltip": "Switch to VisualEditor",
diff --git a/i18n/qqq.json b/i18n/qqq.json
index 91c52d2..4f1c240 100644
--- a/i18n/qqq.json
+++ b/i18n/qqq.json
@@ -542,7 +542,8 @@
"flow-ve-mention-tool-title": "Title text for the user mention tool on
Flow's VisualEditor toolbar.",
"flow-ve-mention-template": "Name of on-wiki template used for user
mentions. The template should accept a call in the form
<nowiki>{{templatename|Username}}</nowiki>, to mention Username. It will use
content language.",
"flow-ve-mention-inspector-invalid-user": "Error shown when the poster
attempts to mention a user that does not exist. Parameters:\n$1: Username.
The username is not registered; thus, gender is unknown.",
- "flow-wikitext-editor-help": "Text shown at the bottom of a wikitext
editing box",
+ "flow-wikitext-editor-help": "Text shown at the bottom of a wikitext
editing box when visualeditor is not available to switch to",
+ "flow-wikitext-editor-help-and-preview": "Text shown at the bottom of a
wikitext editing box when visualeditor is available to switch to",
"flow-wikitext-editor-help-uses-wikitext": "Link to wikitext help. See
also flow-wikitext-editor-help",
"flow-wikitext-editor-help-preview-the-result": "Text of link that will
switch from wikitext editor to an html preview. See also
flow-wikitext-editor-help",
"flow-wikitext-switch-editor-tooltip": "Tooltip for button shown below
a wikitext editor to switch to VisualEditor.",
diff --git a/modules/editor/editors/ext.flow.editors.none.js
b/modules/editor/editors/ext.flow.editors.none.js
index 06c33de..c869943 100644
--- a/modules/editor/editors/ext.flow.editors.none.js
+++ b/modules/editor/editors/ext.flow.editors.none.js
@@ -24,7 +24,9 @@
this.$node.keyup( this.autoExpand );
this.autoExpand.call( this.$node.get( 0 ) );
- this.attachSwitcher();
+ // only attach switcher if VE is actually supported
+ // code to figure out if that VE is supported is in that module
+ mw.loader.using( 'ext.flow.editors.visualeditor', $.proxy(
this.attachControls, this ) );
};
OO.inheritClass( mw.flow.editors.none, mw.flow.editors.AbstractEditor );
@@ -120,25 +122,41 @@
}
};
- mw.flow.editors.none.prototype.attachSwitcher = function() {
- var board = mw.flow.getPrototypeMethod( 'board',
'getInstanceByElement' )( this.$node ),
+ mw.flow.editors.none.prototype.attachControls = function() {
+ var $preview, $controls, templateArgs,
+ board = mw.flow.getPrototypeMethod( 'board',
'getInstanceByElement' )( this.$node );
+
+ if ( mw.flow.editors.visualeditor.static.isSupported() ) {
$preview = $( '<a>' ).attr( {
href: '#',
'data-flow-interactive-handler': 'switchEditor',
'data-flow-target': '< form textarea'
- } ).text( mw.message(
'flow-wikitext-editor-help-preview-the-result' ).text() ),
- $switcher = $(
mw.flow.TemplateEngine.processTemplateGetFragment(
- 'flow_editor_switcher.partial',
- {
- help_text: mw.message(
'flow-wikitext-editor-help' ).params( [
- mw.message(
'flow-wikitext-editor-help-uses-wikitext' ).parse(),
- $preview[0].outerHTML
- ] ).parse()
- }
- ) ).children();
+ } ).text( mw.message(
'flow-wikitext-editor-help-preview-the-result' ).text() );
+
+ templateArgs = {
+ enable_switcher: true,
+ help_text: mw.message(
'flow-wikitext-editor-help-and-preview' ).params( [
+ mw.message(
'flow-wikitext-editor-help-uses-wikitext' ).parse(),
+ $preview[0].outerHTML
+ ] ).parse()
+ };
+ } else {
+ // render just a basic help text
+ templateArgs = {
+ enable_switcher: false,
+ help_text: mw.message(
'flow-wikitext-editor-help' ).params( [
+ mw.message(
'flow-wikitext-editor-help-uses-wikitext' ).parse()
+ ] ).parse()
+ };
+ }
+
+ $controls = $(
mw.flow.TemplateEngine.processTemplateGetFragment(
+ 'flow_editor_switcher.partial',
+ templateArgs
+ ) ).children();
// insert help information + editor switcher, and make it
interactive
- board.emitWithReturn( 'makeContentInteractive',
$switcher.insertAfter( this.$node ) );
+ board.emitWithReturn( 'makeContentInteractive',
$controls.insertAfter( this.$node ) );
};
mw.flow.editors.none.prototype.focus = function() {
diff --git
a/modules/editor/editors/visualeditor/ext.flow.editors.visualeditor.js
b/modules/editor/editors/visualeditor/ext.flow.editors.visualeditor.js
index fec83ee..0bdad04 100644
--- a/modules/editor/editors/visualeditor/ext.flow.editors.visualeditor.js
+++ b/modules/editor/editors/visualeditor/ext.flow.editors.visualeditor.js
@@ -191,13 +191,16 @@
// ES5 support, from es5-skip.js
( function () {
// This test is based on 'use strict',
- // which is inherited from the top-leve
function.
+ // which is inherited from the top-level
function.
return !this && !!Function.prototype.bind;
}() ) &&
// Since VE commit
e2fab2f1ebf2a28f18b8ead08c478c4fc95cd64e, SVG is required
document.createElementNS &&
- document.createElementNS( 'http://www.w3.org/2000/svg',
'svg' ).createSVGRect
+ document.createElementNS( 'http://www.w3.org/2000/svg',
'svg' ).createSVGRect &&
+
+ // ve needs to be turned on as a valid editor
+ mw.config.get( 'wgFlowEditorList' ).indexOf(
'visualeditor' ) !== -1
);
};
diff --git a/modules/editor/editors/visualeditor/mw.flow.ve.Target.js
b/modules/editor/editors/visualeditor/mw.flow.ve.Target.js
index 8e8dc15..2925164 100644
--- a/modules/editor/editors/visualeditor/mw.flow.ve.Target.js
+++ b/modules/editor/editors/visualeditor/mw.flow.ve.Target.js
@@ -37,9 +37,11 @@
{ include: [ 'flowMention' ] }
];
- mw.flow.ve.Target.static.actionGroups = [
- { include: [ 'flowSwitchEditor' ] }
- ];
+ if ( mw.flow.editors.none.static.isSupported() ) {
+ mw.flow.ve.Target.static.actionGroups = [
+ { include: [ 'flowSwitchEditor' ] }
+ ];
+ }
// Methods
diff --git a/modules/editor/ext.flow.editor.js
b/modules/editor/ext.flow.editor.js
index 351fc7c..95af71d 100644
--- a/modules/editor/ext.flow.editor.js
+++ b/modules/editor/ext.flow.editor.js
@@ -192,6 +192,7 @@
* and call switchEditor for each iteration.
*
* @param {jQuery} $node
+ * @param {string} desiredEditor
* @return {jQuery.Promise} Will resolve once editor instance
is loaded
*/
switchEditor: function ( $node, desiredEditor ) {
diff --git
a/modules/engine/components/board/features/flow-board-switcheditor.js
b/modules/engine/components/board/features/flow-board-switcheditor.js
index b68de6f..b08eb7b 100644
--- a/modules/engine/components/board/features/flow-board-switcheditor.js
+++ b/modules/engine/components/board/features/flow-board-switcheditor.js
@@ -30,8 +30,8 @@
* code for switching, so this is only run by clicking the switch
button from 'none'.
* If we add more editors later this will have to be revisited.
*
- * @param {Event}
- * @returns {$.Promise}
+ * @param {Event} event
+ * @returns {jQuery.Promise}
*/
FlowBoardComponentSwitchEditorFeatureMixin.UI.events.interactiveHandlers.switchEditor
= function ( event ) {
var $this = $( this ),
@@ -45,25 +45,6 @@
}
return mw.flow.editor.switchEditor( $target, 'visualeditor' );
- };
-
- /**
- * Hide wikitext editor switchEditor controls on load if visualeditor
is not available.
- *
- * @param {jQuery} event
- */
-
FlowBoardComponentSwitchEditorFeatureMixin.UI.events.loadHandlers.requiresVisualEditor
= function ( $switcher ) {
- if ( mw.config.get( 'wgFlowEditorList' ).indexOf(
'visualeditor' ) === -1 ) {
- $switcher.hide();
- } else {
- // this just pulls in a small bit of code, the full VE
is not pulled in until
- // the editor is initialized.
- mw.loader.using( 'ext.flow.editors.visualeditor',
function() {
- if (
!mw.flow.editors.visualeditor.static.isSupported() ) {
- $switcher.hide();
- }
- } );
- }
};
// Mixin to FlowComponent
diff --git a/modules/styles/board/editor-switcher.less
b/modules/styles/board/editor-switcher.less
index 5c52d56..d1cdd18 100644
--- a/modules/styles/board/editor-switcher.less
+++ b/modules/styles/board/editor-switcher.less
@@ -16,18 +16,20 @@
}
.flow-editor {
- .flow-switcher-controls {
- background-color: white;
+ // because we're attaching switcher controls below the textarea & we
+ // want them to look unified with the textarea, we'll have to take away
+ // it's border and re-apply on the parent node that contains both
+ &.flow-editor-none {
border: 1px solid @colorFieldBorder;
- border-top: 0;
- padding: .25em;
- }
- textarea {
- border-bottom: 0;
- border-bottom-left-radius: 0;
- border-bottom-right-radius: 0;
- margin-bottom: 0;
+ textarea {
+ border: 0;
+ }
+
+ .flow-switcher-controls {
+ background-color: white;
+ padding: .25em;
+ }
}
// would prefer textarea:not(.flow-input-compressed) above, but ie8
wont do it
--
To view, visit https://gerrit.wikimedia.org/r/201153
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: Ia4a0d4e2b10564afe68a567fd5fa93b20324b7dd
Gerrit-PatchSet: 4
Gerrit-Project: mediawiki/extensions/Flow
Gerrit-Branch: master
Gerrit-Owner: Matthias Mullie <mmul...@wikimedia.org>
Gerrit-Reviewer: EBernhardson <ebernhard...@wikimedia.org>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
