SWFobject : contrôle de l'objet Flash

[yjuliet]

Bonjour.

J'utilise JavaScript pour afficher des documents SWF (Flash) générés depuis des documents pdf par pdf2swf (swftools) dans des pages d'un site à l'aide de SWFObject comme suit :

Code HTML :

1
2
3
4
<div id="viewerContainer">
<div id="viewerControls">Boutons de contrôle</div>
<div id="viewerDiv"></div>
</div>

Code javascript :

1
2
3
4
5
6
7
8
9
10
11
...
    var so = new SWFObject(objectPath, "viewerObj", viewerWidth, viewerHeight, "9", "#ffffff");
    so.addParam("wmode", "transparent");
    so.addParam("scale", "auto");
    so.addParam("allowFullScreen", "true");
    so.addParam("trace", "false");     
    so.addParam("allowScriptAccess", "always");
    so.write("viewerDiv");
 
    ratio =  297/210;
    viewRatio = 0;

L'animation Flash est correctement chargée et jusque là, tout va bien.
J'utilise ensuite quelques fonctions supplémentaires écrites en JS pour naviguer dans mon document :

Code javascript :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
 
  function showPagesCount () {
    var flashMovie= document.getElementById('viewerObj');
    document.getElementById('vcpages').innerHTML=flashMovie.TotalFrames();
    document.getElementById('vcpagenum').max=flashMovie.TotalFrames();
  }
 
  function goToPage ( n ) {
    var flashMovie = document.getElementById('viewerObj');
    if (n==-1) {
      n= parseInt(flashMovie.TGetProperty("/", 5));
    }
    if ( (n != flashMovie.TotalFrames()+1) && (n!=0) ) {
      document.getElementById('vcpagenum').value = n;
      flashMovie.GotoFrame( n-1 ); 
    }
  }
 
  function zoomIn () {
    var flashMovie= document.getElementById("viewerObj");
    if (viewRatio++ >= 0) {      
      flashMovie.Zoom(90); 
    } else {
      var viewerWidth = document.getElementById('viewerDiv').offsetWidth;
      var viewerHeight= viewerWidth * ratio ;
      flashMovie.width = (1 + (viewRatio/10)) * viewerWidth;
      flashMovie.height= (1 + (viewRatio/10)) * viewerHeight;
    }
  }
 
  function zoomOut () {
    var flashMovie= document.getElementById("viewerObj");
    if (viewRatio-- > 0) {      
      flashMovie.Zoom(110);
    } else {
      var viewerWidth = document.getElementById('viewerDiv').offsetWidth;
      var viewerHeight= viewerWidth * ratio ;
      flashMovie.width = (1 + (viewRatio/10)) * viewerWidth;
      flashMovie.height= (1 + (viewRatio/10)) * viewerHeight;
    }
  }
 
  function zoomReset () {
    var flashMovie= document.getElementById("viewerObj");
    viewRatio = 0;
    flashMovie.Zoom(0);
    var viewerWidth = document.getElementById('viewerDiv').offsetWidth;
    var viewerHeight= viewerWidth * ratio ;
    flashMovie.width = (1 + (viewRatio/10)) * viewerWidth;
    flashMovie.height= (1 + (viewRatio/10)) * viewerHeight;
  }
 
  function zoomBestFit () {
    var maxHeight= window.innerHeight-(20+viewer.offsetTop);
    var maxWidth = document.getElementById('viewerdiv').offsetWidth;
    var viewerHeight= Math.min(maxHeight, maxWidth * ratio);
    var viewerWidth = viewerHeight / ratio;
    var flashMovie= document.getElementById("viewerObj");
    flashMovie.Zoom(0);
 
    viewRatio = Math.round(10*(viewerWidth/(document.getElementById('viewerDiv').offsetWidth)-1));    
 
    flashMovie.width = viewerWidth;
    flashMovie.height= viewerHeight;
  }

Les résultats diffèrent d'un navigateur à l'autre :
- Avec Chrome, tout fonctionne à merveille.
- Avec Opera, tout fonctionne aussi.
- Sous MSIE 8/9 (64/32), les fonctions de Zoom fonctionnent toutes mais pas gotoPage(n).

SCRIPT438: Cet objet ne gère pas cette propriété ou cette méthode (flashMovie.TotalFrames())

- Avec Firefox (3.6/Linux, 8/Windows 7), le comportement est bien plus étrange : toutes ces fonctions fonctionnent bien jusqu'à ce que j'utilise la fonction switchFullPage().

Code javascript :

1
2
3
4
5
6
7
8
9
10
11
12
13
  function switchFullPage () {
    var flashMovie = document.getElementById('viewerObj');    
    viewerContainer= document.getElementById("viewerContainer");
    if (viewerContainer.className=="embeddedViewer") {
      viewerContainer.className = "fullScreenViewer";
      document.getElementsByTagName("body")[0].style.overflow="hidden";
      zoomReset();
    } else {
      viewerContainer.className = "embeddedViewer";      
      document.getElementsByTagName("body")[0].style.overflow="auto";
      zoomBestFit();
    }    
  }

Suite à l'utilisation de cette fonction, FF3.6 et 8, j'ai les erreurs suivantes :

flashMovie.Zoom is not a function

flashMovie.TGetProperty is not a function

flashMovie.TotalFrames is not a function

dès que les méthodes de l'objet flashMovie sont utilisées.

Je saurais contourner le problème du zoom lorsque le facteur de zoom est inférieur à 0 (zoom arrière géré par les dimensions de l'objet sans l'appel à la méthode Zoom), mais la gestion de page est beaucoup plus embetante.

Je constate par ailleurs, que les navigateurs avec lesquels tout fonctionne conservent le contexte d'affichage lors de l'utilisation de switchFullPage alors que les autres reviennent sur la première page, comme si l'objet SWF était ré-initialisé, un peu comme si le DOM était reconstruit et que mes objets n'existaient plus...

Merci d'avance de votre aide.

[yjuliet]

Après un peu plus d'investigation, j'ai réussi à me dépatouiller pour une partie des fonctions.

Certaines valeurs que je n'arrivais pas à récupérer en JavaScript le sont côté serveur lors de la construction de la page HTML et sont désormais déclarées comme variables JavaScript (flashMovie.TotalFrames(), ...).

Firefox continue sont comportement étrange, comme si le DOM était reconstruit à chaque fois qu'une classe d'objet changeait.

Internet Explorer 8 et inférieurs ne semblent pas gérer la propriété window.innerHeight, nécessaire à ma méthode "zoomBestFit". Existe-t-il un moyen de contournement ?

Merci d'avance.

[NoSmoking]

Bonjour,

Envoyé par yjuliet

Internet Explorer 8 et inférieurs ne semblent pas gérer la propriété window.innerHeight, nécessaire à ma méthode "zoomBestFit". Existe-t-il un moyen de contournement ?

il te faut récupérer

• la largeur via document.body.clientWidth ou document.documentElement.clientWidth
• la hauteur via document.body.clientHeight ou document.documentElement.clientHeight