mediawiki-extensions-Visual.../modules/ve-mw/ce/nodes/ve.ce.MWEntityNode.js
Bartosz Dziewoński d65fe812f5 Show non-breaking spaces in the editor
MWEntityNode representing   is now displayed with a light
grey background and has a tooltip explaining that this is a
non-breaking space and not a random grey blotch.

This is not done for TextNode (in core VisualEditor), as that doesn't
actually work: Parsoid converts all   in input to regular spaces.

It's still not easily possible to insert a non-breaking space.

Bug: T96666
Change-Id: Icbdf7cc3e5d675b199d08777a3439dc5dedceac1
2021-01-28 19:09:29 +00:00

73 lines
1.7 KiB
JavaScript

/*!
* VisualEditor ContentEditable MWEntityNode class.
*
* @copyright 2011-2020 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
/**
* ContentEditable MediaWiki entity node.
*
* @class
* @extends ve.ce.LeafNode
* @constructor
* @param {ve.dm.MWEntityNode} model Model to observe
* @param {Object} [config] Configuration options
*/
ve.ce.MWEntityNode = function VeCeMWEntityNode() {
// Parent constructor
ve.ce.MWEntityNode.super.apply( this, arguments );
// DOM changes
this.$element.addClass( 've-ce-mwEntityNode' );
// Need CE=false to prevent selection issues
this.$element.prop( 'contentEditable', 'false' );
// Events
this.model.connect( this, { update: 'onUpdate' } );
// Initialization
this.onUpdate();
};
/* Inheritance */
OO.inheritClass( ve.ce.MWEntityNode, ve.ce.LeafNode );
/* Static Properties */
ve.ce.MWEntityNode.static.name = 'mwEntity';
/* Methods */
/**
* Handle model update events.
*/
ve.ce.MWEntityNode.prototype.onUpdate = function () {
var
chr = this.model.getAttribute( 'character' ),
whitespaceHtmlChars = ve.visibleWhitespaceCharacters,
significantWhitespace = this.getModel().getParent().hasSignificantWhitespace();
if ( chr === '\u00a0' ) {
//   non-breaking space
this.$element
.addClass( 've-ce-mwEntityNode-nbsp' )
.attr( 'title', mw.msg( 'visualeditor-tooltip-non-breaking-space' ) );
} else {
this.$element
.removeClass( 've-ce-mwEntityNode-nbsp' )
.removeAttr( 'title' );
}
if ( !significantWhitespace && Object.prototype.hasOwnProperty.call( whitespaceHtmlChars, chr ) ) {
chr = whitespaceHtmlChars[ chr ];
}
this.$element.text( chr );
};
/* Registration */
ve.ce.nodeFactory.register( ve.ce.MWEntityNode );