Is there a change event? about contenttools HOT 4 CLOSED

Hi @tuhlmann - yes there is an event/notification for the editable content it is documented here under the ContentEdit API.

For your question specifically if you wanted to know whenever the content of the document was changed you could use the following code:

ContentEdit.Root.get().bind('taint', function (element) {
    console.log(element, 'just got changed');
});

Hope that helps and thanks for your interest in CT.

from contenttools.

Thanks for the quick reply- I look into it.

from contenttools.

@anthonyjb I got a simple integration with our app working and see the fired taint event.
From what I see the event carries all the contents of the region as a "Character" array. Is there also a way to see only the changes or would I need to diff it myself?

from contenttools.

You'd need to perform the diff yourself I'm afraid. The array of characters is a HTMLString instance, you can out put either the HTML or text version of the content to perform a diff using:

var htmlVersion = element.content.html();
var textVersion = element.content.text();

You could look to capture focus events, store a snapshot of the elements content and then capture blur events to compare the contents to see if it's changed, as a simplified example you could approach this like so:

var snapshot = null;
ContentEdit.Root.get().bind('focus', function (element) {

    // We only care about elements that support content
    if (element.content === undefined) {
        snapshot = null;
        return;
    }

    // Take a snapshot
    snapshot = element.content.text()
});

ContentEdit.Root.get().bind('blur', function (element) {

    // Check we have a snapshot to compare
    if (snapshot === null) {
        return;
    }

    // Compare the snapshots
    someDiffFunc(snapshot, element.content.text());

    // Clear the snapshot
    snapshot = null;
});

from contenttools.