tinymce原装插件源码分析（三）-code

code:

用于显示源码。主要包含一个弹框、设置显示内容以及内容的更新。

function showDialog() {
        var win = editor.windowManager.open({
            title: "Source code",
            body: {
                type: 'textbox',
                name: 'code',
                multiline: true,
                minWidth: editor.getParam("code_dialog_width", 600),
                minHeight: editor.getParam("code_dialog_height", Math.min(tinymce.DOM.getViewPort().h - 200, 500)),
                spellcheck: false,
                style: 'direction: ltr; text-align: left'
            },
            onSubmit: function(e) {
                // We get a lovely "Wrong document" error in IE 11 if we
                // don't move the focus to the editor before creating an undo
                // transation since it tries to make a bookmark for the current selection
                editor.focus();

                editor.undoManager.transact(function() {  //uodo管理
                    editor.setContent(e.data.code); 
                });

                editor.selection.setCursorLocation(); //设置游标位置
                editor.nodeChanged();  // Dispatches out a onNodeChange event to all observers. This method should be called when you need to update the UI states or element path etc.
            }
        });

        // Gecko has a major performance issue with textarea
        // contents so we need to set it when all reflows are done
        win.find('#code').value(editor.getContent({source_view: true}));//在窗口外设置窗口内的字段内容。其实里面的参数可写可不写，默认是html格式，见L32486
    }

 代码比较简短，主要的函数调用，都是‘系统’函数的调用。

关于uodo的transact:

就是说，把dom改变的操作，放到callback中去执行以下，然后，uodo管理器会记录这个改变，并压入堆中。

涉及的核心函数：

editor.getContent  （L32482, 核心的操作是L32497的body.innerHTML）、editor.setContent、editor.undoManager.transact、