Prévisualisation d'une image
Bonjour,
J'essaye d'adapter un script que j'ai trouvé sur le net pour prévisualiser l'image de la partition musicale générée par un serveur lilypond.
Code:
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
| /* This script and many more are available free online at
The JavaScript Source!! http://javascript.internet.com
Created by: Abraham Joffe :: http://www.abrahamjoffe.com.au/ */
// width to resize large images to
var maxWidth=600;
// height to resize large images to
var maxHeight=500;
// the id of the preview image tag
var outImage="previewField";
function preview(){
var source='http://www.lilyserv.net/bashserver.php?code='+lilycode.getCode()+'&format=png' ;
globalPic=new Image();
globalPic.src=source;
setTimeout("applyChanges()",200);
}
var globalPic;
function applyChanges(){
var field=document.getElementById(outImage);
var x=parseInt(globalPic.width);
var y=parseInt(globalPic.height);
if (x>maxWidth) {
y*=maxWidth/x;
x=maxWidth;
}
if (y>maxHeight) {
x*=maxHeight/y;
y=maxHeight;
}
field.style.display=(x<1 || y<1)?"none":"";
field.src=globalPic.src;
field.width=x;
field.height=y;
} |
Du coté de l'éditeur :
Code:
1 2 3 4 5 6 7 8
|
<a id="bouton" href="javascript:preview()">Prévisualiser</a>
<div><label><span>Prévisualisation : </span>
<br />
<div id='preview'>
<img alt="Graphic will preview here" id="previewField" src="spacer.gif">
<br />
</div> |
Lorsque je clique une première fois sur le bouton "Prévisualiser" aucune image n'apparait mais on voit bien dans la barre du navigateur "En attente de www.lilyserv.net". Si je clique une deuxième fois l'image générée apparait bien.
La création de l'image par le serveur lilypond est assez longue (plus de 10 secondes) et j'ai essayé de modifier la durée du setTimeout mais cela ne résout pas mon problème.
Pourquoi cela ne fonctionne qu'après avoir cliqué deux fois sur prévisualiser ?
Merci