mediawiki-extensions-Visual.../modules/ve-mw/ui/widgets/ve.ui.MWTocItemWidget.js
Rob Moen eba7d58dd1 Table of contents widget
TOC Widget is created in the mw target view class.
Adding and removing a heading rebuilds the TOC Widget based
on the the order of the page heading nodes.

TOC Widget considers TOC page settings and displays in the default manor
unless forced or disabled.

TOC Widget still needs to be finalized by being placed in the surface.
This could be a problem until we have a CE node for it to live in or
have some DM work added.  Roan and I have discussed how to go forward.

To enable the widget you must add the following to LocalSettings.php:
$wgVisualEditorEnableTocWidget = true;

Change-Id: I488cfbbdb060e50d81f51e0f757e67d0114b8936
2014-03-14 15:20:19 -07:00

89 lines
2.3 KiB
JavaScript

/*!
* VisualEditor UserInterface MWTocItemWidget class.
*
* @copyright 2011-2014 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
/**
* Creates an item an item for the MWTocWidget
*
* @class
* @extends OO.ui.Widget
* @mixins OO.ui.GroupElement
*
* @constructor
* @param {Object} config TOC Item configuration
* @cfg {ve.ce.Node} node ContentEditable node
* @cfg {ve.ui.MWTocItemWidget} parent Parent toc item
* @cfg {string} sectionPrefix TOC item section number
* @cfg {number} tocLevel Depth level of the TOC item
* @cfg {number} tocIndex Running count of TOC items
*
*/
ve.ui.MWTocItemWidget = function VeCeMWTocItemWidget ( config ) {
// Parent constructor
OO.ui.Widget.call( this, config );
// Mixin Constructor
OO.ui.GroupElement.call( this, this.$( '<ul>' ), config );
config = config || {};
// Properties
this.node = config.node || null;
this.parent = config.parent;
this.sectionPrefix = config.sectionPrefix;
this.tocLevel = config.tocLevel;
this.tocIndex = config.tocIndex;
// Allows toc items to be optionally associated to a node.
// For the case of the zero level parent item.
if ( this.node ) {
this.$tocNumber = this.$( '<span>' ).addClass( 'tocnumber' )
.text( this.sectionPrefix );
this.$tocText = this.$( '<span>' ).addClass( 'toctext' )
.text( this.node.$element.text() );
this.$element
.addClass( 'toclevel-' + this.tocLevel )
.addClass( 'tocsection-' + this.tocIndex )
.append( this.$( '<a>' ).append( this.$tocNumber, this.$tocText ) );
// Monitor node events
this.node.model.connect( this, { 'update': 'onUpdate' } );
}
this.$element.append( this.$group );
};
/* Inheritance */
OO.inheritClass( ve.ui.MWTocItemWidget, OO.ui.Widget );
OO.mixinClass( ve.ui.MWTocItemWidget, OO.ui.GroupElement );
/* Static Properties */
ve.ui.MWTocItemWidget.static.tagName = 'li';
/* Methods */
/**
* Updates the text of the toc item
*
*/
ve.ui.MWTocItemWidget.prototype.onUpdate = function () {
// Timeout needed to let the dom element actually update
setTimeout( ve.bind( function () {
this.$tocText.text( this.node.$element.text() );
}, this ), 0 );
};
/**
* Removes this toc item from its parent
*
*/
ve.ui.MWTocItemWidget.prototype.remove = function () {
this.node.model.disconnect( this );
this.parent.removeItems( [this] );
};