adjust layout and menus for wangEditor

static/js/html-editor.js

@@ -342,4 +342,16 @@ $(function () {
             layer.msg("没有需要发布的文档")
         }
     };
+
+    $(window).resize(function(e) {
+      var $container = $(editor.$textContainerElem.elems[0]);
+      var $manual = $container.closest('.manual-wangEditor');
+      var maxHeight = $manual.closest('.manual-editor-container').innerHeight();
+      var statusHeight = $manual.siblings('.manual-editor-status').outerHeight(true);
+      var manualHeihgt = maxHeight - statusHeight;
+      $manual.height(manualHeihgt);
+      var toolbarHeight = $container.siblings('.w-e-toolbar').outerHeight(true);
+      $container.height($container.parent().innerHeight() - toolbarHeight);
+    });
+    $(window).trigger('resize');
 });

static/js/wangEditor-plugins/attach-menu.js

@@ -0,0 +1,42 @@
+(function () {
+
+    // 获取 wangEditor 构造函数和 jquery
+    var E = window.wangEditor;
+    var $ = window.jQuery;
+
+    let AttachMenu = (function (_BtnMenu) {
+      c2b_inherits(AttachMenu, _BtnMenu);
+
+      var _super = c2b_createSuper(AttachMenu);
+
+      function AttachMenu(editor) {
+        c2b_classCallCheck(this, AttachMenu);
+
+        const $elem = E.$(`<div class="w-e-menu" data-title="附件">
+                    <i class="fa fa-paperclip" aria-hidden="true"></i>
+                </div>`);
+        return _super.call(this, $elem, editor);
+      }
+
+      c2b_createClass(AttachMenu, [
+        {
+          key: "clickHandler",
+          value: function clickHandler() {
+            $("#uploadAttachModal").modal("show");
+          }
+        },
+        {
+          key: "tryChangeActive",
+          value: function tryChangeActive() {
+            // this.active();
+          }
+        }
+      ]);
+
+      return AttachMenu;
+    })(E.BtnMenu);
+
+
+    var menuKey = 'attach';
+    E.registerMenu(menuKey, AttachMenu);
+})();

static/js/wangEditor-plugins/history-menu.js

@@ -0,0 +1,42 @@
+(function () {
+
+    // 获取 wangEditor 构造函数和 jquery
+    var E = window.wangEditor;
+    var $ = window.jQuery;
+
+    let HistoryMenu = (function (_BtnMenu) {
+      c2b_inherits(HistoryMenu, _BtnMenu);
+
+      var _super = c2b_createSuper(HistoryMenu);
+
+      function HistoryMenu(editor) {
+        c2b_classCallCheck(this, HistoryMenu);
+
+        const $elem = E.$(`<div class="w-e-menu" data-title="history">
+                    <i class="fa fa-history" aria-hidden="true"></i>
+                </div>`);
+        return _super.call(this, $elem, editor);
+      }
+
+      c2b_createClass(HistoryMenu, [
+        {
+          key: "clickHandler",
+          value: function clickHandler() {
+            window.documentHistory();
+          }
+        },
+        {
+          key: "tryChangeActive",
+          value: function tryChangeActive() {
+            // this.active();
+          }
+        }
+      ]);
+
+      return HistoryMenu;
+    })(E.BtnMenu);
+
+
+    var menuKey = '历史';
+    E.registerMenu(menuKey, HistoryMenu);
+})();

static/js/wangEditor-plugins/release-menu.js

@@ -0,0 +1,42 @@
+(function () {
+
+    // 获取 wangEditor 构造函数和 jquery
+    var E = window.wangEditor;
+    var $ = window.jQuery;
+
+    let ReleaseMenu = (function (_BtnMenu) {
+      c2b_inherits(ReleaseMenu, _BtnMenu);
+
+      var _super = c2b_createSuper(ReleaseMenu);
+
+      function ReleaseMenu(editor) {
+        c2b_classCallCheck(this, ReleaseMenu);
+
+        const $elem = E.$(`<div class="w-e-menu" data-title="发布">
+                    <i class="fa fa-cloud-upload" aria-hidden="true"></i>
+                </div>`);
+        return _super.call(this, $elem, editor);
+      }
+
+      c2b_createClass(ReleaseMenu, [
+        {
+          key: "clickHandler",
+          value: function clickHandler() {
+            window.releaseBook();
+          }
+        },
+        {
+          key: "tryChangeActive",
+          value: function tryChangeActive() {
+            // this.active();
+          }
+        }
+      ]);
+
+      return ReleaseMenu;
+    })(E.BtnMenu);
+
+
+    var menuKey = 'release';
+    E.registerMenu(menuKey, ReleaseMenu);
+})();

static/wangEditor/old/plugins/attach-menu.js

@@ -1,47 +0,0 @@
-(function () {
-
-    // 获取 wangEditor 构造函数和 jquery
-    var E = window.wangEditor;
-    var $ = window.jQuery;
-
-    // 用 createMenu 方法创建菜单
-    E.createMenu(function (check) {
-
-        // 定义菜单id，不要和其他菜单id重复。编辑器自带的所有菜单id，可通过『参数配置-自定义菜单』一节查看
-        var menuId = 'attach';
-
-        // check将检查菜单配置（『参数配置-自定义菜单』一节描述）中是否该菜单id，如果没有，则忽略下面的代码。
-        if (!check(menuId)) {
-            return;
-        }
-
-        // this 指向 editor 对象自身
-        var editor = this;
-
-        // 创建 menu 对象
-        var menu = new E.Menu({
-            editor: editor,  // 编辑器对象
-            id: menuId,  // 菜单id
-            title: '附件', // 菜单标题
-
-            // 正常状态和选中状态下的dom对象，样式需要自定义
-            $domNormal: $('<a href="#" tabindex="-1"><i class="fa fa-paperclip" aria-hidden="true" name="release"></i></a>'),
-            $domSelected: $('<a href="#" tabindex="-1" class="selected"><i class="fa fa-paperclip" aria-hidden="true" name="release"></i></a>')
-        });
-
-
-        // 菜单正常状态下，点击将触发该事件
-        menu.clickEvent = function (e) {
-            $("#uploadAttachModal").modal("show");
-        };
-
-
-        // 菜单选中状态下，点击将触发该事件
-        menu.clickEventSelected = function (e) {
-
-        };
-        // 增加到editor对象中
-        editor.menus[menuId] = menu;
-    });
-
-})();

static/wangEditor/old/plugins/history-menu.js

@@ -1,47 +0,0 @@
-(function () {
-
-    // 获取 wangEditor 构造函数和 jquery
-    var E = window.wangEditor;
-    var $ = window.jQuery;
-
-    // 用 createMenu 方法创建菜单
-    E.createMenu(function (check) {
-
-        // 定义菜单id，不要和其他菜单id重复。编辑器自带的所有菜单id，可通过『参数配置-自定义菜单』一节查看
-        var menuId = 'history';
-
-        // check将检查菜单配置（『参数配置-自定义菜单』一节描述）中是否该菜单id，如果没有，则忽略下面的代码。
-        if (!check(menuId)) {
-            return;
-        }
-
-        // this 指向 editor 对象自身
-        var editor = this;
-
-        // 创建 menu 对象
-        var menu = new E.Menu({
-            editor: editor,  // 编辑器对象
-            id: menuId,  // 菜单id
-            title: '历史', // 菜单标题
-
-            // 正常状态和选中状态下的dom对象，样式需要自定义
-            $domNormal: $('<a href="#" tabindex="-1"><i class="fa fa-history" aria-hidden="true" name="history"></i></a>'),
-            $domSelected: $('<a href="#" tabindex="-1" class="selected"><i class="fa fa-history" aria-hidden="true" name="history"></i></a>')
-        });
-
-        // 菜单正常状态下，点击将触发该事件
-        menu.clickEvent = function (e) {
-            window.documentHistory();
-        };
-
-        // 菜单选中状态下，点击将触发该事件
-        menu.clickEventSelected = function (e) {
-
-        };
-
-
-        // 增加到editor对象中
-        editor.menus[menuId] = menu;
-    });
-
-})();

static/wangEditor/old/plugins/release-menu.js

@@ -1,47 +0,0 @@
-(function () {
-
-    // 获取 wangEditor 构造函数和 jquery
-    var E = window.wangEditor;
-    var $ = window.jQuery;
-
-    // 用 createMenu 方法创建菜单
-    E.createMenu(function (check) {
-
-        // 定义菜单id，不要和其他菜单id重复。编辑器自带的所有菜单id，可通过『参数配置-自定义菜单』一节查看
-        var menuId = 'release';
-
-        // check将检查菜单配置（『参数配置-自定义菜单』一节描述）中是否该菜单id，如果没有，则忽略下面的代码。
-        if (!check(menuId)) {
-            return;
-        }
-
-        // this 指向 editor 对象自身
-        var editor = this;
-
-        // 创建 menu 对象
-        var menu = new E.Menu({
-            editor: editor,  // 编辑器对象
-            id: menuId,  // 菜单id
-            title: '发布', // 菜单标题
-
-            // 正常状态和选中状态下的dom对象，样式需要自定义
-            $domNormal: $('<a href="#" tabindex="-1"><i class="fa fa-cloud-upload" aria-hidden="true" name="release"></i></a>'),
-            $domSelected: $('<a href="#" tabindex="-1" class="selected"><i class="fa fa-cloud-upload" aria-hidden="true" name="release"></i></a>')
-        });
-
-        // 菜单正常状态下，点击将触发该事件
-        menu.clickEvent = function (e) {
-            window.releaseBook();
-        };
-
-        // 菜单选中状态下，点击将触发该事件
-        menu.clickEventSelected = function (e) {
-
-        };
-
-
-        // 增加到editor对象中
-        editor.menus[menuId] = menu;
-    });
-
-})();

views/document/html_edit_template.tpl

@@ -79,6 +79,9 @@
         <div class="manual-category" id="manualCategory" style="top: 0;">
             <div class="manual-nav">
                 <div class="nav-item active"><i class="fa fa-bars" aria-hidden="true"></i> 文档</div>
+                <div class="nav-plus pull-right" data-toggle="tooltip" data-title="返回" data-direction="right">
+                    <a style="color: #999999;" href="{{urlfor "BookController.Dashboard" ":key" .Model.Identify}}" target="_blank"><i class="fa fa-chevron-left" aria-hidden="true"></i></a>
+                </div>
                 <div class="nav-plus pull-right" id="btnAddDocument" data-toggle="tooltip" data-title="创建文档" data-direction="right"><i class="fa fa-plus" aria-hidden="true"></i></div>
                 <div class="clearfix"></div>
             </div>
@@ -91,14 +94,14 @@
                 <div id="htmlEditor" class="manual-editormd-active" style="height: 100%"></div>
             </div>
             <div class="manual-editor-status">
-                <div id="attachInfo" class="item">0 个附件</div>
+                <div id="attachInfo" class="item" style="display: inline-block; padding: 0 3em;">0 个附件</div>
             </div>
         </div>
 
     </div>
 </div>
 <!-- Modal -->
-<div class="modal fade" id="addDocumentModal" tabindex="-1" role="dialog" aria-labelledby="addDocumentModalLabel">
+<div class="modal fade" id="addDocumentModal" tabindex="-1" style="z-index: 10001 !important;" role="dialog" aria-labelledby="addDocumentModalLabel">
     <div class="modal-dialog" role="document">
         <form method="post" action="{{urlfor "DocumentController.Create" ":key" .Model.Identify}}" id="addDocumentForm" class="form-horizontal">
             <input type="hidden" name="identify" value="{{.Model.Identify}}">
@@ -134,7 +137,7 @@
         </form>
     </div>
 </div>
-<div class="modal fade" id="uploadAttachModal" tabindex="-1" role="dialog" aria-labelledby="uploadAttachModalLabel">
+<div class="modal fade" id="uploadAttachModal" tabindex="-1" style="z-index: 10001 !important;" role="dialog" aria-labelledby="uploadAttachModalLabel">
     <div class="modal-dialog" role="document">
         <form method="post" action="{{urlfor "DocumentController.Create" ":key" .Model.Identify}}" id="addDocumentForm" class="form-horizontal">
             <input type="hidden" name="identify" value="{{.Model.Identify}}">
@@ -196,9 +199,9 @@
 <script src="{{cdnjs "/static/js/class2browser.js"}}" type="text/javascript"></script>
 <script src="{{cdnjs "/static/wangEditor/wangEditor.min.js"}}" type="text/javascript"></script>
 <script src="{{cdnjs "/static/js/wangEditor-plugins/save-menu.js"}}" type="text/javascript"></script>
-<!-- <script src="{{cdnjs "/static/wangEditor/old/plugins/release-menu.js"}}" type="text/javascript"></script> -->
+<script src="{{cdnjs "/static/js/wangEditor-plugins/release-menu.js"}}" type="text/javascript"></script>
-<!-- <script src="{{cdnjs "/static/wangEditor/old/plugins/attach-menu.js"}}" type="text/javascript"></script> -->
+<script src="{{cdnjs "/static/js/wangEditor-plugins/attach-menu.js"}}" type="text/javascript"></script>
-<!-- <script src="{{cdnjs "/static/wangEditor/old/plugins/history-menu.js"}}" type="text/javascript"></script> -->
+<script src="{{cdnjs "/static/js/wangEditor-plugins/history-menu.js"}}" type="text/javascript"></script>
 <script src="{{cdnjs "/static/layer/layer.js"}}" type="text/javascript" ></script>
 <script src="{{cdnjs "/static/to-markdown/dist/to-markdown.js"}}" type="text/javascript"></script>
 <script src="{{cdnjs "/static/js/jquery.form.js"}}" type="text/javascript"></script>