0

ajaxfilemanager v1.1 を Tinymce 4.x で動作させようとしていました。Tinymce 3.x では正常に動作しましたが、いくつかの API の変更により機能が損なわれました。しばらく時間を費やした後、再び機能するようになりました-私の答えを見てください...

4

1 に答える 1

2

…だから、もし興味があれば、あなたもそれを働かせることができます。tinymce4 init スクリプトを作成し (必須)、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() {

パッチが機能しなかった場合は、私が行った手順に従って手動で変更を加えることができます。

  1. お気に入りのエディター (vim、nano、joe、gedit など) で for_tinymce4.js を開きます。

  2. 2行目でtinyMCE宣言を削除します（役に立たない）が、tinymceとtinyMCEPopupは保持します

    var tinymce = null, tinyMCEPopup;

  3. tinyMCE に w.tinyMCE が割り当てられている 10 行目を削除します。

    tinyMCE = w.tinyMCE;

  4. 11 行目の t.params 割り当てを次のように置き換えます

    t.params = t.editor.windowManager.getParams();

  5. 14 行目の t.dom 割り当てを次のように置き換えます

    t.dom = new tinymce.dom.DOMUtils(document);

  6. Tinymce4 にはそのようなイベント ハンドラがないため、onOpen イベントがディスパッチされる 27 行目を削除します。

    t.editor.windowManager.onOpen.dispatch(t.editor.windowManager, ウィンドウ);

その後、 file_browser_callbackの ajaxfilemanager URL のクエリ文字列のeditorパラメータを 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>

2 番目のステップ - 構成と 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 のクエリ文字列のconfigパラメータを tinymce4 に設定します。上記を参照。

別の構成と CSS が必要ない場合は、構成パラメーターをtinymceに設定します。

それはすべての人々です。

于 2013-10-08T09:55:42.963 に答える