jenkins-bot has submitted this change and it was merged.
Change subject: VisualDiffs: Use semantic del/ins tags
......................................................................
VisualDiffs: Use semantic del/ins tags
Bug: T149702
Change-Id: I121c0adaef4d7466d071221e1d5bff8ea0ceecb8
---
M build/modules.json
M demos/ve/desktop.html
M demos/ve/mobile.html
A src/ce/annotations/ve.ce.DeleteAnnotation.js
A src/ce/annotations/ve.ce.InsertAnnotation.js
A src/dm/annotations/ve.dm.DeleteAnnotation.js
A src/dm/annotations/ve.dm.InsertAnnotation.js
M src/ui/elements/ve.ui.DiffElement.js
M src/ui/styles/elements/ve.ui.DiffElement.css
M tests/index.html
M tests/ui/ve.ui.DiffElement.test.js
11 files changed, 183 insertions(+), 13 deletions(-)
Approvals:
Jforrester: Looks good to me, approved
jenkins-bot: Verified
diff --git a/build/modules.json b/build/modules.json
index d50d6ba..b44c6e5 100644
--- a/build/modules.json
+++ b/build/modules.json
@@ -328,8 +328,10 @@
"src/dm/annotations/ve.dm.CodeAnnotation.js",
"src/dm/annotations/ve.dm.DatetimeAnnotation.js",
"src/dm/annotations/ve.dm.DefinitionAnnotation.js",
+ "src/dm/annotations/ve.dm.DeleteAnnotation.js",
"src/dm/annotations/ve.dm.FontAnnotation.js",
"src/dm/annotations/ve.dm.HighlightAnnotation.js",
+ "src/dm/annotations/ve.dm.InsertAnnotation.js",
"src/dm/annotations/ve.dm.ItalicAnnotation.js",
"src/dm/annotations/ve.dm.QuotationAnnotation.js",
"src/dm/annotations/ve.dm.SmallAnnotation.js",
@@ -419,8 +421,10 @@
"src/ce/annotations/ve.ce.CodeSampleAnnotation.js",
"src/ce/annotations/ve.ce.DatetimeAnnotation.js",
"src/ce/annotations/ve.ce.DefinitionAnnotation.js",
+ "src/ce/annotations/ve.ce.DeleteAnnotation.js",
"src/ce/annotations/ve.ce.FontAnnotation.js",
"src/ce/annotations/ve.ce.HighlightAnnotation.js",
+ "src/ce/annotations/ve.ce.InsertAnnotation.js",
"src/ce/annotations/ve.ce.ItalicAnnotation.js",
"src/ce/annotations/ve.ce.QuotationAnnotation.js",
"src/ce/annotations/ve.ce.SmallAnnotation.js",
diff --git a/demos/ve/desktop.html b/demos/ve/desktop.html
index 7b88b5d..65a0865 100644
--- a/demos/ve/desktop.html
+++ b/demos/ve/desktop.html
@@ -275,8 +275,10 @@
<script
src="../../src/dm/annotations/ve.dm.CodeAnnotation.js"></script>
<script
src="../../src/dm/annotations/ve.dm.DatetimeAnnotation.js"></script>
<script
src="../../src/dm/annotations/ve.dm.DefinitionAnnotation.js"></script>
+ <script
src="../../src/dm/annotations/ve.dm.DeleteAnnotation.js"></script>
<script
src="../../src/dm/annotations/ve.dm.FontAnnotation.js"></script>
<script
src="../../src/dm/annotations/ve.dm.HighlightAnnotation.js"></script>
+ <script
src="../../src/dm/annotations/ve.dm.InsertAnnotation.js"></script>
<script
src="../../src/dm/annotations/ve.dm.ItalicAnnotation.js"></script>
<script
src="../../src/dm/annotations/ve.dm.QuotationAnnotation.js"></script>
<script
src="../../src/dm/annotations/ve.dm.SmallAnnotation.js"></script>
@@ -366,8 +368,10 @@
<script
src="../../src/ce/annotations/ve.ce.CodeSampleAnnotation.js"></script>
<script
src="../../src/ce/annotations/ve.ce.DatetimeAnnotation.js"></script>
<script
src="../../src/ce/annotations/ve.ce.DefinitionAnnotation.js"></script>
+ <script
src="../../src/ce/annotations/ve.ce.DeleteAnnotation.js"></script>
<script
src="../../src/ce/annotations/ve.ce.FontAnnotation.js"></script>
<script
src="../../src/ce/annotations/ve.ce.HighlightAnnotation.js"></script>
+ <script
src="../../src/ce/annotations/ve.ce.InsertAnnotation.js"></script>
<script
src="../../src/ce/annotations/ve.ce.ItalicAnnotation.js"></script>
<script
src="../../src/ce/annotations/ve.ce.QuotationAnnotation.js"></script>
<script
src="../../src/ce/annotations/ve.ce.SmallAnnotation.js"></script>
diff --git a/demos/ve/mobile.html b/demos/ve/mobile.html
index 4168a23..3b53217 100644
--- a/demos/ve/mobile.html
+++ b/demos/ve/mobile.html
@@ -273,8 +273,10 @@
<script
src="../../src/dm/annotations/ve.dm.CodeAnnotation.js"></script>
<script
src="../../src/dm/annotations/ve.dm.DatetimeAnnotation.js"></script>
<script
src="../../src/dm/annotations/ve.dm.DefinitionAnnotation.js"></script>
+ <script
src="../../src/dm/annotations/ve.dm.DeleteAnnotation.js"></script>
<script
src="../../src/dm/annotations/ve.dm.FontAnnotation.js"></script>
<script
src="../../src/dm/annotations/ve.dm.HighlightAnnotation.js"></script>
+ <script
src="../../src/dm/annotations/ve.dm.InsertAnnotation.js"></script>
<script
src="../../src/dm/annotations/ve.dm.ItalicAnnotation.js"></script>
<script
src="../../src/dm/annotations/ve.dm.QuotationAnnotation.js"></script>
<script
src="../../src/dm/annotations/ve.dm.SmallAnnotation.js"></script>
@@ -364,8 +366,10 @@
<script
src="../../src/ce/annotations/ve.ce.CodeSampleAnnotation.js"></script>
<script
src="../../src/ce/annotations/ve.ce.DatetimeAnnotation.js"></script>
<script
src="../../src/ce/annotations/ve.ce.DefinitionAnnotation.js"></script>
+ <script
src="../../src/ce/annotations/ve.ce.DeleteAnnotation.js"></script>
<script
src="../../src/ce/annotations/ve.ce.FontAnnotation.js"></script>
<script
src="../../src/ce/annotations/ve.ce.HighlightAnnotation.js"></script>
+ <script
src="../../src/ce/annotations/ve.ce.InsertAnnotation.js"></script>
<script
src="../../src/ce/annotations/ve.ce.ItalicAnnotation.js"></script>
<script
src="../../src/ce/annotations/ve.ce.QuotationAnnotation.js"></script>
<script
src="../../src/ce/annotations/ve.ce.SmallAnnotation.js"></script>
diff --git a/src/ce/annotations/ve.ce.DeleteAnnotation.js
b/src/ce/annotations/ve.ce.DeleteAnnotation.js
new file mode 100644
index 0000000..5aa0839
--- /dev/null
+++ b/src/ce/annotations/ve.ce.DeleteAnnotation.js
@@ -0,0 +1,37 @@
+/*!
+ * VisualEditor ContentEditable DeleteAnnotation class.
+ *
+ * @copyright 2011-2016 VisualEditor Team and others; see
http://ve.mit-license.org
+ */
+
+/**
+ * ContentEditable delete annotation.
+ *
+ * @class
+ * @extends ve.ce.TextStyleAnnotation
+ * @constructor
+ * @param {ve.dm.DeleteAnnotation} model Model to observe
+ * @param {ve.ce.ContentBranchNode} [parentNode] Node rendering this annotation
+ * @param {Object} [config] Configuration options
+ */
+ve.ce.DeleteAnnotation = function VeCeDeleteAnnotation() {
+ // Parent constructor
+ ve.ce.DeleteAnnotation.super.apply( this, arguments );
+
+ // DOM changes
+ this.$element.addClass( 've-ce-deleteAnnotation' );
+};
+
+/* Inheritance */
+
+OO.inheritClass( ve.ce.DeleteAnnotation, ve.ce.TextStyleAnnotation );
+
+/* Static Properties */
+
+ve.ce.DeleteAnnotation.static.name = 'textStyle/delete';
+
+ve.ce.DeleteAnnotation.static.tagName = 'del';
+
+/* Registration */
+
+ve.ce.annotationFactory.register( ve.ce.DeleteAnnotation );
diff --git a/src/ce/annotations/ve.ce.InsertAnnotation.js
b/src/ce/annotations/ve.ce.InsertAnnotation.js
new file mode 100644
index 0000000..f6a6efc
--- /dev/null
+++ b/src/ce/annotations/ve.ce.InsertAnnotation.js
@@ -0,0 +1,37 @@
+/*!
+ * VisualEditor ContentEditable InsertAnnotation class.
+ *
+ * @copyright 2011-2016 VisualEditor Team and others; see
http://ve.mit-license.org
+ */
+
+/**
+ * ContentEditable insert annotation.
+ *
+ * @class
+ * @extends ve.ce.TextStyleAnnotation
+ * @constructor
+ * @param {ve.dm.InsertAnnotation} model Model to observe
+ * @param {ve.ce.ContentBranchNode} [parentNode] Node rendering this annotation
+ * @param {Object} [config] Configuration options
+ */
+ve.ce.InsertAnnotation = function VeCeInsertAnnotation() {
+ // Parent constructor
+ ve.ce.InsertAnnotation.super.apply( this, arguments );
+
+ // DOM changes
+ this.$element.addClass( 've-ce-insertAnnotation' );
+};
+
+/* Inheritance */
+
+OO.inheritClass( ve.ce.InsertAnnotation, ve.ce.TextStyleAnnotation );
+
+/* Static Properties */
+
+ve.ce.InsertAnnotation.static.name = 'textStyle/insert';
+
+ve.ce.InsertAnnotation.static.tagName = 'ins';
+
+/* Registration */
+
+ve.ce.annotationFactory.register( ve.ce.InsertAnnotation );
diff --git a/src/dm/annotations/ve.dm.DeleteAnnotation.js
b/src/dm/annotations/ve.dm.DeleteAnnotation.js
new file mode 100644
index 0000000..a9f2f03
--- /dev/null
+++ b/src/dm/annotations/ve.dm.DeleteAnnotation.js
@@ -0,0 +1,34 @@
+/*!
+ * VisualEditor DataModel DeleteAnnotation class.
+ *
+ * @copyright 2011-2016 VisualEditor Team and others; see
http://ve.mit-license.org
+ */
+
+/**
+ * DataModel delete annotation.
+ *
+ * Represents `<del>` tags.
+ *
+ * @class
+ * @extends ve.dm.TextStyleAnnotation
+ * @constructor
+ * @param {Object} element
+ */
+ve.dm.DeleteAnnotation = function VeDmDeleteAnnotation() {
+ // Parent constructor
+ ve.dm.DeleteAnnotation.super.apply( this, arguments );
+};
+
+/* Inheritance */
+
+OO.inheritClass( ve.dm.DeleteAnnotation, ve.dm.TextStyleAnnotation );
+
+/* Static Properties */
+
+ve.dm.DeleteAnnotation.static.name = 'textStyle/delete';
+
+ve.dm.DeleteAnnotation.static.matchTagNames = [ 'del' ];
+
+/* Registration */
+
+ve.dm.modelRegistry.register( ve.dm.DeleteAnnotation );
diff --git a/src/dm/annotations/ve.dm.InsertAnnotation.js
b/src/dm/annotations/ve.dm.InsertAnnotation.js
new file mode 100644
index 0000000..2caf609
--- /dev/null
+++ b/src/dm/annotations/ve.dm.InsertAnnotation.js
@@ -0,0 +1,34 @@
+/*!
+ * VisualEditor DataModel InsertAnnotation class.
+ *
+ * @copyright 2011-2016 VisualEditor Team and others; see
http://ve.mit-license.org
+ */
+
+/**
+ * DataModel insert annotation.
+ *
+ * Represents `<ins>` tags.
+ *
+ * @class
+ * @extends ve.dm.TextStyleAnnotation
+ * @constructor
+ * @param {Object} element
+ */
+ve.dm.InsertAnnotation = function VeDmInsertAnnotation() {
+ // Parent constructor
+ ve.dm.InsertAnnotation.super.apply( this, arguments );
+};
+
+/* Inheritance */
+
+OO.inheritClass( ve.dm.InsertAnnotation, ve.dm.TextStyleAnnotation );
+
+/* Static Properties */
+
+ve.dm.InsertAnnotation.static.name = 'textStyle/insert';
+
+ve.dm.InsertAnnotation.static.matchTagNames = [ 'ins' ];
+
+/* Registration */
+
+ve.dm.modelRegistry.register( ve.dm.InsertAnnotation );
diff --git a/src/ui/elements/ve.ui.DiffElement.js
b/src/ui/elements/ve.ui.DiffElement.js
index 6e6a9ed..e225d82 100644
--- a/src/ui/elements/ve.ui.DiffElement.js
+++ b/src/ui/elements/ve.ui.DiffElement.js
@@ -454,7 +454,7 @@
* @return {Array} Data with annotations added
*/
ve.ui.DiffElement.prototype.annotateNode = function ( linearDiff ) {
- var i, ilen, range,
+ var i, ilen, range, type, annType,
start = 0, // The starting index for a range for building an
annotation
end, transaction, annotatedLinearDiff,
domElement, domElements, originalDomElementsIndex,
@@ -473,19 +473,27 @@
end = start + linearDiff[ i ][ 1 ].length;
if ( start !== end ) {
range = { start: start, end: end };
- if ( linearDiff[ i ][ 0 ] === 1 || linearDiff[ i ][ 0 ]
=== -1 ) {
- diffClass = this.classPrefix + ( linearDiff[ i
][ 0 ] === 1 ? 'insert' : 'remove' );
- domElement = document.createElement( 'span' );
+ type = linearDiff[ i ][ 0 ];
+ if ( type === 1 || type === -1 ) {
+ diffClass = this.classPrefix + ( type === 1 ?
'insert' : 'remove' );
+ domElement = document.createElement( type === 1
? 'ins' : 'del' );
domElement.setAttribute( 'class', diffClass );
domElements = [ domElement ];
originalDomElementsIndex =
diffDoc.getStore().index(
domElements,
domElements.map( ve.getNodeHtml ).join(
'' )
);
- transaction =
ve.dm.Transaction.newFromAnnotation( diffDoc, range, 'set', new
ve.dm.SpanAnnotation( {
- type: 'textStyle/span',
- originalDomElementsIndex:
originalDomElementsIndex
- } ) );
+ annType = type === 1 ? 'textStyle/insert' :
'textStyle/delete';
+ transaction =
ve.dm.Transaction.newFromAnnotation(
+ diffDoc, range, 'set',
+ ve.dm.annotationFactory.create(
+ annType,
+ {
+ type: annType,
+
originalDomElementsIndex: originalDomElementsIndex
+ }
+ )
+ );
diffDoc.commit( transaction );
}
}
diff --git a/src/ui/styles/elements/ve.ui.DiffElement.css
b/src/ui/styles/elements/ve.ui.DiffElement.css
index e8db7bc..e694e30 100644
--- a/src/ui/styles/elements/ve.ui.DiffElement.css
+++ b/src/ui/styles/elements/ve.ui.DiffElement.css
@@ -5,15 +5,19 @@
* @license The MIT License (MIT); see LICENSE.txt
*/
+.ve-ui-diffElement-insert,
+.ve-ui-diffElement-remove {
+ text-decoration: inherit;
+ border-radius: 0.15em;
+}
+
.ve-ui-diffElement-insert {
background-color: #7fd7c4;
- border-radius: 0.15em;
box-shadow: 0 0 0 0.1em #7fd7c4;
}
.ve-ui-diffElement-remove {
background-color: #e88e89;
- border-radius: 0.15em;
box-shadow: 0 0 0 0.1em #e88e89;
}
diff --git a/tests/index.html b/tests/index.html
index bbc90f8..dd4aff5 100644
--- a/tests/index.html
+++ b/tests/index.html
@@ -197,8 +197,10 @@
<script
src="../src/dm/annotations/ve.dm.CodeAnnotation.js"></script>
<script
src="../src/dm/annotations/ve.dm.DatetimeAnnotation.js"></script>
<script
src="../src/dm/annotations/ve.dm.DefinitionAnnotation.js"></script>
+ <script
src="../src/dm/annotations/ve.dm.DeleteAnnotation.js"></script>
<script
src="../src/dm/annotations/ve.dm.FontAnnotation.js"></script>
<script
src="../src/dm/annotations/ve.dm.HighlightAnnotation.js"></script>
+ <script
src="../src/dm/annotations/ve.dm.InsertAnnotation.js"></script>
<script
src="../src/dm/annotations/ve.dm.ItalicAnnotation.js"></script>
<script
src="../src/dm/annotations/ve.dm.QuotationAnnotation.js"></script>
<script
src="../src/dm/annotations/ve.dm.SmallAnnotation.js"></script>
@@ -287,8 +289,10 @@
<script
src="../src/ce/annotations/ve.ce.CodeSampleAnnotation.js"></script>
<script
src="../src/ce/annotations/ve.ce.DatetimeAnnotation.js"></script>
<script
src="../src/ce/annotations/ve.ce.DefinitionAnnotation.js"></script>
+ <script
src="../src/ce/annotations/ve.ce.DeleteAnnotation.js"></script>
<script
src="../src/ce/annotations/ve.ce.FontAnnotation.js"></script>
<script
src="../src/ce/annotations/ve.ce.HighlightAnnotation.js"></script>
+ <script
src="../src/ce/annotations/ve.ce.InsertAnnotation.js"></script>
<script
src="../src/ce/annotations/ve.ce.ItalicAnnotation.js"></script>
<script
src="../src/ce/annotations/ve.ce.QuotationAnnotation.js"></script>
<script
src="../src/ce/annotations/ve.ce.SmallAnnotation.js"></script>
diff --git a/tests/ui/ve.ui.DiffElement.test.js
b/tests/ui/ve.ui.DiffElement.test.js
index 9dd7c38..8b623b4 100644
--- a/tests/ui/ve.ui.DiffElement.test.js
+++ b/tests/ui/ve.ui.DiffElement.test.js
@@ -20,7 +20,7 @@
'<div
class="ve-ui-diffElement-doc-child-change">' +
'<p>' +
'foo ' +
- '<span
class="ve-ui-diffElement-remove">bar</span> <span
class="ve-ui-diffElement-insert">car</span>' +
+ '<del
class="ve-ui-diffElement-remove">bar</del> <ins
class="ve-ui-diffElement-insert">car</ins>' +
' baz' +
'</p>' +
'</div>'
@@ -33,7 +33,7 @@
'<div
class="ve-ui-diffElement-doc-child-change">' +
'<p>' +
'foo"' +
- '<span
class="ve-ui-diffElement-remove">bar</span><span
class="ve-ui-diffElement-insert">bXr</span>' +
+ '<del
class="ve-ui-diffElement-remove">bar</del><ins
class="ve-ui-diffElement-insert">bXr</ins>' +
'"baz' +
'</p>' +
'</div>'
@@ -46,7 +46,7 @@
'<div
class="ve-ui-diffElement-doc-child-change">' +
'<p>' +
'粵' +
- '<span
class="ve-ui-diffElement-remove">文係</span><span
class="ve-ui-diffElement-insert">文唔係</span>' +
+ '<del
class="ve-ui-diffElement-remove">文係</del><ins
class="ve-ui-diffElement-insert">文唔係</ins>' +
'粵語嘅書面語' +
'</p>' +
'</div>'
--
To view, visit https://gerrit.wikimedia.org/r/323255
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I121c0adaef4d7466d071221e1d5bff8ea0ceecb8
Gerrit-PatchSet: 3
Gerrit-Project: VisualEditor/VisualEditor
Gerrit-Branch: master
Gerrit-Owner: Esanders <esand...@wikimedia.org>
Gerrit-Reviewer: Jforrester <jforres...@wikimedia.org>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
