Перейти к содержимому

Введите название инструмента, задачу или имя метода.

Открыть BDE
На этой странице

Первый плагин: кнопка и окно

Первый плагин BDEngine: готовый JS-файл, кнопка в меню Dock, собственное окно, установка и проверка повторного открытия.

Минимальный законченный пример

Добавим пункт My first plugin в меню Dock. По нажатию откроется окно с сообщением. Повторное нажатие вернёт фокус существующему окну, а после закрытия можно создать его снова. Пример не меняет сцену и не требует проекта, пакетов npm или сборщика.

Нужны BDEngine, текстовый редактор и базовое понимание функций JavaScript. Можно скачать готовый first-plugin.js или сохранить приведённый ниже код в файл с таким именем в UTF-8.

В начале файла указываются @name и @namespace. Первое поле видно пользователю, второе определяет установленный плагин. Для собственной разработки замените bde-docs-first-plugin на свой идентификатор и обновите префикс ID окна.

Мы также укажем версию, автора и описание. Подробнее: обязательные метаданные. IIFE (() => { ... })() оставит переменные примера в его собственной области.

Добавить кнопку и создать окно

Полный устанавливаемый файл:

first-plugin.js
// ==UserScript==
// @name         BDE Docs: First plugin
// @namespace    bde-docs-first-plugin
// @version      1.0.0
// @description  Adds a Dock menu button that opens one reusable window.
// @author       BDEngine
// ==/UserScript==


(() => {
  let win = null;


  function start() {
    const api = window.editorAPI;
    if (typeof api?.addButtonDockMenu !== 'function' ||
        typeof api?.createWindow !== 'function') {
      console.warn('[bde-docs-first-plugin] Required UI methods are unavailable.');
      return;
    }


    function openWindow() {
      if (win) {
        win.focus();
        return;
      }


      win = api.createWindow(
        'My first plugin',
        'bde-docs-first-plugin-window',
        'icon-smile',
        480, 300, 300, 200,
        () => { win = null; }
      );


      const message = document.createElement('p');
      message.textContent = 'Hello! This window was created by your plugin.';
      win.container.appendChild(message);
    }


    api.addButtonDockMenu('icon-smile', 'My first plugin', openWindow);
    console.log('[bde-docs-first-plugin] Ready. Open the Dock menu.');
  }


  window.addEventListener('bde:started', start, { once: true });
})();

start() вызывается после готовности интерфейса. Она добавляет кнопку один раз за запуск редактора. addButtonDockMenu() создаёт пункт раскрывающегося меню Dock, а не отдельную кнопку на основной полосе.

Окно создаётся только при нажатии. В

createWindow()

переданы заголовок, ID, иконка, ширина и высота, минимальные размеры и обработчик крестика. Содержимое добавляется в win.container обычными средствами DOM.

Файл предназначен для штатной установки с перезапуском. Если вставить его в консоль уже запущенного редактора, bde:started не повторится и кнопка не появится.

Установить и увидеть результат

  1. Сохраните текущий проект перед перезапуском.
  2. Откройте настройки BDEngine и выберите Мои плагины.
  3. Нажмите область выбора .js и укажите first-plugin.js. Файл также можно перетащить в редактор.
  4. Убедитесь, что BDE Docs: First plugin появился в списке установленных.
  5. Нажмите Перезапустить в сообщении об изменённых плагинах.
  6. После загрузки откройте меню Dock кнопкой с горизонтальными линиями и выберите My first plugin.

Редактор сначала сохраняет файл в локальное хранилище. Установка сама по себе не выполняет новую версию поверх уже работающей. После изменений кода установите .js с тем же namespace ещё раз и перезапустите BDEngine.

Пользовательский раздел: установка и управление плагинами.

Открыть, закрыть и снова открыть

Проверьте три действия:

  • Повторно выберите пункт меню, пока окно открыто. Оно должно получить фокус без создания второго окна.
  • Сверните окно кнопкой минуса и снова выберите пункт. focus() восстанавливает свёрнутое окно.
  • Закройте окно крестиком и снова выберите пункт. Обработчик крестика сбросит win, и будет создано новое окно.

После закрытия обычного окна его DOM удаляется. Поэтому нельзя повторно заполнять container закрытого экземпляра. В этом примере используется новый экземпляр. Для удаления самого плагина откройте Мои плагины, нажмите Удалить и перезапустите редактор.

Если пункта меню нет, проверьте сохранённый файл и перезапуск. В консоли разработчика найдите сообщение с префиксом [bde-docs-first-plugin] или ошибку из файла плагина. Подробнее: Отладка и корректное завершение работы.

Выбрать доработку