Wstęp
Każdy gadżet osadzony w dashboardzie ma mieć możliwość wykonywania akcji przy użyciu skryptów JavaScript.
W momencie załadowania widoku gadżetu, dostępny jest już dla niego obiekt Gadget, który reprezentuje ten gadżet i udostępnia zestaw metod, dzięki którym może np. zmienić tytuł gadżetu czy wyświetlić okno konfiguracji.
Przykład pojedynczego widoku gadżetu (w technologii FreeMarker).
| Code Block |
|---|
| language | html/xml |
|---|
| title | Przykładowy widok .ftl gadżetu |
|---|
|
<!-- pomocnicze macro -->
<#import "/plugin.ftl" as plugin/>
<!-- ... ... -->
<!-- Skrypt wykorzystujący GadgetApi -->
<script type="text/javascript">
// zmiana tytułu
Gadget.setTitle('<@plugin.message "gadget.title"/>');
// automatyczne odświeżanie gadżetu za refreshInterval
Gadget.refresh(${refreshInterval});
</script> |
Gadget API
Poniżej przedstawiono wszystkie dostępne metody obiektu Gadget.
| Metoda | Parametry | Opis |
|---|
| isOwner | | Zwraca true, jeżeli aktualnie zalogowany użytkownik jest właścicielem dashboardu. | Expand |
|---|
| | Code Block |
|---|
| if(Gadget.isOwner()){
// konfiguracja etc...
} |
|
|
| getId | | Zwraca identyfikator gadżetu | Expand |
|---|
| | Code Block |
|---|
| var id = Gadget.getId(); |
|
|
| getKey | | Zwraca klucz gadżetu. Klucz gadżetu składa się z klucza wtyczki oraz klucza modułu np. com.suncode.plugin.dashboard:introduction | Expand |
|---|
| | Code Block |
|---|
| var key = Gadget.getKey(); |
|
|
| getTitle | | Zwraca aktualny tytuł gadżetu | Expand |
|---|
| | Code Block |
|---|
| var title = Gadget.getTitle();
|
|
|
| setTitle | - title: nowy tytuł gadżetu
| Zmienia tekst belki tytułowej gadżetu | Expand |
|---|
| | Code Block |
|---|
| Gadget.setTitle('tytuł');
|
|
|
| refreshSize | | Uaktualnia rozmiar gadżetu do jego poprawnej wysokości. Wykorzystywane, chcemy wymusić ponowne obliczenie automatycznej wysokości gadżetu (np. załadowanie dynamicznej treści). | Expand |
|---|
| | Code Block |
|---|
| Gadget.refreshSize();
|
|
|
| hasAutoHeight | | Zwraca true jeżeli gadżet ma zaznaczoną opcję Dopasowana wysokość. Tak skonfigurowany gadżet próbuje dopasować się do faktycznej zawartości. | Expand |
|---|
| | Code Block |
|---|
| if(Gadget.hasAutoHeight() == false){
// akcja
} |
|
|
| enableAutoHeight | | Włącza opcję Dopasowana wysokość. Wysokość gadżetu zostanie dopasowana do zawartości. | Expand |
|---|
| | Code Block |
|---|
| Gadget.enableAutoHeight(); |
|
|
| getHeight | | Pobiera wysokość gadżetu w pixelach. | Expand |
|---|
| | Code Block |
|---|
| var h = Gadget.getHeight(); |
|
|
| setHeight | - height: nowa wysokość gadżetu (int)
| Zmienia wysokość gadżetu. Jeżeli opcja Dopasowana wysokość była aktywna, zostanie ona wyłączona. | Expand |
|---|
| | Code Block |
|---|
| Gadget.setHeight(500); |
|
|
| refresh | - timeout (opcjonalny) : okres (w sekundach), za który gadżet ma zostać odświeżony
| Info |
|---|
| Jeżeli timeout jest pusty lub timeout<0to gadżet zostanie odświeżony natychmiast |
. | Odświeża gadżet, pobierając ponownie zawartość gadżetu zgodnie z jego url. Podczas odświeżenia widoczna jest maska ładowania. | Info |
|---|
| Odświeżenie powoduje wczytanie strony i wszystkich skryptów od nowa, dlatego funkcja nie udostępnia żadnego callback'u. |
| Expand |
|---|
| | Code Block |
|---|
| // odśwież natychmiast
Gadget.refresh();
Gadget.refresh(0);
// odśwież za 60 minut
Gadget.refresh(60);
// nie odświeżaj
Gadget.refresh(-1);
|
|
|
| showConfiguration | - forceChange (opcjonalny): jeżeli true:
- wyświetlone okno nie ma przycisku Anuluj, co wymusza na użytkowniku zmianę ustawień na poprawne wartości.
| Wyświetla widok konfiguracji gadżetu, opcjonalnie zmuszając go do poprawienia konfiguracji. | Info |
|---|
Po zapisaniu konfiguracji gadżet jest automatycznie odświeżany |
| Expand |
|---|
| | Code Block |
|---|
| Gadget.showConfiguration(true); |
|
|
| getProperties | | Zwraca wszystkie właściwości gadżetu. Zwrócony obiekt ma następującą budowę: | Code Block |
|---|
| {
'propertyname': {
name: 'propertyname',
value: 'propertyValue',
type: 'text'
},
'secondproperty': {
...
},
...
} |
| Note |
|---|
Właściwości są odczytywane przed wywołaniem kontrolera gadżetu, dlatego zmiany właściwości w tym kontrolerze nie będą widoczne, do następnego odświeżenia gadżetu. |
| Expand |
|---|
| | Code Block |
|---|
| // pobranie wszystkich
var props = Gadget.getProperties();
// pobranie konkretnej właściwości
var nameProperty = props['name'] |
|
|
| getProperty | - name: nazwa właściwości, którą chcemy odczytać
| Odczytuje podaną właściwość po nazwie. Wynik: | Code Block |
|---|
| {
name: 'name',
value: 'value',
type: 'text'
} |
| Expand |
|---|
| | Code Block |
|---|
| var nameProperty = Gadget.getProperty('name'); |
|
|
| Zdarzenia na gadżecie |
|---|
| onResize | - function: funkcja, wywołana podczas zmiany wysokości gadżetu
- parametry przekazane do funkcji
- component - komponent (panel gadżetu)
- newHeight - nowa wysokość w pixelach
- newWidth- nowa szerokość w pixelach
- scope (opcjonalny): scope w którym wywołana będzie funkcja
| Dodaje EventListener do zdarzenia Resize panelu. | Expand |
|---|
| | Code Block |
|---|
| Gadget.onResize(function(gadget){
console.log('Resized');
}); |
|
|
| onCollapse | - function: funkcja, wywołana podczas zwijania gadżetu
- scope (opcjonalny): scope w którym wywołana będzie funkcja
| Dodaje EventListener do zdarzenia Collapse panelu. | Expand |
|---|
| | Code Block |
|---|
| Gadget.onCollapse(function(gadget){
console.log('Collapsed');
}); |
|
|
| onExpand | - function: funkcja, wywołana podczas rozwijania gadżetu
- scope (opcjonalny): scope w którym wywołana będzie funkcja
| Dodaje EventListener do zdarzenia Expand panelu.
| Expand |
|---|
| | Code Block |
|---|
| Gadget.onExpand(function(gadget){
console.log('Expanded');
}); |
|
|