IT-Expert
  IT-Expert / Picbrowser

Браузер изображений для Rails c плагином tinymce.

Для чего?

Очень хороший javascript редактор tinymce отдается бесплатно, а плагины для загрузки и вставки файлов и изображений в редакторе хорошие, но платные (и существуют только для PHP и ASP.NET). В архиве с проектом - мое видение реализации такого плагина на ruby для Rails.


Фичи:

загрузка, удаление, просмотр, автоматическая генерация уменьшенной копии изображений для предпросмотра(thumbnails), использование AJAX для операций просмотра и удаления. Функциональные тесты контроллера. Локализован для русского языка. (ru.UTF-8)
При загрузке изображений через ftp есть возможность "перегенерировать" thumbnails для предпросмотра.

Зависимости:

tinymce плагин, RMagick.

Скачать

[ download picbrowser (37489 bytes) ] for rails plugin tinymce

Установка

Установите плагин tinymce для rails, установите RMagick, распакуйте файлы из picbrowser.zip в каталог с вашим проектом. Измените routes.rb в соответствии с рекомендациями в config/routes.rb.sample.

Пример интеграции на странице с tinymce

------ controller страницы -----
## сразу после class перед первым методом класса
uses_tiny_mce(:options => {:theme => 'advanced',
:browsers => %w{msie gecko},
:content_css => "/stylesheets/content_styles.css", # подключаем css страницы
:theme_advanced_toolbar_location => "top",
:theme_advanced_toolbar_align => "left",
:theme_advanced_resizing => true,
:theme_advanced_resize_horizontal => false,
:file_browser_callback => "myBrowserInstance.fileCallBack", # подключение загрузки картинок
:external_image_list_url => "/javascripts/imagelist.js", #уходит на picbrowser controller через /config/routing.rb
:paste_auto_cleanup_on_paste => true,
:theme_advanced_buttons1 => %w{styleselect separator bold italic underline strikethrough separator justifyleft justifycenter justifyright justifyfull indent outdent separator
bullist numlist forecolor backcolor separator link unlink anchor image separator undo redo},
:theme_advanced_buttons2 => %w{formatselect fontselect
fontsizeselect pastetext pasteword cleanup}, :theme_advanced_buttons3 => %w{fullscreen selectall
tablecontrols separator removeformat visualaid separator code separator preview save},
:theme_advanced_statusbar_location => "bottom",
:paste_create_paragraphs => false,
:paste_use_dialog => true,
:onchange_callback => "updatePreview",
:plugins => %w{fullscreen preview paste advimage table advhr
advlink contextmenu save}, :language => "ru_UTF-8", ## нужен russian UTF-8 language pack для tinymce
:only => [:edit]) # показвать только для метода :edit этого контроллера

----- view странцицы -----
<% # Include TinyMCE before other JS to avoid problems -%>
<%= javascript_include_tag('pic_browser') if using_tiny_mce? %>
<%= javascript_include_tiny_mce_if_used %>
<%= tiny_mce if using_tiny_mce? %>

Со мной можно связаться по следующим контактам:

Best regards, Nexus
Вот готовая версия работающего tiny_mce с картинками: http://github.com/devon/tiny_mce_plus/tree/master
Да, многого не хватает. Превью странное, поддержки каталогов нет, удаления изображений. Зато все сделано правильно плагином. И ресайзинг автоматический.
© Максим Прокопов 2005-2024 О сервере