W systemie EGO CRM nie używa się statycznych okien modalnych, tj. okien, które są wstępnie wyrenderowane w kodzie HTML i po prostu ukryte do momentu kliknięcia przycisku otwarcia. Każde okno modalne jest renderowane co najmniej raz przy pierwszym wywołaniu okna modalnego. Renderowanie może odbywać się bezpośrednio przez kod js lub przez ajax.

Scenariusze otwierania okna modalnego (popup):

We wszystkich przypadkach pracy z oknami modalnymi używane są następujące parametry:

Dodatkowo rozważamy sposoby zamykania okna modalnego (jeśli jest to konieczne w scenariuszu):

Do renderowania przycisku otwierającego okno modalne używamy metody „btn” klasy „ui::”.
Do metody przekazywany jest parametr „btn_open_modal” z tablicą parametrów okna modalnego lub po prostu łańcuch jako zawartość okna modalnego.

Najprostszy przykład, przekazujemy do parametru «btn_open_modal» łańcuch - zawartość okna modalnego.

$args = array();
$args['btn_open_modal'] = '<p>My modal content, only string.</p>';
$args['text'] = 'Open modal';
$args['icon'] = array('window', 'far');
$str .= ui::btn($args);

W tym przykładzie przekazujemy do parametru «btn_open_modal» tablicę z parametrami okna modalnego.

$modal_args = array();
$modal_args['body'] = '<p>My modal content.</p>';
$modal_args['header'] = 'My modal title';
$modal_args['footer'] = 'My footer';
$modal_args['size'] = 'full';
$modal_args['theme'] = 'info';
//===
$args = array();
$args['btn_open_modal'] = $modal_args;
$args['text'] = 'Open modal';
$args['icon'] = array('window', 'far');
$str .= ui::btn($args);

W tym przykładzie używamy także:
- draggable: okno można przesuwać po ekranie
- backdrop=FALSE: okno nie zamyka się po kliknięciu poza jego obszarem.

$modal_args = array();
$modal_args['body'] = '<p>My modal content.</p><p><input name="my_input" class="form-control"></p>';
$modal_args['header'] = 'My modal title';
$modal_args['footer'] = 'My footer';
$modal_args['theme'] = 'warning';
$modal_args['placement'] = 'right';
$modal_args['draggable'] = true;
$modal_args['backdrop'] = false;
//===
$args = array();
$args['btn_open_modal'] = $modal_args;
$args['text'] = 'Open modal';
$args['icon'] = array('window', 'far');
$str .= ui::btn($args);

To samo co w poprzednim przykładzie, tylko dodano parametr „oneshot” z wartością TRUE.
Zwróć uwagę, że przy użyciu parametru „oneshot” konieczne jest przekazanie parametru „id”.
Przesuń okno w inne miejsce. Wpisz jakiś tekst w polu w oknie modalnym, następnie zamknij je i otwórz ponownie.

$modal_args = array();
$modal_args['body'] = '<p>My modal content.</p><p><input name="my_input" class="form-control"></p>';
$modal_args['header'] = 'My modal title';
$modal_args['footer'] = 'My footer';
$modal_args['theme'] = 'warning';
$modal_args['placement'] = 'right';
$modal_args['draggable'] = true;
$modal_args['backdrop'] = false;
$modal_args['id'] = set_id('my_modal_with_oneshot_ui');
$modal_args['oneshot'] = true;
//===
$args = array();
$args['btn_open_modal'] = $modal_args;
$args['text'] = 'Open modal';
$args['icon'] = array('window', 'far');
$str .= ui::btn($args);

Otwieramy okno modalne za pomocą JS.
Tworzymy przycisk i przypisujemy mu handler. W handlerze JS używamy helpera $$.oj_modal() z parametrami okna modalnego.

Zwróć uwagę, że helper „$$.oj_modal()” zwraca obiekt jquery okna modalnego.
Jest to ważne, jeśli później trzeba wykonać jakąś pracę z obiektem okna modalnego.
W naszym przykładzie wypisaliśmy obiekt okna modalnego w konsoli.

$args = array();
$args['handler_click'] = 'my_open_modal';
$args['text'] = 'Open modal';
$args['icon'] = array('blinds-open', 'far');
$str .= ui::btn($args);
$$.my_open_modal = function(){
	var modal_pars={};
	modal_pars.body = 'My content in modal from js.';
	modal_pars.size = 'sm';
	var modalObj = $$.oj_modal(modal_pars);
	console.log('modalObj', modalObj);
	return true;
}
$args = array();
$args['handler_click'] = 'my_open_modal_variant';
$args['text'] = 'Open modal';
$args['icon'] = array('blinds-open', 'far');
$str .= ui::btn($args);
$$.my_open_modal_variant = function(){
	var modal_pars={};
	modal_pars.body = 'My content in modal from js.';
	modal_pars.size = 'lg';
	modal_pars.draggable = true;
	modal_pars.backdrop = false;
	$$.oj_modal(modal_pars);
	return true;
}

W tym przykładzie w obsłudze JS zamkniemy okno modalne po 1 sekundzie, używając helpera „$$.oj_modal_close()”.
Jeśli nie przekażesz żadnych parametrów helperowi, zostaną zamknięte wszystkie okna modalne.
Jeśli masz otwartych kilka okien i chcesz zamknąć tylko konkretne, przekaż helperowi ID okna modalnego lub obiekt jQuery tego okna.

$args = array();
$args['handler_click'] = 'my_open_modal_and_close';
$args['text'] = 'Open modal';
$args['icon'] = array('blinds-open', 'far');
$str .= ui::btn($args);
$$.my_open_modal_and_close = function(){
	var modal_pars={};
	modal_pars.body = 'My content in modal from js.';
	modal_pars.theme = 'info';
	var modalObj = $$.oj_modal(modal_pars);
	setTimeout(function(){
		$$.oj_modal_close(modalObj);
	}, 1000);
	return true;
}

Zawartość przyszłego okna modalnego umieszczana jest w ukrytym elemencie HTML.
Zamiast parametru „body” w tablicy parametrów okna modalnego używamy parametru „body_from”, któremu przekazujemy ID elementu DOM zawierającego zawartość okna.

W tym przykładzie przycisk do otwarcia okna modalnego tworzymy za pomocą klasy

My modal content from hidden block.

Kliknij dwukrotnie, aby wyczyścić poleNaciśnij ENTER, aby zapisać
//=== Hidden block with content for modal
$str .= '<div id="'.set_id('my_modal_content').'" class="d-none">';
	$str .= e_p('My modal content from hidden block.', 'mb-3');
	$args = array();
	$args['name'] = 'my_input';
	$str .= ui::input_with_save($args);
$str .= '</div>';

//=== Button
$modal_args = array();
$modal_args['body_from'] = find_ele('my_modal_content');
$modal_args['header'] = 'My modal title';
$modal_args['draggable'] = true;
//===
$args = array();
$args['btn_open_modal'] = $modal_args;
$args['text'] = 'Open modal';
$args['icon'] = array('code', 'far');
$str .= ui::btn($args);

W przykładzie otwieramy okno modalne za pomocą JS.

My modal content from hidden block.

Kliknij dwukrotnie, aby wyczyścić poleNaciśnij ENTER, aby zapisać
//=== Hidden block with content for modal
$str .= '<div id="'.set_id('my_modal_content').'" class="d-none">';
	$str .= e_p('My modal content from hidden block.', 'mb-3');
	$args = array();
	$args['name'] = 'my_input';
	$str .= ui::input_with_save($args);
$str .= '</div>';

//=== Button
$args = array();
$args['handler_click'] = 'my_open_modal_body_from';
$args['text'] = 'Open modal';
$args['icon'] = array('code', 'far');
$str .= ui::btn($args);
$$.my_open_modal_body_from = function(){
	var modal_pars={};
	modal_pars.body_from = $$.find_ele('my_modal_content');
	modal_pars.size = false;
	modal_pars.theme = 'secondary';
	$$.oj_modal(modal_pars);
	return true;
}

Zawartość okna modalnego jest generowana po stronie serwera w kodzie PHP.
Przyciskowi przypisujemy handler.
W handlerze serwera używamy helpera „oj_modal()” do zwrócenia przygotowanej zawartości do okna modalnego.

W handlerze po stronie serwera tworzymy ciąg okna modalnego i przekazujemy helperowi «oj_modal()» tablicę z parametrami okna modalnego.

$args = array();
$args['handler_click'] = 'my_open_modal_ajax';
$args['text'] = 'Open modal';
$args['icon'] = array('server', 'far');
$str .= ui::btn($args);
public function my_open_modal_ajax() {
	$str = '';
	$str .= e_p('Modal content');
	$str .= e_p('Time: '.time());
	$header_str = mlang('my_header', 1);
	//===
	$modal_pars = array(
			'body'=>$str
		, 'header'=>$header_str
		, 'size'=>'lg'
		, 'theme'=>'primary'
		, 'draggable'=>true
	);
	oj_modal($modal_pars);
}

To samo, tylko dodajemy parametr „oneshot”.
Zwróć uwagę, że przy użyciu parametru „oneshot” konieczne jest przekazanie parametru „id”.
Zwróć uwagę na czas w oknie modalnym po zamknięciu i ponownym otwarciu okna.

$args = array();
$args['handler_click'] = 'my_open_modal_ajax_oneshot';
$args['text'] = 'Open modal';
$args['icon'] = array('server', 'far');
$str .= ui::btn($args);
public function my_open_modal_ajax_oneshot() {
	$str = '';
	$str .= e_p('Modal content');
	$str .= e_p('Time: '.time());
	$header_str = mlang('my_header', 1);
	//===
	$modal_pars = array(
			'body'=>$str
		, 'header'=>$header_str
		, 'size'=>'lg'
		, 'theme'=>'primary'
		, 'draggable'=>true
		, 'id'=>set_id('my_modal_with_oneshot_ajax')
		, 'oneshot'=>true
	);
	oj_modal($modal_pars);
}

W handlerze po stronie serwera tworzymy ciąg okna modalnego i przekazujemy helperowi «oj_modal()» tylko utworzony ciąg.

$args = array();
$args['handler_click'] = 'my_open_modal_ajax_only_string';
$args['text'] = 'Open modal';
$args['icon'] = array('server', 'far');
$str .= ui::btn($args);
public function my_open_modal_ajax_only_string() {
	$str = '';
	$str .= e_p('Modal content');
	$str .= e_p('Time: '.time());
	oj_modal($str);
}

Używamy parametru «_close_parent_modal» w różnych scenariuszach, aby zamknąć nadrzędne okno modalne, w którym znajduje się przycisk lub pole z handlerem, podczas wykonywania handlera.

W tym przykładzie wykorzystujemy ajax do generowania zawartości okna modalnego.
W oknie modalnym tworzymy pole za pomocą klasy „ui::”, przekazując do metody tworzenia pola parametr „_close_parent_modal”.
Okno modalne zamknie się tylko w przypadku braku błędu.
Spróbuj zapisać nieuzupełnione pole.

$args = array();
$args['handler_click'] = 'my_open_modal_close_parent_modal_1';
$args['text'] = 'Open modal';
$args['icon'] = array('eye', 'far');
$str .= ui::btn($args);
public function my_open_modal_close_panent_modal_1() {
	$str = '';
	$args = array();
	$args['name'] = 'my_input_1';
	$args['_close_parent_modal'] = true;
	$str .= ui::input_with_save($args);
	//===
	oj_modal($str);
}
public function save_my_input_1() {
	$val = ui::get_post_VAL();
	if(!empty($val)) {
		$success_text = 'VALUE: '.$val;
		//===
		ojsucc($success_text);
	}
	else ojerr(mlang('s_error__field_empty_warn', 1));
}

W tym przykładzie również wykorzystujemy ajax do generowania zawartości okna modalnego.
Jednak przy tworzeniu pola w oknie modalnym za pomocą klasy „ui::” nie używamy parametru „_close_parent_modal”.
Parametr „_close_parent_modal” używamy w zwracającym helperze „oj_ret()” bezpośrednio w handlerze zapisu pola.
Dzięki temu okno modalne zamknie się dopiero po otrzymaniu instrukcji zamknięcia w zwracanych danych po wykonaniu obsługi.
W tym przykładzie zamykamy okno tylko w przypadku udanej operacji.

$args = array();
$args['handler_click'] = 'my_open_modal_close_parent_modal_2';
$args['text'] = 'Open modal';
$args['icon'] = array('eye', 'far');
$str .= ui::btn($args);
public function my_open_modal_close_panent_modal_2() {
	$str = '';
	$args = array();
	$args['name'] = 'my_input_2';
	$str .= ui::input_with_save($args);
	//===
	oj_modal($str);
}
public function save_my_input_2() {
	$val = ui::get_post_VAL();
	if(!empty($val)) {
		$success_text = 'VALUE: '.$val;
		//===
		oj_ret('_close_parent_modal', true);
		//===
		ojsucc($success_text);
	}
	else ojerr(mlang('s_error__field_empty_warn', 1));
}

To samo co w poprzednim przykładzie, ale teraz używamy «oj_ret('_close_parent_modal')» do zamknięcia okna modalnego w każdym przypadku, nawet przy błędzie.

$args = array();
$args['handler_click'] = 'my_open_modal_close_parent_modal_3';
$args['text'] = 'Open modal';
$args['icon'] = array('eye', 'far');
$str .= ui::btn($args);
public function my_open_modal_close_panent_modal_3() {
	$str = '';
	$args = array();
	$args['name'] = 'my_input_3';
	$str .= ui::input_with_save($args);
	//===
	oj_modal($str);
}
public function save_my_input_3() {
	$val = ui::get_post_VAL();
	//===
	oj_ret('_close_parent_modal', true);
	//===
	if(!empty($val)) {
		$success_text = 'VALUE: '.$val;
		//===
		ojsucc($success_text);
	}
	else ojerr(mlang('s_error__no_data', 1));
}

Specjalne parametry, analogiczne do «btn_open_modal», do otwierania w oknie modalnym plików multimedialnych (audio, wideo, tekstowych i PDF) z uwzględnieniem typu mediów.

Otwórz obraz w oknie modalnym.
Używamy tych samych parametrów okna modalnego w tablicy dla parametru „btn_open_img”, z wyjątkiem:
„body” i „body_from”. Zamiast nich musi być przekazany parametr „src” z linkiem do obrazka (o linkach do obrazów czytaj w dokumentacji).

Używamy przycisku stworzonego klasą „ui::”.
Parametrowi „btn_open_img” przekazujemy tablicę parametrów okna modalnego.

$img_args = array();
$img_args['src'] = media_link('3e1861d3864ba55b27a8');
$img_args['theme'] = 'primary';
$img_args['draggable'] = true;
$img_args['id'] = set_id('my_modal_100');
$img_args['oneshot'] = true;
//===
$args = array();
$args['btn_open_img'] = $img_args;
$args['text'] = 'Open image';
$args['icon'] = array('image', 'far');
$str .= ui::btn($args);

Używamy przycisku stworzonego klasą „ui::”.
Parametrowi „btn_open_img” przekazujemy tylko łańcuch z linkiem.

$args = array();
$args['btn_open_img'] = media_link('c1c3ad469424684ae939');
$args['text'] = 'Open image';
$args['icon'] = array('image', 'far');
$str .= ui::btn($args);

Używamy instrukcji ajax do otwierania obrazka w oknie modalnym, w handlerze serwera korzystamy z helpera „oj_img()”.
W tym przykładzie przekazujemy helperowi tablicę parametrów okna modalnego.
Zwróć uwagę, że helper „oj_img()” jest warunkowo finalizujący, tzn. domyślnie kończy działanie skryptu i wysyła dane przez ajax (exit). Aby zapobiec zakończeniu działania skryptu, przekaż drugiego argumentu „FALSE", jak w tym przykładzie, aby po wykonaniu helpera wysłać też komunikat (ojsucc()).

$args = array();
$args['handler_click'] = 'my_handler_and_open_img_3';
$args['text'] = 'Action';
$args['icon'] = array('image', 'far');
$str .= ui::btn($args);
public function my_handler_and_open_img_3() {
	$img_pars = array(
			'src'=>media_link('674f1e5c680c360b6d64')
		, 'header'=>'My image'
		, 'size'=>'lg'
		, 'theme'=>'warning'
		, 'draggable'=>true
		, 'auto_close'=>1200
	);
	oj_img($img_pars, false);
	ojsucc(true, 1200);
}

Tak samo jak w poprzednim przykładzie używamy helpera „oj_img()”.
Jednak w tym przykładzie przekazujemy helperowi tylko link do obrazka.

$args = array();
$args['handler_click'] = 'my_handler_and_open_img_4';
$args['text'] = 'Action';
$args['icon'] = array('image', 'far');
$str .= ui::btn($args);
public function my_handler_and_open_img_4() {
	oj_img(media_link('011ab21242e86e7d7635'));
}

Otwieramy obraz bezpośrednio z kodu JS.
W handlerze JS używamy helpera „$$.oj_img()”.
Helperowi można przekazać obiekt z parametrami okna modalnego lub tylko link do obrazka.

$args = array();
$args['handler_click'] = 'my_open_img_in_js';
$args['text'] = 'Open image';
$args['icon'] = array('image', 'far');
$str .= ui::btn($args);
$$.my_open_img_in_js = function(){
	var img_pars={};
	img_pars.src = $$.media_link('d0123b5368a11f8fed76');
	img_pars.theme = 'secondary';
	img_pars.draggable = true;
	img_pars.id = $$.set_id('my_modal_img_js');
	img_pars.oneshot = true;
	$$.oj_img(img_pars);
	return true;
}

Otwórz wideo Youtube w oknie modalnym.
Używamy tych samych parametrów okna modalnego w tablicy dla parametru „btn_open_youtube”, z wyjątkiem:
„body” i „body_from”. Zamiast nich musi być przekazany parametr „src” z identyfikatorem wideo Youtube.

Specjalne parametry dodatkowe.

  • Proporcje obrazu wideo, parametr «aspect_ratio». Do tego parametru możesz przekazać jedną z następujących wartości:

    «21by9», «16by9», «4by3», «1by1» Domyślnie: «16by9».

  • Parametry odtwarzacza Youtube. Przeczytaj o parametrach w dokumentacji odtwarzacza Youtube.

    Do tych parametrów należą:

    «youtube_autoplay», «youtube_cc_load_policy», «youtube_controls», «youtube_disablekb», «youtube_end», «youtube_fs», «youtube_iv_load_policy», «youtube_rel», «youtube_showinfo», «youtube_start»

Używamy przycisku stworzonego klasą „ui::”.
Parametrowi „btn_open_youtube” przekazujemy tablicę parametrów okna modalnego.

$youtube_args = array();
$youtube_args['src'] = 'zpOULjyy-n8';
$youtube_args['draggable'] = true;
$youtube_args['youtube_disablekb'] = true;
//===
$args = array();
$args['btn_open_youtube'] = $youtube_args;
$args['text'] = 'Open youtube video';
$args['icon'] = array('tv', 'far');
$str .= ui::btn($args);

Używamy przycisku stworzonego klasą „ui::”.
Parametrowi „btn_open_youtube” przekazujemy tylko identyfikator wideo Youtube.

$args = array();
$args['btn_open_youtube'] = 'zpOULjyy-n8';
$args['text'] = 'Open youtube video';
$args['icon'] = array('tv', 'far');
$str .= ui::btn($args);

Używamy instrukcji ajax do otwierania wideo Youtube w oknie modalnym, w handlerze serwera korzystamy z helpera „oj_youtube()”.
W tym przykładzie przekazujemy helperowi tablicę parametrów okna modalnego.
Zwróć uwagę, że helper „oj_youtube()” jest warunkowo finalizujący, tzn. domyślnie kończy działanie skryptu i wysyła dane przez ajax (exit). Aby zapobiec zakończeniu działania skryptu, przekaż drugiego argumentu „FALSE", jak w tym przykładzie, aby po wykonaniu helpera wysłać też komunikat (ojsucc()).

$args = array();
$args['handler_click'] = 'my_handler_and_open_youtube_3';
$args['text'] = 'Action';
$args['icon'] = array('tv', 'far');
$str .= ui::btn($args);
public function my_handler_and_open_youtube_3() {
	$youtube_pars = array(
			'src'=>'zpOULjyy-n8'
		, 'header'=>'My Youtube video'
		, 'size'=>'lg'
		, 'theme'=>'warning'
		, 'draggable'=>true
		, 'auto_close'=>2500
		, 'youtube_autoplay'=>false
	);
	oj_youtube($youtube_pars, false);
	ojsucc(true, 1200);
}

Tak samo jak w poprzednim przykładzie używamy helpera „oj_youtube()”.
Jednak w tym przykładzie przekazujemy helperowi tylko identyfikator wideo Youtube.

$args = array();
$args['handler_click'] = 'my_handler_and_open_youtube_4';
$args['text'] = 'Action';
$args['icon'] = array('tv', 'far');
$str .= ui::btn($args);
public function my_handler_and_open_youtube_4() {
	oj_youtube('zpOULjyy-n8');
}

Otwieramy film Youtube bezpośrednio z kodu JS.
W tym celu w handlerze JS używamy helpera «$$.oj_youtube()».
Helperowi, podobnie jak w poprzednich przykładach, można przekazać obiekt z parametrami okna modalnego lub tylko identyfikator filmu Youtube.
Zwróć uwagę, że w tym przykładzie używamy również parametru «oneshot» (konieczne jest także przekazanie parametru «id»), więc okno z filmem Youtube nie zostanie zniszczone, a tylko zamknięte, zapewniając pauzę w odtwarzaniu wideo.

$args = array();
$args['handler_click'] = 'my_open_youtube_in_js';
$args['text'] = 'Open youtube video';
$args['icon'] = array('tv', 'far');
$str .= ui::btn($args);
$$.my_open_youtube_in_js = function(){
	var youtube_pars={};
	youtube_pars.src = 'zpOULjyy-n8';
	youtube_pars.id = $$.set_id('my_modal_youtube_oneshot');
	youtube_pars.oneshot = true;
	youtube_pars.theme = 'secondary';
	youtube_pars.draggable = true;
	$$.oj_youtube(youtube_pars);
	return true;
}

Otwiera pliki audio, wideo lub tekstowe w zależności od ich typu.
Używamy tych samych parametrów okna modalnego w tablicy dla parametru „btn_open_youtube”, z wyjątkiem:
„body” i „body_from”. Zamiast nich musi być przekazany parametr „src” z linkiem do pliku.

Specjalne parametry dodatkowe.

  • * Parametr obowiązkowy, typ mediów «media_ident». Ten parametr wyjaśnia skryptom, jak otworzyć ten plik. Użyj jednego z następujących typów:

    • audio: otwórz do odtwarzania plik audio
    • video: otwórz do oglądania plik wideo
    • text: otwórz do oglądania plik tekstowy
    • pdf: otwórz do oglądania plik PDF

Tak więc do parametru «btn_open_media» może być przekazana tylko tablica, która musi zawierać dwa obowiązkowe parametry: «src» i «media_ident».

Używamy przycisku stworzonego klasą „ui::”.
W tym przykładzie odtwarzamy audio.

$media_args = array();
$media_args['src'] = media_link('dffe554669f542d8c1d2');
$media_args['media_ident'] = 'audio';
$media_args['theme'] = 'primary';
$media_args['draggable'] = true;
$media_args['id'] = set_id('my_modal_audio');
$media_args['oneshot'] = true;
//===
$args = array();
$args['btn_open_media'] = $media_args;
$args['text'] = 'Open audio';
$args['icon'] = array('music', 'far');
$str .= ui::btn($args);

Używamy przycisku stworzonego klasą „ui::”.
W tym przykładzie otwieramy plik tekstowy.

$media_args = array();
$media_args['src'] = media_link('11a22a2a4488978d63a2');
$media_args['media_ident'] = 'text';
$media_args['size'] = 'lg';
//===
$args = array();
$args['btn_open_media'] = $media_args;
$args['text'] = 'Open text file';
$args['icon'] = array('file-alt', 'far');
$str .= ui::btn($args);

Używamy instrukcji ajax do otwierania pliku multimedialnego w oknie modalnym, w handlerze serwera korzystamy z helpera „oj_media()”.
Zwróć uwagę, że helper „oj_media()” jest warunkowo finalizujący, tzn. domyślnie kończy działanie skryptu i wysyła dane przez ajax (exit). Aby zapobiec zakończeniu działania skryptu, przekaż drugiego argumentu „FALSE", jak w tym przykładzie, aby po wykonaniu helpera wysłać też komunikat (ojsucc()).
W tym przykładzie otwieramy plik pdf.

$args = array();
$args['handler_click'] = 'my_handler_and_open_media_3';
$args['text'] = 'Open PDF-file';
$args['icon'] = array('file-pdf', 'far');
$str .= ui::btn($args);
public function my_handler_and_open_media_3() {
	$media_pars = array(
			'src'=>media_link('1e43b08a10407efcc57a')
		, 'media_ident'=>'pdf'
		, 'header'=>'My PDF'
		, 'theme'=>'primary'
		, 'draggable'=>true
	);
	oj_media($media_pars, false);
	ojsucc(true, 1200);
}

Otwieramy plik multimedialny bezpośrednio z kodu JS.
W handlerze JS używamy helpera „$$.oj_media()”.
W tym przykładzie oglądamy plik wideo.

$args = array();
$args['handler_click'] = 'my_handler_and_open_media_4';
$args['text'] = 'Open video file';
$args['icon'] = array('video', 'far');
$str .= ui::btn($args);
$$.my_handler_and_open_media_4 = function(){
	var media_pars={};
	media_pars.src = $$.media_link('a83d9e3079530dc4edc2');
	media_pars.media_ident = 'video';
	media_pars.theme = 'secondary';
	media_pars.id = $$.set_id('my_media_video');
	media_pars.oneshot = true;
	$$.oj_media(media_pars);
	return true;
}