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、