Tworzenie niestandardowych układów sekcji za pomocą API

W usłudze Oracle Content Management można tworzyć niestandardowe układy sekcji za pomocą Section Layout API, zawierającego Rendering API i Editing API.

Pliki z zestawu początkowego, którym warto się przyjrzeć, są omówione pod hasłem Tworzenie układu sekcji. Pliki z zestawu początkowego, przeznaczone dla układów sekcji, zawierają szczegółowe komentarze opisujące strukturę plików układu sekcji.

Rendering API

Rendering API, ładowane z modułu render.js, są używane w konstruktorze serwisów oraz w trybie wykonawczym.

Rendering API Opis Parametry wejściowe Wynik po wykonaniu
(Constructor) Inicjalizuje moduł renderowania układu sekcji.

Obiekt JavaScript zawierający następujące właściwości:

  • sectionlayoutData (obiekt) : Dane układu sekcji wykryte w modelu strony.

  • componentId (napis): Wartość componentId układu sekcji (zazwyczaj GUID).

  • renderMode (napis; opcjonalne): Tryb renderowania podczas operacji renderowania.

  • customSettingsData (obiekt): Kopia właściwości customSettingsData zawartej w danych sectionLayoutData.

Są inicjalizowane Rendering API służące do renderowania układu sekcji.
render

Emituje do strony elementy DOM odpowiednie dla układu sekcji, w tym elementy "container DIV" dla składników podrzędnych.

container (element) : Element DOM, w którym będzie renderowany kod znacznikowy układu sekcji.

Gdy ta metoda zostanie wykonana, będą renderowane składniki podrzędne.

Składniki podrzędne można zidentyfikować, odnajdując podrzędne elementy div[id]

addComponent

Używana ze składnikami "lista zawartości" do dynamicznego dodawania składników podrzędnych do układu sekcji.

Ta funkcja jest opcjonalna.

container (element) : Element DOM, w którym będzie renderowany nowy składnik.

componentId (napis): ID nowego składnika dodawanego do układu sekcji.

Gdy ta metoda zostanie wykonana, będzie renderowany element, którego ID jest zgodny z wejściową wartością componentId.

Editing API

Moduł edit.js jest ładowany, jeśli właściwość hasEditHandlers jest ustawiona na wartość true w pliku appinfo.json powiązanym z układem sekcji.

Editing API są używane w konstruktorze serwisów.

Wszystkie funkcje w tym module, z wyjątkiem funkcji Constructor, są opcjonalne.

Editing API Opis Parametry wejściowe Wynik po wykonaniu
(Constructor) Inicjalizuje moduł edycji układu sekcji.

Obiekt JavaScript zawierający następującą właściwość:

  • componentId (napis): Wartość componentId układu sekcji (zazwyczaj GUID).

Są inicjalizowane Editing API służące do edytowania układu sekcji.

getCapabilities

Zwraca obiekt opisujący możliwości edytowania układu sekcji.

Obiekt JavaScript opisujący możliwości edytowania układu sekcji.

Po wprowadzeniu, do funkcji zostaną przekazane możliwości domyślne. Jeśli trzeba, funkcja może modyfikować obiekt Capabilities.

Obiekt Capabilities może zawierać następujące możliwości:

  • title (napis): Tytuł układu sekcji wyświetlany użytkownikowi.

  • settingsTitle (napis): Tytuł wyświetlany w oknie dialogowym "Panel ustawień".

  • hasSettings (wartość_logiczna): Sygnalizuje, czy panel ustawień jest obsługiwany przez układ sekcji.

  • allowMove (wartość_logiczna): Sygnalizuje, czy układ sekcji zezwala na przenoszenie elementów podrzędnych.

  • allowDelete (wartość_logiczna): Sygnalizuje, czy układ sekcji zezwala na usuwanie elementów podrzędnych.

  • isHidden (wartość_logiczna): Sygnalizuje, czy układ sekcji jest obecnie ukrywany w odpowiedzi na opcje użytkownika.

  • dropTarget (wartość_logiczna): Sygnalizuje, czy układ sekcji jest celem dla operacji "przeciągnij i upuść".

  • customMenuOptions (tablica): Niestandardowe opcje menu dodawane do podręcznego menu układu sekcji. Każdy obiekt menu-option ma następujące właściwości:

    • label (etykieta) : Wyświetlany tekst opcji menu.

    • action (funkcja): Funkcja wywoływana, gdy użytkownik wybierze tę opcję menu.

    • disabled (wartość_logiczna): Sygnalizuje, czy opcja menu ma być wyświetlana w stanie wyłączenia.

    • icon (etykieta) : URL wyświetlany obok etykiety opcji menu. (Ta właściwość jest zarezerwowana do użycia w przyszłości.)

    • checkmark (etykieta) : Sygnalizuje, czy obok etykiety opcji menu powinien być wyświetlany znacznik.

    • subMenuItems (tablica): Opcje wyświetlane w podmenu.

(Obiekt): Możliwości układu sekcji.

getCaptionContent

Zwraca wyświetlaną nazwę układu sekcji, która to nazwa będzie się pojawiać w elementach UI.

Brak.

(Napis): Wyświetlana nazwa układu sekcji.

filterCapabilities

Umożliwia układowi sekcji modyfikowanie obiektu Capabilities, zanim menu zostaną wyświetlone użytkownikowi.

Tego API można używać do dostosowywania lub usuwania opcji menu. (Zob. także: getCapabilities.)

Obiekt JavaScript opisujący możliwości edytowania układu sekcji. Po wprowadzeniu, do funkcji zostaną przekazane możliwości domyślne.

(Obiekt): Możliwości układu sekcji.
onDragOver Funkcja wywoływana podczas operacji "przeciągnij i upuść", służąca do zasygnalizowania, czy przeciągany element można przeciągnąć do układu sekcji.

eventObject (obiekt event): Obiekt event przechowujący informacje o zdarzeniu przeciągania.

dataTransfer (obiekt DataTransfer): Obiekt DataTransfer przechowujący informacje o elemencie przeciąganym do układu sekcji.

(Wartość logiczna): Wartość sygnalizująca, czy przeciągany element może zostać przyjęty przez układ sekcji.

Jeśli przeciągany element może zostać przyjęty przez układ sekcji, jest zwracana wartość true; w przeciwnym razie — wartość false.

onDrop Funkcja wywoływana podczas czynności "upuść" z operacji "przeciągnij i upuść", służąca do zasygnalizowania, czy przeciągany element powinien zostać umieszczony w układzie sekcji.

eventObject (obiekt event): Obiekt event przechowujący informacje o zdarzeniu upuszczenia.

dataTransfer (obiekt DataTransfer): Obiekt DataTransfer przechowujący informacje o elemencie upuszczanym do układu sekcji.

(Wartość logiczna): Wartość sygnalizująca, czy operacja upuszczania została obsłużona przez układ sekcji.

Jeśli jest zwraca wartość true, logika domyślna jest pomijana.

onAddComponent Powiadamia układ sekcji, że element został — wskutek operacji "przeciągnij i upuść" — dodany do układu sekcji.

eventObject (obiekt event): Obiekt event przechowujący informacje o zdarzeniu przeciągania.

dataTransfer (obiekt DataTransfer): Obiekt DataTransfer przechowujący informacje o elemencie upuszczanym do układu sekcji.

componentId (napis): Wartość componentId nowo dodanego elementu.

Powiadomienie układu sekcji.
onMoveComponent

Powiadamia układ sekcji, że element został — wskutek operacji "przeciągnij i upuść" — przeniesiony do układu sekcji.

eventObject (obiekt event): Obiekt event przechowujący informacje o zdarzeniu przeciągania.

dataTransfer (obiekt DataTransfer): Obiekt DataTransfer przechowujący informacje o elemencie upuszczanym do układu sekcji.

componentId (napis): Wartość componentId przeniesionego elementu.

Powiadomienie układu sekcji.
getSettingsData

Umożliwia układowi sekcji zmianę danych dla ustawień, zanim zostanie wyświetlony panel ustawień.

settingsData (obiekt): Domyślne dane ustawień, obliczone dla układu sekcji.

(Obiekt): Dane ustawień układu sekcji.
updateSettings

Umożliwia układowi sekcji zmianę swoich ustawień po zamknięciu panelu ustawień.

Ten API jest wywoływany tuż przed składowaniem ustawień w modelu strony.

parameters (obiekt): Obiekt "raw parameters" zwracany z panelu ustawień.

sectionLayoutData (obiekt) : Dane układu sekcji, które będą składowane. Dane domyślne zostaną wygenerowane z metody parameters (obiekt) i przekazane w tym parametrze do funkcji.

(Obiekt): Dane układu sekcji do przechowania w modelu strony.
dispose

Umożliwia modułowi edycyjnemu zwalnianie pamięci, odłączanie zdarzeń oraz dezalokację zasobów powiązanych z procedurami obsługi edycji.

Ten API jest wywoływany, gdy trzeba całkowicie odświeżyć układ sekcji, na przykład w przypadku operacji Cofnij/Ponów.

Brak. Odświeżanie układu sekcji jest włączone.