Polak potrafi
Najogólniej mówiąc, Alladyn obejmuje całokształt mechanizmów stworzonych za pomocą języka JavaScript i pozwalających twórcom stron internetowych realizować ideę tzw. cross-browsingu. Termin ten oznacza ujednolicenie sposobu wyświetlania witryn sieciowych w różnych przeglądarkach, działających na różnych platformach systemowych, przy zachowaniu tej samej wersji kodu strony WWW.
Opisywany projekt powstał w odpowiedzi na odmienną implementację kodu języka JavaScript w dwóch najpopularniejszych przeglądarkach – Internet Explorerze i Netscape Navigatorze. Twórcy witryn internetowych wykorzystujący JS do wzbogacania serwisów elementami interaktywnymi doskonale znają uczucie frustracji, pojawiające się niejednokrotnie w momencie testowania nowych stron. Występujące wbrew wszelkiej logice niezgodności w reprezentacji tego samego pliku HTML w różnych przeglądarkach działających pod kontrolą różnych systemów operacyjnych kończą się często rezygnacją z tego czy innego “wodotrysku”. Zaradzić temu można, wykorzystując właśnie możliwości Alladyna – biblioteki programistycznej stanowiącej API technologii Dynamic HTML, czyli efektu połączenia możliwości techniki kaskadowych arkuszy stylów CSS, modelu DOM oraz języka JavaScript.
…i jesteśmy w DOM-u!
W dziele kreacji interaktywnych elementów serwisu internetowego Alladyn okazać nam się może pomocny w dwojaki sposób. Po pierwsze, zawarty w tej bibliotece zbiór funkcji JScriptu w momencie uruchomienia tworzy “w locie” nowy, ujednolicony model obiektowy przeglądarki (DOM) wraz ze wszystkimi niezbędnymi obiektami, metodami i właściwościami. W ten sposób zniwelowana zostaje różnica w implementacji języka JavaScript w obrębie najpopularniejszych przeglądarek WWW i znika potrzeba pisania osobnego kodu skryptów dla IE i Navigatora. Dzięki temu w naszej pracy nad serwisem WWW możemy się skoncentrować wyłącznie na kwestiach naprawdę istotnych – dopracowaniu szaty graficznej oraz logiki programistycznej witryny, nie zaprzątając sobie głowy powstawaniem ewentualnych różnic w sposobie jej wyświetlania w różnych przeglądarkach. Działając z założenia na zasadzie “uruchom i zapomnij”, Alladyn pozwala więc w pełni cieszyć się swobodą kreacji, oszczędzając webmasterowi wiele czasu oraz niepotrzebnych nerwów.
Po drugie, w chwili startu Alladyn oddaje dodatkowo do dyspozycji projektanta stron WWW rozbudowany moduł animacyjny, wykorzystujący mechanizmy DHTML-a. Na moduł ten składają się zaszyte w kodzie Alladyna mechanizmy, służące m.in. modelowaniu kilku rodzajów ruchu (zwykły, zapętlony, odbity) w oparciu o klatki kluczowe oraz kontrolowaniu wszystkich parametrów określających wygląd warstw, takich jak np. pozycja, przezroczystość czy kadrowanie. Zastosowane w Alladynie rozwiązania pozwalają uzyskać na stronie WWW efekty bliźniaczo podobne do znanych z animacji typu Flash.
| Porównanie modelu obiektowego (DOM) Alladyna, IE 4.x oraz NN 4.xx/6: | ||
| Wersja DOM | Dostęp do warstw | Dostęp do właściwości pozycjonujących |
| Internet Explorer 4.x lub wyższy | document.all[‘nazwawarstwy’] lub document.all.nazwawarstwy | document.all.nazwawarstwy.style.top = 100 document.all.nazwawarstwy.style.left = 10 document.all.nazwawarstwy.style.zIndex = 3 |
| Netscape Navigator 4.xx | document.layers[‘nazwawarstwy’] lub document.layers.nazwawarstwy | document.layers.nazwawarstwy.top = 100 document.layers.nazwawarstwy.left = 10 document.layers.nazwawarstwy.zIndex = 3 |
| Netscape Navigator 6 | warstwa = document.getElementById (“nazwawarstwy”) warstwa | warstwa = document.getElementById(“nazwawarstwy”) warstwa.style.top = 100 warstwa.style.left = 10 warstwa.style.zIndex = 3 |
| Alladyn | vlay.nazwawarstwy lub vlay[‘nazwawarstwy’] | vlay.nazwawarstwy.style.top = 100 vlay.nazwawarstwy.style.left = 10 vlay.nazwawarstwy.style.zIndex = 3 |
