10 июн. 2011 г.

django-tinymce + django-filebrowser

Пара файлменеджер+wysiwyg - удобный набор для привлечения к генерации контента пользователей совсем уж низкого уровня технической подготовки.
Сейчас, чтобы подключить к любимой CMSке на django загрузку картинок, уже не нужно ничего велосипедить. Решение проблемы сводится к поиску нужного форка на github. И это же правило справедливо для большинства plugable-приложений.
В случае с заявленными в сабже приложениями нужно:
1. Настроить tinymce (отобрать у пользователя все не нужные ему возможности. Меньше можешь - меньше накосячишь). Файл настроек django-tinymce может выглядеть так:

# -*- coding: utf8 -*-

from settings import STATIC_ROOT

#TinyMCE widget configuration
TINYMCE_JS_URL = "/static/tiny_mce/tiny_mce.js"
TINYMCE_JS_ROOT = STATIC_ROOT + "/tiny_mce"
TINYMCE_SPELLCHECKER=False
TINYMCE_PLUGINS = [
    'safari',
    'table',
    'advlink',
    'advimage',
    'iespell',
    'inlinepopups',
    'media',
    'searchreplace',
    'contextmenu',
    'paste',
    'wordcount'
]

TINYMCE_DEFAULT_CONFIG={
    'theme' : "advanced",
    'plugins' : ",".join(TINYMCE_PLUGINS), # django-cms
'language' : 'ru',
    'theme_advanced_buttons1' : "bullist,numlist,|,link,unlink,anchor,image",
    'theme_advanced_buttons3' : "table,|,delete_row,delete_table,|,row_after,row_before",
    'theme_advanced_buttons4' : "styleselect,formatselect,fontselect,fontsizeselect",
    'theme_advanced_buttons2' : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,undo,redo,|,link,unlink,cleanup",
    'theme_advanced_buttons4' : "",
    'theme_advanced_toolbar_location' : "top",
    'theme_advanced_toolbar_align' : "left",
    'theme_advanced_statusbar_location' : "bottom",
    'theme_advanced_resizing' : True,
    'table_default_cellpadding': 2,
    'table_default_cellspacing': 2,
    'cleanup_on_startup' : False,
    'cleanup' : False,
    'paste_auto_cleanup_on_paste' : False,
    'paste_block_drop' : False,
    'paste_remove_spans' : False,
    'paste_strip_class_attributes' : False,
    'paste_retain_style_properties' : "",
    'forced_root_block' : False,
    'force_br_newlines' : False,
    'force_p_newlines' : False,
    'remove_linebreaks' : False,
    'convert_newlines_to_brs' : False,
    'inline_styles' : False,
    'relative_urls' : False,
    'formats' : {
        'alignleft' : {'selector' : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', 'classes' : 'align-left'},
        'aligncenter' : {'selector' : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', 'classes' : 'align-center'},
        'alignright' : {'selector' : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', 'classes' : 'align-right'},
        'alignfull' : {'selector' : 'p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img', 'classes' : 'align-justify'},
        'strikethrough' : {'inline' : 'del'},
        'italic' : {'inline' : 'em'},
        'bold' : {'inline' : 'strong'},
        'underline' : {'inline' : 'u'}
    },
    'pagebreak_separator' : ""
}
#FILEBROWSER_URL_FILEBROWSER_MEDIA = STATIC_URL + 'filebrowser'
FILEBROWSER_DIRECTORY = 'filebrowser'
2. Найти и установить тот самый, правильный форк. Сегодня для меня это https://github.com/smacker/django-filebrowser-no-grappelli-for-django13 (чтоб установить нужно прописать в INSTALLED_APPS tinymce и добавить url(r'^tinymce/filebrowser/',include('filebrowser.urls')),).
Django-filebrowser-no-grappelli-for-django13 нуждается в https://github.com/tstone/django-uploadify (необходимые настройки сводятся к добавлению uploadify в INSTALLED_APPS и добавлению урл-паттерна  (r'^uploadify/', include('uploadify.urls')), ).

Ну и все, если не считать мануальной терапий по переносу каталогов медиа файлов из подкаталогов приложений (1.3 умеет коллекционировать статику, потому для многих уже и не актуально).

4 комментария:

Анонимный комментирует...

поосторожней с моим форком. Там могут быть баги, а я еще 4 месяца в США жить буду. Мне тут не до джанги...

Иван Маркеев комментирует...

Думаю всем теперь интересен не столько форк, сколько ваша судьба. Чем занимаетесь в США?

Анонимный комментирует...

Доброе время суток!
Иван, я попробовал сделать так, как указано у вас в описании. Однако у меня возникли проблемы (возможно проблема в статике - но где именно - не могу понять).
На всякий случай вот настройки для filebrowser и tinymce (settings.py проекта):
# FILEBROWSER_URL_FILEBROWSER_MEDIA = os.path.join(MEDIA_URL,'filebrowser')
FILEBROWSER_URL_ADMIN = '/admin/filebrowser/'
FILEBROWSER_URL_HOME = '/admin/'
FILEBROWSER_PATH_MEDIA = MEDIA_URL+'filebrowser/' # NOT path BUT url
FILEBROWSER_URL_TINYMCE = MEDIA_URL+'js/tiny_mce/'
FILEBROWSER_PATH_TINYMCE=os.path.join(MEDIA_ROOT, 'js/tiny_mce')
FILEBROWSER_MAX_UPLOAD_SIZE = 4500000


FILEBROWSER_MEDIA_URL= MEDIA_URL+'filebrowser/' # NOT path BUT url
FILEBROWSER_MEDIA_ROOT=os.path.join(MEDIA_ROOT, 'filebrowser')
FILEBROWSER_DIRECTORY=os.path.join(FILEBROWSER_MEDIA_ROOT,'uploads')


TINYMCE_JS_URL=MEDIA_URL + 'js/tiny_mce/tiny_mce_src.js'

TINYMCE_JS_ROOT=os.path.join(MEDIA_ROOT, 'js/tiny_mce')

TINYMCE_DEFAULT_CONFIG={
'theme': 'advanced',
'mode': 'textareas',
'language':"ru",
'content_css': "/mymedia/style/style.css",
'plugins':'''advhr, advimage, advlink, advlist, autoresize,
autosave, contextmenu, directionality,
emotions, fullscreen, iespell, inlinepopups,
insertdatetime, layer, legacyoutput, media,
nonbreaking, noneditable, pagebreak, paste, preview,
print, save, searchreplace, spellchecker, style, tabfocus,
table, template, visualchars, wordcount'''
}

TINYMCE_SPELLCHECKER = False

TINYMCE_FILEBROWSER=True

Собственно проблем много:
1) в админке в файловом менеджере после создания папки войти в нее не получается - при щелчке на выбранной папке выдает сообщение "Запрашиваемой папки не существует." хотя эта папка точно была создана в директории FILEBROWSER_MEDIA_ROOT
2) не работает кнопка "загрузить". Она ссылается на путь /tinymce/filebrowser/upload_flash/?ot=desc&o=date и выдает ошибку: TemplateSyntaxError (multi_file_upload takes 1 arguments)
При этом если вручную заменить "upload_flash" на "upload" - откроется страница с загрузкой файлов по одному.
3) после загрузки нескольких файлов (рисунков) "по-одному" попробовал вставить их в tinymce редакторе (через вставку картинки) - по идее там должна была появиться иконка с списком выбора картинок или еще как-то. Однако такой кнопки не появилось.
Вопрос: что я делаю не так?

Ivan Markeyev комментирует...

Слишком много неизвестных в этом вопросе. Можете прислать код приложения архивом на мою почту markeev@gmail.com?