Esanders has uploaded a new change for review. https://gerrit.wikimedia.org/r/323255
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 M src/ui/elements/ve.ui.DiffElement.js M src/ui/styles/elements/ve.ui.DiffElement.css M tests/index.html 6 files changed, 38 insertions(+), 10 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/VisualEditor/VisualEditor refs/changes/55/323255/1 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/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> -- To view, visit https://gerrit.wikimedia.org/r/323255 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: I121c0adaef4d7466d071221e1d5bff8ea0ceecb8 Gerrit-PatchSet: 1 Gerrit-Project: VisualEditor/VisualEditor Gerrit-Branch: master Gerrit-Owner: Esanders <esand...@wikimedia.org> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits