Смайлики в IPB 2.3

[vasyast]

Доброго дня.

 

В современных версиях разработчики IP.Board полностью вылились в реализацию «красивостей» для форума, неизбежно принеся в жертву качество и, возможно, функциональность. Например, с версии 2.2 ввелась новая система менеджмента смайликов — родительская и дочерняя папка смайликов, подробнее об этом я писал в теме Смайлики (багтреккер клиентского раздела). За полгода уже многие успели поругаться и привыкнуть к этому нововведению. Сейчас речь пойдет немного не об этом.

 

Меня заинтересовал вопрос: как преобразить окошко со смайликами в редакторе сообщений? В Админцентре с версии 2.2 настройка количества отображаемых смайликов в строке исчезла. Конечно, весь форум «дышит» аджаксом, поэтому логично все эти «прелести» искать в файлах типа JavaScript. После недолгих раздумий находятся источники, файлы:

• /jscripts/ips_text_editor.js
  
• /jscripts/ips_text_editor_func.js
  

Опа, они закомпрессированны. Достаём из дистрибутива эти файлы в папке /Development/javascript_uncompressed/jscripts/.

 

Что мне надо сделать. Увеличить размер окна со смайлами, увеличить/сократить количество выводимых смайликов и такую же операцию проделать с выпадающим меню смайлов (кнопка которого находится на панеле форматирования текста).

 

Открываем ips_text_editor_func.js и находим фрагмент кода (комментарии):

		//-----------------------------------------
	// Build emoticons...
	//-----------------------------------------

По содержанию комментария в коде не трудно понять, за что отвечает последующий код. Далее находим нужный набор настроек:

		var _div  = document.createElement( 'div' );
	_div.style.width	 = '100%';
	_div.style.height	= '120px';
	_div.style.overflow	 = 'auto';
	_div.style.overflowY = 'auto';
	_div.style.overflowX = 'auto';


	var table		  = document.createElement('table');
	table.cellPadding  = 0;
	table.cellSpacing  = 0;
	table.border	   = 0;
	table.width		= '99%';


	var i		 = 0;
	var perrow	= 3;
	var show_emos = 12;
	var show_rows = show_emos / perrow;
	var max_emos  = 0;
	var _previous = 0;
	var _next	 = 0;

Методом проб и ошибок можно определить назначение каждой переменной. Стоит отдельно выделить следующие:

1. _div.style.height — видно из название, что это высота окна со смайлами;
   
2. var show_emos — общее количество смайликов для отображения на странице окошка;
   
3. var perrow — количество смайликов в строке окошка;
   
4. var show_rows = show_emos / perrow — нехитрое математическое выражение (отношение общего количества смайлов к смайлам за строку) по вычеслению строк окошка со смайликами.
   

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

 

Теперь хочется посмотреть код реализации смайликов через выпадающее меню.

 

Открываем файл ips_text_editor.js и в нём находим код:

			case 'emoticons':

Далее идёт похожая реализация как и в предыдущем файле, но выделим тут две переменные:

• var perrow — количество смайликов в строке выпадающего меню;
  
• // table.width — закомментированная переменная ширины выпадающего меню. По умолчанию там стоит значение «auto», но можно указать и желаемое количество пикселей. Чтобы убрать комментарий, нужно удалить «//».
  

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

 

Зачем это надо? Меня поймут администраторы форумов, где стоят нестандартные смайлики, большего/меньшего размера и которые негармонично смотрятся в этих жестких рамках.

 

Удачи.

 

P.S. Мне будет интересно узнать о ваших примерах работы со смайликами. Как вы изменяли окошки и, возможно, модифицировали код. Возможно, что внесу в статью изменения, основанные на ваших комментариях. Спасибо.

[Sannis]

Угум-с. Я так и делал если нужно было.

 

P.S. А при чём тут ajax?

[in_fact]

как насчет вывода по категориям?

я пробовал адаптировать мод для 21х версии..

все чудесно, но категории просто не открываются.