mediawiki-extensions-Visual.../modules/ve-mw/ce/nodes/ve.ce.MWReferencesListNode.js

237 lines
6.4 KiB
JavaScript
Raw Normal View History

/*!
* VisualEditor ContentEditable MWReferencesListNode class.
*
* @copyright 2011-2015 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
/**
* ContentEditable MediaWiki references list node.
*
* @class
* @extends ve.ce.LeafNode
* @mixins ve.ce.FocusableNode
ve.ce.ProtectedNode Objective: Generalize the shield and phantom magic, so we can use it for pretty much any node we like. Usually this will be used with generated content nodes, but also with aliens (of course) and possible other stuff in the future. Bonus: Also fixes a bug in DM that would crash VE when you selected to the end and hit backspace. Changes: *.php * Added links to files aliens.html * Added attributes to aliens to make them aliens again ve.ce.AlienNode.js * Moved shield and phantom functionality to ve.ce.ProtectedNode ve.ce.AlienNode.js, ve.ce.MWReferenceListNode.js, ve.ce.MWReferenceNode.js, ve.ce.MWTemplateNode.js * Mixed in ve.ce.ProtectedNode ve.ce.Node.css * Reorganized styles and updated class names * Added simple light blue hover with outline (using inset box shadow) for protected nodes, same style as before for aliens ve.ce.Surface.css * Moved phantom styles to ve.ce.Node.css ve.ce.BranchNode.js * Moved call to setLive(false) to happen before detach() so that the surface object is still available and events can be disconnected ve.ce.BranchNode.js, ve.ce.Document.js, ve.ce.js, ve.ce.Surface.js, ve.ce.SurfaceObserver.js * Adjusted CSS class names ve.ce.Node.js * Moved shield template to ve.ce.ProtectedNode ve.ce.ProtectedNode.js * New class, mix into another class to protect it from editing ve.ce.RelocatableNode.js * Renamed temporary surface property to relocatingSurface to avoid confusion when debugging ve.ce.Surface.js * Moved phantom template to ve.ce.ProtectedNode ve.dm.Transaction.js * Fixed bug where most of the internal list was being deleted when the end of the document was selected and the user pressed backspace Change-Id: I2468b16e1ba6785ad298e38190e33493135719c3
2013-05-07 00:07:01 +00:00
*
* @constructor
* @param {ve.dm.MWReferencesListNode} model Model to observe
* @param {Object} [config] Configuration options
*/
ve.ce.MWReferencesListNode = function VeCeMWReferencesListNode( model, config ) {
// Parent constructor
ve.ce.LeafNode.call( this, model, config );
ve.ce.ProtectedNode Objective: Generalize the shield and phantom magic, so we can use it for pretty much any node we like. Usually this will be used with generated content nodes, but also with aliens (of course) and possible other stuff in the future. Bonus: Also fixes a bug in DM that would crash VE when you selected to the end and hit backspace. Changes: *.php * Added links to files aliens.html * Added attributes to aliens to make them aliens again ve.ce.AlienNode.js * Moved shield and phantom functionality to ve.ce.ProtectedNode ve.ce.AlienNode.js, ve.ce.MWReferenceListNode.js, ve.ce.MWReferenceNode.js, ve.ce.MWTemplateNode.js * Mixed in ve.ce.ProtectedNode ve.ce.Node.css * Reorganized styles and updated class names * Added simple light blue hover with outline (using inset box shadow) for protected nodes, same style as before for aliens ve.ce.Surface.css * Moved phantom styles to ve.ce.Node.css ve.ce.BranchNode.js * Moved call to setLive(false) to happen before detach() so that the surface object is still available and events can be disconnected ve.ce.BranchNode.js, ve.ce.Document.js, ve.ce.js, ve.ce.Surface.js, ve.ce.SurfaceObserver.js * Adjusted CSS class names ve.ce.Node.js * Moved shield template to ve.ce.ProtectedNode ve.ce.ProtectedNode.js * New class, mix into another class to protect it from editing ve.ce.RelocatableNode.js * Renamed temporary surface property to relocatingSurface to avoid confusion when debugging ve.ce.Surface.js * Moved phantom template to ve.ce.ProtectedNode ve.dm.Transaction.js * Fixed bug where most of the internal list was being deleted when the end of the document was selected and the user pressed backspace Change-Id: I2468b16e1ba6785ad298e38190e33493135719c3
2013-05-07 00:07:01 +00:00
// Mixin constructors
ve.ce.FocusableNode.call( this );
ve.ce.ProtectedNode Objective: Generalize the shield and phantom magic, so we can use it for pretty much any node we like. Usually this will be used with generated content nodes, but also with aliens (of course) and possible other stuff in the future. Bonus: Also fixes a bug in DM that would crash VE when you selected to the end and hit backspace. Changes: *.php * Added links to files aliens.html * Added attributes to aliens to make them aliens again ve.ce.AlienNode.js * Moved shield and phantom functionality to ve.ce.ProtectedNode ve.ce.AlienNode.js, ve.ce.MWReferenceListNode.js, ve.ce.MWReferenceNode.js, ve.ce.MWTemplateNode.js * Mixed in ve.ce.ProtectedNode ve.ce.Node.css * Reorganized styles and updated class names * Added simple light blue hover with outline (using inset box shadow) for protected nodes, same style as before for aliens ve.ce.Surface.css * Moved phantom styles to ve.ce.Node.css ve.ce.BranchNode.js * Moved call to setLive(false) to happen before detach() so that the surface object is still available and events can be disconnected ve.ce.BranchNode.js, ve.ce.Document.js, ve.ce.js, ve.ce.Surface.js, ve.ce.SurfaceObserver.js * Adjusted CSS class names ve.ce.Node.js * Moved shield template to ve.ce.ProtectedNode ve.ce.ProtectedNode.js * New class, mix into another class to protect it from editing ve.ce.RelocatableNode.js * Renamed temporary surface property to relocatingSurface to avoid confusion when debugging ve.ce.Surface.js * Moved phantom template to ve.ce.ProtectedNode ve.dm.Transaction.js * Fixed bug where most of the internal list was being deleted when the end of the document was selected and the user pressed backspace Change-Id: I2468b16e1ba6785ad298e38190e33493135719c3
2013-05-07 00:07:01 +00:00
// Properties
this.internalList = null;
this.listNode = null;
// DOM changes
this.$element.addClass( 've-ce-mwReferencesListNode references' );
this.$reflist = this.$( '<ol class="references"></ol>' );
this.$refmsg = this.$( '<p>' )
.addClass( 've-ce-mwReferencesListNode-muted' );
// Events
this.model.connect( this, { attributeChange: 'onAttributeChange' } );
// Initialization
this.update();
};
/* Inheritance */
OO.inheritClass( ve.ce.MWReferencesListNode, ve.ce.LeafNode );
OO.mixinClass( ve.ce.MWReferencesListNode, ve.ce.FocusableNode );
/* Static Properties */
ve.ce.MWReferencesListNode.static.name = 'mwReferencesList';
ve.ce.MWReferencesListNode.static.tagName = 'div';
ve.ce.MWReferencesListNode.static.primaryCommandName = 'referencesList';
/* Static Methods */
/**
* @inheritdoc
*/
ve.ce.MWReferencesListNode.static.getDescription = function ( model ) {
return model.getAttribute( 'refGroup' );
};
/* Methods */
/**
* Handle setup events.
*
* @method
*/
ve.ce.MWReferencesListNode.prototype.onSetup = function () {
this.internalList = this.model.getDocument().getInternalList();
this.listNode = this.internalList.getListNode();
this.internalList.connect( this, { update: 'onInternalListUpdate' } );
this.listNode.connect( this, { update: 'onListNodeUpdate' } );
// Parent method
ve.ce.LeafNode.prototype.onSetup.call( this );
};
/**
* Handle teardown events.
*
* @method
*/
ve.ce.MWReferencesListNode.prototype.onTeardown = function () {
this.internalList.disconnect( this, { update: 'onInternalListUpdate' } );
this.listNode.disconnect( this, { update: 'onListNodeUpdate' } );
this.internalList = null;
this.listNode = null;
// Parent method
ve.ce.LeafNode.prototype.onTeardown.call( this );
};
/**
* Handle the updating of the InternalList object.
*
* This will occur after a document transaction.
*
* @method
* @param {string[]} groupsChanged A list of groups which have changed in this transaction
*/
ve.ce.MWReferencesListNode.prototype.onInternalListUpdate = function ( groupsChanged ) {
// Only update if this group has been changed
if ( groupsChanged.indexOf( this.model.getAttribute( 'listGroup' ) ) !== -1 ) {
this.update();
}
};
/**
* Rerender when the 'listGroup' attribute changes in the model.
*
* @param {string} key Attribute key
* @param {string} from Old value
* @param {string} to New value
*/
ve.ce.MWReferencesListNode.prototype.onAttributeChange = function ( key ) {
if ( key === 'listGroup' ) {
this.update();
}
};
/**
* Handle the updating of the InternalListNode.
*
* This will occur after changes to any InternalItemNode.
*
* @method
*/
ve.ce.MWReferencesListNode.prototype.onListNodeUpdate = function () {
// When the list node updates we're not sure which list group the item
// belonged to so we always update
// TODO: Only re-render the reference which has been edited
this.update();
};
/**
* Update the references list.
*/
ve.ce.MWReferencesListNode.prototype.update = function () {
var i, j, iLen, jLen, index, firstNode, key, keyedNodes, $li, modelNode, viewNode,
internalList = this.model.getDocument().internalList,
refGroup = this.model.getAttribute( 'refGroup' ),
listGroup = this.model.getAttribute( 'listGroup' ),
nodes = internalList.getNodeGroup( listGroup );
this.$reflist.detach().empty();
this.$refmsg.detach();
if ( !nodes || !nodes.indexOrder.length ) {
if ( refGroup !== '' ) {
this.$refmsg.text( ve.msg( 'visualeditor-referenceslist-isempty', refGroup ) );
} else {
this.$refmsg.text( ve.msg( 'visualeditor-referenceslist-isempty-default' ) );
}
this.$element.append( this.$refmsg );
} else {
for ( i = 0, iLen = nodes.indexOrder.length; i < iLen; i++ ) {
index = nodes.indexOrder[i];
firstNode = nodes.firstNodes[index];
key = internalList.keys[index];
keyedNodes = nodes.keyedNodes[key];
// Exclude references defined inside the references list node
/*jshint loopfunc:true */
keyedNodes = keyedNodes.filter( function ( node ) {
while ( ( node = node.parent ) && node !== null ) {
if ( node instanceof ve.dm.MWReferencesListNode ) {
return false;
}
}
return true;
} );
if ( !keyedNodes.length ) {
continue;
}
$li = this.$( '<li>' );
if ( keyedNodes.length > 1 ) {
for ( j = 0, jLen = keyedNodes.length; j < jLen; j++ ) {
$li.append(
this.$( '<sup>' ).append(
this.$( '<a>' ).text( ( i + 1 ) + '.' + j )
)
).append( ' ' );
}
}
// Generate reference HTML from first item in key
modelNode = internalList.getItemNode( firstNode.getAttribute( 'listIndex' ) );
if ( modelNode && modelNode.length ) {
viewNode = new ve.ce.InternalItemNode( modelNode );
// HACK: PHP parser doesn't wrap single lines in a paragraph
Ultra-mega-hyper-citation editing on crack Objectives: * Allow users on-wiki to create tools and dialogs for citation templates of their choosing * Allow editing of citation templates directly, without having to go through the reference dialog * Provide citation template tools within reference editing that use the same titles and icons as the citation tools do, but don't wrap the inserted content in a ref tag Changes: * Reference list was cloning the DOM element it was inserting into its view before the generated content node could finish rendering, so it never ended up showing the finished rendering in the reference list * Documenting hack about use of reference list node's destroy method, and how we are depending on destroy not canceling generated content rendering * Introduced reference model * Added saving/updating method to transclusion model * Added getPartsList method to dm transclusion node, which caches the result and invalidates the cache on update * Added citation dialog, which extends transclusion dialog * Added cite group to toolbars, cite-template in reference dialog toolbar * Factored out getting the node to edit and saving changes procedures in transclusion dialog so they could be extended in citation dialog * Updated uses of autoAdd as per changes in oojs-ui (Ic353f91) * Renamed MWDialogTool file since there was only one tool in it * Expanded TransclusionDialogTool file out since there is now more logic to it * Switched to using ve.dm.MWReferenceModel instead of plain objects in reference search widget Configuration: If you add to MediaWiki:Visualeditor-cite-tool-definition.json the following code you will magically be presented with a delightful array of citation options: [ { "name": "web", "icon": "ref-cite-web", "template": "Cite web" }, { "name": "book", "icon": "ref-cite-book", "template": "Cite book" }, { "name": "news", "icon": "ref-cite-news", "template": "Cite news" }, { "name": "journal", "icon": "ref-cite-journal", "template": "Cite journal" } ] ...or... [ { "name": "any-name", "icon": "any-ooui-icon", "template": "Any template", "title": "Any title text" } ] The title text is derived either from the title property or from the name property by pre-pending the string 'visualeditor-cite-tool-name-' to generate a message key. Titles for 'web', 'book', 'news' and 'journal' are provided. The icon is a normal oo-ui-icon name, and more icons can be added, as usual, by adding a class called .oo-ui-icon-{icon name} to MediaWiki:Common.css. 'ref-cite-web', 'ref-cite-book', 'ref-cite-news' and 'ref-cite-journal' are provided. The template name is simply the name of the template without its namespace prefix. Depends on Ic353f91 in oojs-ui Bug: 50110 Bug: 50768 Change-Id: Id401d973b8d5fe2faec481cc777c17a24fd19dd4
2014-03-21 18:56:46 +00:00
if (
viewNode.$element.children().length === 1 &&
viewNode.$element.children( 'p' ).length === 1
) {
// unwrap inner
Ultra-mega-hyper-citation editing on crack Objectives: * Allow users on-wiki to create tools and dialogs for citation templates of their choosing * Allow editing of citation templates directly, without having to go through the reference dialog * Provide citation template tools within reference editing that use the same titles and icons as the citation tools do, but don't wrap the inserted content in a ref tag Changes: * Reference list was cloning the DOM element it was inserting into its view before the generated content node could finish rendering, so it never ended up showing the finished rendering in the reference list * Documenting hack about use of reference list node's destroy method, and how we are depending on destroy not canceling generated content rendering * Introduced reference model * Added saving/updating method to transclusion model * Added getPartsList method to dm transclusion node, which caches the result and invalidates the cache on update * Added citation dialog, which extends transclusion dialog * Added cite group to toolbars, cite-template in reference dialog toolbar * Factored out getting the node to edit and saving changes procedures in transclusion dialog so they could be extended in citation dialog * Updated uses of autoAdd as per changes in oojs-ui (Ic353f91) * Renamed MWDialogTool file since there was only one tool in it * Expanded TransclusionDialogTool file out since there is now more logic to it * Switched to using ve.dm.MWReferenceModel instead of plain objects in reference search widget Configuration: If you add to MediaWiki:Visualeditor-cite-tool-definition.json the following code you will magically be presented with a delightful array of citation options: [ { "name": "web", "icon": "ref-cite-web", "template": "Cite web" }, { "name": "book", "icon": "ref-cite-book", "template": "Cite book" }, { "name": "news", "icon": "ref-cite-news", "template": "Cite news" }, { "name": "journal", "icon": "ref-cite-journal", "template": "Cite journal" } ] ...or... [ { "name": "any-name", "icon": "any-ooui-icon", "template": "Any template", "title": "Any title text" } ] The title text is derived either from the title property or from the name property by pre-pending the string 'visualeditor-cite-tool-name-' to generate a message key. Titles for 'web', 'book', 'news' and 'journal' are provided. The icon is a normal oo-ui-icon name, and more icons can be added, as usual, by adding a class called .oo-ui-icon-{icon name} to MediaWiki:Common.css. 'ref-cite-web', 'ref-cite-book', 'ref-cite-news' and 'ref-cite-journal' are provided. The template name is simply the name of the template without its namespace prefix. Depends on Ic353f91 in oojs-ui Bug: 50110 Bug: 50768 Change-Id: Id401d973b8d5fe2faec481cc777c17a24fd19dd4
2014-03-21 18:56:46 +00:00
viewNode.$element.children().replaceWith(
viewNode.$element.children().contents()
);
}
$li.append(
this.$( '<span>' )
.addClass( 'reference-text' )
.append( viewNode.$element )
);
Ultra-mega-hyper-citation editing on crack Objectives: * Allow users on-wiki to create tools and dialogs for citation templates of their choosing * Allow editing of citation templates directly, without having to go through the reference dialog * Provide citation template tools within reference editing that use the same titles and icons as the citation tools do, but don't wrap the inserted content in a ref tag Changes: * Reference list was cloning the DOM element it was inserting into its view before the generated content node could finish rendering, so it never ended up showing the finished rendering in the reference list * Documenting hack about use of reference list node's destroy method, and how we are depending on destroy not canceling generated content rendering * Introduced reference model * Added saving/updating method to transclusion model * Added getPartsList method to dm transclusion node, which caches the result and invalidates the cache on update * Added citation dialog, which extends transclusion dialog * Added cite group to toolbars, cite-template in reference dialog toolbar * Factored out getting the node to edit and saving changes procedures in transclusion dialog so they could be extended in citation dialog * Updated uses of autoAdd as per changes in oojs-ui (Ic353f91) * Renamed MWDialogTool file since there was only one tool in it * Expanded TransclusionDialogTool file out since there is now more logic to it * Switched to using ve.dm.MWReferenceModel instead of plain objects in reference search widget Configuration: If you add to MediaWiki:Visualeditor-cite-tool-definition.json the following code you will magically be presented with a delightful array of citation options: [ { "name": "web", "icon": "ref-cite-web", "template": "Cite web" }, { "name": "book", "icon": "ref-cite-book", "template": "Cite book" }, { "name": "news", "icon": "ref-cite-news", "template": "Cite news" }, { "name": "journal", "icon": "ref-cite-journal", "template": "Cite journal" } ] ...or... [ { "name": "any-name", "icon": "any-ooui-icon", "template": "Any template", "title": "Any title text" } ] The title text is derived either from the title property or from the name property by pre-pending the string 'visualeditor-cite-tool-name-' to generate a message key. Titles for 'web', 'book', 'news' and 'journal' are provided. The icon is a normal oo-ui-icon name, and more icons can be added, as usual, by adding a class called .oo-ui-icon-{icon name} to MediaWiki:Common.css. 'ref-cite-web', 'ref-cite-book', 'ref-cite-news' and 'ref-cite-journal' are provided. The template name is simply the name of the template without its namespace prefix. Depends on Ic353f91 in oojs-ui Bug: 50110 Bug: 50768 Change-Id: Id401d973b8d5fe2faec481cc777c17a24fd19dd4
2014-03-21 18:56:46 +00:00
// HACK: See bug 62682 - We happen to know that destroy doesn't abort async
// rendering for generated content nodes, but we really can't gaurantee that in the
// future - if you are here, debugging, because something isn't rendering properly,
// it's likely that something has changed and these assumptions are no longer valid
viewNode.destroy();
} else {
$li.append(
this.$( '<span>' )
.addClass( 've-ce-mwReferencesListNode-muted' )
.text( ve.msg( 'visualeditor-referenceslist-missingref' ) )
);
}
this.$reflist.append( $li );
}
this.$element.append( this.$reflist );
}
};
/* Registration */
ve.ce.nodeFactory.register( ve.ce.MWReferencesListNode );