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、