[(#REM)  L'appel depuis un article se fait par < imzXXX >, alors id_imz=XXX]

[(#SET{id_objet,       		[(#ENV{id_imz,     		2382})]})]
[(#SET{size,       		[(#ENV{size,     		1})]})]
  [(#SET{haut,       		[(#ENV{height,     		43})]})]
[(#SET{align_pano,      	[(#ENV{align,     		center})]})]
[(#SET{bgd,       		[(#ENV{background,     		none})]})]
  [(#SET{zm,       		[(#ENV{zoom,     		0})]})]
  [(#SET{shx,       		[(#ENV{shiftx,     		0})]})]
  [(#SET{shy,       		[(#ENV{shifty,     		0})]})]
[(#SET{legende,        		[(#ENV{legende,        		''})]})]

#SET{url,#self}
#SET{wim,2000px}
#SET{him,1000px}
#SET{lgnd,''}

<BOUCLE_pano(DOCUMENTS){id_document=#GET{id_objet}}>
#SET{url,#URL_DOCUMENT}
#SET{wim,#LARGEUR}
#SET{him,#HAUTEUR}
[(#REM) Legende=texte : la legende est cree avec le texte, sinon texte par défaut  ]
         [(#GET{legende}|oui|?{#SET{lgnd,#GET{legende}},#SET{lgnd,'Cliquer sur + ou - pour zoomer'}})]
[(#REM) Legende=1 : la legende est cree a partir du titre ]
         [(#GET{legende}|=={1}|?{#SET{lgnd,#TITRE|textebrut}})]
[(#REM) Legende=2 : la legende est cree a partir du descriptif ]
         [(#GET{legende}|=={2}|?{#SET{lgnd,#DESCRIPTIF|textebrut}})]
</BOUCLE_pano>

[(#REM) calcul de largeur et hauteur en vw du conteneur de l'image ]
[(#SET{ldiv,#GET{size}|mult{98}})]
[(#SET{pcntw,#GET{him}|div{#GET{wim}}})]
[(#SET{hdiv,#GET{ldiv}|mult{#GET{pcntw}}})]

[(#SET{halfw,#GET{wim}|div{2}})]
#SET{fullw,#GET{wim}}
#SET{fullh,#GET{halfw}}

[(#REM) si w/h inférieur 2, fullwidth=him x 2 ]
[(#GET{him}|>{#GET{halfw}}|?{#SET{fullw,#GET{him}|mult{2}}})]
[(#GET{him}|>{#GET{halfw}}|?{#SET{halfw,#GET{him}}})]

[(#REM) l'image est affichée à 100% dans une div de taille (size) X entre 0 et 1 : width(en vw)=X*98 et hauteur(en vw)=X*98*#HAUTEUR/#LARGEUR ]
<script>
    function zoomin#GET{id_objet}(){
        var myImg = document.getElementById("map#GET{id_objet}");
        var currWidth = myImg.clientWidth;
        var currHeight = myImg.clientHeight;
        myImg.style.width = (currWidth*1.111) + "px";
        myImg.style.height = (currHeight*1.111) + "px";
    }
    function zoomout#GET{id_objet}(){
        var myImg = document.getElementById("map#GET{id_objet}");
        var currWidth = myImg.clientWidth;
        var currHeight = myImg.clientHeight;
        myImg.style.width = (currWidth*0.9) + "px";
        myImg.style.height = (currHeight*0.9) + "px";
    }
</script>
<#GET{align_pano}>    <! -- alignement de la div qui contient led div image + boutons et légende -->
<div style="display:block;float:#GET{align_pano}; width:#GET{ldiv}vw; background:#GET{bgd};">   <! -- largeur calculée ; couleur de fond -->
<div style="display:block;overflow: scroll; width:#GET{ldiv}vw; height:#GET{hdiv}vw; margin:0 auto;">   <! -- largeur et hauteur calculée -->
    <img id="map#GET{id_objet}" src="#GET{url}" width="100%" height="100%"  />
</div>  <! -- src="#URL_DOCUMENT" -->
<div style="display:block;background:none;width:#GET{ldiv}vw;margin:0 auto;">   <! -- largeur calculée -->
    <center>
    <button style="background:#fff;font-family:monospace;font-size:1.5em;" type="button" onclick="zoomin#GET{id_objet}()"><b>&nbsp;+&nbsp;</b></button>
    <span><a href="#GET{url}">     <! -- lien vers l'image -->
    #GET{lgnd}
    </a></span>  <! -- texte par défaut, remplacé par légende -->
    <button style="background:#fff;font-family:monospace;font-size:1.5em;" type="button" onclick="zoomout#GET{id_objet}()"><b>&nbsp;-&nbsp;</b></button>
    </center>
</div>
</div>
</#GET{align_pano}>    <! -- /alignement -->