PHP. Файловый менеджер для CKeditor — CKfsys 2

Из-за чего суета?

В визуальном редакторе CKeditor нет файлового менеджера. У его предшественника FCKeditor был файловый менеджер, но он имеел ряд недостатков, которые мешают полноценно работать с этим замечательным (по моему мнению) редактором.
Существует расширенный файловый менеджер CKFinder, но он платный, и лицензия для 1 сайта на момент написания статьи стоит 59$... Многовато, лучше доделать то что есть до ума.
Так что потратив недельку на разбор того как работает встроенный файловый менеджер я переделал все части, которые меня не устраивали.

За доработку внешнего вида на более современный лад спасибо Max.

Нетерпеливые сразу могут посмотреть пример → или посмотреть исходники на GitHub→

Что изменилось?

Вот какие изменения я посчитал достаточными:

  1. Русифицирован интерфейс.
  2. При добавлении папок с русскими именами и закачке файлов с русскими именами производится их транслитерация.
  3. У папок пишется их размер.
  4. Можно удалять файлы и папки.
  5. При закачке картинок на сервер можно изменить их размер.
  6. У типа ресурсов Image (Изображения) выводятся их preview-версии.

Функционал в пунктах 4, 5 и 6 можно отключить в config.php.
Для изменения размеров изображений используется imagemagick (качество получше) или если его нет — gd2.

Вот что было и во что все это превратилось — это выглядит так:

Было (стандартный из FCKeditor)

Стандарный файловый менеджер FCKeditor

Стало (CKfsys 2)

Наведи на картинку
и смотри подробнее

Файловый менеджер CKfsys 2

Конфигурирование файлового менеджера CKfsys

Требования к серверу:

Добавились следующие настройки:

// Разрешить удаление файлов и папок true/false
$Config['Delete']        = true;

// Делать превьюшки и разрешать изменять размеры при закачке
// требует утилиту imagemagick или библиотеку gd2
// если их нет, то чтобы не выводить в интерфейсе лишние элементы установите в false
$Config['ThumbCreate']      = true; // При закачке можно изменять размеры
$Config['ThumbList']        = true; // Показывать превьюшки
$Config['ThumbListSize']    = 100;  // Размер превьюшки, вписывается в квадрат
$Config['ThumbMaxGenerate'] = 5;    // Максимальное количество превьюшек, генерируемое за раз, если вдруг их нет

И для хранения preview-версий в конце конфигурационного файла задается папка, задайте её:

$Config['AllowedExtensions']['ImageThumb']     = $Config['AllowedExtensions']['Image'];
$Config['DeniedExtensions']['ImageThumb']      = $Config['DeniedExtensions']['Image'];
$Config['FileTypesPath']['ImageThumb']         = $Config['UserFilesPath'] . 'imageThumb/' ;
$Config['FileTypesAbsolutePath']['ImageThumb'] = ($Config['UserFilesAbsolutePath'] == '') ?
                                                 '' : $Config['UserFilesAbsolutePath'].'imageThumb/' ;

То что нужно сконфигурировать в стандарте (если кто не в курсе)

Помните что в целях безопасности обязательно нужно в конфигурации файлового менеджера проверять авторизованность пользователя, и только в случае если пользователь авторизован давать возможность ему пользоваться файловым менеджером.

Для этого нужно в файле CKFSYS_PATH/connectors/php/config.php определить переменную:

// SECURITY: You must explicitly enable this "connector". (Set it to "true").
// WARNING:  don't just set "$Config['Enabled'] = true ;", you must be sure that only
//           authenticated users can access this file or use some kind of session checking.
$Config['Enabled'] = empty($_SESSION['administrator'])?false:true; // Вот тут укажите свою проверку

И определите папку где будут хранится закачиваемые файлы:

// Path to user files relative to the document root.
$Config['UserFilesPath'] = '/userfiles/'; // Вот тут укажите свою папку, создайте ее с правами 0777

Соединяем CKeditor и CKfsys

Считаем что файловый менеждер настроен, теперь присоединяем его к редактору.
Для этого в файле CKEDITOR_PATH/config.js задаем пути к файловому менеджеру:

CKEDITOR.editorConfig = function( config ) {

    ...

    // File manager
    // CKFSYS_PATH — путь к файловому менеджеру у вас, чтото типа /path/to/ckeditor/filemanager,
    // путь указывать от DOCUMENT_ROOT
    config.filebrowserBrowseUrl = '/CKFSYS_PATH/browser/default/browser.html?Connector=/CKFSYS_PATH/connectors/php/connector.php';
    config.filebrowserImageBrowseUrl = '/CKFSYS_PATH/browser/default/browser.html?type=Image&Connector=/CKFSYS_PATH/connectors/php/connector.php';
};

Пример

Лицензия

Редактор распространяется под лицензии GPL.

Ссылки

Предыдущие версии

  1. Первым шагом был немного доработанный файловый менеджер FCKEditor v1.
  2. Вторым — полноценный файловый менеджер FCKEditor v2.
  3. После того как FCKeditor стал CKeditor менеджер поменял пару строк кода и стал называться CKfsys.

К скрипту имеется 1059 комментариев

Добавить комментрий


Главный редактор: SergiusD
Издается с 2005 года