Instalacja na stronie internetowej obiektu - plugin Plaza Booking Engine

[plazaweb]

Strona obiektu musi obsługiwać bibliotekę jQuery w wersji 3 i wyższej.

W pierwszej kolejności należy dodać do kodu źródłowego strony internetowej obiektu poniższy skrypt (po skrypcie ładującym bibliotekę jQuery). Parametr {domena} wskazuje na domenę, pod którą znajduje się BE.

Kod: Zaznacz cały

<script src="https://{domena}/assets/bg/js/plugin.js"></script>

Następnie w wybranym miejscu na podstronie dodać przycisk, który po kliknięciu otworzy okno modalne np.:

Kod: Zaznacz cały

<button id="openModalBE" class="btn btn-pink">Rezerwuj</button>

Kolejnym krokiem jest dodanie obsługi zdarzenia kliknięcia dla powyższego przycisku. Parametr {id_obiektu} to identyfikator obiektu z Plaza lub wartość 'all', gdy chcemy wyświetlić listę obiektów (w przypadku bazy z wieloma obiektami).

Kod: Zaznacz cały

<script>
  $(function() {
    openPlazaWebBE('#openModalBE', {'url': 'https://{domena}/bg/ob/{id_obiektu}/0'});
  });
</script>

Funkcja openPlazaWebBE przyjmuje dwa parametry:
- id lub klasa przycisku otwierającego okno modalne
- obiekt ustawień

Obiekt ustawień może zawierać następujące pola:
- url: wymagany - adres url do wyświetlenia w oknie
- checkin: opcjonalny - data przyjazdu w postaci Y-m-d np '2026-01-01'
- checkout: opcjonalny - data wyjazdu w postaci Y-m-d np. '2026-01-05'
- adults: opcjonalny - ilość dorosłych
- children: opcjonalny - łączna ilość dzieci
- child_age[n]: wymagany w przypadku wartości parametru children > 0 - ilość dzieci w n-tej kategorii wiekowej (należy podać ilość dzieci dla wszystkich kategorii)
- roomtypeId: opcjonalny - lista identyfikatorów typu pokoju z Plaza oddzielonych przecinkiem, podanie parametru spowoduje zawężenie listy typów pokoi do wskazanych np. '23', '2,9,15'

Przykładowy obiekt ustawień:

Kod: Zaznacz cały

{
  'url': 'https://{domena}/bg/ob/{id_obiektu}/0',
  'checkin': '2026-01-01',
  'checkout': '2026-01-05',
  'adults': 2,
  'children': 2,
  'child_age[0]': 0,
  'child_age[1]': 1,
  'child_age[2]: 1,
  'roomtypeId': '10'
}

Wyświetlone okno modalne pojawi się zasłaniając całą stronę internetową obiektu. W celu dostosowania okna do własnych preferencji należy dodać do strony odpowiednie style dla klas:
- pw-modal
- pw-modal-header
- pw-modal-title
- pw-modal-content
- pw-modal-close