2

MVC5、CKEditor 自定义文件管理器 API

我的界面运行良好,但是当我单击“图像”按钮选择要插入的图像时,用于文件选择的新窗口会显示在系统的主监视器上(运行 4 个监视器)。因此,如果我使用监视器 3 进行在线编辑,则必须转到主监视器来选择图像会让人分心。最好在我当前窗口的顶部打开新窗口。

我不知道如何解决这个问题。我无法轻松找到 CKEditor 配置设置,而且我不明白如何强制打开视图,或者不在特定位置打开。

这是我调用 CKEditor 的设置脚本:

@Section Scripts
<script src="~/scripts/ckeditor/ckeditor.js"></script>
<script>
    CKEDITOR.replace('Model.UserPost.Body', {
        filebrowserBrowseUrl: '/BlogsAndForums/UserPost/ImageDisplay?AnchorPostID=' + @Model.AnchorPostID, //This line routes to the ImageDisplay method and view.  Needs more configuration
        toolbarGroups: [  // Define the toolbar groups as it is a more accessible solution.
            { "name": "basicstyles", "groups": ["basicstyles"] },
            { "name": "links", "groups": ["links"] },
            { "name": "paragraph", "groups": ["list", "blocks"] },
            { "name": "document", "groups": ["mode"] },
            { "name": "insert", "groups": ["insert"] },
            { "name": "styles", "groups": ["styles"] },
            { "name": "about", "groups": ["about"] }
        ],
        removeButtons: 'Underline,Strike,Subscript,Superscript,Anchor,Styles,Specialchar' // Remove the redundant buttons from toolbar groups defined above.
    });
</script>
@Scripts.Render("~/bundles/jqueryval")
End Section

ImageDisplay 方法(见 filebrowserBrowseUrl: 规范)(1) 显示可供选择的图像列表。(2) 单击图像后,它 (3) 关闭并返回 CKEditor。(4) 图像的 URL 已填充,之后一切正常。

我遇到的唯一问题是 ImageDisplay 视图出现在我的显示器上的位置。

4

1 回答 1

2

这个相关问题解释了如何在右侧桌面(监视器)中打开弹出窗口。这都是关于设置适当的window.open()选项。


现在是困难的部分。理论上它应该是可能的editor.config.fileBrowserWindowFeatures。现实情况是,打开弹出窗口(包装器)的Popup 插件window.open()实施得非常糟糕,以至于它覆盖了您在配置中设置的任何几何图形

它甚至没有为 popup 返回一个新的窗口处理程序

所以基本上你无能为力,除了(这是一个非常非常讨厌的黑客):

var org = window.open;
window.open = function() { 
  var args = Array.prototype.slice.call(arguments, arguments); 
  console.log( args ); 
  args[ 2 ] = args[ 2 ].replace( /height=\d+/g, 'height=100' ); 
  return org.apply( window, args); 
}

我在 CKEditor 错误跟踪器上创建了一个问题。希望它能平滑插件。

于 2016-02-23T09:30:34.160 回答