我试图让 ajaxfilemanager v1.1 与 Tinymce 4.x 一起工作。它在 Tinymce 3.x 上运行良好,但有一些 API 更改破坏了它。在花了一些时间之后,我让它再次工作 - 看看我的答案......
1 回答
...,所以如果你有兴趣,你也可以让它工作。您只需要创建一个 tinymce4 初始化脚本(强制)并复制 tinymce 配置和 CSS(可选)。
第一步 - 在 jscripts/ 中创建新的 javascript
转到ajaxfilemanager/jscripts文件夹并将 for_tinymce.js 复制到for_tinymce4.js然后修补(或修改)它。
这是完整的补丁,所以你可以使用它
--- for_tinymce.js 2010-02-05 15:14:48.000000000 +0100
+++ for_tinymce4.js 2013-10-08 11:44:44.000000000 +0200
@@ -1,5 +1,5 @@
// Some global instances
-var tinymce = null, tinyMCEPopup, tinyMCE;
+var tinymce = null, tinyMCEPopup;
tinyMCEPopup = {
init : function() {
@@ -7,12 +7,11 @@
// Find API
tinymce = w.tinymce;
- tinyMCE = w.tinyMCE;
t.editor = tinymce.EditorManager.activeEditor;
- t.params = t.editor.windowManager.params;
+ t.params = t.editor.windowManager.getParams();
- // Setup local DOM
- t.dom = t.editor.windowManager.createInstance('tinymce.dom.DOMUtils', document);
+ // Setup local DOM (because of IE)
+ t.dom = new tinymce.dom.DOMUtils(document);
t.dom.loadCSS(t.editor.settings.popup_css);
// Setup on init listeners
@@ -25,7 +24,6 @@
t.isWindow = !t.getWindowArg('mce_inline');
t.id = t.getWindowArg('mce_window_id');
- t.editor.windowManager.onOpen.dispatch(t.editor.windowManager, window);
},
getWin : function() {
如果补丁对您不起作用,您可以按照我所做的步骤手动进行更改:
- 在您最喜欢的编辑器(vim、nano、joe、gedit...)中打开 for_tinymce4.js
在第 2 行删除 tinyMCE 声明(没用),但保留 tinymce 和 tinyMCEPopup
var tinymce = null, tinyMCEPopup;
删除第 10 行,其中为 tinyMCE 分配了 w.tinyMCE;
tinyMCE = w.tinyMCE;将第 11 行的 t.params 赋值替换为
t.params = t.editor.windowManager.getParams();
将第 14 行的 t.dom 赋值替换为
t.dom = new tinymce.dom.DOMUtils(document);
删除第 27 行 onOpen 事件被调度的地方,因为在 Tinymce4 中没有这样的事件处理程序
t.editor.windowManager.onOpen.dispatch(t.editor.windowManager, 窗口);
之后,您可以通过将 file_browser_callback 中ajaxfilemanager URL 中查询字符串的编辑器参数从tinymce更改为 tinymce4 从 Tinymce 4.x 初始化ajaxfilemanager。
我有这个
<script type="text/javascript>
tinymce.init({
selector: "textarea.editor",
plugins: [
"advlist autolink lists link image charmap print preview anchor",
"searchreplace visualblocks code fullscreen",
"insertdatetime media table contextmenu paste"
],
toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
file_browser_callback : ajaxfilemanager
});
function ajaxfilemanager(field_name, url, type, win) {
var ajaxfilemanagerurl = "/lib/ajaxfilemanager/ajaxfilemanager.php?editor=tinymce4&config=tinymce4&language=cs";
switch (type) {
case "image":
ajaxfilemanagerurl += "&type=img";
break;
case "media":
ajaxfilemanagerurl += "&type=media";
break;
case "file":
ajaxfilemanagerurl += "&type=files";
break;
default:
return false;
}
tinymce.activeEditor.windowManager.open(
{url : ajaxfilemanagerurl,
title : 'Ajax File Manager',
width : 782,
height : 440 },
{window : win,
input : field_name}
);
return false;
}
</script>
第二步 - 复制配置和 CSS
如果你想为tinymce4使用不同的配置和CSS,你必须复制inc/config.tinymce.php到inc/config.tinymce4.config然后复制theme/default/css/tinymce.css到theme/default/css/ tinymce4.css(或其他主题文件夹,如果使用)并修改它们以满足您的需要。
然后,您可以通过将 file_browser_callback 中 ajaxfilemanager URL 中查询字符串的配置参数设置为tinymce4来引用这些文件。往上看。
如果您不需要不同的配置和 CSS,请将config参数设置为tinymce。
这就是所有人。