OrbitVu™ Viewer 1.2 - Implementacja na własnej stronie
Przeglądarka OrbitVu Viewer jest aplikacją w formacie Adobe Flash™. Służy do wyświetlania i interaktywnego przeglądania rozkompresowanych prezentacji w formacie OVUS przygotowanych za pomocą programu OrbitVu Editor. Głównym zastosowaniem aplikacji jest przegladanie sekwencji zdjęć tzw. obiektów 3D.
Osadzanie bezpośrednio w HTML
Implementacja przy użyciu tag'ów<object> oraz <embed>. Do przeglądarki (orbitvu12/orbitvuer12.swf) należy przekazać parametr ovus_folder (jako parametr flashvars), który wskazuje na katalog z prezentacją. Atrybuty width oraz height określają odpowiednio szerokość oraz wysokość okna przeglądarki. Należy pamiętać o przekazaniu unikalnego atrybutu "id" dla tag'a "object" - w przeciwnym razie funkcja przybliżania/oddalania za pomocą kółka myszy może nie działać prawidłowo na niektórych przeglądarkach (np. IE8).Wadą takiego rozwiązania jest to, że brak tu automatycznego rozpoznawiania czy użytkownik posiada odpowiednią wersję Adobe Flash Player™ i automatycznej instalacji takiego oprogramowania.
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"
width="500" height="400" type="application/x-shockwave-flash"
data="orbitvu12/orbitvuer12.swf" id="unique-id-ABCDEF-012345678">
<param name="movie" value="orbitvu12/orbitvuer12.swf">
<param name="allowfullscreen" value="true"/>
<param name="allowScriptAccess" value="always"/>
<param name="flashvars" value="ovus_folder=samples/bykczarny72"/>
<embed src="orbitvu12/orbitvuer12.swf" width="500" height="400"
type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"
flashvars="ovus_folder=samples/bykczarny72" allowfullscreen="true">
</embed>
</object>
Osadzanie za pomocą biblioteki swfobject
Osadzanie przeglądarki za pomocą biblioteki swfobject, ma następujące zalety:- Przeglądarka nie zostanie uruchomiona, jeśli użytkownik nie ma zainstalowanej odpowiedniej wersji Adobe Flash Player™
- Automatyczny program instalujący odpowiednią wersję Adobe Flash Player™
- Zapewnia, że osadzenie będzie kompatybilne z większością przeglądarek internetowych
- Umożliwia pokazanie alternatywnej treści, w przypadku gdy nie można załadować przeglądarki
<head> </head> strony:<script type="text/javascript" src="orbitvu12/swfobject.js"></script>
<div>, która zawiera alternatywną treść wyświetlaną jeśli nie da się uruchomic przeglądarki oraz skryptu rejestrującego przeglądarkę (np. zdjęcie, link do strony Adobe Flash Player). Do przeglądarki (orbitvu12/orbitvuer12.swf) należy przekazać parametr ovus_folder (jako siódmy parametr metody embedSWF), który wskazuje na katalog z prezentacją. W sekcji <div> podano jako alternatywną treść miniaturę prezentacji.
<script type="text/javascript">
swfobject.embedSWF("orbitvu12/orbitvuer12.swf", "ov23476524", "500", "400", "11.0.0",
"orbitvu12/expressInstall.swf", {ovus_folder:"samples/bykczarny72"},
{allowfullscreen:"true"} );
</script>
<div id="ov23476524">
<image src="samples/bykczarny72/thumbnails/thumbnail.jpg" width="500" alt="Byk czarny"/>
</div>
Implementacja za pomocą dostarczonych skryptów
Implementacja w ten sposób ma wszystkie zalety osadzania za pomocą swfobject, a dodatkowo, ze względu na jeden skryp wywołujący, umożliwia łatwe nadpisanie parametrów dla wszystkich prezentacji. Plik zawiera jedną funkcję inject_orbitvu, której kod można przenieść do własnego pliku ze skryptami (np. w celu optymalizacji).Osadzenie przeglądarki polega na zdefiniowaniu sekcji
<div>, która zawiera alternatywną treść wyświetlaną jeśli nie da się uruchomic przeglądarki (np. zdjęcie, link do strony Adobe Flash Player) oraz wywołania funkcji inject_orbitvu.
Pliki
Przeglądarka OrbitVu Viewer jest dostarczana wraz z zestawem plików (biblikotek), które pomagają w implementacji.
Kompletny zestaw plików:
- orbitvuer12.swf - aplikacja OrbitVu Viewer (przeglądarka)
- orbitvu.js - biblioteki pomocnicze
- expressinstall.swf - aplikacja wspomagająca upgrade do wymaganej wersji Adobe Flash Player™
- swfobject.js - skrypty pomocnicze osadzające aplikację flash na stronie
Pliki pomocnicze javascript
Pliki pomocnicze należy załadować za pomocą kodu poniżej. Kod należy umieścić w części <head> </head> strony.
<script type="text/javascript" src="orbitvu12/swfobject.js"></script>
<script type="text/javascript" src="orbitvu12/orbitvu.js"></script>
Kod wywołania przeglądarki
W części <body> </body> strony należy umeścić wywołanie funkcji inject_orbitvu, która umieści okno przeglądarki na stronie.
Dla poprawnego działania niezbędne jest umieszczenie przeglądarki w oddzielnej sekcji <div>, o unikalnym identyfikatorze, który jest przekazywany do funkcji.
<div style="width: 500px; height: 400px;" id="ov4b7d7fde44b04">
<image src="samples/bykczarny72/thumbnails/thumbnail.jpg" width="500" alt="Byk czarny"/>
<script type="text/javascript">
inject_orbitvu( 'ov4b7d7fde44b04',
'orbitvu12/orbitvuer12.swf',
'orbitvu12/expressInstall.swf',
{
ovus_folder: "samples/bykczarny72/",
width: "500",
height: "400"
}
);
</script>
</div>Przykład "minimalnej" strony html z wywołaniem przeglądarki: inject.html
Parametry inject_orbitvu
inject_orbitvu ( id, orbitvu_path, expressinstall_path, orbitvuargs )
Funkcja inject_orbitvu wymaga podania następujących parametrów:
- id - unikalny identyfikator sekcji <div>, w której ma być umieszczona przeglądarka
- orbitvu_path - URL do przeglądarki OrbitVu Viewer
- expressinstall_path - URL do expressinstall.swf
- orbitvuargs - parametry jak w tabeli poniżej oraz dodatkowo parametry konfiguracyjne przeglądarki.
| Nazwa | Opis | Wartość domyślna |
|---|---|---|
| base | Katalog bazowy dla przeglądarki. W przypadku braku innych parametrów, przeglądarka próbuje wczytać prezantację z katalogu bazowego. | Lokalizacja pliku html |
| width | Szerokość okna prezentacji | 500 |
| height | Wysokość okna prezentacji | 400 |
| iecachefix | Jeśli "yes" to przeglądarka nie będzie cache'owana przez przeglądarkę internetową. Ma to znaczenie jeśli na jednej domenie uruchomione ma być kilka takich samych prezentacji z tymi samymi parametrami - zabaezpiecza przed błędnym wyświetlaniem przez IE. [yes/no] | no |
Parametry konfiguracyjne przeglądarki
Domyślne parametry konfiguracyjne przeglądarki, które definiuje się na etapie tworzenia prezentacji, są zapisane w folderze prezentacji w pliku config.xml. Lokalizację pliku config.xml określa parametr "ovus_folder". Istnieje możliwość nadpisania parametrów z pliku config.xml, podając parametry za pomocą flashvars (osadzanie bezpośrednie lub za pomocą swfobject), lub jako orbitvuargs.| Nazwa | Opis | Wartość domyślna |
|---|---|---|
| ovus_folder | URL do folderu prezentacji | Folder bazowy |
| xml_url | URL do pliku content.xml prezentacji | Folder bazowy/content.xml |
| image_folder | URL do folderu "images" prezentacji | Folder bazowy/images/ |
| lang | Język podpowiedzi [pl/en] | pl |
| background_color | Kolor tła | 0xffffff (biały) |
| border | Ramka dookoła okna prezentacji [yes/no] | yes |
| border_color | Kolor ramki | 0xffffff (biały) |
| ovskin | Blokowanie wyświetlania loga OrbitVu w tle oraz wpisów w menu pod prawym klaiwszem myszy [yes/no] | no |
| auto_rotate | Czy zaraz po uruchomienu automatycznie obracać? [yes/no] | no |
| vmove | Ruch pionowy - góra/dół podczas manualnego obrotu [yes/no] | yes |
| frame_rate | Prędkość automatycznego obrotu [ramek/sek] | 12 |
| preload | Czy automatycznie przeładować całą sekwencję [yes/no] | no |
| rotate_dir | Kierunek obrotu w trybie automatycznym i ręcznym [right/left] | right |
| report_bugs | Jeśli "yes" to w momencie wystąpienia błędu podczas ładowania plików wyskoczy okienko z kodem błędu. Opcja przydatna w trakcie testowania. [yes/no] | no |
Inne uwagi implementacyjne
Niektóre wersje programu Internet Explorer nie dopuszczają aby po ostatnim parametrze pojawił się przecinek. Na przykład kod poniżej zwróci błąd i przeglądarka IE7 nie zostanie uruchomiona:
inject_orbitvu( 'ov4b7d7fde44b04','orbitvuer12.swf','expressInstall.swf',
{
ovus_folder: "bull/byk.xml",
}
);
</script>
</div>Parametr iecachefix
Ze względu na sposób w jaki przeglądarki z rodziny Internet Explorer cache'ują pliki, w tym pliki .swf, użycie OrbitVu Viewer w kilku miejscach z takimi samymi parametrami startowymi na jednej stronie, lub w tej samej domenie, może okazać się niemożliwe. Objawiem będzie pojawienie się pustego okna przeglądarki. Parametr iecachefix powoduje, że funkcja inject_orbitvu doda losowy ciąg znaków do wywołania, co uniemożliwi cache'owanie przez IE. Podobnego problemu nie stwierdzono w innych przeglądarkach internetowych.
2010 (c) Wszelkie prawa zastrzeżone Ventis s.c.
Orbitvu jest zastrzeżonym znakiem towarowym Ventis s.c.
Oprogramowanie OrbitVu Viewer jest chronione ustawą o ochronie praw autorskich i jego użytkowanie wymaga licencji.