Как добавить ссылку в MediaWiki VisualEditor Toolbar?

Я пытаюсь вставить специальную ссылку на специальную страницу на панели инструментов VisualEditor. См. Изображение ниже.

Link PositionСм. изображение

Я много гулял, но безуспешно. Кто-то, пожалуйста, дайте путь...

Ответы

Ответ 1

Мой ответ основан на следующих ресурсах:

Кроме того, я уверен, что нет документального способа добавления инструмента на панель инструментов в VE, насколько я знаю. Хотя возможно добавить инструмент в группу, которая уже добавлена, в основном используется для группы инструментов "Вставить", например, в Syntaxhighlight_GeSHi). Возможно, это намного проще или "лучше":

Во-первых, VisualEditor предоставляет способ загрузки дополнительных модулей (называемых плагинами) при загрузке основной части VE (в основном, когда вы нажимаете кнопку "Изменить" ). Модули должны быть зарегистрированы через глобальную переменную $wgVisualEditorPluginModules (или эквивалент в extension.json, если вы используете новую регистрацию расширений). В вашем файле регистрации расширения вы должны инициализировать модуль (с необходимыми script файлами для добавления инструмента) и добавить его в качестве плагина 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. В этом script вы можете делать то, что захотите. В качестве примера, это способ добавить новый модуль в конец списка групп инструментов на панели инструментов:

Пример 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 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' ]
    } );
} )();

После установки расширения в вашем LocalSettings.php и запуске VE вы должны увидеть новый инструмент на панели инструментов с заданным именем. Нажав на нее, вы увидите окно с сообщением "Привет". Как написано во встроенных комментариях: В обработчике кликов (onSelect) вы можете делать все, что хотите, например. откройте ссылку на новой вкладке, например. на специальную страницу. Чтобы получить ссылку на специальную страницу, я бы предложил использовать mw.Title для получения локализованного пространства имен. Например:

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

Первым параметром mw.Title.newFromText() является имя страницы, второй параметр - идентификатор пространства имен (-1 - значение по умолчанию для специальных страниц и должно всегда работать).

Я надеюсь, что это поможет!

Ответ 2

Я не уверен, что полностью понимаю ваш вопрос. Это так же просто, как выбрать текст, щелкнув значок цепи, затем щелкнув вкладку External Link и вставив туда свою ссылку.


Screenshot