Esanders has uploaded a new change for review.
https://gerrit.wikimedia.org/r/170043
Change subject: Support editing of caption nodes
......................................................................
Support editing of caption nodes
As ce is set to false on the table (as required by Firefox)
override ce back to try on captions and hide focus styling.
Make sure click events get through by never using preventDefault.
Bonus: refactor out event.target to tableCellNode lookup into
getCellNodeFromTarget.
Change-Id: Ie2e0472b473fd8befbd80fbe70bee51577c39ae7
---
M src/ce/nodes/ve.ce.TableCaptionNode.js
M src/ce/nodes/ve.ce.TableNode.js
M src/ce/styles/nodes/ve.ce.TableNode.css
3 files changed, 50 insertions(+), 18 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/VisualEditor/VisualEditor
refs/changes/43/170043/1
diff --git a/src/ce/nodes/ve.ce.TableCaptionNode.js
b/src/ce/nodes/ve.ce.TableCaptionNode.js
index 036a252..5b65742 100644
--- a/src/ce/nodes/ve.ce.TableCaptionNode.js
+++ b/src/ce/nodes/ve.ce.TableCaptionNode.js
@@ -28,6 +28,21 @@
ve.ce.TableCaptionNode.static.tagName = 'caption';
+/* Methods */
+
+/**
+ * @inheritdoc
+ */
+ve.ce.TableCaptionNode.prototype.onSetup = function () {
+ // Parent method
+ ve.ce.TableCaptionNode.super.prototype.onSetup.call( this );
+
+ // DOM changes
+ this.$element
+ .addClass( 've-ce-tableCaptionNode' )
+ .prop( 'contentEditable', 'true' );
+};
+
/* Registration */
ve.ce.nodeFactory.register( ve.ce.TableCaptionNode );
diff --git a/src/ce/nodes/ve.ce.TableNode.js b/src/ce/nodes/ve.ce.TableNode.js
index aa4bda4..a904fa4 100644
--- a/src/ce/nodes/ve.ce.TableNode.js
+++ b/src/ce/nodes/ve.ce.TableNode.js
@@ -107,9 +107,7 @@
* @param {jQuery.Event} e Double click event
*/
ve.ce.TableNode.prototype.onTableDblClick = function ( e ) {
- var tableNode = $( e.target ).closest( 'table' ).data( 'view' );
- if ( tableNode !== this ) {
- // Nested table, ignore event
+ if ( !this.getCellNodeFromTarget( e.target ) ) {
return;
}
if ( this.surface.getModel().getSelection() instanceof
ve.dm.TableSelection ) {
@@ -123,25 +121,18 @@
* @param {jQuery.Event} e Mouse down or touch start event
*/
ve.ce.TableNode.prototype.onTableMouseDown = function ( e ) {
- var cellNode, startCell, endCell, selection, newSelection, tableNode;
+ var cellNode, startCell, endCell, selection, newSelection;
if ( e.type === 'touchstart' && e.originalEvent.touches.length > 1 ) {
// Ignore multi-touch
return;
}
- tableNode = $( e.target ).closest( 'table' ).data( 'view' );
-
- if ( tableNode !== this ) {
- // Nested table, ignore event
- return;
- }
-
- cellNode = $( e.target ).closest( 'td, th' ).data( 'view' );
+ cellNode = this.getCellNodeFromTarget( e.target );
if ( !cellNode ) {
- e.preventDefault();
return;
}
+
endCell = this.getModel().getMatrix().lookupCell( cellNode.getModel() );
if ( !endCell ) {
e.preventDefault();
@@ -176,12 +167,30 @@
};
/**
+ * Get the table and cell node from an event target
+ *
+ * @param {HTMLElement} target Element target to find nearest cell node to
+ * @return {ve.ce.TableCellNode|null} Table cell node, or null if none found
+ */
+ve.ce.TableNode.prototype.getCellNodeFromTarget = function ( target ) {
+ var $target = $( target ),
+ $table = $target.closest( 'table' );
+
+ // Nested table, ignore
+ if ( !this.$element.is( $table ) ) {
+ return null;
+ }
+
+ return $target.closest( 'td, th' ).data( 'view' );
+};
+
+/**
* Handle mouse/touch move events
*
* @param {jQuery.Event} e Mouse/touch move event
*/
ve.ce.TableNode.prototype.onTableMouseMove = function ( e ) {
- var cell, selection, touch, target, node;
+ var cell, selection, touch, target, cellNode;
// 'touchmove' doesn't give a correct e.target, so calculate it from
coordinates
if ( e.type === 'touchmove' ) {
@@ -195,12 +204,12 @@
target = e.target;
}
- node = $( target ).closest( 'td, th' ).data( 'view' );
- if ( !node ) {
+ cellNode = this.getCellNodeFromTarget( target );
+ if ( !cellNode ) {
return;
}
- cell = this.getModel().matrix.lookupCell( node.getModel() );
+ cell = this.getModel().matrix.lookupCell( cellNode.getModel() );
if ( !cell ) {
return;
}
@@ -278,7 +287,7 @@
var active = (
this.editingFragment !== null &&
selection instanceof ve.dm.LinearSelection &&
- this.getModel().getOuterRange().containsRange(
selection.getRange() )
+
this.editingFragment.getSelection().getRanges()[0].containsRange(
selection.getRange() )
) ||
(
selection instanceof ve.dm.TableSelection &&
diff --git a/src/ce/styles/nodes/ve.ce.TableNode.css
b/src/ce/styles/nodes/ve.ce.TableNode.css
index 2d10e1c..caebbc8 100644
--- a/src/ce/styles/nodes/ve.ce.TableNode.css
+++ b/src/ce/styles/nodes/ve.ce.TableNode.css
@@ -10,6 +10,14 @@
cursor: default;
}
+.ve-ce-tableCaptionNode:focus {
+ outline: none;
+}
+
+.ve-ce-tableCaptionNode {
+ cursor: text;
+}
+
.ve-ce-tableNodeOverlay {
position: absolute;
pointer-events: none;
--
To view, visit https://gerrit.wikimedia.org/r/170043
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: Ie2e0472b473fd8befbd80fbe70bee51577c39ae7
Gerrit-PatchSet: 1
Gerrit-Project: VisualEditor/VisualEditor
Gerrit-Branch: master
Gerrit-Owner: Esanders <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
