prototype.js -- notatki programisty
Dotyczy wersji 1.4.0
| Jak napisać |
|---|
Praca dyplomowa odciąga Cię od pisania kodu?
Odzyskaj swój czas
|
| Szkolenie Django |
Nowość: warsztaty z tworzenia serwisów internetowych w Django.
|
| Druga edycja: 13 stycznia 2009. |
Co to takiego?
Prototype.js, jeśli jeszcze nie spotkałeś się z tą nazwą, jest biblioteką dla języka JavaScript napisaną przez Sama Stephensona. Ten przemyślany i bardzo dobrze napisany kawałek zgodnego ze standardami kodu usuwa dużą część kłopotów pojawiających się podczas tworzenia złożonych, interaktywnych stron WWW kojarzonych z Web 2.0.
Jeśli już próbowałeś korzystać z tej biblioteki, to najprawdopodobniej zauważyłeś już że dokumentacja nie należy do jej najmocniejszych stron. Jak wielu programistów przede mną, nauczyłem się korzystać z prototype.js metodą czytania źródeł i eksperymentów. Pomyślałem, że dobrze byłoby zbierać i udostępniać innym notatki z tego, czego udaje mi się dowiedzieć.
Spisałem też nieoficjalną instrukcję obsługi obiektów, klas, funkcji i rozszerzeń tworzących tę bibliotekę.
Programiści znający już Ruby mogą zwrócić uwagę na celowe podobieństwo wielu elementów biblioteki Prototype do standardowych klas tego języka.
Funkcje pomocnicze
Prototype.js udostępnia wiele predefiniowanych obiektów i funkcji pomocniczych. Oczywistym powodem jest to, że pozwalają oszczędzić programiście pisania powtarzającego się kodu.
Funkcja $()
$() jest wygodnym odpowiednikiem bardzo często używanej funkcji document.getElementById() obiektowego modelu dokumentu -- zwraca element o identyfikatorze podanym funkcji jako parametr.
Dodatkowo, jeśli jako parametr poda się więcej niż jeden identyfikator, to $() zwróci tablicę (obiekt klasy Array) zawierającą wszystkie żądane elementy. Na przykład:
<HTML> <HEAD> <TITLE> Test Page </TITLE> <script src="prototype-1.4.0.js"></script> <script> function test1() { var d = $('myDiv'); alert(d.innerHTML); } function test2() { var divs = $('myDiv','myOtherDiv'); for(i=0; i<divs.length; i++) { alert(divs[i].innerHTML); } } </script> </HEAD> <BODY> <div id="myDiv"> <p>To jest akapit</p> </div> <div id="myOtherDiv"> <p>A to kolejny akap</p> </div> <input type="button" value=Test1 onclick="test1();"><br> <input type="button" value=Test2 onclick="test2();"><br> </BODY> </HTML>
Kolejną zaletą $() jest to, że jako parametr można jej przekazać zarówno ID elementu strony, jak i sam element -- efekt będzie ten sam. Przydaje się to podczas pisania funkcji, które akceptują oba warianty parametrów.
Funkcja $F()
$F() to kolejny przydatny skrót. Zwraca wartość pola tekstowego, listy wyboru albo innego pola formularza o podanym identyfikatorze. Ta funkcja również przyjmuje jako parametr element albo ID elementu.
<script>
function test3()
{
alert( $F('userName') );
}
</script>
<input type="text" id="userName" value="Jan Kowalski"><br>
<input type="button" value=Test3 onclick="test3();"><br>
Funkcja $A()
Funkcja $A() przekształca obiekt na tablicę.
W połączeniu z rozszerzeniami klasy Array funkcja ta ułatwia konwersję lub kopiowanie dowolnej listy na obiekt typu Array. Jednym z częstszych zastosowań jest konwersja obiektu NodeList na zwykłą tablicę, co umożliwia znacznie szybszy dostęp do jego elementów.
<script>
function showOptions(){
var someNodeList = $('lstEmployees').getElementsByTagName('option');
var nodes = $A(someNodeList);
nodes.each(function(node){
alert(node.nodeName + ': ' + node.innerHTML);
});
}
</script>
<select id="lstEmployees" size="10" >
<option value="5">Buchanan, Steven</option>
<option value="8">Callahan, Laura</option>
<option value="1">Davolio, Nancy</option>
</select>
<input type="button" value="Pokaż opcje" onclick="showOptions();" >
Funkcja $H()
Funkcja $H() przekształca obiekt na Hash przypominający tablicę asocjacyjną, implementujący też interfejs Enumerable udostępniający różne metody dostępu do przechowywanych elementów.
<script>
function testHash()
{
// tworzymy obiekt...
var a = {
first: 10,
second: 20,
third: 30
};
// ...i przekształcamy go na hash
var h = $H(a);
alert(h.toQueryString()); // wyświetli: first=10&second=20&third=30
}
</script>
Funkcja $R()
Funkcja $R() jest po prostu krótszym sposobem zapisania new ObjectRange(lowerBound, upperBound, excludeBounds).
Dokładniejsze wyjaśnienia znajdziesz w dokumentacji klasy ObjectRange. Tutaj poprzestaniemy na prostym przykładzie pokazującym też korzystanie z iteratorów przy pomocy metody each. Opis tej metody znajdziesz w dokumentacji klasy Enumerablef.
<script>
function demoDollar_R(){
var range = $R(10, 20, false);
range.each(function(value, index){
alert(value);
});
}
</script>
<input type="button" value="Sample Count" onclick="demoDollar_R();" >
Funkcja Try.these()
Try.these() ułatwia próbowanie kolejnych funkcji do momentu znalezienia tej, która zadziała. Jako parametr podaje się jej listę funkcji. Będą one wykonywane, jedna po drugiej, aż któraś z nich zakończy się powodzeniem (nie powodując wyjątku). Wynik tej funkcji zostanie zwrócony jako rezultat Try.these().
Na przykład: w części przeglądarek dostępna jest funkcja xmlNode.text, a w innych istnieje xmlNode.textContent. Poniższy przykład pokazuje, jak można wybrać tę z nich, która działa, używając Try.these().
<script>
//pobierz zawartość węzła XML
function getXmlNodeValue(xmlNode){
return Try.these(
function() {return xmlNode.text;},
function() {return xmlNode.textContent;)
);
}
</script>
Obiekt Ajax
Wszystkie te funkcje pomocnicze są przydatne, ale nie oszukujmy się: nie są szczytem techniki. Jest zresztą całkiem prawdopodobne, ze korzystasz już z czegoś podobnego w swoich programach. Te funkcje są jednak tylko wierzchołkiem góry lodowej.
Jestem pewien, że przyglądasz się prototype.js głównie z powodu jej wsparcia dla modelu AJAX. Wyjaśnijmy więc jak ta biblioteka upraszcza życie w tym miejscu.
Obiekt Ajax jest tworzony przez prototype.js jako wygodny interfejs do złożonego kodu, z którego trzeba skorzystać żeby osiągnąć funkcjonalność AJAX. Obiekt ten zawiera zestaw klas zamykających w sobie logikę AJAX. Przyjrzyjmy się teraz niektórym z nich.
Klasa Ajax.Request
Jeśli nie używasz żadnej biblioteki pomocniczej, to najprawdopodobniej piszesz duże ilości kodu tworzącego obiekt XMLHttpRequest, śledzącego stan wykonania zapytania a nastęnie wyciągającego i przetwarzającego uzyskaną odpowiedź. Jeśli masz szczęście, to przynajmniej nie musisz przejmować się wsparciem dla więcej niż jednego typu przeglądarki.
Klasa Ajax.Request znacznie upraszcza to zadanie.
Powiedzmy, że Twoja aplikacja może wysłać do serwera zapytanie na adres http://yoursever/app/get_sales?empID=1234&year=1998, a serwer odpowiada odsyłając następujący dokument XML.
<?xml version="1.0" encoding="utf-8" ?> <ajax-response> <response type="object" id="productDetails"> <monthly-sales> <employee-sales> <employee-id>1234</employee-id> <year-month>1998-01</year-month> <sales>$8,115.36</sales> </employee-sales> <employee-sales> <employee-id>1234</employee-id> <year-month>1998-02</year-month> <sales>$11,147.51</sales> </employee-sales> </monthly-sales> </response> </ajax-response>
Komunikacja z serwerem i przyjęcie od niego tego dokumentu jest bardzo proste, jeśli korzysta się z obiektu klasy Ajax.Request. Poniższy przykład pokazuje, jak to zrobić.
<script>
function searchSales()
{
var empID = $F('lstEmployees');
var y = $F('lstYears');
var url = 'http://yoursever/app/get_sales';
var pars = 'empID=' + empID + '&year=' + y;
var myAjax = new Ajax.Request(
url,
{
method: 'get',
parameters: pars,
onComplete: showResponse
});
}
function showResponse(originalRequest)
{
//put returned XML in the textarea
$('result').value = originalRequest.responseText;
}
</script>
<select id="lstEmployees" size="10" onchange="searchSales()">
<option value="5">Buchanan, Steven</option>
<option value="8">Callahan, Laura</option>
<option value="1">Davolio, Nancy</option>
</select>
<select id="lstYears" size="3" onchange="searchSales()">
<option selected="selected" value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
</select>
<br><textarea id=result cols=60 rows=10 ></textarea>
Zwróć uwagę na drugi parametr konstruktora obiektu Ajax.Request: {method: 'get', parameters: pars, onComplete: showResponse} jest anonimowym obiektem (w notacji JSON). Oznacza to, że przekazujemy konstruktorowi obiekt, którego atrybut method zawiera tekst 'get', atrybut parameters zawiera tekst zapytania HTTP, a atrybut/metoda onComplete to funkcja showResponse.
Można też zdefiniować inne atrybuty, takie jak asynchronous, który może mieć wartość true lub false i decyduje o tym, czy komunikacja będzie asynchroniczna czy synchroniczna (domyślną wartoścją jest true).
Ten parametr pozwala na konfigurację zapytania AJAX. W naszym przykładzie zapytanie ze zmiennej pars zostanie wysłane na URL podany w pierwszym parametrze konstruktora przy pomocy metody GET protokołu HTTP. Obiekt Ajax.Request wywoła funkcję showResponse kiedy otrzyma od serwera odpowiedź.
Jak być może wiesz, obiekt XMLHttpRequest udostępnia informacje o stanie wykonania zapytania podczas komunikacji z serwerem. Zapytanie może znajdować na jednym z czterech etapów: Loading, Loaded, Interactive lub Complete. Obiekt Ajax.Request może wykonać wskazaną przez Ciebie funkcję po przejściu do dowolnego z tych stanów, przy czym zwykle najbardziej interesującym jest Complete, oznaczający koniec komunikacji. Funkcję do wykonania przekazuje się ustawiając odpowiedni atrybut onXXXXX w drugim parametrze konstruktora, tak jak w naszym przykładzie ustawiane jest onComplete. Funkcja ta zostanie wywołana z jednym parametrem -- będzie to właśnie używany obiekt XMLHttpRequest. Można z niego skorzystać żeby dostać się do otrzymanych z serwera danych i sprawdzić, czy zapytanie zakończyło się sukcesem: atrybut status zawiera kod zakończenia operacji HTTP.
Istnieją dwie opcje ułatwiające przetworzenie wyników. Jeśli przekażesz funkcję jako atrybut onSuccess, to zostanie ona wykonana jeśli zapytanie AJAX zakończy się powodzeniem. Podobnie, atrybut onFailure pozwala na przekazanie funkcji do wykonania w razie problemów. Jak wszystkie pozostałe funkcje onXXXXX, te dwie również otrzymują obiekt XMLHttpRequest jako parametr.
Nasz przykładowy kod nie robi nic interesującego z otrzymanymi danymi, tylko wstawia je do elementu textarea. Zwykle programy wyszukują wewnątrz XML dane potrzebne do zmiany zawartości strony albo przetwarzają je na HTML przy pomocy transformacji XSLT.
W wersji 1.4.0 pojawił się nowy sposób obsługi zdarzeń. Jeśli chcesz, żeby jakaś funkcja została wykonana po wystąpieniu wybranego zdarzenia niezależnie od tego, które zapytanie AJAX jest jego przyczyną, to możesz skorzystać z obiektu Ajax.Responders.
Powiedzmy, że chcesz sygnalizować oczekiwanie na wynik zapytania AJAX przy pomocy obracającej się ikonki lub czegoś podobnego. Możesz to osiągnąć przy pomocy dwóch funkcji, z których jedna pokaże ikonę kiedy rozpoczęte zostanie pierwsze zapytanie, a druga ukryje ją kiedy zakończy się ostatnie. Przykład poniżej.
<script>
var myGlobalHandlers = {
onCreate: function(){
Element.show('systemWorking');
},
onComplete: function() {
if(Ajax.activeRequestCount == 0){
Element.hide('systemWorking');
}
}
};
Ajax.Responders.register(myGlobalHandlers);
</script>
<div id='systemWorking'><img src='spinner.gif'>Loading...</div>
Więcej informacji znajdziesz w opisie obiektu Ajax.Request i parametru options
Klasa Ajax.Updater
Jeśli po stronie serwera masz skrypt, który potrafi odesłać odpowiedź w postaci HTML gotowego do wstawienia w stronę WWW, to sprawa jest jeszcze prostsza dzięki klasie Ajax.Updater. Wystarczy określić, do którego elementu biblioteka ma wstawić HTML odesłany przez serwer. Najszybciej będzie wyjaśnić to na przykładzie.
<script>
function getHTML()
{
var url = 'http://yourserver/app/getSomeHTML';
var pars = 'someParameter=ABC';
var myAjax = new Ajax.Updater(
'placeholder',
url,
{
method: 'get',
parameters: pars
});
}
</script>
<input type=button value=GetHtml onclick="getHTML()">
<div id="placeholder"></div>
Jak widzisz, kod jest bardzo podobny do poprzedniego przykładu, z pominięciem funkcji onComplete. Zamiast niej przekazaliśmy w konstruktorze identyfikator elementu. Zmieńmy kod jeszcze trochę żeby zademonstrować jak klient może obsłużyć błędy serwera.
Dodamy do zapytania atrybut onFailure, pozwalający na przekazanie funkcji wywoływanej w sytuacjach błędnych. Zmienimy też pierwszy parametr tak, że zamiast identyfikatora elementu przekażemy obiekt, który może mieć dwa atrybuty: success, który zostanie wykorzystany jeśli zapytanie zakończy się poprawnie, oraz failure, do użycia w razie napotkania błędów. Nie skorzystamy z atrybutu failure, ale zamiast niego przekażemy jako atrybut onFailure funkcję reportError.
<script>
function getHTML()
{
var url = 'http://yourserver/app/getSomeHTML';
var pars = 'someParameter=ABC';
var myAjax = new Ajax.Updater(
{success: 'placeholder'},
url,
{
method: 'get',
parameters: pars,
onFailure: reportError
});
}
function reportError(request)
{
alert('Sorry. There was an error.');
}
</script>
<input type=button value=GetHtml onclick="getHTML()">
<div id="placeholder"></div>
Jeśli Twój serwer może przesłać oprócz HTML kod JavaScript, to obiekt Ajax.Updater potrafi go wykonać. Wystarczy dodać evalScripts: true; do ostatniego parametru konstruktora.
Więcej szczegółów znajdziesz w opisach Ajax.Updater oraz Ajax.options.
Opis prototype.js
Rozszerzenia klas JavaScript
Biblioteka prototype.js udostępnia swoją funkcjonalność między innymi poprzez rozszerzanie istniejących klas JavaScript.
Rozszerzenia klasy Object
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| extend(destination, source) | statyczna (klasowa) | destination: dowolny obiekt, source: dowolny obiekt | Umożliwia implementację dziedziczenia poprzez skopiowanie wszystkich atrybutów i metod z obiektu source do destination. |
| inspect(targetObj) | statyczna (klasowa) | targetObj: dowolny obiekt | Zwraca reprezentację obiektu targetObj w postaci czytelnej dla człowieka. Używa metody inspect jeśli obiekt ją implementuje, a toString w przeciwnym wypadku. |
Rozszerzenia klasy Number
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| toColorPart() | instancji (obiektu) | (brak) | Zwraca liczbę w reprezentacji szesnastkowej. Metoda ta przydaje się do konwersji składowych RGB na postać HTML. |
| succ() | instancji (obiektu) | (brak) | Zwraca następną liczbę. |
| times(iterator) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index) | Wykonuje iterator dla każdej liczby od 0 do o jeden mniejszej od aktualnej wartości tego obiektu Number. Zgodnie z regułami interfejsu Enumerable iterator jest wywoływany z dwoma parametrami: kolejną wartością oraz indeksem pętli. W przypadku klasy Number te parametry są zawsze identyczne. |
Następujący przykład otworzy 10 okien z kolejnymi liczbami od 0 do 9.
<script>
function demoTimes(){
var n = 10;
n.times(function(value, index){
alert(index);
});
/***************************
* można też napisać:
* (10).times( .... );
***************************/
}
</script>
<input type=button value="Test Number.times()" onclick="demoTimes()">
Rozszerzenia klasy Function
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| bind(object) | instancji (obiektu) | object: właściciel tej metody | Tworzy funkcję poprzez przypięcie metody do wskazanego obiektu. Nowa funkcja wywołuje metodę, na podstawie której powstała, przekazując jej wszystkie parametry jakie otrzyma. |
| bindAsEventListener(object) | instancji (obiektu) | object: właściciel tej metody | Tworzy funkcję łącząc metodę ze wskazanym obiektem, zakładając że metoda ta obsługuje zdarzenia. Nowa funkcja wywołuje metodę, na podstawie której powstała, przekazując jej jeden parametr -- obiekt event opisujący obsługiwane właśnie zdarzenie. |
Przyjrzyjmy się jednemu z tych rozszerzeń w akcji.
<input type=checkbox id=myChk value=1> Test?
<script>
//deklaracja klasy
var CheckboxWatcher = Class.create();
//implementacja klasy
CheckboxWatcher.prototype = {
initialize: function(chkBox, message) {
this.chkBox = $(chkBox);
this.message = message;
//przypisujemy naszą metodę do obsługi zdarzenia
this.chkBox.onclick =
this.showMessage.bindAsEventListener(this);
},
showMessage: function(evt) {
alert(this.message + ' (' + evt.type + ')');
}
};
var watcher = new CheckboxWatcher('myChk', 'Changed');
</script>
Rozszerzenia klasy String
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| stripTags() | instancji (obiektu) | (brak) | Zwraca tekst po usunięciu wszystkich znaczników HTML i XML. |
| stripScripts() | instancji (obiektu) | (brak) | Zwraca tekst po usunięciu wszystkich bloków <script />. |
| escapeHTML() | instancji (obiektu) | (brak) | Tworzy tekst poprzez zakodowanie znaków specjalnych odwołaniami znakowymi (notacją ampersandową). |
| unescapeHTML() | instancji (obiektu) | (brak) | Odwrotność escapeHTML() |
| extractScripts() | instancji (obiektu) | (brak) | Zwraca tablicę zawierającą wszystkie bloki <script /> z tego tekstu. |
| evalScripts() | instancji (obiektu) | (brak) | Wykonuje wszystkie bloki <script /> w tym tekście. |
| toQueryParams() | instancji (obiektu) | (brak) | Zakłada że tekst zawiera nazwy i wartości parametrów w postaci URL (jak w 'field1=value1&field2=value2&field3=value3'). Tworzy tablicę asocjacyjną zawierającą wartości parametrów. |
| parseQuery() | instancji (obiektu) | (brak) | Identyczna z toQueryParams(). |
| toArray() | instancji (obiektu) | (brak) | Zwraca tablicę zawierającą kolejne znaki tekstu. |
| camelize() | instancji (obiektu) | (brak) | Przekształca tekst-pisany-tak na tekstPisanyTak. Przydatne podczas pisania kodu obsługującego właściwości stylu. |
Rozszerzenia klasy Array
Przede wszystkim Prototype rozszerza klasę Array o wszystkie wygodne metody zdefiniowane w Enumerable. Oprócz tego dostępne są też metody wymienione poniżej.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| clear() | instancji (obiektu) | (brak) | Opróżnia tablicę i zwraca ją jako wynik. |
| first() | instancji (obiektu) | (brak) | Zwraca pierwszy element tablicy. |
| last() | instancji (obiektu) | (brak) | Zwraca ostatni element tablicy. |
| compact() | instancji (obiektu) | (brak) | Zwraca tablicę powstałą przez usunięcie z tej wszystkich elementów o wartościach null or undefined. Ta metoda tworzy nową tablicę, a nie zmienia obiektu, na którym została wywołana. |
| flatten() | instancji (obiektu) | (brak) | Zwraca płaską, jednowymiarową wersję tej tablicy. Działa poprzez rekurencyjną zamianę wszystkich elementów, które są tablicami, na ciąg ich elementów. |
| without(value1 [, value2 [, .. valueN]]) | instancji (obiektu) | value1 ... valueN: wartości do pominięcia. | Zwraca tablicę powstałą poprzez usunięcie wskazanych elementów. |
| indexOf(value) | instancji (obiektu) | value: wartość, której szukasz. | Zwraca indeks, pod którym w tej tablicy znajduje się value (zaczynając od 0), lub -1 jeśli nie zawiera ona takiej wartości. |
| reverse([applyToSelf]) | instancji (obiektu) | applyToSelf: czy ta tablica ma zostać zmieniona? | Zwraca tablicę z odwróconą kolejnością elementów. Jeśli parametr applyToSelf jest równy true lub pominięty, to zmieniona zostanie tablica na której wywołano tę funkcję. W przeciwnym przypadku tablica nie ulegnie zmianie. |
| shift() | instancji (obiektu) | (brak) | Zwraca ostatni element i usuwa go z tablicy, zmniejszając jej rozmiar o 1. |
| inspect() | instancji (obiektu) | (brak) | Metoda przeimplementowana, żeby uzyskać czytelną reprezentację tablicy i jej elementów. |
Rozszerzenia obiektu DOM document
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| getElementsByClassName(className [, parentElement]) | instancji (obiektu) | className: nazwa klasy elementu (atrybut class), parentElement: obiekt (lub identyfikator) zawierający poszukiwane elementy | Zwraca listę wszystkich elementów podanej klasy CSS. Jeśli parametr parentElement zostanie pominięty, to funkcja przeszuka cały dokument. |
Rozszerzenia obiektu Event
| Atrybut | Typ | Opis |
|---|---|---|
| KEY_BACKSPACE | Number | 8: Stała. Kod klawisza Backspace. |
| KEY_TAB | Number | 9: Stała. Kod klawisza Tab. |
| KEY_RETURN | Number | 13: Stała. Kod klawisza Return. |
| KEY_ESC | Number | 27: Stała. Kod klawisza Esc. |
| KEY_LEFT | Number | 37: Stała. Kod klawisza strzałki w prawo. |
| KEY_UP | Number | 38: Stała. Kod klawisza strzałki w górę. |
| KEY_RIGHT | Number | 39: Stała. Kod klawisza strzałki w prawo. |
| KEY_DOWN | Number | 40: Stała. Kod klawisza strzałki w dół. |
| KEY_DELETE | Number | 46: Stała. Kod klawisza Delete. |
| observers: | Array | Lista obserwatorów; szczegół implementacyjny obiektu. |
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| element(event) | statyczna (klasowa) | event: obiekt klasy Event | Zwraca element, który jest przyczyną zdarzenia. |
| isLeftClick(event) | statyczna (klasowa) | event: obiekt klasy Event | Sprawdza, czy podane zdarzenie obejmuje kliknięcie lewym klawiszem myszy. |
| pointerX(event) | statyczna (klasowa) | event: obiekt klasy Event | Zwraca współrzędną X położenia kursora myszy na stronie. |
| pointerY(event) | statyczna (klasowa) | event: obiekt klasy Event | Zwraca współrzędną Y położenia kursora myszy na stronie. |
| stop(event) | statyczna (klasowa) | event: obiekt klasy Event | Wyłącza domyślną reakcję na to zdarzenie i zatrzymuje przekazywanie go dalej. |
| findElement(event, tagName) | statyczna (klasowa) | event: obiekt klasy Event, tagName: nazwa szukanego znacznika. | Znajduje pierwszy element o podanej nazwie zaczynając od elementu który jest przyczyną zdarzenia i szukając w górę drzewa DOM. |
| observe(element, name, observer, useCapture) | statyczna (klasowa) | element: obiekt lub identyfikator, name: nazwa zdarzenia (jak 'click', 'load' itp), observer: funkcja obsługująca zdarzenie, useCapture: pozwala wybrać, czy observer zostanie wywołany przed czy po tym jak zdarzenie dotrze do obiektu, który jest przyczyną zdarzenia. | Rejestruje funkcję obsługującą zdarzenia podanego typu. |
| stopObserving(element, name, observer, useCapture) | statyczna (klasowa) | element: obiekt lub identyfikator, name: nazwa zdarzenia (jak 'click', 'load' itp), observer: funkcja obsługująca zdarzenie, useCapture: pozwala wybrać, czy observer zostanie wywołany przed czy po tym jak zdarzenie dotrze do obiektu, który jest przyczyną zdarzenia. | Usuwa funkcję obsługującą zdarzenia podanego typu. |
| _observeAndCache(element, name, observer, useCapture) | statyczna (klasowa) | Prywatna metoda, nie przejmuj się nią. | |
| unloadCache() | statyczna (klasowa) | (brak) | Prywatna metoda, nie przejmuj się nią. Czyści pamięć podręczną obserwatorów. |
Przyjrzyjmy się, jak można użyć tego obiektu do zarejestrowania nowej funkcji obsługującej zdarzenia 'load' obiektu window.
<script>
Event.observe(window, 'load', showMessage, false);
function showMessage() {
alert('Page loaded.');
}
</script>
Nowe obiekty i klasy zdefiniowane przez prototype.js
Biblioteka prototype.js udostępnia też wiele nowych, ułatwiających pracę obiektów.
Klasa PeriodicalExecuter
Obiekty tej klasy ułatwiają cykliczne wykonywanie funkcji z podaną częstotliwością.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](callback, interval) | konstruktor | callback: funkcja bezparametrowa, interval: liczba sekund | Tworzy obiekt, który będzie cyklicznie wywoływał funkcję callback z podanym odstępem czasu. |
| Atrybut | Typ | Opis |
|---|---|---|
| callback | Function() | Funkcja, która ma być wykonywana (bez parametrów). |
| frequency | Number | Odstęp pomiędzy kolejnymi wywołaniami funkcji callback, w sekundach. |
| currentlyExecuting | Boolean | Wskazuje, czy funkcja callback jest obecnie wykonywana |
Obiekt Prototype
Obiekt Prototype nie ma specjalnie ważnej roli, ale pozwala na sprawdzenie której wersji biblioteki prototype.js używamy.
| Atrybut | Typ | Opis |
|---|---|---|
| Version | String | Wersja biblioteki prototype.js. |
| emptyFunction | Function() | Pusta funkcja, dla wygodniejszego zapisu niektórych algorytmów. |
| K | Function(obj) | Identyczność. Funkcja, która po prostu zwraca podany parametr. |
| ScriptFragment | String | Wyrażenie regularne używane do wyłuskania skryptów z odpowiedzi serwera. |
Obiekt Enumerable
Obiekt Enumerable ułatwia pisanie kodu wymagającego przeglądania kolekcji obiektów.
Używany w wielu innych obiektach biblioteki.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| each(iterator) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index) | Wywołuje iterator dla każdego elementu, przekazując mu element i jego indeks. |
| all([iterator]) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index) | Zwraca true, jeśli iterator zwróci wartość inną niż false i null dla każdego elementu kolekcji. W przeciwnym przypadku zwraca false. Parametr iterator można pominąć, w tej sytuacji funkcja zwróci true wtedy, gdy żaden z elementów kolekcji nie będzie równy null ani false. |
| any(iterator) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index), optional. | Zwraca true, jeśli iterator zwróci wartość inną niż false i null dla któregokolwiek elementu kolekcji. W przeciwnym przypadku zwraca false. Parametr iterator można pominąć, w tej sytuacji funkcja zwróci true wtedy, gdy któryś z elementów kolekcji będzie różny od null i false. |
| collect(iterator) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index) | Tworzy tablicę zawierającą wyniki wywołania iteratora dla każdego elementu kolekcji. |
| detect(iterator) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index) | Zwraca pierwszy element kolekcji, dla którego iterator zwrócił wartość inną niż null i false. Jeśli taki element nie zostanie znaleziony, to detect zwróci null. |
| entries() | instancji (obiektu) | (brak) | Identyczna z toArray(). |
| find(iterator) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index) | Identyczna z detect(). |
| findAll(iterator) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index) | Zwraca tablicę zawierającą wszystkie takie elementy kolekcji, dla których iterator zwrócił wartości inne niż null i false. Ta funkcja jest przeciwieństwem reject(). |
| grep(pattern [, iterator]) | instancji (obiektu) | pattern: wyrażenie regularne, iterator: funkcja zgodna z deklaracją Function(value, index) | Zwraca tablicę zawierającą wszystkie elementy kolekcji, których wartość pasuje do podanego wyrażenia regularnego. Jeśli zostanie podany iterator, to zwrócona tablica będzie zawierać wyniki jego wywołania na pasujących elementach. |
| include(obj) | instancji (obiektu) | obj: dowolny obiekt | Sprawdza, czy podany obiekt należy do kolekcji. |
| inject(initialValue, iterator) | instancji (obiektu) | initialValue: wartość początkowa, dowolny obiekt, iterator: funkcja zgodna z deklaracją Function(accumulator, value, index) | Łączy wszystkie elementy kolekcji używając podanej funkcji. Iterator jest wywoływany dla każdego elementu i jako pierwszy element otrzymuje wynik poprzedniego wywołania. Pierwsze wywołanie otrzymuje jako accumulator obiekt initialValue. Inject wynik ostatniego wywołania iteratora. |
| invoke(methodName [, arg1 [, arg2 [...]]]) | instancji (obiektu) | methodName: nazwa metody do wykonania dla każdego elementu, arg1..argN: argumenty, które zostaną przekazane metodzie. | Wywołuje metodę o podanej nazwie na każdym obiekcie w kolekcji, przekazując argumenty arg1...argN. Zwraca tablicę zawierającą wyniki wszystkich wykonanych metod. |
| map(iterator) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index) | Identyczna z collect(). |
| max([iterator]) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index) | Zwraca maksymalny element w kolekcji. Jeśli podany zostanie iterator, to porównywane będą wyniki jego wykonania na elementach kolekcji. |
| member(obj) | instancji (obiektu) | obj: any object | Identyczna z include(). |
| min([iterator]) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index) | Zwraca minimalny element w kolekcji. Jeśli podany zostanie iterator, to porównywane będą wyniki jego wykonania na elementach kolekcji. |
| partition([iterator]) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index) | Zwraca tablicę zawierającą dwie tablice: pierwsza zawiera te elementy kolekcji, dla których iterator zwrócił true, a druga -- wszystkie pozostałe. Jeśli pominiesz parametr iterator, to w pierwszej tablicy znajdą się wszystkie elementy prawdziwe, a w drugiej pozostałe. |
| pluck(propertyName) | instancji (obiektu) | propertyName: nazwa atrybutu, który zostanie pobrany z każdego elementu. To może być też indeks elementu. | Zwraca tablicę zawierającą wartości atrybutu o podanej nazwie zebrane ze wszystkich elementów kolekcji. |
| reject(iterator) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index) | Zwraca tablicę zawierającą wszystkie takie elementy kolekcji, dla których iterator zwrócił null lub false. Ta funkcja jest przeciwieństwem findAll(). |
| select(iterator) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index) | Identyczna z findAll(). |
| sortBy(iterator) | instancji (obiektu) | iterator: funkcja zgodna z deklaracją Function(value, index) | Zwraca tablicę zawierającą wszystkie elementy kolekcji w kolejności wartości zwracanych dla nich przez iterator. |
| toArray() | instancji (obiektu) | (none) | Zwraca tablicę zawierającą wszystkie elementy kolekcji. |
| zip(collection1[, collection2 [, ... collectionN [,iterator]]]) | instancji (obiektu) | collection1 .. collectionN: kolekcje, które zostaną połączone, iterator: funkcja zgodna z deklaracją Function(value, index) | Łączy wszystkie podane kolekcje z kolekcją której wywołana została ta metoda. W wyniku powstaje nowa tablica tego samego rozmiaru, co początkowa, a każdy jej element jest tablicą (nazwijmy je podtablicami) elementów znajdujących się na tej samej pozycji we wszystkich łączonych kolekcjach. Jeśli podasz funkcję iterator, to zostanie wywołana kolejno dla wszystkich podtablic. Szybki przykład: [1,2,3].zip([4,5,6], [7,8,9]).inspect() zwraca "[ [1,4,7],[2,5,8],[3,6,9] ]". Uwaga: prototype w wersji 1.4.0 zawiera błąd w wyniku którego iterator jest wykonywany dla każdej podtablicy, ale nie ma żadnego wpływu na wyniki. |
Obiekt Hash
Obiekt Hash implementuje tablicę asocjacyjną -- kolekcję par Klucz:Wartość.
Każdy element obiektu Hash jest tablicą zawierającą dwa elementy: klucz i wartość. Dla wygody każda taka tablica ma też atrybuty key i value, przechowujące te same dane.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| keys() | instancji (obiektu) | (brak) | Zwraca tablicę zawierającą klucze wszystkich elementów. |
| values() | instancji (obiektu) | (brak) | Zwraca tablicę zawierającą wartości wszystkich elementów. |
| merge(otherHash) | instancji (obiektu) | otherHash: obiekt Hash | Tworzy nowy Hash zawierający wartości tego, na którym została wywołana ta metoda, oraz otherHash. |
| toQueryString() | instancji (obiektu) | (brak) | Zwraca tekst z zawartością tego obiektu Hash w postaci URL, jak w 'key1=value1&key2=value2&key3=value3'. |
| inspect() | instancji (obiektu) | (brak) | Metoda przeimplementowana, żeby uzyskać czytelną reprezentację tablicy asocjacyjnej i jej elementów. |
Klasa ObjectRange
Dziedziczy po Enumerable
Reprezentuje zakres wartości ograniczony z góry i z dołu.
| Atrybut | Typ | Opis | |
|---|---|---|---|
| start | (dowolny) | instancji (obiektu) | Dolne ograniczenie zakresu |
| end | (dowolny) | instancji (obiektu) | Górne ograniczenie zakresu |
| exclusive | Boolean | instancji (obiektu) | Określa, czy zakres obejmuje też ograniczenia. |
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](start, end, exclusive) | konstruktor | start: dolne ograniczenie, end: górne ograniczenie, exclusive: włączyć ograniczenia do zakresu? | Tworzy obiekt zawierający zakres od start do end. Istotne jest, żeby start i end były obiektami tego samego typu i implementowały metodę succ(). |
| include(searchedValue) | instancji (obiektu) | searchedValue: szukana wartość | Sprawdza, czy podana wartość należy do zakresu. |
Obiekt Class
Obiekt Class wykorzystywany jest w deklaracjach innych klas biblioteki. Pozwala na wykorzystanie metod initialize() jako konstruktorów.
Przykład:
//deklaracja klasy
var MySampleClass = Class.create();
//implementacja klasy
MySampleClass.prototype = {
initialize: function(message) {
this.message = message;
},
showMessage: function(ajaxResponse) {
alert(this.message);
}
};
//a teraz możemy utworzyć jedną instancję naszej klasy...
var myTalker = new MySampleClass('hi there.');
//...i ją wykorzystać
myTalker.showMessage(); //wyświetla alert
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| create(*) | instancji (obiektu) | (dowolne) | Tworzy konstruktor nowej klasy |
Obiekt Ajax
Obiekt wykorzystywany przez klasy udostępniające funkcjonalność AJAX.
| Atrybut | Typ | Opis | |
|---|---|---|---|
| activeRequestCount | Number | instancji (obiektu) | Liczba trwających właśnie operacji AJAX. |
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| getTransport() | instancji (obiektu) | (brak) | Tworzy nowy obiekt XMLHttpRequest. |
Obiekt Ajax.Responders
Dziedziczy po Enumerable
Obiekt ten przechowuje listę obiektów, które mają być powiadamiane o zdarzeniach związanych z AJAX. Przykładowym zastosowaniem może być globalna obsługa wyjątków dla operacji AJAX.
| Atrybut | Typ | Opis | |
|---|---|---|---|
| responders | Array | instancji (obiektu) | Lista obiektów, które są powiadamiane o zdarzeniach AJAX. |
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| register(responderToAdd) | instancji (obiektu) | responderToAdd: obiekt do dodania do listy powiadamianych. | Obiekt przekazany jako responderToAdd może zawierać metody o takich samych nazwach jak zdarzenia AJAX (onCreate, onComplete, onException i tym podobne). Kiedy wystąpi jakieś zdarzenie AJAX, zostaną wywołane metody o odpowiedniej nazwie we wszystkich zarejestrowanych obiektach. |
| unregister(responderToRemove) | instancji (obiektu) | responderToRemove: obiekt do usunięcia z listy powiadamianych. | Usuwa wskazany obiekt z listy powiadamianych o zdarzeniach. |
| dispatch(callback, request, transport, json) | instancji (obiektu) | callback: nazwa zdarzenia AJAX, request: obiekt Ajax.Request, który spowodował to zdarzenie, transport: obiekt XMLHttpRequest obsługujący tę operację AJAX, json: nagłówek X-JSON odpowiedzi (jeśli jest dostępny) | Przegląda listę zarejestrowanych obiektów szukając tych, które mają zaimplementowaną metodę o nazwie callback. Każdą taką metodę, jaką znajdzie, wywołuje przekazując jej pozostałe trzy parametry. Jeśli odpowiedź AJAX zawiera nagłówek X-JSON, to zostanie on wczytany i przekazany jako parametr json. Jeśli propagowanym zdarzeniem jest onException, to wyjątek zostanie przekazany zamiast parametru transport, a parametr json będzie pominięty. |
Klasa Ajax.Base
Nadklasa innych klas zdefiniowanych w obiekcie Ajax.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| setOptions(options) | instancji (obiektu) | options: opcje AJAX | Konfiguruje operację AJAX na podstawie podanego obiektu options. |
| responseIsSuccess() | instancji (obiektu) | (brak) | Zwraca prawdę, jeśli operacja AJAX zakończyła się sukcesem. |
| responseIsFailure() | instance | (brak) | Przeciwieństwo responseIsSuccess() -- zwraca true, jeśli operacja AJAX zakończyła się niepowodzeniem. |
Klasa Ajax.Request
Dziedziczy po Ajax.Base
Udostępnia wygodny interfejs do operacji AJAX.
| Atrybut | Typ | Rodzaj | Opis |
|---|---|---|---|
| Events | Array | statyczny (klasowy) | Lista zdarzeń (stanów obiektu) mogących pojawić się podczas operacji AJAX. Lista zawiera teksty: 'Uninitialized', 'Loading', 'Loaded', 'Interactive', and 'Complete.' |
| transport | XMLHttpRequest | instancji (obiektu) | Obiekt XMLHttpRequest wykonujący operację AJAX. |
| url | String | instancji (obiektu) | URL, pod który zostało wysłane zapytanie AJAX. |
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](url, options) | konstruktor | url: adres, spod którego mają zostać ściągnięte dane, options: opcje AJAX | Tworzy obiekt, który rozpocznie operację AJAX ze wskazanym adresem (url) i opcjami. Tworzenie obiektu powoduje wysłanie zdarzenia XMLHttpRequest. Uwaga: warto pamiętać, że wybrany url podlega ustawieniom bezpieczeństwa przeglądarki. W wielu sytuacjach przeglądarka nie pozwoli na użycie adresu, jeśli wskazuje na inny serwer (domenę) niż ta, z której pobrana została bieżąca strona. Trzymanie się takich adresów pozwala uniknąć zmian w konfiguracji przeglądarki. (Dzięki, Clay). |
| evalJSON() | instancji (obiektu) | (brak) | Tej metody nie używa się z zewnątrz. Wykorzystywana wewnętrznie do wczytania nagłówka X-JSON odpowiedzi HTTP. |
| evalReponse() | instancji (obiektu) | (brak) | Tej metody nie używa się z zewnątrz. Wykorzystywana do wykonania odpowiedzi AJAX, jeśli w jej nagłówku Content-type podany jest typ text/javascript. |
| header(name) | instance | name: nazwa nagłówka HTTP | Tej metody nie używa się z zewnątrz. Wykorzystywana wewnętrznie do pobierania zawartości nagłówków HTTP odpowiedzi AJAX. |
| onStateChange() | instancji (obiektu) | (brak) | Tej metody nie używa się z zewnątrz. Obiekt wykorzystuje ją do śledzenia zmian w stanie wykonania polecenia AJAX. |
| request(url) | instancji (obiektu) | url: adres operacji AJAX | Tej metody nie używa się z zewnątrz, wywołuje ją konstruktor. |
| respondToReadyState(readyState) | instancji (obiektu) | readyState: numer stanu (od 1 do 4) | Tej metody nie używa się z zewnątrz. Wykorzystywana jest przez onStateChange, żeby obsłużyć zmiany stanu wykonania polecenia AJAX. |
| setRequestHeaders() | instancji (obiektu) | (brak) | Tej metody nie używa się z zewnątrz. Obiekt wykorzystuje ją, żeby utworzyć nagłówek zapytania HTTP. |
Parametr options
Istotną częścią operacji AJAX jest parametr options. Nie jest on instancją konkretnej klasy, można tu użyć dowolnego obiektu, o ile ma odpowiednie atrybuty. Najczęściej wykorzystuje się anonimowy obiekt tworzony tylko na potrzeby zapytania AJAX.
| Atrybut | Type | Wartość domyślna | Opis |
|---|---|---|---|
| method | String | 'post' | Metoda przesłania zapytania HTTP. |
| parameters | String | '' | Lista parametrów do przekazania w ramach zapytania HTTP, w formacie URL. |
| asynchronous | Boolean | true | Wskazuje, czy zapytanie AJAX zostanie obsłużone asynchronicznie. |
| postBody | String | undefined | Dane przekazane wewnątrz zapytania HTTP, jeśli wykorzystywana jest metoda POST. |
| requestHeaders | Array | undefined | Lista nagłówków HTTP do przekazania w ramach zapytania HTTP. Lista ta musi zawierać parzystą liczbę elementów, na przemian nazwy i zawartość kolejnych nagłówków. Example:['my-header1', 'tu zawartosc my-header1', 'my-other-header', 'a tu zawartosc my-other-header'] |
| onXXXXXXXX | Function(XMLHttpRequest) | undefined | Funkcja, która ma zostać wykonana kiedy stan wykonania zapytania AJAX zmieni się na XXXXXXXX. Przykład: var myOpts = {onComplete: showResponse, onLoaded: registerLoaded};. Wskazana funkcja zostanie wywołana z jednym parametrem -- obiektem XMLHttpRequest używanym do tej operacji AJAX. |
| onSuccess | Function(XMLHttpRequest) | undefined | Funkcja, która ma zostać wykonana kiedy zapytanie AJAX zakończy się sukcesem. Wskazana funkcja zostanie wywołana z jednym parametrem -- obiektem XMLHttpRequest używanym do tej operacji AJAX. |
| onFailure | Function(XMLHttpRequest) | undefined | Funkcja, która ma zostać wykonana kiedy zapytanie AJAX zakończy się niepowodzeniem. Wskazana funkcja zostanie wywołana z jednym parametrem -- obiektem XMLHttpRequest używanym do tej operacji AJAX. |
| onException | Function(Ajax.Request, exception) | undefined | Funkcja, która ma zostać wykonana po wystąpieniu po stronie klienta wyjątku AJAX, takiego jak niewłaściwa odpowiedź lub błędne parametry. Funkcja otrzyma dwa parametry: obiekt Ajax.Request, obsługujący operację, która spowodowała wyjątek, oraz sam wyjątek. |
| insertion | Function(Object, String) | null | Funkcja mająca wstawić tekst otrzymany jako wynik zapytania AJAX w element drzewa dokumentu. Ta funkcja zostanie wywołana z dwoma argumentami: elementem, którego zawartość ma zostać zmieniona, oraz tekstem do wstawienia. Używane tylko przez obiekty Ajax.Updater. |
| evalScripts | Boolean | undefined, false | Wskazuje, czy bloki <script> wewnątrz odpowiedzi mają zostać wykonane. Używane tylko przez obiekty Ajax.Updater. |
| decay | Number | undefined, 1 | Wyznacza stopniowe spowolnienie w częstotliwości odświeżania obiektu Ajax.PeriodicalUpdater w sytuacji, kiedy odpowiedź serwera jest taka sama, jak poprzednia. Na przykład użycie wartości 2 oznacza, że po otrzymaniu takiej samej odpowiedzi jak poprzednia obiekt będzie czekał z wysłaniem kolejnego zapytania dwa razy dłużej niż za pierwszym razem. Jeśli otrzyma tę samą wartość ponownie, będzie czekał czterokrotnie dłużej. Wartości domyślne wyłączają spowolnienie. |
Klasa Ajax.Updater
Dziedziczy po Ajax.Request
Obiektów tej klasy wykorzystuje się w sytuacjach, kiedy w odpowiedzi na zapytanie AJAX serwer odsyła HTML do bezpośredniego wstawienia w jakiś element strony. Potrafią też wykonać bloki <script> wewnątrz tekstu odesłanego przez serwer (opcja evalScripts).
| Atrybut | Typ | Rodzaj | Opis |
|---|---|---|---|
| containers | Object | instancji (obiektu) | Elementy, których zawartość ma zostać podmieniona na wynik zapytania AJAX. Obiekt ten zawiera dwa atrybuty: containers.success wykorzystywany jeśli zapytanie AJAX zakończy się sukcesem oraz containers.failure, wykorzystywany w przeciwnym przypadku. |
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](container, url, options) | constructor | container: może być identyfikatorem elementu, elementem lub obiektem z dwoma atrybutami: success -- elementem (lub identyfikatorem) do wykorzystania, jeśli zapytanie AJAX się powiedzie, oraz failure -- elementem (lub identyfikatorem) do wykorzystania w przeciwnym przypadku; url: adres, na który ma zostać wysłane zapytanie; options: opcje AJAX | Tworzy obiekt, który wyśle zapytanie pod wskazany url zgodnie z parametrem options. |
| updateContent() | instancji (obiektu) | (brak) | Tej metody nie używa się z zewnątrz. Wykorzystywana jest przez sam obiekt po otrzymaniu odpowiedzi od serwera. Podmieni zawartość odpowiedniego elementu dokumentu na tekst otrzymany w odpowiedzi (wykorzystując funkcję insertion, jeśli została ustawiona w opcjach). |
Klasa Ajax.PeriodicalUpdater
Dziedziczy po Ajax.Base
Instancje tej klasy cyklicznie wykorzystują obiekty Ajax.Updater do podmiany zawartości elementu strony lub wykonania innego zadania, do jakiego służy Ajax.Updater. Więcej informacji znajdziesz w opisie Ajax.Updater reference.
| Atrybut | Typ | Rodzaj | Opis |
|---|---|---|---|
| container | Object | instancji (obiektu) | Parametr przekazywany bezpośrednio konstruktorowi klasy Ajax.Updater. |
| url | String | instancji (obiektu) | Parametr przekazywany bezpośrednio konstruktorowi klasy Ajax.Updater. |
| frequency | Number | instancji (obiektu) | Odstęp w sekundach pomiędzy kolejnymi podmianami (nie częstotliwość!). Liczba ta będzie mnożona przez współczynnik spowolnienia wyznaczany na podstawie parametru decay. |
| decay | Number | instancji (obiektu) | Przechowuje aktualną wartość spowolnienia pomiędzy kolejnymi aktualizacjami. |
| updater | Ajax.Updater | instancji (obiektu) | Ostatni wykorzystany obiekt Ajax.Updater. |
| timer | Object | instancji (obiektu) | Timer wyznaczający moment kolejnej aktualizacji. |
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](container, url, options) | konstruktor | container: może być identyfikatorem elementu, elementem lub obiektem z dwoma atrybutami: success -- elementem (lub identyfikatorem) do wykorzystania, jeśli zapytanie AJAX się powiedzie, oraz failure -- elementem (lub identyfikatorem) do wykorzystania w przeciwnym przypadku; url: adres, na który ma zostać wysłane zapytanie; options: opcje AJAX | Tworzy obiekt, który będzie wysyłał zapytania pod wskazany url zgodnie z parametrem options. |
| start() | instancji (obiektu) | (brak) | Tej metody nie używa się z zewnątrz. Wykorzystywana przez obiekt do rozpoczęcia aktualizacji. |
| stop() | instancji (obiektu) | (brak) | Tej metody nie używa się z zewnątrz. Wykorzystywana przez obiekt do zakończenia aktualizacji. |
| updateComplete() | instancji (obiektu) | (brak) | Tej metody nie używa się z zewnątrz. Wywoływana przez aktualnie używany obiekt Ajax.Updater po zakończeniu operacji AJAX, konfiguruje następną aktualizację. |
| onTimerEvent() | instancji (obiektu) | (brak) | Tej metody nie używa się z zewnątrz. Wywoływana przez timer w momencie, kiedy należy rozpocząć kolejną aktualizację. |
Obiekt Element
Udostępnia funkcje pomocnicze ułatwiające zmiany drzewa dokumentu.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| addClassName(element, className) | instancji (obiektu) | element: element lub identyfikator, className: nazwa klasy CSS | Dodaje wskazaną klasę do listy klas elementu. |
| classNames(element) | instancji (obiektu) | element: element lub identyfikator | Zwraca obiekt Element.ClassNames reprezentujący nazwy klas CSS wskazanego elementu. |
| cleanWhitespace(element) | instancji (obiektu) | element: element lub identyfikator | Usuwa wszystkie dzieci wskazanego elementu zawierające tylko białe znaki. |
| empty(element) | instancji (obiektu) | element: element lub identyfikator | Sprawdza, czy wskazany element jest pusty (lub zawiera tylko białe znaki). |
| getDimensions(element) | instancji | element: element lub identyfikator | |
| getHeight(element) | instancji (obiektu) | element: element lub identyfikator | Zwraca atrybut offsetHeight wskazanego elementu. |
| getStyle(element, cssProperty) | instancji (obiektu) | element: element lub identyfikator, cssProperty: nazwa atrybutu CSS (można użyć zapisu 'prop-name' lub 'propName'). | Zwraca wartość atrybutu CSS ze wskazanego elementu (lub null, jeśli taki nie istnieje). |
| hasClassName(element, className) | instancji (obiektu) | element: element lub identyfikator, className: nazwa klasy CSS | Zwraca true jeśli className należy do listy klas wskazanego elementu. |
| hide(elem1 [, elem2 [, elem3 [...]]]) | instancji (obiektu) | elemN: element lub identyfikator | Ukrywa podane elementy ustawiające im style.display na 'none'. |
| makeClipping(element) | instancji (obiektu) | element: element lub identyfikator | |
| makePositioned(element) | instancji (obiektu) | element: element lub identyfikator | |
| remove(element) | instancji (obiektu) | element: element lub identyfikator | Usuwa wskazany obiekt z dokumentu. |
| removeClassName(element, className) | instancji (obiektu) | element: element lub identyfikator, className: nazwa klasy CSS | Usuwa wskazaną klasę z listy klas elementu. |
| setStyle(element, style) | instancji (obiektu) | element: element lub identyfikator, style: tablica asocjacyjna zawierająca atrybuty CSS (klucze mogą być w formacie 'prop-name' lub 'propName'). | Ustawia elementowi wartości wszystkich atrybutów CSS wymienionych w style. |
| scrollTo(element) | instancji (obiektu) | element: element lub identyfikator | Ustawia widoczny fragment okna na pozycji wskazanego elementu. |
| show(elem1 [, elem2 [, elem3 [...]]]) | instancji (obiektu) | elemN: element lub identyfikator | Pokazuje podane elementy ustawiające im style.display na ''. |
| toggle(elem1 [, elem2 [, elem3 [...]]]) | instancji (obiektu) | elemN: element lub identyfikator | Pokazuje elementy ukryte i ukrywa widoczne. |
| undoClipping(element) | instancji (obiektu) | element: element lub identyfikator | |
| undoPositioned(element) | instancji (obiektu) | element: element lub identyfikator | |
| update(element, html) | instancji (obiektu) | element: element lub identyfikator, html: tekst html | Podmienia wewnętrzny html wskazanego elementu na podany tekst. Jeśli parametr html zawiera bloki <script>, to nie zostaną one wstawione, ale będą wykonane. |
| visible(element) | instancji (obiektu) | element: element lub identyfikator | Sprawdza, czy wskazany element jest widoczny. |
Klasa Element.ClassNames
Dziedziczy po Enumerable
Ułatwia operacje na nazwach klas CSS związanych z elementem dokumentu.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](element) | konstruktor | element: element DOM lub identyfikator | Tworzy obiekt Element.ClassNames pozwalający na dostęp do nazw klas CSS wskazanego elementu. |
| add(className) | instancji (obiektu) | className: nazwa klasy CSS | Dodaje wskazaną nazwę klasy CSS do elementu. |
| remove(className) | instancji (obiektu) | className: nazwa klasy CSS | Usuwa wskazaną nazwę klasy CSS z elementu. |
| set(className) | instancji (obiektu) | className: nazwa klasy CSS | Wstawia podaną nazwę klasy do listy klas elementu i usuwa wszystkie pozostałe. |
Obiekt Abstract
Obiekt zawierający klasy abstrakcyjne wykorzystywane w bibliotece.
Klasa Abstract.Insertion
Abstrakcyjna nadklasa wszystkich pozostałych klas udostępniających dynamiczne wstawianie tekstu.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](element, content) | konstruktor | element: element lub identyfikator, content: HTML do wstawienia | Tworzy obiekt ułatwiający dynamiczne wstawianie tekstu. |
| contentFromAnonymousTable() | instancji (obiektu) | (brak) |
| Atrybut | Typ | Rodzaj | Opis |
|---|---|---|---|
| adjacency | String | statyczny, parametr | Wskazuje miejsce, w którym ma zostać wstawiony nowy tekst względem wskazanego elementu. Możliwe wartości to: 'beforeBegin' (przed początkiem), 'afterBegin' (za początkiem), 'beforeEnd' (przed końcem), and 'afterEnd' (za końcem). |
| element | Object | instancji (obiektu) | Element, względem którego będzie wstawiany nowy tekst. |
| content | String | instancji (obiektu) | Nowy HTML do wstawienia. |
Obiekt Insertion
Obiekt ten zawiera konkretne (nieabstrakcyjne) klasy ułatwiające wstawianie tekstu.
Klasa Insertion.Before
Dziedziczy po Abstract.Insertion
Wstawia HTML przed wskazanym elementem.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](element, content) | konstruktor | element: element lub identyfikator, content: HTML do wstawienia | Odziedziczony po Abstract.Insertion. Tworzy obiekt ułatwiający dynamiczne wstawianie tekstu. |
Następujący kod
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.Before('person', 'Chief '); </script>
Zmieni HTML na:
<br>Hello, Chief <span id="person" style="color:red;">Wiggum. How's it going?</span>
Klasa Insertion.Top
Dziedziczy po Abstract.Insertion
Wstawia HTML jako pierwsze dziecko wskazanego elementu. Nowy tekst zostanie wstawiony bezpośrednio za znacznikiem otwierającym wskazany element.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](element, content) | konstruktor | element: element lub identyfikator, content: HTML do wstawienia | Odziedziczony po Abstract.Insertion. Tworzy obiekt ułatwiający dynamiczne wstawianie tekstu. |
Następujący kod
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.Top('person', 'Mr. '); </script>
Zmieni HTML na:
<br>Hello, <span id="person" style="color:red;">Mr. Wiggum. How's it going?</span>
Klasa Insertion.Bottom
Dziedziczy po Abstract.Insertion
Wstawia HTML jako pierwsze dziecko wskazanego elementu. Nowy tekst zostanie wstawiony bezpośrednio przed znacznikiem zamykającym wskazany element.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](element, content) | konstruktor | element: element lub identyfikator, content: HTML do wstawienia | Odziedziczony po Abstract.Insertion. Tworzy obiekt ułatwiający dynamiczne wstawianie tekstu. |
Następujący kod
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.Bottom('person', " What's up?"); </script>
Zmieni HTML na:
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going? What's up?</span>
Klasa Insertion.After
Dziedziczy po Abstract.Insertion
Wstawia HTML bezpośrednio za znacznikiem zamykającym wskazany element.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](element, content) | konstruktor | element: element lub identyfikator, content: HTML do wstawienia | Odziedziczony po Abstract.Insertion. Tworzy obiekt ułatwiający dynamiczne wstawianie tekstu. |
Następujący kod
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>
<script> new Insertion.After('person', ' Are you there?'); </script>
Zmieni HTML na:
<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span> Are you there?
Obiekt Field
Obiekt Field udostępnia funkcje ułatwiające pracę z polami formularzy.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| clear(field1 [, field2 [, field3 [...]]]) | instancji (obiektu) | fieldN: pole formularza lub identyfikator pola | Czyści zawartość wszystkich wskazanych pól. |
| present(field1 [, field2 [, field3 [...]]]) | instancji (obiektu) | fieldN: pole formularza lub identyfikator pola | Sprawdza, czy wszystkie wskazane pola mają niepustą zawartość. |
| focus(field) | instancji (obiektu) | field: pole formularza lub identyfikator pola | Przenieś kursor do wskazanego pola. |
| select(field) | instancji (obiektu) | field: pole formularza lub identyfikator pola | Zaznacza zawartość pola, jeśli jego typ na to pozwala. |
| activate(field) | instancji (obiektu) | field: pole formularza lub identyfikator pola | Przenosi kursor do wskazanego pola i zaznacza wartość, jeśli jego typ na to pozwala. |
Obiekt Form
Udostępnia funkcje ułatwiające korzystanie z formularzy i ich zawartości.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| serialize(form) | instancji (obiektu) | form: obiekt formularza lub jego identyfikator | Zwraca tekst z zawartością pól formularza w postaci URL, jak w 'field1=value1&field2=value2&field3=value3'. |
| findFirstElement(form) | instancji (obiektu) | form: obiekt formularza lub jego identyfikator | Zwraca pierwsze aktywne pole formularza. |
| getElements(form) | instancji (obiektu) | form: obiekt formularza lub jego identyfikator | Zwraca tablicę zawierającą wszystkie pola wskazanego formularza. |
| getInputs(form [, typeName [, name]]) | instancji (obiektu) | form: obiekt formularza lub jego identyfikator, typeName: typ pola formularza, name: nazwa pola formularza. | Zwraca tablicę zawierającą wszystkie pola typu <input> ze wskazanego formularza. Można ograniczyć listę podając żądany typ lub nazwę elementu. |
| disable(form) | instancji (obiektu) | form: obiekt formularza lub jego identyfikator | Wyłącza wszystkie pola formularza. |
| enable(form) | instancji (obiektu) | form: obiekt formularza lub jego identyfikator | Włącza wszystkie pola formularza. |
| focusFirstElement(form) | instancji (obiektu) | form: obiekt formularza lub jego identyfikator | Przenosi kursor do pierwszego widocznego i włączonego pola formularza. |
| reset(form) | instancji (obiektu) | form: obiekt formularza lub jego identyfikator | Resetuje formularz, tak samo jak metoda reset() formularza. |
Obiekt Form.Element
Udostępnia funkcje ułatwiające korzystanie z elementów formularza (widocznych lub nie).
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| serialize(element) | instancji (obiektu) | element: obiekt elementu lub jego identyfikator | Zapisuje nazwę i wartość pola do tekstu, w postaci URL: 'elementName=elementValue'. |
| getValue(element) | instancji (obiektu) | element: obiekt elementu lub jego identyfikator | Zwraca wartość elementu. |
Obiekt Form.Element.Serializers
Zawiera funkcje wykorzystywane wewnątrz biblioteki do pobierania wartości pól formularza.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| inputSelector(element) | instancji (obiektu) | element: obiekt albo identyfikator elementu, który ma atrybut checked (jak radio button lub checkbox). | Zwraca tablicę zawierającą nazwę i zawartość elementu, na przykład: ['elementName', 'elementValue'] |
| textarea(element) | instancji (obiektu) | element: obiekt albo identyfikator elementu, który ma atrybut value (jak pola textbox, button lub password). | Zwraca tablicę zawierającą nazwę i zawartość elementu, na przykład: ['elementName', 'elementValue'] |
| select(element) | instancji (obiektu) | element: obiekt albo identyfikator elementu <select>. | Zwraca tablicę zawierającą nazwę i wszystkie zaznaczone opcje elementu, na przykład: ['elementName', 'opt1 opt2 opt3'] |
Klasa Abstract.TimedObserver
Abstrakcyjna nadklasa klas pozwalających na obserwację elementu w oczekiwaniu na zmianę jego zawartości (lub dowolnej właściwości zdefiniowanej przez klasę pochodną).
Podklasy Abstract.TimedObserver mogą śledzić takie rzeczy jak pola formularza, atrybuty stylu, liczbę wierszy w tabeli czy dowolną inną wartość, na której mogłoby Ci zależeć.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](element, frequency, callback) | konstruktor | element: obiekt elementu lub jego identyfikator, frequency: liczba sekund pomiędzy kolejnymi sprawdzeniami, callback: funkcja do wywołania kiedy obserwowana wartość się zmieni | Tworzy obiekt obserwujący wskazany element. |
| getValue() | instancji (obiektu), abstrakcyjna | (brak) | Zwraca obserwowaną wartość. Ta funkcja musi zostać zaimplementowana w podklasach. |
| registerCallback() | instancji (obiektu) | (brak) | Tej metody nie używa się z zewnątrz. Wykorzystywana przez obiekt do włączenia systematycznego sprawdzania wartości. |
| onTimerEvent() | instancji (obiektu) | (brak) | Tej metody nie używa się z zewnątrz. Porównuje aktualną wartość elementu z poprzednią. |
| Atrybut | Typ | Opis |
|---|---|---|
| element | Object | Obserwowany obiekt. |
| frequency | Number | Liczba sekund pomiędzy kolejnymi sprawdzeniami. |
| callback | Function(Object, String) | Funkcja do wykonania kiedy obserwowana wartość ulegnie zmianie. Zostanie wywołana z dwoma parametrami: obserwowanym obiektem i nową wartością. |
| lastValue | String | Ostatnia zaobserwowana wartość. |
Klasa Form.Element.Observer
Dziedziczy po Abstract.TimedObserver
Podklasa Abstract.TimedObserver pozwalająca na obserwację wartości pól formularza. Przydaje się w przypadku tych elementów, które nie informują o zmianie zawartości przy pomocy zdarzeń. Pozostałe można obsłużyć przy pomocy Form.Element.EventObserver.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](element, frequency, callback) | konstruktor | element: element formularza lub jego identyfikator, frequency: liczba sekund pomiędzy kolejnymi sprawdzeniami, callback: funkcja do wywołania kiedy obserwowana wartość się zmieni | Odziedziczony po Abstract.TimedObserver. Tworzy obiekt, który będzie obserwował wartość wskazanego elementu formularza. |
| getValue() | instancji (obiektu) | (brak) | Zwraca wartość obserwowanego elementu. |
Klasa Form.Observer
Dziedziczy po Abstract.TimedObserver
Podklasa Abstract.TimedObserver pozwalająca na jednoczesną obserwację całej zawartości formularza. Przydaje się w przypadku formularzy zawierających pola, które nie informują o zmianie zawartości przy pomocy zdarzeń. Pozostałe można obsłużyć przy pomocy Form.EventObserver.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](form, frequency, callback) | konstruktor | form: obiekt formularza lub jego identyfikator, frequency: liczba sekund pomiędzy kolejnymi sprawdzeniami, callback: funkcja do wywołania kiedy obserwowana wartość się zmieni | Odziedziczony po Abstract.TimedObserver. Tworzy obiekt, który będzie obserwował zawartość wskazanego formularza. |
| getValue() | instancji (obiektu) | (brak) | Zwraca tekst z pełną zawartością formularza. |
Klasa Abstract.EventObserver
Abstrakcyjna nadklasa klas pozwalających na obserwacje elementów informujących o zmianie swojego stanu przy pomocy zdarzeń. Wystąpienie takiego zdarzenia spowoduje uruchomienie funkcji przekazanej do konstruktora.
Wiele obiektów tej klasy może obserwować ten sam element bez przeszkadzania sobie nawzajem. Funkcje będą wywoływane w takiej kolejności, w jakiej były rejestrowane.
Zdarzenie, które spowoduje wykonanie funkcji, to onclick w przypadku elementów radio i checkbox oraz onchange dla pól tekstowych i elementów select.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](element, callback) | konstruktor | element: obiekt elementu lub jego identyfikator, callback: funkcja do wywołania kiedy nastąpi zdarzenie | Tworzy obiekt obserwujący wskazany element. |
| getValue() | instancji (obiektu), abstrakcyjna | (brak) | Zwraca obserwowaną wartość. Ta funkcja musi zostać zaimplementowana w podklasach. |
| registerCallback() | instancji (obiektu) | (brak) | Tej metody nie używa się z zewnątrz. Wykorzystywana przez obiekt do podłączenia się do obsługi odpowiednich zdarzeń. |
| registerFormCallbacks() | instancji (obiektu) | (brak) | Tej metody nie używa się z zewnątrz. Wykorzystywana przez obiekt do podłączenia się do obsługi odpowiednich zdarzeń we wszystkich elementach formularza. |
| onElementEvent() | instancji (obiektu) | (brak) | Tej metody nie używa się z zewnątrz. Wykonywana po nadejściu obserwowanego zdarzenia. |
| Atrybut | Typ | Opis |
|---|---|---|
| element | Obiekt | Obserwowany obiekt. |
| callback | Function(Object, String) | Funkcja do wykonania kiedy obserwowana wartość ulegnie zmianie. Zostanie wywołana z dwoma parametrami: obserwowanym obiektem i nową wartością. |
| lastValue | String | Ostatnia zaobserwowana wartość. |
Klasa Form.Element.EventObserver
Dziedziczy po Abstract.EventObserver
Podklasa Abstract.EventObserver pozwalająca na obserwację wartości pól formularza. Ta klasa wykrywa zmiany przy pomocy zdarzeń; do obserwowania elementów, które nie udostępniają zdarzeń informujących o zmianie wartości, należy zamiast niej użyć Form.Element.Observer.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](element, callback) | konstruktor | element: obiekt elementu lub jego identyfikator, callback: funkcja do wykonania kiedy obserwowana wartość ulegnie zmianie | Odziedziczony po Abstract.EventObserver. Tworzy obiekt, który będzie obserwować atrybut value wskazanego elementu. |
| getValue() | instancji (obiektu) | (brak) | Zwraca wartość obserwowanego elementu. |
Klasa Form.EventObserver
Dziedziczy po Abstract.EventObserver
Podklasa Abstract.TimedObserver pozwalająca na jednoczesną obserwację całej zawartości formularza. Ta klasa wykrywa zmiany zawartości przy pomocy zdarzeń; jeśli formularz zawiera elementy, które nie udostępniają odpowiednich zdarzeń, należy zamiast niej użyć Form.Observer.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| [konstruktor](form, callback) | konstruktor | form: obiekt formularza lub jego identyfikator, callback: funkcja do wykonania kiedy jakiekolwiek pole formularza ulegnie zmianie | Odziedziczony po Abstract.EventObserver. Tworzy obiekt, który będzie obserwował zawartość wskazanego formularza. |
| getValue() | instancji (obiektu) | (brak) | Zwraca tekst z pełną zawartością formularza. |
Obiekt Position (szkic dokumentacji)
Udostępnia zestaw funkcji pomagających w ustawianiu współrzędnych i rozmiarów obiektów.
| Metoda | Rodzaj | Argumenty | Opis |
|---|---|---|---|
| prepare() | instancji (obiektu) | (brak) | Ustawia atrybuty deltaX i deltaY na aktualne współrzędne widocznego obszaru wewnątrz strony. Tę funkcję należy wykonać przed używaniem withinIncludingScrolloffset po każdym przesunięciu strony. |
| realOffset(element) | instancji (obiektu) | element: object | Zwraca tablicę ([x, y]) zawierającą aktualne przesunięcie zawartości elementu wynikające z ustawienia pasków przewijania (jego i wszystkich elementów nadrzędnych). |
| cumulativeOffset(element) | instancji (obiektu) | element: object | Zwraca tablicę ([x, y]) zawierającą aktualne przesunięcie zawartości elementu wynikające z jego położenia (uwzględnia też położenie wszystkich elementów nadrzędnych). |
| within(element, x, y) | instancji (obiektu) | element: obiekt, x i y: współrzędne punktu | Sprawdza czy podane współrzędne są wewnątrz prostokąta opisanego na wskazanym elemencie. |
| withinIncludingScrolloffsets(element, x, y) | instancji (obiektu) | element: obiekt, x i y: współrzędne punktu | |
| overlap(mode, element) | instancji (obiektu) | mode: 'vertical' lub 'horizontal', element: obiekt | Należy wykonać within() bezpośrednio przed użyciem tej metody. Oblicza położenie punktu wskazanego w within() wewnątrz elementu, w zakresie od 0 do 1. Na przykład: jeśli element jest kwadratowym DIV o boku 100px na pozycji (300, 300), to within(divSquare, 330, 330); overlap('vertical', divSquare); zwróci 0.1, co oznacza że punkt (330, 330) jest położony w 1/10 jego wysokości (mierząc od góry). |
| clone(source, target) | instancji (obiektu) | source: element lub jego identyfikator, target: element lub jego identyfikator | Ustawia rozmiary i położenie elementu target na takie same jak elementu source. |
Jeśli znajdziesz w tym tekście błędne, niedokładne lub niekompletne informacje, to jest całkiem możliwe że winny jest tłumacz. Napisz do mnie, postaram się poprawić albo przekazać uwagi autorowi możliwie szybko. Dokumentacja do wersji 1.4.0 jest nadal rozwijana, więc ten dokument będzie stopniowo uaktualniany.