Question

I am just wondering if there is a simple solution already to the problem of turning selected content in tinymce to upperCase letters.

Anyone got a solution?

PS: The upperCase-function is known, but won’t solve the tinymce setting of selected content alone.

Answer 1

This is what i came up with after some fiddling

        // check if a node intersects the given range
        rangeIntersectsNode: function (range, node) {
            var nodeRange;
            if (range.intersectsNode) {
                return range.intersectsNode(node);
            }
            else {
                nodeRange = node.ownerDocument.createRange();
                try {
                    nodeRange.selectNode(node);
                } catch (e) {
                    nodeRange.selectNodeContents(node);
                }

                return range.compareBoundaryPoints(Range.END_TO_START, nodeRange) == -1 &&
                    range.compareBoundaryPoints(Range.START_TO_END, nodeRange) == 1;
            }
        },


// Tinymce-Shortcut:  (cmd/ctrl + shift +a)
if ( ( (mac && evt.metaKey)|| (!mac && evt.ctrlKey)) && evt.shiftKey && evt.keyCode == 65 ){

    if (!ed.selection.isCollapsed()) {

        var selection   = ed.getWin().getSelection();   // user selection
        var range       = selection.getRangeAt(0);      // erste range
        var start       = range.startContainer;
        var start_offset = range.startOffset;
        var end         = range.endContainer;
        var end_offset  = range.endOffset;

        // Get all textnodes of the common ancestor
        // Check foreach of those textnodes if they are inside the selection
        // StartContainer and EndContainer may be partially inside the selection (if textnodes)
        // concatenate those textnode parts and make toUppercase the selected part only
        // all textnodes inbetween need to become upperCased (the nodeContents)
        // Selection needs to be reset afterwards.
        var textnodes = t.getTextNodes(range.commonAncestorContainer);
        for (var i=0; i<textnodes.length; i++) {
            if (t.rangeIntersectsNode(range, textnodes[i])){
                if (textnodes[i] == start && textnodes[i] == end) {
                    var text_content = start.textContent;
                    text_content = start.textContent.substring(0, start_offset) + text_content.substring(start_offset, end_offset).toUpperCase() + end.textContent.substring(end_offset);
                    textnodes[i].nodeValue = text_content;
                }
                else if (textnodes[i] == start){
                    var text_content = start.textContent.substring(0, start_offset) + start.textContent.substring(start_offset).toUpperCase();
                    textnodes[i].nodeValue = text_content;

                }
                else if (textnodes[i] == end){
                    var text_content = end.textContent.substring(0, end_offset).toUpperCase() + end.textContent.substring(end_offset);
                    textnodes[i].nodeValue = text_content;
                }
                else {
                    // Textnodes between Start- and Endcontainer
                    textnodes[i].nodeValue = textnodes[i].nodeValue.toUpperCase();
                }
            }
        }

        // reset selection
        var r = ed.selection.dom.createRng();
        r.setStart(start, start_offset);
        r.setEnd(end, end_offset);
        ed.selection.setRng(r);

        evt.preventDefault();
        return false;
    }
}