In order to create new and innovative products, we are working closely with customers to find new ways to work with documents. Mobile devices and sharing platforms change the way how documents are used in business processes. Document collaboration and sharing is one of the major research fields in our development.

Creating documents is an ongoing process and by using software that allows real-time updates and documents to be saved to a central repository in the cloud, different teams can contribute to these documents and work more effectively with ongoing updates.

Text Control provides customizable libraries to integrate document collaboration processes into business applications. Since version X16, MS Word compatible track changes is available as a new feature. TX Text Control enables document collaboration features in applications. Track Changes, also known as redline, or redlining, is a way to keep track of the changes different authors make to a document.

This sample shows how to use the TX Text Control API to visualize tracked changes outside the editor. This could be a useful feature in mobile applications to provide an overview of changes made in a document over a specific period of time.

The following screen video shows this project in action:

Track Changes

In the ASP.NET MVC project, the following model is used to show the tracked changes:

public class TrackedChangeModel
{
public string DocumentName { get; set; }
public DateTime FirstChange { get; set; } = DateTime.MaxValue;
public List<TrackedChange> TrackedChanges { get; set; } = new List<TrackedChange>();
}
public class TrackedChange
{
public string UserName { get; set; }
public DateTime ChangeTime { get; set; }
public string Text { get; set; }
public string HighlightColor { get; set; }
public ChangeKind ChangeKind { get; set; }
public string Image { get; set; }
}
public enum ChangeKind
{
InsertedText = 4096,
DeletedText = 8192
}
view raw data.cs hosted with ❤ by GitHub

For demo purposes, this model is created in the Controller Index method using a ServerTextControl instance that is used to loop through the TXTextControl.TextPartCollection class ╰ TX Text Control .NET for Windows Forms
╰ TXTextControl Namespace
╰ TextPartCollection Class
An instance of the TextPartCollection class contains all text parts in a TX Text Control document. to retrieve all classes of type TXTextControl.TrackedChange class ╰ TX Text Control .NET for Windows Forms
╰ TXTextControl Namespace
╰ TrackedChange Class
A TrackedChange object represents a change made to the document after anyone has revised the document. .

public ActionResult Index()
{
// set document name to dummy document
string sDocumentName = Server.MapPath("~/template.docx");
// create a new TrackedChangeModel
TrackedChangeModel model = new TrackedChangeModel() {
DocumentName = sDocumentName
};
// use a temporary ServerTextControl to retrieve the
// changes and to create the thumbnails
using (ServerTextControl tx = new ServerTextControl())
{
tx.Create();
// load the document
tx.Load(sDocumentName, StreamType.WordprocessingML);
// loop through all text parts including headers and footers
foreach (IFormattedText textPart in tx.TextParts)
{
// loop through all changes
foreach (TXTextControl.TrackedChange trackedChange in textPart.TrackedChanges)
{
if (trackedChange.ChangeTime < model.FirstChange) // get first change time stamp
model.FirstChange = trackedChange.ChangeTime;
// create a new TrachedChange object
Models.TrackedChange tc = new Models.TrackedChange()
{
ChangeTime = trackedChange.ChangeTime,
HighlightColor = ColorTranslator.ToHtml(trackedChange.HighlightColor),
ChangeKind = (Models.ChangeKind)trackedChange.ChangeKind,
Text = trackedChange.Text,
UserName = (trackedChange.UserName == "") ? "Unknown User"
: trackedChange.UserName
};
// highlight the change in the document
trackedChange.ScrollTo();
trackedChange.Select();
textPart.Selection.TextBackColor = Color.Yellow;
// create a thumbnail of the page and the highlighted change
tc.Image = ImageToBase64(
tx.GetPages().GetItem().GetImage(100, Page.PageContent.All)
, ImageFormat.Jpeg);
// add the change to the model
model.TrackedChanges.Add(tc);
}
}
}
return View(model);
}
view raw data.cs hosted with ❤ by GitHub

All information that should be visualized are added to the model and finally an image thumbnail of the specific page is created where the tracked change is highlighted. This document page is rendered in the view next to the document history time line.

When hovering over a time line item, the thumbnail image is replaced with the associated image representation.

Try this demo on your own by downloading the project sources from our GitHub repository.