Javascript 如何在AdobeCQ5的富文本编辑器中创建插件来添加附件或文件？

我需要帮助在AdobeCQ5中为富文本编辑器创建插件，以便将图像、pdf、视频、ppt或任何文件添加到富文本编辑器中

现有可用的rte插件有findreplace、undo、拼写检查、table等

如何创建插件将文件添加到富文本编辑器？ 插件是一个ExtJS文件。如果有人能提出答案，我将不胜感激。这将大有帮助

---

谢谢

我在RTE中添加了一个自定义下拉列表。它用于在从编辑器中选择值时向编辑器添加值。我认为这可能有助于解决您的问题，因为您同样可以创建所需的插件。 请参考方法旁边的注释，以供参考

/**
 * Placeholder Plugin
 */
var keyvalueEnteries = [];
var newText;
var doc;
var range

CUI.rte.plugins.PlaceholderPlugin = new Class({

    toString: "PlaceholderPlugin",

    extend: CUI.rte.plugins.Plugin,

    /**
     * @private
     */
    cachedFormats: null,

    /**
     * @private
     */
    formatUI: null,

    getFeatures: function() {
        return [ "Myparaformat" ];
    },

    /**
     * @private
     * 
     */
    getKeys: function() {
        var com = CUI.rte.Common;
        if (this.cachedFormats == null) {
            this.cachedFormats = this.config.formats || { };
            com.removeJcrData(this.cachedFormats);
            this.cachedFormats = com.toArray(this.cachedFormats, "tag", "description");
        }
        return this.cachedFormats;
    },


    initializeUI: function(tbGenerator) {

        var plg = CUI.rte.plugins;
        var ui = CUI.rte.ui;
        if (this.isFeatureEnabled("placeHolder")) {
            this.formatUI = tbGenerator.createParaFormatter("placeHolder", this,null,this.getKeys());

            tbGenerator.addElement("placeHolder", plg.Plugin.SORT_PARAFORMAT, this.formatUI,
                    10);
        }
    },

    notifyPluginConfig: function(pluginConfig) { //This function gets executed once on load of RTE for the first time

        var url = pluginConfig.sourceURL;

        keyvalueEnteries = CQ.HTTP.eval(url);

        keyvalueEnteries = JSON.stringify(keyvalueEnteries);

        if(keyvalueEnteries == undefined){
            keyvalueEnteries = '[{"key":"","value":"None"}]';
        }

        pluginConfig = pluginConfig || { };
        //creating JSON sttructure
        var placeholderJSON = '{"formats":' + keyvalueEnteries + '}';
        var placeHolderVals = eval('(' + placeholderJSON + ')');

        var defaults = placeHolderVals;
        if (pluginConfig.formats) {
            delete defaults.formats;
        }
        CUI.rte.Utils.applyDefaults(pluginConfig, defaults);
        this.config = pluginConfig;
    },

    execute: function(cmd) { // This function gets executed when there is change in the state of custom plugin/drop down
        if (this.formatUI) {
            var formatId = this.formatUI.getSelectedFormat();
            if (formatId && range != undefined) {
                var placeholderElement = "";
                if(formatId == 'none' && range.collapsed == false){//checks if None is selected in placeholder and the text is selected
                    range.deleteContents();
                }else if(formatId != 'none'){
                    placeholderElement = document.createTextNode(" ${" + formatId + "} ");
                    range.insertNode(placeholderElement); //INSERTS PLACEHOLDER AT CURRENT CARET LOCATION
                    range.setStartAfter(placeholderElement);//INSERTS CURSOR AT THE END OF CURRENT PLACEHOLDER IF PLACEHOLDER IS SELECTED AGAIN
                }
            }
        }
    },

    updateState: function(selDef) { // This function gets executed on click on the editor space in RTE
        doc = selDef.editContext.doc; //GET THE DOCUMENT INSIDE THE IFRAME

        range = doc.getSelection().getRangeAt(0); //GETS CURRENT CARET POSITION
    }

});


//register plugin
CUI.rte.plugins.PluginRegistry.register("placeholder",
        CUI.rte.plugins.PlaceholderPlugin);


CUI.rte.ui.ext.ParaFormatterImpl = new Class({

    toString: "ParaFormatterImpl",

    extend: CUI.rte.ui.TbParaFormatter,


    // Interface implementation ------------------------------------------------------------

    addToToolbar: function(toolbar) {
        var com = CUI.rte.Common;

        this.toolbar = toolbar;
        if (com.ua.isIE) {
            // the regular way doesn't work for IE anymore with Ext 3.1.1, hence working
            // around
            var helperDom = document.createElement("span");
            helperDom.innerHTML = "<select class=\"x-placeholder-select\">"
                + this.createFormatOptions() + "</select>";
            this.formatSelector = CQ.Ext.get(helperDom.childNodes[0]);
        } else {
            this.formatSelector = CQ.Ext.get(CQ.Ext.DomHelper.createDom({
                tag: "select",
                cls: "x-placeholder-select",
                html: this.createFormatOptions()
            }));
        }
        this.initializeSelector();
        toolbar.add(
                CQ.I18n.getMessage("Placeholder"), // Type the name you want to appear in RTE for the custom plugin /drop down
                " ",
                this.formatSelector.dom);
    },

    /**
     * Creates HTML code for rendering the options of the format selector.
     * @return {String} HTML code containing the options of the format selector
     * @private
     */
    createFormatOptions: function() {
        var htmlCode = "";
        if (this.formats) {
            var formatCnt = this.formats.length;
            htmlCode += "<option value='none'>None</option>";
            for (var f = 0; f < formatCnt; f++) {
                var text = this.formats[f].text;
                htmlCode += "<option value=\"" + this.formats[f].value + "\">" + text
                + "</option>";
            }
        }
        return htmlCode;
    },

    createToolbarDef: function() {
        return {
            "xtype": "panel",
            "itemId": this.id,
            "html": "<select class=\"x-placeholder-select\">"
                + this.createFormatOptions() + "</select>",
                "listeners": {
                    "afterrender": function() {
                        var item = this.toolbar.items.get(this.id);
                        if (item && item.body) {
                            this.formatSelector = CQ.Ext.get(item.body.dom.childNodes[0]);
                            this.initializeSelector();
                        }
                    },
                    "scope": this
                }
        };
    },

    initializeSelector: function() {
        this.formatSelector.on('change', function() {
            var format = this.formatSelector.dom.value;
            if (format.length > 0) {
                this.plugin.execute(this.id);
            }
        }, this);
        this.formatSelector.on('focus', function() {
            this.plugin.editorKernel.isTemporaryBlur = true;
        }, this);
        // fix for a Firefox problem that adjusts the combobox' height to the height
        // of the largest entry
        this.formatSelector.setHeight(20);
    },

    getSelectorDom: function() {
        return this.formatSelector.dom;
    },

    getSelectedFormat: function() {
        var format;
        if (this.formatSelector) {
            format = this.formatSelector.dom.value;
            if (format.length > 0) {
                return format;
            }
        } else {
            var item = this.toolbar.items.get(this.id);
            if (item.getValue()) {
                return item;
            }
        }
        return null;
    },

    selectFormat: function(formatToSelect, auxRoot, formatCnt, noFormatCnt) {
        var indexToSelect = -1;
        var selectorDom = this.formatSelector.dom;
        if ((formatToSelect != null) && (formatCnt == 1) && (noFormatCnt == 0)) {
            var options = selectorDom.options;
            for (var optIndex = 0; optIndex < options.length; optIndex++) {
                var optionToCheck = options[optIndex];
                if (optionToCheck.value == formatToSelect) {
                    indexToSelect = optIndex;
                    break;
                }
            }
        }
        selectorDom.disabled = (noFormatCnt > 0) && (auxRoot == null);
        selectorDom.selectedIndex = indexToSelect;
    }

});

/**
*占位符插件
*/
var KeyValueEntries=[]；
var新文本；
var-doc；
var范围
CUI.rte.plugins.PlaceholderPlugin=新类({
toString:“占位符插件”，
扩展：CUI.rte.plugins.Plugin，
/**
*@私人
*/
cachedFormats:null，
/**
*@私人
*/
formatUI:null，
getFeatures:function（）{
返回[“Myparaformat”]；
},
/**
*@私人
* 
*/
getKeys:function（）{
var com=CUI.rte.Common；
if（this.cachedFormats==null）{
this.cachedFormats=this.config.formats | |{}；
com.removeJcrData（this.cachedFormats）；
this.cachedFormats=com.toArray（this.cachedFormats，“tag”，“description”）；
}
返回此.cachedFormats；
},
初始化：函数（tbGenerator）{
var plg=CUI.rte.plugins；
var ui=CUI.rte.ui；
如果（此.isFeatureEnabled（“占位符”））{
this.formatUI=tbGenerator.createParaFormatter（“占位符”，this，null，this.getKeys（））；
tbGenerator.addElement（“占位符”，plg.Plugin.SORT_PARAFORMAT，this.formatUI，
10);
}
},
notifyPluginFig:function（PluginFig）{//此函数在首次加载RTE时执行一次
var url=pluginConfig.sourceURL；
KeyValueEntries=CQ.HTTP.eval（url）；
KeyValueEntries=JSON.stringify（KeyValueEntries）；
如果（KeyValueEntries==未定义）{
KeyValueEntries='[{“键”：“”“值”：“无”}]'；
}
pluginFig=pluginFig | |{}；
//创建JSON结构
变量占位符JSON='{“格式”：'+KeyValueEntries+'}'；
var PLACEHOLDERVAL=eval（“（“+placeholderJSON+”）”）；
var默认值=占位符VAL；
if（插入图格式）{
删除默认格式；
}
CUI.rte.Utils.applyDefaults（pluginFig，默认值）；
this.config=pluginConfig；
},
execute:function（cmd）{//当自定义插件/下拉列表的状态发生更改时，将执行此函数
if（this.formatUI）{
var formatId=this.formatUI.getSelectedFormat（）；
if（formatId&&range！=未定义）{
var占位符元素=”；
if（formatId='none'&&range.collapsed==false）{//检查占位符中是否未选择任何内容，以及文本是否已选择
range.deleteContents（）；
}else if（formatId！=“无”）{
占位符元素=document.createTextNode（“${”+formatId+“}”）；
range.insertNode（占位符元素）；//在当前插入符号位置插入占位符
range.setStartAfter（占位符元素）；//如果再次选择占位符，则在当前占位符的末尾插入光标
}
}
}
},
updateState:function（selDef）{//在RTE中单击编辑器空间时执行此函数
doc=selDef.editContext.doc；//在IFRAME中获取文档
range=doc.getSelection（）.getRangeAt（0）；//获取当前插入符号位置
}
});
//注册插件
CUI.rte.plugins.PluginRegistry.register（“占位符”，
CUI.rte.plugins.PlaceholderPlugin）；
CUI.rte.ui.ext.ParaFormatterImpl=新类({
toString:“ParaFormatterImpl”，
扩展：CUI.rte.ui.TbParaFormatter，
//接口实现------------------------------------------------------------
addToToolbar:功能（工具栏）{
var com=CUI.rte.Common；
this.toolbar=工具栏；
如果（com.ua.isIE）{
//常规方法在Ext 3.1.1中不再适用于IE，因此无法正常工作
//周围
var helperDom=document.createElement（“span”）；
helperDom.innerHTML=“”
+此.createFormatOptions（）+“”；
this.formatSelector=CQ.Ext.get（helperDom.childNodes[0]）；
}否则{
this.formatSelector=CQ.Ext.get（CQ.Ext.DomHelper.createDom({
标签：“选择”，
cls：“x-占位符-选择”，
html:this.createFormatOptions（）
}));
}
这个.initializeSelector（）；
工具栏。添加(
CQ.I18n.getMessage（“占位符”），//键入要在RTE中显示的自定义插件/下拉列表的名称
" ",
这个文件名为.formatSelector.dom）；
},
/**
*创建用于呈现格式选择器选项的HTML代码。
*@return{String}包含格式选择器选项的HTML代码
*@私人
*/
createFormatOptions:function（）{
var htmlCode=“”；
if（this.formats）{
var formatCnt=this.formats.length；
htmlCode+=“无”；
对于（var f=0；f