Allow VE users to change displaytitle in advanced settings dialog

Some parts of this are heavily based on how the existing defaultsort stuff works.

Relies on I9bb80b01 and Iba2fff95

Bug: 56868
Change-Id: I5f0ce2ec36e82b04d9e1357b14046867c1dd3b60

VisualEditor.php

@@ -863,6 +863,7 @@ $wgResourceModules += array(
 		'scripts' => array(
 			'modules/ve-mw/dm/metaitems/ve.dm.MWCategoryMetaItem.js',
 			'modules/ve-mw/dm/metaitems/ve.dm.MWDefaultSortMetaItem.js',
+			'modules/ve-mw/dm/metaitems/ve.dm.MWDisplayTitleMetaItem.js',
 			'modules/ve-mw/dm/metaitems/ve.dm.MWHiddenCategoryMetaItem.js',
 			'modules/ve-mw/dm/metaitems/ve.dm.MWIndexDisableMetaItem.js',
 			'modules/ve-mw/dm/metaitems/ve.dm.MWIndexForceMetaItem.js',
@@ -927,6 +928,8 @@ $wgResourceModules += array(
 			'visualeditor-dialog-meta-languages-name-label',
 			'visualeditor-dialog-meta-languages-readonlynote',
 			'visualeditor-dialog-meta-languages-section',
+			'visualeditor-dialog-meta-settings-displaytitle',
+			'visualeditor-dialog-meta-settings-displaytitle-enable',
 			'visualeditor-dialog-meta-settings-hiddencat-label',
 			'visualeditor-dialog-meta-settings-index-default',
 			'visualeditor-dialog-meta-settings-index-disable',

modules/ve-mw/dm/metaitems/ve.dm.MWDisplayTitleMetaItem.js

@@ -0,0 +1,54 @@
+/*!
+ * VisualEditor DataModel MWDisplayTitleMetaItem class.
+ *
+ * @copyright 2011-2014 VisualEditor Team and others; see AUTHORS.txt
+ * @license The MIT License (MIT); see LICENSE.txt
+ */
+
+/**
+ * DataModel display title meta item.
+ *
+ * @class
+ * @extends ve.dm.MetaItem
+ * @constructor
+ * @param {Object} element Reference to element in meta-linmod
+ */
+ve.dm.MWDisplayTitleMetaItem = function VeDmMWDisplayTitleMetaItem( element ) {
+	// Parent constructor
+	ve.dm.MetaItem.call( this, element );
+};
+
+/* Inheritance */
+
+OO.inheritClass( ve.dm.MWDisplayTitleMetaItem, ve.dm.MetaItem );
+
+/* Static Properties */
+
+ve.dm.MWDisplayTitleMetaItem.static.name = 'mwDisplayTitle';
+
+ve.dm.MWDisplayTitleMetaItem.static.group = 'mwDisplayTitle';
+
+ve.dm.MWDisplayTitleMetaItem.static.matchTagNames = [ 'meta' ];
+
+ve.dm.MWDisplayTitleMetaItem.static.matchRdfaTypes = [ 'mw:PageProp/displaytitle' ];
+
+ve.dm.MWDisplayTitleMetaItem.static.toDataElement = function ( domElements ) {
+	var content = domElements[0].getAttribute( 'content' );
+	return {
+		'type': this.name,
+		'attributes': {
+			'content': content
+		}
+	};
+};
+
+ve.dm.MWDisplayTitleMetaItem.static.toDomElements = function ( dataElement, doc ) {
+	var meta = doc.createElement( 'meta' );
+	meta.setAttribute( 'property', 'mw:PageProp/displaytitle' );
+	meta.setAttribute( 'content', dataElement.attributes.content );
+	return [ meta ];
+};
+
+/* Registration */
+
+ve.dm.modelRegistry.register( ve.dm.MWDisplayTitleMetaItem );

modules/ve-mw/i18n/en.json

@@ -91,6 +91,8 @@
     "visualeditor-dialog-meta-languages-name-label": "Language",
     "visualeditor-dialog-meta-languages-readonlynote": "This is a list of pages in other languages that are linked to this one. For now, it can only be edited in source mode or on Wikidata.",
     "visualeditor-dialog-meta-languages-section": "Languages",
+    "visualeditor-dialog-meta-settings-displaytitle": "Display title",
+    "visualeditor-dialog-meta-settings-displaytitle-enable": "Enable display title",
     "visualeditor-dialog-meta-settings-hiddencat-label": "Hidden category",
     "visualeditor-dialog-meta-settings-index-default": "Default",
     "visualeditor-dialog-meta-settings-index-disable": "No",

modules/ve-mw/i18n/qqq.json

@@ -96,6 +96,8 @@
 	"visualeditor-dialog-meta-languages-name-label": "Column header for the language links table, giving the language name of the remote wiki.\n{{Identical|Language}}",
 	"visualeditor-dialog-meta-languages-readonlynote": "Text of a note informing users that the language links cannot yet be edited.\n\nSee also:\n* {{msg-mw|Visualeditor-referencelist-missingref}}",
 	"visualeditor-dialog-meta-languages-section": "Label for the language links dialog section.\n{{Identical|Language}}",
+	"visualeditor-dialog-meta-settings-displaytitle": "Label for the text box in which the user can set what the title of the page should be displayed as.",
+	"visualeditor-dialog-meta-settings-displaytitle-enable": "Label for the checkbox to enable the use of the display title text box.",
 	"visualeditor-dialog-meta-settings-hiddencat-label": "Prompt for the checkbox to let the user hide this category from pages.",
 	"visualeditor-dialog-meta-settings-index-default": "Label for the option to have default indexing behavior.\n{{Identical|Default}}",
 	"visualeditor-dialog-meta-settings-index-disable": "Label for the option for indexing to be forced off.\n{{Identical|No}}",

modules/ve-mw/ui/pages/ve.ui.MWAdvancedSettingsPage.js

@@ -84,6 +84,32 @@ ve.ui.MWAdvancedSettingsPage = function VeUiMWAdvancedSettingsPage( name, config
 		}
 	);
 
+	this.displayTitleTouched = false;
+	this.enableDisplayTitleInput = new OO.ui.CheckboxInputWidget( { '$': this.$ } );
+	this.enableDisplayTitleInput.connect( this, { 'change': 'onEnableDisplayTitleInputChange' } );
+	this.enableDisplayTitleField = new OO.ui.FieldLayout(
+		this.enableDisplayTitleInput,
+		{
+			'$': this.$,
+			'align': 'inline',
+			'label': ve.msg( 'visualeditor-dialog-meta-settings-displaytitle-enable' )
+		}
+	);
+	this.displayTitleInput = new OO.ui.TextInputWidget( {
+		'$': this.$,
+		'placeholder': ve.msg( 'visualeditor-dialog-meta-settings-displaytitle' )
+	} );
+	this.displayTitleInput.connect( this, { 'change': 'onDisplayTitleInputChange' } );
+	this.displayTitleField = new OO.ui.FieldLayout(
+		this.displayTitleInput,
+		{
+			'$': this.$,
+			'align': 'inline'
+		}
+	);
+
+	this.advancedSettingsFieldset.addItems( [ this.indexing, this.newEditSectionLink, this.enableDisplayTitleField, this.displayTitleField ] );
+
 	this.metaItemCheckboxes = [];
 	/*global mw*/
 	if ( mw.config.get( 'wgVariantArticlePath' ) ) {
@@ -99,8 +125,6 @@ ve.ui.MWAdvancedSettingsPage = function VeUiMWAdvancedSettingsPage( name, config
 		);
 	}
 
-	this.advancedSettingsFieldset.addItems( [ this.indexing, this.newEditSectionLink ] );
-
 	$.each( this.metaItemCheckboxes, function () {
 		this.fieldLayout = new OO.ui.FieldLayout(
 			new OO.ui.CheckboxInputWidget( { '$': this.$ } ),
@@ -122,6 +146,29 @@ OO.inheritClass( ve.ui.MWAdvancedSettingsPage, OO.ui.PageLayout );
 
 /* Methods */
 
+/**
+ * Handle redirect state change events.
+ *
+ * @param {boolean} value Whether a redirect is to be set for this page
+ */
+ve.ui.MWAdvancedSettingsPage.prototype.onEnableDisplayTitleInputChange = function ( value ) {
+	this.displayTitleInput.setDisabled( !value );
+	if ( !value ) {
+		this.displayTitleInput.setValue( '' );
+		this.enableDisplayTitleInput.setValue( false );
+	}
+	this.displayTitleTouched = true;
+};
+
+/**
+ * Handle redirect state change events.
+ *
+ * @param {boolean} value Whether a redirect is to be set for this page
+ */
+ve.ui.MWAdvancedSettingsPage.prototype.onDisplayTitleInputChange = function () {
+	this.displayTitleTouched = true;
+};
+
 /**
  * @inheritdoc
  */
@@ -183,6 +230,9 @@ ve.ui.MWAdvancedSettingsPage.prototype.setup = function ( metaList ) {
 		newSectionEditLinkOption = this.getMetaItem( 'mwNewSectionEdit' ),
 		newSectionEditLinkType = newSectionEditLinkOption && newSectionEditLinkOption.element.type || 'default',
 
+		displayTitleItem = this.getMetaItem( 'mwDisplayTitle' ),
+		displayTitle = displayTitleItem && displayTitleItem.getAttribute( 'content' ) || '',
+
 		advancedSettingsPage = this;
 
 	// Indexing items
@@ -193,6 +243,11 @@ ve.ui.MWAdvancedSettingsPage.prototype.setup = function ( metaList ) {
 	newSectionEditField.selectItem( newSectionEditField.getItemFromData( newSectionEditLinkType ) );
 	this.newSectionEditLinkOptionTouched = false;
 
+	this.enableDisplayTitleInput.setValue( !!displayTitleItem );
+	this.displayTitleInput.setValue( displayTitle );
+	this.displayTitleInput.setDisabled( !displayTitle );
+	this.displayTitleTouched = false;
+
 	// Simple checkbox items
 	$.each( this.metaItemCheckboxes, function () {
 		var currentValue = !!advancedSettingsPage.getMetaItem( this.metaName );
@@ -217,6 +272,10 @@ ve.ui.MWAdvancedSettingsPage.prototype.teardown = function ( data ) {
 		currentNewSectionEditLinkItem = this.getMetaItem( 'mwNewSectionEdit' ),
 		newNewSectionEditLinkOptionData = this.newEditSectionLink.getField().getSelectedItem(),
 
+		currentDisplayTitleItem = this.getMetaItem( 'mwDisplayTitle' ),
+		newDisplayTitle = this.displayTitleInput.getValue(),
+		newDisplayTitleItemData = { 'type': 'mwDisplayTitle', 'attributes': { 'content': newDisplayTitle } },
+
 		advancedSettingsPage = this;
 
 	// Alter the indexing option flag iff it's been touched & is actually different
@@ -259,6 +318,30 @@ ve.ui.MWAdvancedSettingsPage.prototype.teardown = function ( data ) {
 		}
 	}
 
+	if ( this.displayTitleTouched ) {
+		if ( currentDisplayTitleItem ) {
+			if ( newDisplayTitle ) {
+				if ( currentDisplayTitleItem.getAttribute( 'content' ) !== newDisplayTitle ) {
+					// There was a display title and is a new one, but they differ, so replace
+					currentDisplayTitleItem.replaceWith(
+						ve.extendObject( true, {},
+							currentDisplayTitleItem.getElement(),
+							newDisplayTitleItemData
+					) );
+				}
+			} else {
+				// There was a display title and is no new one, so remove
+				currentDisplayTitleItem.remove();
+			}
+		} else {
+			if ( newDisplayTitle ) {
+				// There's no existing display title but there is a new one, so create
+				// HACK: Putting this at index 0, offset 0 so that it works – bug 61862
+				this.metaList.insertMeta( newDisplayTitleItemData, 0, 0 );
+			}
+		}
+	}
+
 	$.each( this.metaItemCheckboxes, function () {
 		var currentItem = advancedSettingsPage.getMetaItem( this.metaName ),
 			newValue = this.fieldLayout.getField().getValue();