ORBITVU Strona Wsparcia Technicznego
Implementacja ORBITVU VIEWER na stronie www – zaawansowane
ORBITVU™ VIEWER 1.3 – 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
Dotyczy przeglądarki bez opcji HTML5.
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>
Przykładowy plik: embed.html
Osadzanie za pomocą biblioteki swfobject
Dotyczy przeglądarki bez opcji HTML5.
Osadzanie przeglądarki za pomocą biblioteki swfobject, ma następujące zalety:
Załadowanie biblioteki w części <head> </head> strony:
<script type=”text/javascript” src=”orbitvu12/swfobject.js”></script>
Osadzenie przeglądarki polega na zdefiniowaniu sekcji <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″> <img src=”samples/bykczarny72/thumbnails/thumbnail.jpg” width=”500″ alt=”Byk czarny”/> </div>
Przykładowy plik: swfobject.html
Implementacja za pomocą dostarczonych skryptów
Rekomendowany sposób osadzania z opcją HTML5.
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:
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″> <img 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>
Na stro nie może znajdować się wiele okien przeglądarki, należy jednak pamiętać o unikalnym identyfikatorze.
Przykład “minimalnej” strony html z wywołaniem przeglądarki: tutaj.
Parametry inject_orbitvu
inject_orbitvu ( id, orbitvu_path, expressinstall_path, orbitvuargs )
Funkcja inject_orbitvu wymaga podania następujących parametrów:
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 |
force_html5 | Jeśli “yes” to przeglądarka uruchomiona w trybie HTML5. [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 |
vmove | Ruch pionowy – góra/dół podczas manualnego obrotu [yes/no] | yes |
frame_rate | Prędkość automatycznego obrotu [ramek/sek] | 12 |
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 |
auto_rotate_dir | Kierunek obrotu w trybie automatycznym [left/right] (od ver. 1.2.1338) | rotate_dir |
teaser | Zachęta do przeglądania (patrz zachowanie orzy starcie poniżej) [autorotate/zoomin/play/static] | static |
continous | Czy rotacja ciągła [yes/no] | yes |
first_frame | Pierwsza ramka [1-no. of frames] | 1 |
valign | Wyśrodkowanie w pionie (nie działa z opcją HTML5) [top/center/bottom] | center |
transition | Animacja przejścia (nie działa z opcją HTML5) [alpha/blur/no] | no |
preload_width, preload_height | Wymuś minimalny rozmiar zdjęć ładowanych podczas startu przeglądarki | – |
Zachowanie przy starcie
W celu zachęcenia użytkownika do przeglądania prezentacji 360° przeglądarkę można skonfigurować aby uruchamiała się w różny sposób (parametr teaser):
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”, } );
Przeglądarka uruchamiana lokalnie
Ze względu na ograniczenia związane z bezpieczeństwem w oprogramowaniu Adobe Flash Player™ oraz w nowych przeglądarkach internetowych, może nie być możliwe uruchomienie przeglądarki z lokalnego systemu plików. Zalecamu uruchomienie lokalnego serwera HTTP w celu testowanie przeglądarki lokalnie.
This entry was posted in ORBITVU VIEWER on 3 Listopad 2011 by bochenek.
Post navigation
← Specyfikacja struktury prezentacji .ovusORBITVU →
Język