произвольный тип параметров компонента в bitrix

Лирическое отступление.

Не смотря на всю мою заочную нелюбовь к bitrix пришлось разрабатывать и на нём. Теперь эта нелюбовь очная. Документация плохая, комьюнити относительно небольшое, странноватая модель создания страниц, код в котором довольно таки сложно разобраться,сайтом управлять должен специально обученный человек, самому в нём разобраться крайне сложно, могу и дальше продолжить список но надоело. Пост как раз про большинство этих недостатков.

Начнём

Документация Битрикса довольно скромно говорит о том каких типов могут быть параметры, другие источники тоже расходятся во мнениях. Видимо узнать это можно только посмотрев код, но как-то не хочется. По поводу такого типа как CUSTOM все советуют смотреть компонент карт гугла. Смотрим его, т.к. никакое гугл-фу не помогло и найти какой-то другой документации кроме map.google.view.

Описание

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

$arComponentParameters = array(
//...
'MAP_DATA' => array(
'NAME' => GetMessage('MYMS_PARAM_DATA'),
'TYPE' => 'CUSTOM',
'JS_FILE' => '/bitrix/components/bitrix/map.google.view/settings/settings.js',
'JS_EVENT' => 'OnGoogleMapSettingsEdit',
'JS_DATA' => LANGUAGE_ID.'||'.GetMessage('MYMS_PARAM_DATA_SET'),
'DEFAULT' => serialize(array(
'google_lat' => GetMessage('MYMS_PARAM_DATA_DEFAULT_LAT'),
'google_lon' => GetMessage('MYMS_PARAM_DATA_DEFAULT_LON'),
'google_scale' => 13
)),
'PARENT' => 'BASE',
)
//...
);

JS_FILE – файл с JS кодом ответственным за отображение кастомной опции
JS_EVENT – callback функция которая будет вызвана после загрузки JS_FILE
JS_DATA – будет передана в JS_EVENT

вообще говоря в JS_EVENT будет передано не JS_DATA, а объект

1
2
3
4
5
6
7
8
9
10

{
data:JS_DATA, //как не трудно догадаться тут будет <strong>JS_DATA</strong> из .parameters.php
oCont: td, /* контейнер, в котором предлагается размещать
кастомный контрол управления параметром */
oInput: input,//input в котором и будет предаваться значение параметра на сервер при сохранении
popertyID:"MAP_DATA",//название параметра
propertyParams: { /*...*/ },//Объект содержащий всё тоже, что и массив параметра в .parameters.php
fChange:function(){ /*...*/ },//callback для вызова, при изменении параметра
getElements:function(){ /*...*/ }//возвращает объект со всеми параметрами компонента
}

На этом можно было бы и закончить, дальше каждый сам волен делать, что хочет. Но так как в руках у нас есть компонент, то посмотрим как это реализовано там.

map.google.view

1
2
3
4
5
6
7
8
9
10
11
12
13

function JCEditorOpener(arParams)
{
this.jsOptions = arParams.data.split('||');
this.arParams = arParams;

var obButton = document.createElement('BUTTON');//создаём кнопку
this.arParams.oCont.appendChild(obButton);// добавляем в контейнер

obButton.innerHTML = this.jsOptions[1];//текст из JS_DATA

obButton.onclick = BX.delegate(this.btnClick, this);//навешиваем callback'и
this.saveData = BX.delegate(this.__saveData, this);
}

По нажатию кнопки открывается диалог, который генерируется в /bitrix/components/bitrix/map.google.view/settings/settings.php. В запросе к settings.php передаётся текущее значение MAP_DATA.
settings.php:
Заголовок

1 2	$obJSPopup->ShowTitlebar(); $obJSPopup->StartDescription('bx-edit-menu');

1 2	<p><b>< ?echo GetMessage('MYMV_SET_POPUP_WINDOW_TITLE')?></b></p><!-- Заголовок диалогового окна--> <p class="note">< ?echo GetMessage('MYMV_SET_POPUP_WINDOW_DESCRIPTION')?></p><!-- Описание -->

Блок контента

1	$obJSPopup->StartContent();

Блок кнопок

1	$obJSPopup->StartButtons();

Кнопка сохранения

1	<input type="submit" value="<?echo GetMessage('MYMV_SET_SUBMIT')?/>" onclick="return jsGoogleCE.__saveChanges();"/>

1 2	$obJSPopup->ShowStandardButtons(array('cancel'));//кнопка отмены $obJSPopup->EndButtons();

в __saveChanges() данные сериализуются в строку и записываются в oInput, функцию сериализации на js в формат php можно взять/посмотреть в bitrix/components/bitrix/map.google.view/settings/settings_lod.js. А в компоненте десериализацию проводить из $arParam[~MAP_DATA].

03.09.2011