imprimer le contenu d'une pop up.

[tgval]

Bonjour,

Je n'arrive plus à imprimer mes images qui s'ouvrent dans des pop ups.
Quand j'imprime via Safari, c'est une page blanche qui sort, et quand j'essaie par firefox, j'ai un message d'erreur: la page a changé pendant que j'imprimais, relancer l'impression.
je relance l'impression et là ça fonctionne.

On peut voir des exemples ici

Je précise que ce site existe depuis 5 ans, et que c'est la première fois que je vois ça!

Merci d'avance!

PS désolée pour le message d'avant, le '"fin de code" n'a pas fonctionné!

[baron]

(schlum @ 19 Mar 2007, 21:16 )

(baron @ 19 Mar 2007, 20:37)

(marc_os @ 19 Mar 2007, 19:44.) Bon, tout ça c'est dans l'hypothèse que le fait de précharger les images résoudra ton problème. J'espère que c'est bien le cas !!

L'expérience suivante tend à le montrer :
Charger la page, cliquer sur une image, décliner l'invitation à imprimer – la popup s'affiche.
Revenir sur la page principale, cliquer sur la même image. L'impression est bonne.

Oui, c'est ce que j'ai fait aussi (cf. au-dessus...)

Pour qu'on se comprenne bien, je précise que j'ai fait deux expériences successives :
• La première consistait – comme tu sembles l'avoir fait – à laisser la popup s'afficher, après avoir décliné la fenêtre d'impression automatique, puis à imprimer de manière traditionnelle, via le menu Fichier, le contenu de cette fenêtre surgissante.
• La deuxième à laisser, de la même façon, s'afficher cette fenêtre popup puis à revenir dans la première fenêtre générale – tout en laissant affichée en arrière-plan l'image .gif dans sa fenêtre – et à cliquer une deuxième fois sur le même lien, qui produisait alors une impression correcte.

(baron @ hier, 14:16)
Quoiqu'ayant une configuration bien différente (OS 9.1 et Mozeilla 1.3.1), j'observe le même comportement en deux temps que toi et Schlum :

Quand je clique sur une image, il me propose une impression que je refuse, puis je fais "Imprimer" sur le pop-up et ça fonctionne.

Si je clique sur l'image choisie, une popup blanche s'ouvre, puis aussitôt la fenêtre de dialogue d'impression.
1º Si j'acquiesce alors, j'ai une page blanche (l'adresse de la page imprimée étant d'ailleurs la seule chose qui s'imprime – et elle est parlante ! « about:blank »).
2º Si je refuse cette impression, l'image se charge et s'affiche à l'écran. Du coup, je peux l'imprimer sans problème à partir du menu Fichier.

J'en ai faite une troisième :
• Comme en 2) mais en ayant d'abord refermé la fenêtre popup, puis en recliquant sur le lien de la page principale => impression vide.

L'important est donc de charger l'image et de la garder chargée, pas de l'avoir en cache me semble-t-il…

[marc_os]

[...]
L'important est donc de charger l'image et de la garder chargée, pas de l'avoir en cache me semble-t-il…

C'est pour ça que je précisais: "si ça marche".
En effet, même si l'image est préchargée par du code javascript, quand la nouvelle fenêtre est affichée, l'image doit être lue depuis le disque dur. Et là aussi, ça se fait de façon asynchrone. Même si c'est x fois plus rapide que de télécharger l'image, ça peut ne pas être suffisant, et il se peut que l'image ne soit pas (suffisament) chargée quand l'appel javascript à print est fait.

Je vais faire quelques petits essais dans ma pause midi pour réduire à zéro ce risque.
A toute...

[marc_os]

[...]
A toute...

Me revoilà.
Donc, j'ai un peu étofé mon code javascript.
Le principe du code :
- comme avant, faire le tour de tous les liens d'une page et si dans le onclick on trouve une url d'image, on précharge celle-ci.
- on regarde aussi si le onclick contient window.open et pop.print(). Si c'est le cas, je change la propriété onclick de sorte que celle-ci appelle une fonction javascript perso chargée d'ouvrir une nouvelle fenêtre comme avant, et de lancer l'impression.
- Cette nouvelle fonction à la différence d'avant fait en sorte que la demande d'impression ne se fasse qu'une fois que l'image est bel et bien chargée.

Ça marche comme avant, la seule différence est la taille des fenêtres ouvertes qui est la taille de la fenêtre d'où on vient, et non pas la taille de l'image. Mais ça ne devrait pas poser de problème !

Voici le code :

[codebox]
var gImages = new Array();

function chargerImage(urlImage)
{
var img = new Image();
gImages.push(img);
img.src = urlImage;
}

function chargerImagesDansTagsA()
{
var extensions = new Array("jpg", "gif", "png"); // ajouter ici des extensions si nécessaire
var marqueursDebutImage = new Array("'", "\"");

var nbLiens = document.links.length;
var nbExtensions = extensions.length;
var nbMarqueurs = marqueursDebutImage.length;

for ( i=0; i<nbLiens; i++ )
{
var lien = document.links[i];
var textOnClick = lien.onclick;
var oTextOnClick = new String(textOnClick);
for ( j=0; j<nbExtensions; j++ )
{
var extension = "." + extensions[j];
var positionExtension = oTextOnClick.search(extension);
if ( positionExtension > 0 )
{
oText = oTextOnClick.substring(0, positionExtension); // contient la valeur de onclick jusqu'au nom de l'image sans l'extension
for ( k=0; k<nbMarqueurs; k++ )
{
var positionDernierMarqueur = oText.lastIndexOf(marqueursDebutImage[k]);
if ( positionDernierMarqueur >= 0 )
{
oText = oText.substring(positionDernierMarqueur+1);
urlImage = oText + extension;
chargerImage(urlImage);

// On va mettre un onclick qui va bien
// Petit test sur le onclick pour éviter de remplacer ce qu'il ne faut pas.
// Il doit contenir window.open et pop.print().
if ( oTextOnClick.search("window.open") != -1 && oTextOnClick.search("pop.print()") != -1 )
{
// mais on doit d'abord stocker les infos dont on a besoin
lien.grandeImage = urlImage; // trop cool, on peut ajouter des propriétés aux objets comme on veut
// Le nouveau onclick pour le lien (cf. http://www.brainjar.com/dhtml/events/ )
lien.onclick = afficherEtImprimerGrandeImage;
}
// on a trouvé le nom de l'image donc:
j = nbExtensions; // pas la peine de chercher une image avec une autre extension => on sortira de la boucle sur les extensions
break; // on sort de la boucle en cours
}
}
}
}
}
}

function afficherEtImprimerGrandeImage(event)
{
afficherEtImprimerImage(this.grandeImage);
}

// On aurait pu aussi ouvrir un fichier php à qui on aurait passé en paramètre le nom de l'image à afficher.
// Mais ça aurait fait un fichier en plus à mettre sur le site, et là ça marche sans php
function afficherEtImprimerImage(urlFichier)
{
win = window.open();
doc = win.document;
doc.writeln('<html>');
doc.writeln('<head>');
doc.writeln('<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">');
doc.writeln('<title>Image à imprimer</title>');
doc.writeln('</head>');
doc.writeln('<body style="margin:0; padding:0">');
// setTimeout ci-dessous nécessaire avec FireFox PC: sinon, affichage d'une fenêtre grise sous la boîte de dialogue d'impression
doc.writeln('<img src="' + urlFichier + '" alt="" onload="window.setTimeout(\'window.print()\', 100);">');
doc.writeln('</body>');
doc.write('</html>');
doc.close();
return false;
}
[/codebox]

Les modifications à faire dans tes fichiers sont les mêmes que pour ma première version du code:
- copier le code dans un fichier .js
Pour chaque page concernée:
- inclure ce fichier .js dans le head du fichier
- appeler chargerImagesDansTagsA() dans le onload du body.
C'est tout !

Pour tes prochaines pages, idem, mais pour tes liens tu peux utiliser directement afficherEtImprimerImage dans le onclick pour remplacer le window.open. Par exemple:

HTML

<a href="#" target="_self" onClick="afficherEtImprimerImage('images/grandeImage.jpg')"><img src="images/petiteImage.jpg" alt=""></a>

Voili voilà, on apprend tous les jours.

PS: Testé et approuvé sur IE6, IE7 et Firefox 2 sur PC (et oui, au taf je suis sur PC )

Ce message a été modifié par marc_os - 20 Mar 2007, 14:10.