Topic on Extension talk:StructuredDiscussions

Enable the visual editor on the mobile frontend

1
Tinss (talkcontribs)

In mobile mode, only the wikicode is available which is problematic as most users are not versed in wikicode edition. Below is a patch to enable the visual editor in mobile mode.

There is however one bug that I cannot solve: searching users to tag them does not work, the exact user name has to be entered.

In extension.json

Above "ext.flow.visualEditor":

"ext.flow.mobileVisualEditor": {
	"scripts": [
		"editor/editors/visualeditor/mw.flow.ve.Target.js",
		"editor/editors/visualeditor/mw.flow.ve.UserCache.js",
		"editor/editors/visualeditor/ui/inspectors/mw.flow.ve.ui.MentionInspector.js",
		"editor/editors/visualeditor/ui/tools/mw.flow.ve.ui.MentionInspectorTool.js",
		"editor/editors/visualeditor/ui/tools/mw.flow.ve.ui.MWEditModeTool.js",
		"editor/editors/visualeditor/ui/contextitem/mw.flow.ve.ui.MentionContextItem.js",
		"editor/editors/visualeditor/ui/widgets/mw.flow.ve.ui.MentionTargetInputWidget.js",
		"editor/editors/visualeditor/mw.flow.ve.CommandRegistry.js",
		"editor/editors/visualeditor/mw.flow.ve.SequenceRegistry.js"
	],
	"styles": [
		"editor/editors/visualeditor/mw.flow.ve.Target.less"
	],
	"dependencies": [
		"ext.visualEditor.core",
		"ext.visualEditor.core.mobile",
		"ext.visualEditor.mediawiki",
		"ext.visualEditor.mwwikitext",
		"ext.visualEditor.switching",
		"mediawiki.editfont.styles",
		"oojs-ui.styles.icons-editing-advanced",
		"ext.flow.visualEditor.icons",
		"mediawiki.api",
		"mediawiki.util"
	],
	"messages": [
		"flow-ve-mention-context-item-label",
		"flow-ve-mention-inspector-title",
		"flow-ve-mention-inspector-remove-label",
		"flow-ve-mention-inspector-invalid-user",
		"flow-ve-mention-placeholder",
		"flow-ve-mention-tool-title"
	],
	"targets": [
		"mobile"
	]
},

In "ext.flow.visualEditor.icons":

"targets": [
	"desktop",
	"mobile"
]

In extensions/Flow/modules/flow/ui/widgets/editor/mw.flow.ui.EditorWidget.js

Comment out !OO.ui.isMobile() in

mw.flow.ui.EditorWidget.static.isVisualEditorSupported = function () {
	/* global VisualEditorSupportCheck:false */
	return !!(
		//!OO.ui.isMobile() &&
		mw.loader.getState( 'ext.visualEditor.core' ) &&
		mw.user.options.get( 'flow-visualeditor' ) &&
		window.VisualEditorSupportCheck && VisualEditorSupportCheck()
	);
};


Replace line modules = [ 'ext.flow.visualEditor' ].concat(

with modules = [ OO.ui.isMobile() ? 'ext.flow.mobileVisualEditor' : 'ext.flow.visualEditor' ].concat(

Reply to "Enable the visual editor on the mobile frontend"