wikimedia/mediawiki-extensions-VisualEditor
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor synced 2024-09-25 03:08:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added support for displaying inline images.

Browse source 
Change-Id: Ieecbca8ed864585e8eaa99598d4bfdb5ac9bfec7
This commit is contained in:
Inez Korczyński 2013-03-27 15:56:54 -07:00
parent e47ed7309b
commit 21e4fdc014
7 changed files with 133 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
VisualEditor.php
View file

@ -265,6 +265,7 @@ $wgResourceModules += array(
've/dm/nodes/ve.dm.MWEntityNode.js',
've/dm/nodes/ve.dm.MWHeadingNode.js',
've/dm/nodes/ve.dm.MWPreformattedNode.js',
've/dm/nodes/ve.dm.MWImageNode.js',
've/dm/annotations/ve.dm.LinkAnnotation.js',
've/dm/annotations/ve.dm.MWExternalLinkAnnotation.js',
@ -310,6 +311,7 @@ $wgResourceModules += array(
've/ce/nodes/ve.ce.MWEntityNode.js',
've/ce/nodes/ve.ce.MWHeadingNode.js',
've/ce/nodes/ve.ce.MWPreformattedNode.js',
've/ce/nodes/ve.ce.MWImageNode.js',
// ui
've/ui/ve.ui.js',

2
demos/ve/index.php
View file

@ -154,6 +154,7 @@ $html = file_get_contents( $page );
<script src="../../modules/ve/dm/nodes/ve.dm.MWEntityNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.MWHeadingNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.MWPreformattedNode.js"></script>
<script src="../../modules/ve/dm/nodes/ve.dm.MWImageNode.js"></script>
<script src="../../modules/ve/dm/annotations/ve.dm.LinkAnnotation.js"></script>
<script src="../../modules/ve/dm/annotations/ve.dm.MWExternalLinkAnnotation.js"></script>
<script src="../../modules/ve/dm/annotations/ve.dm.MWInternalLinkAnnotation.js"></script>
@ -194,6 +195,7 @@ $html = file_get_contents( $page );
<script src="../../modules/ve/ce/nodes/ve.ce.MWEntityNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.MWHeadingNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.MWPreformattedNode.js"></script>
<script src="../../modules/ve/ce/nodes/ve.ce.MWImageNode.js"></script>
<script src="../../modules/ve/ui/ve.ui.js"></script>
<script src="../../modules/ve/ui/ve.ui.Context.js"></script>
<script src="../../modules/ve/ui/ve.ui.Frame.js"></script>

1
demos/ve/pages/image.html Normal file
View file

@ -0,0 +1 @@
<p>This is an image: <a rel="mw:Image" href="./File:Foo.jpg"><img alt="Wiki.png" src="//upload.wikimedia.org/wikipedia/en/b/bc/Wiki.png" width="135" height="155"></a>!!!</p>

79
modules/ve/ce/nodes/ve.ce.MWImageNode.js Normal file
View file

@ -0,0 +1,79 @@
/*!
* VisualEditor ContentEditable MWEntityNode class.
*
* @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
/**
* ContentEditable MediaWiki image node.
*
* @class
* @extends ve.ce.LeafNode
* @constructor
* @param {ve.dm.MWImageNode} model Model to observe
*/
ve.ce.MWImageNode = function VeCeMWImageNode( model ) {
// Parent constructor
ve.ce.LeafNode.call( this, model, $( '<a>' ) );
// DOM Changes
this.$.addClass( 've-ce-MWImageNode' );
this.$.attr( 'contenteditable', false );
this.$img = $( '<img>' ).appendTo( this.$ );
this.$img.attr( {
'width': this.model.getAttribute( 'width' ),
'height': this.model.getAttribute( 'height' ),
'src': this.model.getAttribute( 'src' )
} );
// Events
this.model.addListenerMethod( this, 'update', 'onUpdate' );
this.$.on( {
'click': ve.bind( this.onClick, this ),
'dragstart': ve.bind( this.onDragstart, this )
} );
// Initialization
this.onUpdate();
};
/* Inheritance */
ve.inheritClass( ve.ce.MWImageNode, ve.ce.LeafNode );
/* Static Properties */
ve.ce.MWImageNode.static.name = 'MWimage';
/* Methods */
ve.ce.MWImageNode.prototype.onUpdate = function () {
// ...
};
/**
* Handle the mouse click.
*
* @method
* @param {jQuery.Event} e Click event
*/
ve.ce.MWImageNode.prototype.onClick = function ( e ) {
e.preventDefault();
return false;
};
/**
* Handle the dragstart.
*
* @method
* @param {jQuery.Event} e Dragstart event
*/
ve.ce.MWImageNode.prototype.onDragstart = function ( e ) {
e.preventDefault();
return false;
};
/* Registration */
ve.ce.nodeFactory.register( ve.ce.MWImageNode );

2
modules/ve/ce/ve.ce.Surface.js
View file

@ -53,7 +53,7 @@ ve.ce.Surface = function VeCeSurface( $container, model, surface ) {
'cut': ve.bind( this.onCut, this ),
'copy': ve.bind( this.onCopy, this ),
'paste': ve.bind( this.onPaste, this ),
'dragover drop': ve.bind( this.onDragoverDrop, this )
'dragover drop': ve.bind( this.onDocumentDragoverDrop, this )
} );
if ( $.browser.msie ) {
this.$.on( 'beforepaste', ve.bind( this.onPaste, this ) );

46
modules/ve/dm/nodes/ve.dm.MWImageNode.js Normal file
View file

@ -0,0 +1,46 @@
/*!
* VisualEditor DataModel MWEntityNode class.
*
* @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
/**
* DataModel MediaWiki image node.
*
* @class
* @extends ve.dm.LeafNode
* @constructor
* @param {number} [length] Length of content data in document
* @param {Object} [element] Reference to element in linear model
*/
ve.dm.MWImageNode = function VeDmMWImageNode( length, element ) {
ve.dm.LeafNode.call( this, 0, element );
};
/* Inheritance */
ve.inheritClass( ve.dm.MWImageNode, ve.dm.LeafNode );
/* Static Properties */
ve.dm.MWImageNode.static.name = 'MWimage';
ve.dm.MWImageNode.static.isContent = true;
ve.dm.MWImageNode.static.matchRdfaTypes = [ 'mw:Image' ];
ve.dm.MWImageNode.static.toDataElement = function ( domElements ) {
return {
'type': 'MWimage',
'attributes': {
'src': domElements[0].childNodes[0].src,
'width': domElements[0].childNodes[0].width,
'height': domElements[0].childNodes[0].height
}
};
};
/* Registration */
ve.dm.modelRegistry.register( ve.dm.MWImageNode );

2
modules/ve/test/index.php
View file

@ -99,6 +99,7 @@
<script src="../../ve/dm/nodes/ve.dm.MWEntityNode.js"></script>
<script src="../../ve/dm/nodes/ve.dm.MWHeadingNode.js"></script>
<script src="../../ve/dm/nodes/ve.dm.MWPreformattedNode.js"></script>
<script src="../../ve/dm/nodes/ve.dm.MWImageNode.js"></script>
<script src="../../ve/dm/annotations/ve.dm.LinkAnnotation.js"></script>
<script src="../../ve/dm/annotations/ve.dm.MWExternalLinkAnnotation.js"></script>
<script src="../../ve/dm/annotations/ve.dm.MWInternalLinkAnnotation.js"></script>
@ -139,6 +140,7 @@
<script src="../../ve/ce/nodes/ve.ce.MWEntityNode.js"></script>
<script src="../../ve/ce/nodes/ve.ce.MWHeadingNode.js"></script>
<script src="../../ve/ce/nodes/ve.ce.MWPreformattedNode.js"></script>
<script src="../../ve/ce/nodes/ve.ce.MWImageNode.js"></script>
<script src="../../ve/ui/ve.ui.js"></script>
<script src="../../ve/ui/ve.ui.Context.js"></script>
<script src="../../ve/ui/ve.ui.Frame.js"></script>