How to insert text/symbols from a custom button on textAngular toolbar

妖精的绣舞 提交于 2020-01-13 11:03:58

问题


Essentially I want to add a button to the toolbar to allow the user to insert © into the textangular editor (http://textangular.com/), however I am having trouble understanding how to add functionality to my button after it has been registered... As all the examples for custom functionality on the textangular site use the same statement "wrapSelection" which has very minimal documentation, an example of this is shown below with the quote button.

    taRegisterTool('quote', {
    iconclass: 'fa fa-quote-right',
    tooltiptext: taTranslations.quote.tooltip,
    action: function(){
        return this.$editor().wrapSelection("formatBlock", "<BLOCKQUOTE>");
    },
    activeState: function(){ return this.$editor().queryFormatBlockState('blockquote'); }
});

I am confused as to where the "formatBlock" is initialised and believe finding its source would help me with this problem. As you can see any help would be appreciated

    taRegisterTool('insertCopyright', {
        buttontext: '&copy;',
        tooltiptext: taTranslations.insertCopyright.tooltip,
        action: function () {
            //???
       },
    });

回答1:


Just thought I would post our workaround answer for anyone wishing to insert custom symbols or anything like that, obviously we can move the 'insertTextAtCursor' and 'moveCaret' elsewhere to cleanup but regardless..

    taRegisterTool('insertCopyright', {
            buttontext: '&copy;',
            tooltiptext: taTranslations.insertCopyright.tooltip,
            action: function() {
                function insertTextAtCursor(text) {
                    var sel, range;
                    if (window.getSelection) {
                        sel = window.getSelection();
                        if (sel.getRangeAt && sel.rangeCount) {
                            range = sel.getRangeAt(0);
                            range.deleteContents();
                            range.insertNode(document.createTextNode(text));
                        }
                    } else if (document.selection && document.selection.createRange) {
                        document.selection.createRange().text = text;
                    }
                }

                function moveCaret(charCount) {
                    var sel, range;
                    if (window.getSelection) {
                        sel = window.getSelection();
                        if (sel.rangeCount > 0) {
                            var textNode = sel.focusNode;
                            sel.collapse(textNode.nextSibling, charCount);
                        }
                    } else if ((sel = window.document.selection)) {
                        if (sel.type != "Control") {
                            range = sel.createRange();
                            range.move("character", charCount);
                            range.select();
                        }
                    }
                }

                insertTextAtCursor(String.fromCharCode(169));
                return moveCaret(1);
            },
        });


来源:https://stackoverflow.com/questions/26145428/how-to-insert-text-symbols-from-a-custom-button-on-textangular-toolbar

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!