Настройка страниц с помощью JavaScript и CSS

В своем расширении вы можете настраивать функциональность Plesk и внешний вид средствами JavaScript и Cascading Style Sheets (CSS). Эти технологии позволяют изменять множество настроек интерфейса Plesk, например, добавлять новые элементы графического интерфейса и скрывать существующие элементы.

Глобальные изменения в Plesk UI

Чтобы Plesk загружал ваш код JavaScript или CSS на каждой странице, поместите этот код в файлы global.css и global.js в папке /htdocs.

Изменение выбранных страниц

Чтобы загружать код только на некоторых страницах, используйте следующую конструкцию:

if ("/smb/file-manager/list" != window.location.pathname) {
 return;
}

Изменение только страниц расширения

Чтобы включить JavaScript и CSS только на страницах расширения, используйте следующий подход:

  1. Создайте отдельные файлы (например, custom.js и custom.css) и поместите их в папку /htdocs,
  2. Там, где необходимо, загрузите эти файлы в соответствующих контроллерах, как описано ниже:

    $this->view->headScript()->appendFile(pm_Context::getBaseUrl() . 'custom.js');

    $this->view->headLink()->appendStylesheet(pm_Context::getBaseUrl() . 'styles.css');

Использование различных библиотек JavaScript

Фреймворк JavaScript в Plesk является прототипом.

Если вам надо загрузить дополнительные библиотеки и использовать их глобально, на всех страницах, вы можете сделать это непосредственно в файле global.js, например:

$$("head").first().insert(
 new Element("script", {type:"text/javascript", src:"//example.com/example.js"})
);

Если для расширения просто нужна другая библиотека, включите ее следующим образом:

$this->view->headScript()->appendFile(pm_Context::getBaseUrl() . 'library.js');

или, используя полный путь:

$this->view->headScript()->appendFile('//example.com/example.js');

Комментарии

Использование global.js и global.css

Помните о том, что код из global.js загружается и выполняется на каждой странице Plesk. Позаботьтесь о том, чтобы добавленный персональный код не нарушил общую производительность Plesk.

Советы по разработке:

  • Этот подход может быть наиболее полезен для серверных расширений, функциональность которых затрагивает все или почти все страницы интерфейса Plesk.
  • Избегайте добавления кода, относящегося только к страницам расширения, в файлы global.js и global.css. Вместо этого используйте включение в персональные файлы.
  • Избегайте включения запросов к внешним ресурсам, которые слишком долго выполняются, так как это замедлит загрузку всех страниц Plesk.

Советы по тестированию:

  • Проверяйте производительность и время загрузки как для страниц интерфейса Plesk, так и для страниц расширения.
  • В global.js могут возникнуть конфликты между библиотеками JavaScript, используемыми данным расширением, и библиотеками, используемыми другими расширениями.
  • Проверяйте консоль браузера и журналы на наличие ошибок JavaScript.
Как избежать конфликтов имен

Добавляйте имя расширения в качестве префикса в имена классов/переменные/пространства имен, чтобы их можно было отличить от имен классов/переменных/пространств имен, относящихся к Plesk или другим расширениям. В противном случае возможно возникновение конфликтов имен и непредсказуемых ошибок, которые трудно локализовать и исправить.

Лицензирование библиотек

Если вашему расширению требуется платная лицензия для работы, проконсультируйтесь с юристами, чтобы удостовериться, что лицензия на библиотеку JavaScript, используемую расширением, разрешает коммерческое использование – так как в противном случае возможны противоречия с лицензией на использование библиотеки и юридические последствия.