var currentQuads, pageNum = 0;

readerControl.docViewer.on('textSelected', function (e, quads, text) {            
    if (quads && quads.length > 0) {                
        for (var i = 0; i < quads.length; i++)
            currentQuads.push(quads[i]);               
    }
});


//I had added a custom button to create annotation from selected text and I set a click event on it
$("<li>").attr({
    'id': 'annot-button-createFromSelection'
})
.appendTo($("#toolModePicker"))
.click(function () {   
    var points = currentQuads.map(function (quad) {
        return quad.GetPoints();
    });
    createAnnotationFromSelectedText(points);
    currentQuads = [];
})
.append("<img src='Resources/annot/annot_highlight.png'>");



//when I click my custom buttom this function is called to create annotation from text selection
function createAnnotationFromSelectedText(quads) {        
    var docViewer = readerControl.docViewer;
    var annotationManager = docViewer.GetAnnotationManager();
    
    var firstChar = quads[0];
    var lastChar = quads[quads.length - 1];

    // center the selection coordinates to make it more precise
    var firstx = (firstChar.x1 + firstChar.x2) / 2;
    var finalx = (lastChar.x3 + lastChar.x4) / 2;
    var y = (firstChar.y1 + firstChar.y4) / 2;

    // assume that all the characters are aligned vertically
    // select from the top left of the first char to the bottom right of the last char
    var topLeft = { x: firstx, y: y, pageIndex: pageNum };
    var bottomRight = { x: finalx, y: y, pageIndex: pageNum };

    var annot = new Annotations.TextHighlightAnnotation();
    annot.SetPageNumber(pageNum + 1);
    annot.StrokeColor = new Annotations.Color(0, 255, 255);
    annotationManager.AddAnnotation(annot);

    var textHighlightTool = new window.Tools.TextHighlightCreateTool(docViewer);
    textHighlightTool.annotation = annot;
    textHighlightTool.pageCoordinates[0] = topLeft;
    textHighlightTool.select(topLeft, bottomRight);        
}