mediawiki-extensions-Visual.../modules/ve-mw/ui/inspectors/ve.ui.MWMagicLinkNodeInspector.js
C. Scott Ananian 7cc23367f6 Specialized inspector for ISBN magic links
Implement a special node type, context item, and inspector for
ISBN/PMID/RFC magic links.  Add buttons to the link inspectors
to convert back and forth between "simple" links, and magic links.

Depends on I5d000d8b63dafdfe0a2753069d3f0ac5b03b8829 in Parsoid
for clean round-tripping of localized ISBN magic links.

Bug: T63558
Change-Id: Id5b7a2ae3c80b0e5eed598f0bd024d3e94f7e9aa
2015-09-01 14:25:59 -04:00

183 lines
5.2 KiB
JavaScript

/*!
* VisualEditor UserInterface MWMagicLinkNodeInspector class.
*
* @copyright 2011-2015 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
/**
* Inspector for editing MediaWiki magic links (RFC/ISBN/PMID).
*
* @class
* @extends ve.ui.NodeInspector
*
* @constructor
* @param {Object} [config] Configuration options
*/
ve.ui.MWMagicLinkNodeInspector = function VeUiMWMagicLinkNodeInspector( config ) {
// Parent constructor
ve.ui.NodeInspector.call( this, config );
};
/* Inheritance */
OO.inheritClass( ve.ui.MWMagicLinkNodeInspector, ve.ui.NodeInspector );
/* Static properties */
ve.ui.MWMagicLinkNodeInspector.static.name = 'linkMagicNode';
ve.ui.MWMagicLinkNodeInspector.static.icon = 'link';
ve.ui.MWMagicLinkNodeInspector.static.title = null; // see #getSetupProcess
ve.ui.MWMagicLinkNodeInspector.static.modelClasses = [ ve.dm.MWMagicLinkNode ];
ve.ui.MWMagicLinkNodeInspector.static.actions = ve.ui.MWMagicLinkNodeInspector.super.static.actions.concat( [
{
action: 'convert',
label: OO.ui.deferMsg( 'visualeditor-magiclinknodeinspector-convert-link' ),
modes: [ 'edit' ]
}
] );
/* Methods */
/**
* @inheritdoc
*/
ve.ui.MWMagicLinkNodeInspector.prototype.initialize = function () {
// Parent method
ve.ui.MWMagicLinkNodeInspector.super.prototype.initialize.call( this );
// Properties
this.targetInput = new OO.ui.TextInputWidget( {
validate: this.validate.bind( this )
} );
this.targetInput.on( 'change', this.onChange.bind( this ) );
// Initialization
this.form.$element.append( this.targetInput.$element );
};
/**
* Return true if the given string is a valid magic link of the
* appropriate type.
*
* @private
*/
ve.ui.MWMagicLinkNodeInspector.prototype.validate = function ( str ) {
var node = this.getFragment().getSelectedNode();
return node.constructor.static.validateContent( str, node.getMagicType() );
};
ve.ui.MWMagicLinkNodeInspector.prototype.onChange = function ( value ) {
// Disable the unsafe action buttons if the input isn't valid
var isValid = this.validate( value );
this.actions.forEach( null, function ( action ) {
if ( !action.hasFlag( 'safe' ) ) {
action.setDisabled( !isValid );
}
} );
};
/**
* @inheritdoc
*/
ve.ui.MWMagicLinkNodeInspector.prototype.getActionProcess = function ( action ) {
if ( ( action === 'done' || action === 'convert' ) &&
!this.validate( this.targetInput.getValue() ) ) {
// Don't close dialog: input isn't valid.
return new OO.ui.Process( 0 );
}
if ( action === 'convert' ) {
return new OO.ui.Process( function () {
this.close( { action: action } );
}, this );
}
return ve.ui.MWMagicLinkNodeInspector.super.prototype.getActionProcess.call( this, action );
};
/**
* @inheritdoc
*/
ve.ui.MWMagicLinkNodeInspector.prototype.getSetupProcess = function ( data ) {
// Set the title based on the node type
var fragment = data.fragment,
node = fragment instanceof ve.dm.SurfaceFragment ?
fragment.getSelectedNode() : null,
type = node instanceof ve.dm.MWMagicLinkNode ?
node.getMagicType() : null,
msg = type ?
'visualeditor-magiclinknodeinspector-title-' + type.toLowerCase() :
null;
data = $.extend( {
title: msg ? OO.ui.deferMsg( msg ) : null
}, data );
return ve.ui.MWMagicLinkNodeInspector.super.prototype.getSetupProcess.call( this, data )
.next( function () {
// Initialization
this.targetInput.setValue(
this.selectedNode ? this.selectedNode.getAttribute( 'content' ) : ''
);
}, this );
};
/**
* @inheritdoc
*/
ve.ui.MWMagicLinkNodeInspector.prototype.getReadyProcess = function ( data ) {
return ve.ui.MWMagicLinkNodeInspector.super.prototype.getReadyProcess.call( this, data )
.next( function () {
this.targetInput.focus().select();
}, this );
};
/**
* @inheritdoc
*/
ve.ui.MWMagicLinkNodeInspector.prototype.getTeardownProcess = function ( data ) {
data = data || {};
return ve.ui.MWMagicLinkNodeInspector.super.prototype.getTeardownProcess.call( this, data )
.first( function () {
var content, annotation, annotations,
surfaceModel = this.getFragment().getSurface(),
doc = surfaceModel.getDocument(),
nodeRange = this.selectedNode.getOuterRange(),
value = this.targetInput.getValue(),
done = data.action === 'done',
convert = data.action === 'convert',
remove = data.action === 'remove' || ( done && !value );
if ( remove ) {
surfaceModel.change(
ve.dm.Transaction.newFromRemoval( doc, nodeRange )
);
} else if ( convert ) {
annotation = ve.dm.MWMagicLinkNode.static.annotationFromContent(
value
);
if ( annotation ) {
annotations = doc.data.getAnnotationsFromOffset( nodeRange.start ).clone();
annotations.push( annotation );
content = value.split( '' );
ve.dm.Document.static.addAnnotationsToData( content, annotations );
surfaceModel.change(
ve.dm.Transaction.newFromReplacement( doc, nodeRange, content )
);
}
} else if ( done && this.validate( value ) ) {
surfaceModel.change(
ve.dm.Transaction.newFromAttributeChanges(
doc, nodeRange.start, { content: value }
)
);
}
}, this );
};
/* Registration */
ve.ui.windowFactory.register( ve.ui.MWMagicLinkNodeInspector );