15

VisualEditor ツールバーの特別なページへのカスタム リンクを挿入しようとしています。下の画像を参照してください。

リンク位置 画像を見る

私はたくさんグーグルで検索しましたが、成功しませんでした。誰か道を教えてください...

4

2 に答える 2

5

私の答えは、次のリソースに基づいています。

また、私が知る限り、VE のツールバーにツールを追加する方法が文書化されていないことは確かです。すでに追加されているグループにツールを追加することは可能ですが、主にSyntaxhighlight_GeSHiのように「挿入」ツール グループに使用されます)。おそらく、これを行うためのはるかに簡単または「より良い」方法があります:)

まず、VisualEditor は、VE の主要部分がロードされるとき (ほとんどの場合、[編集] ボタンをクリックしたとき) に、追加のモジュール (プラグインと呼ばれる) をロードする方法を提供します。モジュールは、グローバル変数$wgVisualEditorPluginModules(または新しい拡張登録を使用している場合は、extension.json の同等のもの) を介して登録する必要があります。拡張登録ファイルで、モジュールを初期化し (ツールを追加するために必要なスクリプト ファイルを使用)、VE プラグインとして追加する必要があります。

PHP の例 (PHP ファイルによる古い拡張機能の登録):

// other setup...
$wgResourceModules['ext.extName.visualeditor'] = array(
    'localBasePath' => __DIR__,
    'remoteExtPath' => 'extName'
    'dependencies' => array(
        'ext.visualEditor.mwcore',
    ),
    'scripts' => array(
        'javascripts/ve.ui.ExtNameTool.js',
    ),
    'messages' => array(
        'extname-ve-toolname',
    ),
);
$wgVisualEditorPluginModules[] = 'ext.extName.visualeditor';
// other setup...

extension.json (新しい JSON ベースの拡張登録):

// other setup...
"ResourceModules": {
    "ext.geshi.visualEditor": {
        "scripts": [
            "javascripts/ve.ui.ExtNameTool.js"
        ],
        "dependencies": [
            "ext.visualEditor.mwcore"
        ],
        "messages": [
            "extname-ve-toolname"
        ]
   }
},
"VisualEditorPluginModules": [
    "ext.extName.visualeditor"
],
// other setup...

ここで、VE が起動するとext.extName.visualeditor、この例で名前が付けられたモジュールが script でロードされますve.ui.ExtNameTool.js。このスクリプトでは、やりたいことが何でもできるようになりました。例として、ツールバーのツールグループ リストの最後に新しいモジュールを追加する方法を次に示します。

ve.ui.ExtNameTool.js の例:

( function () {
    // create a new class, which will inherit ve.ui.Tool,
    // which represents one tool
    ve.ui.extNameTool = function extNameTool( toolGroup, config ) {
        // parent constructor
        ve.ui.extNameTool.super.apply( this, arguments );
        // the tool should be enabled by default, enable it
        this.setDisabled( false );
    }
    // inherit ve.ui.Tool
    OO.inheritClass( ve.ui.extNameTool, ve.ui.Tool );
    // every tool needs at least a name, or an icon
    // (with the static property icon)
    ve.ui.extNameTool.static.name = 'extname';
    // don't add the tool to a named group automatically
    ve.ui.extNameTool.static.autoAddToGroup = false;
    // prevent this tool to be added to a catch-all group (*),
    although this tool isn't added to a group
    ve.ui.extNameTool.static.autoAddToCatchall = false;
    // the title of the group (it's a message key,
    // which should be added to the extensions i18n
    // en.json file to be translateable)
    // can be a string, too
    ve.ui.extNameTool.static.title =
        OO.ui.deferMsg( 'extname-ve-toolname' );
    // onSelect is the handler for a click on the tool
    ve.ui.extNameTool.prototype.onSelect = function () {
        // show an alert box only, but you can do anything
        alert( 'Hello' );
        this.setActive( false );
    }
    // needs to be overwritten, but does nothing so far
    ve.ui.extNameTool.prototype.onUpdateState = function () {
    ve.ui.extNameTool.super.prototype.onUpdateState.apply( this, arguments );
    }
    // the tool needs to be registered to the toolFactory
    // of the toolbar to be reachable with the given name
    ve.ui.toolFactory.register( ve.ui.extNameTool );
    // add this tool to the toolbar
    ve.init.mw.Target.static.toolbarGroups.push( {
        // this will create a new toolgroup with the tools
        // named in this include directive. The naem is the name given
        // in the static property of the tool
        include: [ 'extname' ]
    } );
} )();

拡張機能を VE にインストールしてLocalSettings.phpVE を起動すると、指定した名前の新しいツールがツールバーに表示されます。それをクリックすると、「Hello」という内容の警告ボックスが表示されます。インライン コメントに書かれているように: クリック ハンドラー ( onSelect) では、特別なページなどへのリンクを新しいタブで開くなど、好きなことを行うことができます。mw.Title特別なページへのリンクを取得するには、ローカライズされた名前空間を取得するために使用することをお勧めします。例えば：

var relativeUrl = mw.Title.newFromText( 'RecentChanges', -1 ).getUrl();

の最初のパラメータはmw.Title.newFromText()ページの名前で、2 番目のパラメータは名前空間の ID です (-1 は特別なページのデフォルトであり、常に機能するはずです)。

それが役立つことを願っています！

于 2015-08-05T11:12:28.083 に答える
-1

あなたの質問を完全に理解しているかどうかはわかりません。テキストを選択し、チェーン アイコンをクリックしてから、External Linkタブをクリックしてそこにリンクを貼り付けるだけです。

スクリーンショット

于 2015-06-26T08:37:02.923 に答える