Единый редактор для INSTANT (на основе стандартного с ББ-кодами), вер. 1.9

+40
2.62K

Единый редактор с ББ-кодами

заменяет WYSYWIYG редактор, в статьях, в УК и в конфиге блогов на стандартный редактор с ББ-кодами (справедливо и для админки), как на форуме…
с некоторым наращиванием функционала…
без изменений в структуре БД…

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

что менялось

в файле /core/classes/page.class.php в функции
  1. public static function getBBCodeToolbar($field_id, $images=0, $placekind='forum'){
начиная со строки для панели смайлов по функцию public static function getSmilesPanel($for_field_id){ включительно:
  1.  
  2. <a class="usr_bb_button" href="javascript:void(0)" onclick="$(\'#smilespanel_'.$field_id.'\').slideToggle(\'slow\')" title="Вставить смайл">
  3. <img src="/includes/bbcode/images/smiles.png" alt="Вставить смайл" />
  4. </a>';
  5. if ($placekind=='blogs'){
  6. $html .= '<a class="usr_bb_button" href="javascript:addTagCut(\''.$field_id.'\')" title="Вставить конец анонса (кат)">
  7. <img src="/includes/bbcode/images/cut.png" alt="Вставить конец анонса (кат)" />
  8. </a>';
  9. }
  10. if ($images){
  11. $html .= '<a class="usr_bb_button" href="javascript:addTagVideo(\''.$field_id.'\')" title="Вставить видео">
  12. <img src="/includes/bbcode/images/video.png" alt="Вставить видео" />
  13. </a>
  14. <a class="usr_bb_button" href="javascript:addTagAudio(\''.$field_id.'\')" title="Вставить mp3">
  15. <img src="/includes/bbcode/images/audio.png" alt="Вставить mp3" />
  16. </a>
  17. <a class="usr_bb_button" href="javascript:addTagImage(\''.$field_id.'\')" title="Вставить картинку из Сети">
  18. <img src="/includes/bbcode/images/image_link.png" alt="Вставить картинку из Сети" />
  19. </a>';
  20. if ($inUser->id) {
  21. $users_cfg = $inCore->loadComponentConfig('users');
  22. if ($users_cfg['sw_photo']){
  23. $html .= '<a class="usr_bb_button" href="javascript:addAlbumImage(\''.$field_id.'\')" title="Вставить фото из личных альбомов">
  24. <img src="/includes/bbcode/images/albumimage.png" alt="Вставить фото из личных альбомов" />
  25. </a>';
  26. }
  27. $html .= '<a class="usr_bb_button" href="javascript:addImage(\''.$field_id.'\')" title="Загрузить и вставить фото">
  28. <img src="/includes/bbcode/images/image.png" alt="Загрузить и вставить фото" />
  29. </a>
  30. <div class="usr_bb_button" id="imginsert_'.$field_id.'" style="display:none">
  31. <strong>Загрузить фото:</strong>
  32. <input type="file" id="attach_img_'.$field_id.'" name="attach_img_'.$field_id.'"/>
  33. <input type="button" name="goinsert" value="Вставить" onclick="loadImage(\''.$field_id.'\', \''.session_id().'\', \''.$placekind.'\')" />
  34. </div>
  35. <div class="usr_bb_button" id="imgloading_'.$field_id.'" style="display:none">
  36. Загрузка изображения...
  37. </div>';
  38. if ($users_cfg['sw_photo']){
  39. $html .= '<div class="usr_bb_button" id="albumimginsert_'.$field_id.'" style="display:none">
  40. <strong>Вставить фото:</strong> '.cmsUser::getPhotosList($inUser->id).'
  41. <input type="button" name="goinsert" value="Вставить" onclick="insertAlbumImage(\''.$field_id.'\')" />
  42. </div>';
  43. }
  44. }
  45. }
  46. $html = cmsCore::callEvent('GET_BBCODE_BUTTON', $html);
  47.  
  48. return $html;
  49. }
  50.  
  51. /**
  52. * Возвращает html-код панели со смайлами
  53. * @param string $for_field_id
  54. * @return html
  55. */
  56. public static function getSmilesPanel($for_field_id){
  57. $html = '<div class="usr_msg_smilebox" id="smilespanel_'.$for_field_id.'" style="display:none">';
  58. if ($handle = opendir(PATH.'/images/smilies')) {
  59. while (false !== ($file = readdir($handle))) {
  60. if ($file != '.' && $file != '..' && strstr($file, '.gif')){
  61. $tag = str_replace('.gif', '', $file);
  62. $dir = '/static/smiles/';
  63.  
  64. $html .= '<a href="javascript:addSmile(\''.$tag.'\', \''.$for_field_id.'\');"><img src="'.$dir.$file.'" /></a> ';
  65. }
  66. }
  67. closedir($handle);
  68. }
  69. $html .= '</div>';
  70. return $html;
  71. }
  72.  
в файле /public_html/templates/ваш шаблон/components/com_catalog_add.tpl — ближе к концу строку…
  1.  
  2. <input type="submit" name="submit" value="{$LANG.SAVE}" style="font-size:18px" />
  3.  
заменить на:
  1.  
  2. <input type="submit" name="send" value="{$LANG.SAVE}" style="font-size:18px" />
  3.  
файл /core/js/smiles.js — в архиве…

файл /includes/bbcode/bbcode.lib.php — в архиве…

файл /core/ajax/imginsert.php — в архиве…

ну и собственно файлы плагина тоже в архиве, в соответствии с расположением в нужных директориях…

АРХИВ

в моих файлах

кому интересно подключайтесь к тестированию и к разработке… )
0
Савонарола Савонарола 9 лет назад #
Спасибо Майк! Жирный плюсище за твой труд
0
st.Puh st.Puh 9 лет назад #
Админка Модули сайта Добавить модуль Внешний скрипт ВСТАВИТЬ и как во всех внешних редакторах не вставляет {ФАЙЛ=myscript.php}
+1
• Mike • • Mike • 9 лет назад #
функции пока поддерживаются, лишь те, которые существуют в стандартном редакторе, всё что работало в WYSIWYG работать не будет — пока, по крайней мере…
0
st.Puh st.Puh 9 лет назад #
С этим редактором теперь будет трудно-невозможно создавать красиво оформленные статьи, к примеру тот же шаблон статьи очень удобно а у вас уже нет да и куча всяких удобств при создании стаей пропадает
+1
• Mike • • Mike • 9 лет назад #
начало и предпосылки создания на форуме в теме тут
для тех кто не читал, поясню — это экспериментальная версия, не для рабочих проектов, и соответственно для тех, кто хотел, чтобы на сайте был один редактор на основе стандартного с ББ-кодами
в “другую сторону” в сторону WYSIWYG везде, так же начата работа, но пока еще всё сырое для того чтобы публиковать даже альфа-релиз… )
-1
picaboo picaboo 9 лет назад #
визивинг бы в блоги :)
0
Anonim Anonim 9 лет назад #
Не визинг нужен, а редактор как в майл.ру чтобы там было все - и bb и Html и код
0
• Mike • • Mike • 9 лет назад #
удобно когда просто )
например, есть два варианта: одна кнопка и четыре кнопки; вопрос: где выбор более простой и интуитивный?
ну и, если есть “всё”, то что выбрать?
по существу…
в мэйле каким способом осуществляется переключение? в профиле в настройках для каждого? или в редакторе, непосредственно при редактировании?
+7
• Mike • • Mike • 9 лет назад #
пишите что хотите увидеть, если это реализуемо, постараюсь воплотить… если конечно сама идея с заменой редактора привлекает…
0
letsgo letsgo 9 лет назад #
Идея отличная. Спасибо за наработки, буду ждать еще продолжение.
0
Anonim Anonim 9 лет назад #
Конечно!
0
Савонарола Савонарола 9 лет назад #
Странный глюк вылез. В каталоге бьются все форматирования текста и не работает спойлер. Еще не все потестил, если ещё что нарою, отпишусь
0
spacer spacer 9 лет назад #
Отличная мысль и работа.
Редактор нужен единый. Возможно в 2-х вариантах (с урезанных функционалом), чтобы в комментариях не озорничали.

Единственное, что мне не нравится, это то, что в BB изображения не обтекаются текстом, нельзя выставить "margin". Вот если бы можно было на кнопоки "расположить слева" автоматически выставлять правый маржин 15 пикселов, а при "расположить справа", левый, соответственно и обтекание, было бы удобно. А если по центру, значит без обтекания.

p.S. Подскажите, пожалуйста, как удалить кнопочку "H1" из панельки, чтобы пользователи не злоупотребляли?
0
• Mike • • Mike • 9 лет назад #
spacer:
нельзя выставить "margin". Вот если бы можно было на кнопоки "расположить слева" автоматически выставлять правый маржин 15 пикселов, а при "расположить справа", левый, соответственно и обтекание, было бы удобно. А если по центру, значит без обтекания.
добавлены теги выравнивания и альтернативного текста для изображений загружаемых с компа…
на данный момент так и происходит, флоат лефт с правым мержином и наоборот, обтекание специально убрано, так как визуализация зависит от размеров изображения, например, при загрузке пикчи по ширине в 600 пикселей в шаблоне остается около 80 пикселей свободных для текста, чтобы не порождать подобных проблем было отключено добавлением дива с двойной очисткой…
центр в данной редакции сделать не удастся из-за обратного парсинга из свойства флоат…
как удалить кнопочку "H1" из панельки…
/core/classes/page.class.php функция public static function getBBCodeToolbar($field_id, $images=0, $placekind='forum'){
ищем строку:
Код PHP:
<a class="usr_bb_button" href="javascript:addTag(\''.$field_id.'\', \'[h1]\', \'[/h1]\')" title="Большой заголовок"><img src="/includes/bbcode/images/h1.png" border="0" alt="Большой заголовок" /></a>
и аккуратно удаляем или закомментируем <!-- найденная строка -->
0
spacer spacer 9 лет назад #
Спасибочки, но я не понял, если флоат есть, почему бы обтекание к нему, все-таки не прилепить?
обтекание специально убрано, так как визуализация зависит от размеров изображения, например, при загрузке пикчи по ширине в 600 пикселей в шаблоне остается около 80 пикселей свободных для текста, чтобы не порождать подобных проблем было отключено добавлением дива с двойной очисткой…
Я все понимаю, но юзер же тоже не совсем туп, увидит, что маленькое расстояние для текста и сделает флоат по центру (отредактирует).
центр в данной редакции сделать не удастся из-за обратного парсинга из свойства флоат…
тут я не понял :)
0
spacer spacer 9 лет назад #
И еще, раз уж у вас руки, как надо растут, может вы добавить ко вставке изображения функцию подписи?
Ну нужная же штуковина для соблюдения всяких там авторских прав.
0
• Mike • • Mike • 9 лет назад #
по первому пункту: свойство флоат может принимать только три значения none, left, right центра у него нет и в разных броузерах (старых версиях) добится центровки универсальным кодом очень сложно без “извращений”
по обтеканию: если общая ширина материала например 700 пикселей а изображение загружено 600 для текста просто мало места остается, не красиво и нечитаемо…
обратный парсинг это когда html коды заменяются обратно бб-кодами
например код для изображения <img style="float:left....
превращается в
Код PHP:
[img align=left....[/code] т.е. берется свойство флоат из стиля а не выравнивание…
функцию подписи по-идее можно добавить, просто это еще больше усложнит код, в данной редакции плагина без основательной переделки не обойтись, а задачу я ставил перед собой чтобы работало на основе встроенного редактора, т.е. без кардинальной переделки, одинаково используя одни и те же функции и библиотеки…
будет делать дальше постараюсь учесть все пожелания, поэтому и просил писать их тут, чтобы представлять направление и масштаб переделки…
0
spacer spacer 9 лет назад #
Погодите, мы друг друга не поймем что-то smile
Зачем тогда маржин, если нет обтекания ни в каком варианте выравнивания?
А центровка вообще из текущего ВВ-редактора выпадет? (Сейчас же он есть.)
0
• Mike • • Mike • 9 лет назад #
всё будет… /только по-другому/, но, только вместе с возможностью изменения размера вставляемого изображения, проще не могу объяснить…
0
spacer spacer 9 лет назад #
Про некрасиво и нечитаемо я уже писал, сам юзер или редактор увидят, что текст не лезет или переносится по одному слову и выставит центр. Но если центра у нас нет, тогда, конечно, не айс.

Мне просто трудно представить, зачем, по большому счету, нужен флоат, если все-равно нет обтекания. Пусть все изображения становятся по центру и юзеру меньше действий и лишних опций.
+1
• Mike • • Mike • 9 лет назад #
без нормального управления вставляемым изображением и текстом так и сделано в библиотеке есть данные опции но они не задействованы по-умолчанию…
это типа бета релиза, много еще не так как будет…
0
Lana Lana 9 лет назад #
У меня почему то в статьях не отрабатывает - Загрузить и вставить фото (последняя иконка).
Ни в админке, ни при редактировании юзером.
Не могли бы вы проверить, хотя может у меня что-то не так, но ставила на 1.9 - первоисточник.

В форуме нормально вставляет.
Кстати окошки - выравнивание и текст - не очевидно, допустим я не хочу вводить выравнивание - первая реакция "Отмена", "Отмена" (а не Ок) - повисает Загрузка...
+1
• Mike • • Mike • 9 лет назад #
в статьях в обоих текстовых областях не работает или только в одной?

с выравниванием и отменой пока так, их по идее нужно переносить рядом с другими кнопками при самой загрузке (там где обзор и вставить) да и делать нужно через классы (стили) а не в код вставлять, сделаю постепенно, просто общую концепцию не хотелось нарушать поэтому пока через промты (окошки для ввода)
+1
• Mike • • Mike • 9 лет назад #
в админке пока не работает, так как там не подгружается /includes/jquery/upload/ajaxfileupload.js
0
spacer spacer 9 лет назад #
Табличка еще не помешает для вставки.
"Число строк", "Число столбцов", "Вставить"
0
• Mike • • Mike • 9 лет назад #
Тогда получится очередной RTE только с лишним парсингом… )
+1
iLoveNY iLoveNY 9 лет назад #
Вопрос не в тему конечно, но скажите пожалуйста:как сделать в bbcode на стене можно было только добавить фото,видео, музыку ну и текст естественно, а в блогах присутствовали ВСЕ функции редактора?
0
iLoveNY iLoveNY 9 лет назад #
Вопрос не в тему конечно, но скажите пожалуйста:как сделать в bbcode на стене можно было только добавить фото,видео, музыку ну и текст естественно, а в блогах присутствовали ВСЕ функции редактора?
-1
• Mike • • Mike • 9 лет назад #
в page.class.php функция public static function getBBCodeToolbar($field_id, $images=0, $placekind='forum'){...
первый параметр передает функции id текстового блока, второй доступность кнопок в секции if ($images..., третий место вызова, например forum, blogs и т.д.
смотрите в коде компонентов, как происходит вызов этой функции и какие параметры передаются и настраивайте “под себя”…
-1
picaboo picaboo 9 лет назад #
&#9786; Mike &#9786;, а дальше дорабатывать этот вариант не планировалось?
0
• Mike • • Mike • 9 лет назад #
он почти закончен, осталось прописать пару функций и придумать иконки для новых кнопок, ну и описать процесс установки где что меняется…
-1
picaboo picaboo 9 лет назад #
могу потестить если надо. будет под 1.9 или 1.10 ?
0
• Mike • • Mike • 9 лет назад #
пока только под 1.9 в 1.10 много что поменяется там нужно будет делать совсем по другому + настраивать конфигурацию jevix (правила)…
И скорее всего в будущем произойдёт полный отказ от бб-кодов, поэтому я работаю и в другом направлении — в сторону единого html редактора на основе sceditor 1.3.7…
могу потестить если надо. будет под 1.9 или 1.10 ?
отпишусь в личку как с функциями закончу, можно будет погонять без кнопочек пока…
+2
• Mike • • Mike • 9 лет назад #
идёт окончательная шлифовка, скоро будет обновление, от этого отличается кардинально и использует билиотеки и функции без обращения к стандартным, ставится тоже будет проще…

Еще от автора

Предварительный просмотр в BB редакторе для 1.10.4
В продолжение темы— Предварительный просмотр в стандартном редакторе с ББ-кодами для версии 1.
Расширенная постраничная навигация вер. 1.10.3+
Плагин расширенной постраничной навигации для версий выше 1.10.3
Замена модальных диалогов на инлайн панели для версии 1.10.3
Заменяет модальные окна при отправке сообщений и написании записей на стену + статус пользователя. Добавлены две функции в /core/js/common.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.