Adobe Acrobat 3D, JavaScript i animacje, część 3

kwiecień 9th, 2009. Brak komentarzy.
Kategorie: Acrobat, JavaScript, Software, Zabawy z kodem.

No stało się, kończymy naszą cudowną serię z najlepszym pod słońcem oprogramowaniem.
Wybaczcie mi sarkazm, ale dotychczas wydawało mi się, iż Adobe to poważna firma, wypuszczająca poważne oprogramowanie. Niestety.
Ale ja nie o tym miałem…

Jako, że kończymy, trzeba by opisać nasz model i utworzyć ładny interfejs. Na początek utwórzmy w którymś miejscu pole tekstowe. Nazwijmy je np. Text1, nadajmy odpowiedni wygląd, atrybut read only i jako domyślną wartość wpiszmy nazwę pierwszego wariantu produktu, który ma się pokazać po otwarciu dokumentu. Czyli w naszym przypadku “zatyczka, wklad”.
W tym polu tekstowym będą się pojawiać kolejne nazwy wariantów, w momencie kiedy animacja do nich przejdzie.

Teraz utwórzmy w widocznym miejscu przycisk, który będzie głównym obiektem naszego – jakże rozbudowanego – interfejsu. Nadajmy mu jakąś nazwę, przykładowo Button1 i napis (Caption), np. “Pokaż inną wersję”, aby użytkownik miał choć mgliste pojęcie o jego zastosowaniu.

Po kliknięciu tego przycisku ma się ukazywać popup-menu z wyborem wariantu.

Musimy się do tego odpowiednio przygotować. W skrypcie dokumentu, w miejscu deklaracji, umieszczamy dotychczas wspomniane funkcje i obiekty:

  • in_array()
  • extAnim()
  • animList()
  • myPoint()
  • playMe()

oraz skrypt dodający animacje do listy oraz sprawdzenie i przypisanie wartości zmiennej actual.

Musimy jeszcze utworzyć funkcję, która będzie deaktywować nasz przycisk w trakcie trwania animacji (kombinowanie ze zmianą animacji w trakcie trwania sekwencji jest niebezpieczne – wierzcie mi, przerabiałem to):

// funkcja wlaczajace/wylaczajaca przycisk
function buttonCheck()
{
  // jesli nie istnieje lista animacji, wyjdz
  if(myPoint.anim == null)
    return false;
  // jesli ktoras animacja jest uruchomiona, zablokuj przycisk i zakoncz
  for(var a = 0; a < myPoint.anim.length; a++)
    if(myPoint.anim[a][0].getRunning())
    {
      this.getField("Button1").readonly = true;
      return false;
    }
  // zadna animacja nie jest uruchomiona, odblokuj przycisk i usun timer
  this.getField("Button1").readonly = false;
  // pokaż aktualną nazwę produktu
  this.getField("Text1").value = actual;
  app.clearInterval(button_timeout);
}

Pod zdarzenie Mouse Up przycisku (por. “Adobe Acrobat 3D, JavaScript i animacje. Dodatek.”) podpinamy odpowiedni skrypt. Na początku blokowanie przycisku i zerowanie movieIndex:

button_timeout = app.setInterval("buttonCheck()", 10);
var movieIndex = 0;

Teraz tworzenie menu. Jest to proste, jak budowa cepa. W dokumentacji pod popUpMenuEx jest wszystko dokładnie opisane (jak na Adobe).

Przed samym utworzeniem menu, należy ustalić, co w owym menu będzie i która pozycja ma być nieaktywna (obecnie wybrana). W tym celu tworzymy szybką tablicę wariantów:

// tworzenie menu z listy wszystkich produktow
items = new Array();
for(var a = 0; a < myList.points.length; a++)
{
  // nie wyswietlamy produktow "przejsciowych"
  if(myList.points[a].substring(0, 1) != '*')
  {
    var newItem = {};
    newItem.cName = myList.points[a];
    // aktualnie wybrany produkt w menu ma dodatkowe wlasciwosci:
    if(myList.points[a] == actual)
    {
      newItem.bMarked  = true;   // zaznaczony
      newItem.bEnabled = false;  // nieaktywny
      // (domyslnie bMarked == false, bEnabled == true)
    }
    items.push(newItem);
  }
}

Następnie finalizujemy akcję, czyli odpalamy menu i jeśli użytkownik coś wybierze, obliczamy ścieżkę i odpalamy sekwencję animacji:

 
// wyswietlenie menu
var cRtn = app.popUpMenuEx.apply(app, items);
 
// jesli wybrano pozycje menu
if(cRtn != null)
{
  // poczatek tablicy "tu bylem"
  var been = new Array();
  been.push(actual);
 
  // na wszelki wypadek resetowanie statycznej listy punktow. To powinno wejsc w nawyk
  myPoint.way = new Array();
  // TU OBLICZANA JEST NAJKROTSZA SCIEZKA
  graph = new myPoint(actual, null, 0, been, cRtn);
 
  // ustawienie "aktualnego" produktu na wlasnie wybrany
  actual = cRtn;
 
  // funkcja uruchamiajaca kolejne animacje
  anim_timeout = app.setInterval("playMe()", 10);
}

i… to by było na tyle!

Ktokolwiek będzie musiał przejść tę samą drogę przez mękę, mam nadzieję, że będzie miał przeze mnie ułatwione zadanie…

Skomentuj: