Hostowanie Prezentacji 360° na własnym serwerze

Do hostowania prezentacji na własnym serwerze potrzebujesz:

• dostęp do serwera (kopiowanie plików i konfiguracja serwera HTTP)
• własną kopię ORBITVU VIEWER (musisz zakupić licencję lub skorzystać z ORBITVU VIEWER Free360)
• Prezentacja 360°
• troche wiedzy technicznej na temat HTML i administracji serwerami
• musisz zrozumieć czym jest ORBITVU PRESENTATION oraz czym jest ORBITVU VIEWER.

Rozlokowanie

• VIEWER
  • Skopiuj ORBITVU VIEWER na Twój serwer (skopiuj folder orbitvu12/)
  • Skonfiguruj swój serwer WWW tak, aby obsługiwał pliki z folderu orbitvu12/ (upewnij się, że są one publicznie dostępne pod pewnym adresem URL, np.: http://twojadomena.com/orbitvu12/)
• Prezentacje
  • Skopiuj Prezentacje na swój serwer (zwykle będziesz używać klienta FTP)
  • Skonfiguruj swój serwer WWW tak, aby obsługiwał pliki prezentacji pod niektórymi publicznie dostępnymi adresami URL, np.: http://twojadomena.com/presentations/
• Konfiguracja serwera
  • Dodaj nagłówek Access-Control-Allow-Origin*; zarówno do adresu URL VIEWER jak i URL Prezentacji aby uniknąć potencjalnych problemów z CORS (Cross-origin resource sharing)
  • Dodaj crossdomain.xml do domeny używanej do obsługi plików prezentacji w celu uniknięcia problemów z bezpieczeństwem Flash, np.: https://mydomain.com/crossdomain.xml
• Kodowanie
  • Utwórz strony internetowe, które wykorzystają Twoj ORBITVU VIEWER i Twoje adresy URL prezentacji (szczegóły poniżej).

Kodowanie stron internetowych

• Wczytaj skrypty pomocnicze ORBITVU VIEWER Możesz dodać skrypty do sekcji<head> na stronie.

<script type="text/javascript" src="http://yourdomain.com/orbitvu12/orbitvu.js"></script>

• Utwórz element kontenera do prezentacji Utwórz element kontenera, do którego zostanie wstrzyknięta Twoja prezentacja. Konieczne jest ustawienie unikalnego identyfikatora dla tego kontenera.

<div id="presentation1-container"></div>

• Wstrzyknięcie prezentacji Ostatnim krokiem jest wywołanie funkcji JavaScript inject_orbitvu, która wstrzykuje prezentację do kontenera.

<script type="text/javascript">
    inject_orbitvu(
        'presentation1-container',
        'http://yourdomain.com/orbitvu12/',
        '',
        {
            ovus_folder: "http://yourdomain.com/presentations/presentation1/",
            content2: 'yes',
            width: "500",
            height: "400"
        });
</script>

Linia 3:

id elementu kontenera

Linie 4-5:

URL do plików ORBITVU VIEWER (hostowanych na Twoim serwerze)

Linia 7:

URL do katalogu prezentacji (hostowanego na Twoim serwerze)

Linia 8:

Ustaw na yes, jeśli w katalogu prezentacji znajduje się plik content2.xml, w przeciwnym razie ustaw na nie lub usuń

Linie 9-10:

Inne parametry ORBITVU VIEWER. Więcej informacji na ten temat można znaleźć w częsci lista parametrów.

Kompletny przykład

Przykład wykorzystuje jQuery do odroczenia wykonania JavaScript do czasu załadowania strony

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />

        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script type="text/javascript" src="http://yourdomain.com/orbitvu12/orbitvu.js"></script>

        <script type="text/javascript">
            $(function() {
                inject_orbitvu(
                  'presentation1-container',
                  'http://yourdomain.com/orbitvu12/orbitvuer12.swf',
                  'http://yourdomain.com/orbitvu12/expressInstall.swf',
                  {
                      ovus_folder: "http://yourdomain.com/presentations/presentation1/",
                      content2: "yes",
                      width: "500",
                      height: "400"
                  });
            });
        </script>
    </head>
    <body>
        <h1>Some text</h1>

        <div id="presentation1-container"></div>
    </body>
</html>