11548 sujets

JavaScript, DOM et API Web HTML5

Bon, c'est pas nouveau, je suis vraiment nul en javascript...

Depuis ce matin je fais des recherches mais je ne trouve pas ce que je veux Smiley decu

J'aimerais que lorsque le bouton "envoyer" d'un formulaire soit cliqué, pendant que la photo est uploadée (ce sont de grosses photos, l'utilisateur peut attendre jusque genre 5 minutes...), une petite fenêtre popup s'ouvre avec dedans un petit texte qui dit que la photo est en cours d'envoi et une barre de progression toute simple (pas une barre qui calcule la progression mais vraiment juste un gif animé qui tourne en boucle, juste pour que ça bouge et que l'utilisateur ne pense pas que le truc est planté).

Jusque là, je pense que c'est pas trop compliqué et dans mes cordes.

Ensuite, j'aimerais qu'une fois que la page en arrière plan (qui est en train d'exécuter le script d'envoi) puisse envoyer une commande qui ferme ce popup lorsqu'elle a fini d'envoyer le fichier. Et là j'avoue que je patauge un peu et que je ne sais pas comment m'y prendre Smiley cligne

Si quelqu'un a des pistes, exemples etc, ce serait sympa...
J'ai tenté ceci:

J'ai créé un <div> masqué, que je voudrais faire apparaître lorsque le bouton "Envoyer" est cliqué...

Mais cela ne fonctionne pas car, sans doute, une fois que le bouton est cliqué, la page suivante est en train d'être chargée. Et même si elle prend du temps à être chargée puisque l'image est lourde à envoyer, la page actuelle du formulaire ne sait plus être modifiée Smiley decu

J'en reviens donc à ma première idée de page popup qui s'ouvre au click, mais je sais pas comment la faire se refermer seul une fois que la page suivante est chargée Smiley decu
Bon, je sais qu eje parle seul, mais c'est pas grave, ça fait passer le temps et ça m'empêche de peter une case parce que là le truc commence à m'énerver...

Enfin, tout marche *presque* comme il faudrait, donc si encore uen fois quelqu'un peut m'aider c'est cool Smiley smile

Quand on clique sur Submit, un <div> contentant un gif animé de barre de progression et un petit texte apparait. Ce div étant à la base masqué, bien entendu.
Une fois que la page a fini de charger la photo et passe à la suite, c'est nickel...

MAIS...

Si la photo ne rencontre pas des conditions minimales de taille, il y a un history.back() qui ramène l'utilisateur au formulaire pour qu'il choisisse une autre photo.

Problème: comme on fait un simple retour en arrière dans l'history, on revient sur le formulaire tel que l'utilisateur l'avait laissé, et donc le div de progression est visible Smiley decu

Je n'ai pas trouvé l'endroit où je pouvais dire de masque à nouveau ce div une fois qu'on changeait de page Smiley decu

Une idée?

Merci Smiley lol