ueditor.yoho.js 2.45 KB
UE.registerUI('yohoLink',function(editor,uiName){
    //注册按钮执行时的command命令,使用命令默认就会带有回退操作
    editor.registerCommand(uiName,{
        execCommand:function(value){
            editor.insert(value);
            console.log("exeCommand", uiName, "value", value);
        }
    });


    //创建dialog
    var dialog = new UE.ui.Dialog({
        //指定弹出层中页面的路径,这里只能支持页面,因为跟addCustomizeDialog.js相同目录,所以无需加路径
        iframeUrl: UEDITOR_CONFIG.UEDITOR_HOME_URL + 'dialogs/yohoLink/yohoLink.html',
        //需要指定当前的编辑器实例
        editor:editor,
        //指定dialog的名字
        name:uiName,
        //dialog的标题
        title:"yohoLink",

        //指定dialog的外围样式
        cssRules:"width:525px;height:200px;",

        //如果给出了buttons就代表dialog有确定和取消
        buttons:[
            {
                className:'edui-okbutton',
                label:'确定',
                onclick:function () {
                    editor.execCommand(uiName);
                    dialog.close(true);
                    editor.execCommand(uiName);
                }
            },
            {
                className:'edui-cancelbutton',
                label:'取消',
                onclick:function () {
                    dialog.close(false);
                }
            }
        ]});

    var btn = new UE.ui.Button({
        name:'dialogbutton' + uiName,
        title:'dialogbutton' + uiName,
        //需要添加的额外样式,指定icon图标,这里默认使用一个重复的icon
        cssRules :'background-position: -500px 0;',
        onclick:function () {
            //渲染dialog
            dialog.render();
            dialog.open();
        }
    });

    //当点到编辑内容上时,按钮要做的状态反射
    editor.addListener('selectionchange', function () {
        var start = editor.selection.getStart();
        var text = editor.selection.getText();
        // 选中文字或者图片
        // if (start.tagName == 'IMG' || text.length > 0) {
        //     btn.setDisabled(false);
        // } else {
        //     btn.setDisabled(true);
        // }
    });

    return btn;
}/*index 指定添加到工具栏上的那个位置,默认时追加到最后,editorId 指定这个UI是那个编辑器实例上的,默认是页面上所有的编辑器都会添加这个按钮*/);