SwellRT / swellrt

SwellRT main project. Server, JavaScript and Java clients
http://swellrt.org/
Apache License 2.0
234 stars 34 forks source link

Editor customisation question #235

Closed emcodemall closed 6 years ago

emcodemall commented 6 years ago

Hey there, thanks for this great project! I was able to compile swell and run the demos, no problem. Now i would like to prevent the editor colorful marking and striknig text that has changed by another user. As far as i understand, the procedure for this is to return null from the corresponding annotations events, correct?

I added this lines before the swell.Editor.createWithId in the textpad-demo html but it does not fire.

swell.Editor.AnnotationRegistry .define("mark","mark");

swell.Editor.AnnotationRegistry .setHandler("mark", (event) => {

  console.log("annotation event ["+event.type+"] "+event.annotation.key+"="+event.annotation.value+", "+event.annotation.range.start+":"+event.annotation.range.end);

}); 

What could i possibly do wrong?

pablojan commented 6 years ago

Hi, thanks!

In that version of swell you can't control manually the annotations rendering diffs. So in order to turn on/off them you must call methods showDiffHighlight()' andhideDiffHighlight()` on the text node itself.

emcodemall commented 6 years ago

Thanks for the quick answer pablo. to give something back to the opensource community, here my fix. i was able to apply your suggestion by using this javascript code. The problem is that i could not figure out how to select the "text node itself" so i just walk through all childs of a div of the page. call this function after the editor was attached to a dom object.

  function disableEditorAnnotations(){
    //workaround missing api option to be in control of marked or striked trough text when someone else edits it
    var objs = []; // we'll store the object references in this array
    function walkTheObject( obj ) {
        var keys = Object.keys( obj ); // get all own property names of the object
        var counter = 0;
        keys.forEach( function ( key ) {
            var value = obj[ key ]; // get property value
            counter++
            // if the property value is an object...
            if ( value && typeof value === 'object' ) { 

                // if we don't have this reference...
                if ( objs.indexOf( value ) < 0 ) {
                    objs.push( value );
                    //objs.push( value ); // store the reference
                    walkTheObject( value ); // traverse all its own properties
                } 

            }
        });
    }

    walkTheObject(document.getElementsByTagName("div"));

    for (i=0; i<objs.length;i++){
        try {
            //console.log(objs[i])
            if (objs[i].stopShowDiffs){
                objs[i].stopShowDiffs();
            }
        }
        catch(err) {
           //console.log(err);
        }
    }

  }
emcodemall commented 6 years ago

stopShowDiffs is only available in the dev build. also i still did not get out what you mean by "the text node". Any clue would be very welcome!