Menu

Récupérer un valeur dans une fonction [Résolu]

Messages postés
67
Date d'inscription
jeudi 20 mars 2014
Statut
Membre
Dernière intervention
21 mai 2019
-
Bonjour,


J'ai une code qui permet de récupérer de calculer la fenêtre d'un pdf avec la valeur scale par rapport au width de la fenêtre le voici:

var unscaledViewport = page.getViewport(1);
//scale permet de redimensionner un pdf sur un élément html
var scale = Math.min(($(window).width() / unscaledViewport.width));
var viewport = page.getViewport(scale);
console.log(viewport);

Ca marche bien mais le problème c'est que ce code ne prend pas la taille en temps réel du width que seulement si j'actualise la page. Alors ce que je veux c'est d'obtenir la valeur du width lorsque je redimensionne la fenêtre sans avoir à rafraichir la page.

J'aimerais donc insérer ce code dans un function resize:

$(window).resize(function() { 
   
}); 


Ce que je veux c'est quelque chose du genre:

$(window).resize(function() { 
  var unscaledViewport = page.getViewport(1);
  var scale = Math.min(($(window).width() / unscaledViewport.width)); 
}); 

//La variable viewport doit récupère la variable scale qui se trouve dans la function resize

var viewport = page.getViewport(scale);
console.log(viewport);



Mais je ne sais pas comment faire, pouvez vous m'aider s'il vous plaît. Merci de votre collaboration.
Afficher la suite 

Votre réponse

2 réponses

Messages postés
3389
Date d'inscription
jeudi 16 juin 2005
Statut
Membre
Dernière intervention
21 mai 2019
902
0
Merci
Bonjour,

Essaie comme ça :
var viewport;

function updateViewport() {
  var unscaledViewport = page.getViewport(1);
  var scale = Math.min(($(window).width() / unscaledViewport.width)); 
  viewport = page.getViewport(scale);
}

$(window).resize(updateViewport); 

updateViewport();

console.log(viewport);
rasielblas
Messages postés
67
Date d'inscription
jeudi 20 mars 2014
Statut
Membre
Dernière intervention
21 mai 2019
-
Merci de m'avoir répondu, votre function marche très bien mais le problème c'est au niveau du:
$(window).resize(updateViewport); 

En fait, quand je redimensionne la page alors la valeur retourné par la fonction updateViewport reste le même. l'évènement resize n'est pas détecter.

Cordialement,
Reivax962
Messages postés
3389
Date d'inscription
jeudi 16 juin 2005
Statut
Membre
Dernière intervention
21 mai 2019
902 -
As-tu des erreurs dans la console de ton navigateur ?
rasielblas
Messages postés
67
Date d'inscription
jeudi 20 mars 2014
Statut
Membre
Dernière intervention
21 mai 2019
-
Non! je ne détecte aucun erreur sur la console mais elle me retourne un seul valeur est c'est tout, la valeur ne se met pas à jour lorsque je redimensionne la fenêtre, elle ne détecte pas l'évènement resize même si je change la valeur du fonction par le message hello word, alors elle me retourne seulement un seul hello word même si je redimensionne la fenêtre.
Reivax962
Messages postés
3389
Date d'inscription
jeudi 16 juin 2005
Statut
Membre
Dernière intervention
21 mai 2019
902 -
Ah mais ça c'est normal, le console.log n'est pas inclus à la fonction. Tu peux le rajouter à la dernière ligne de la fonction.
Commenter la réponse de Reivax962
Messages postés
67
Date d'inscription
jeudi 20 mars 2014
Statut
Membre
Dernière intervention
21 mai 2019
0
Merci
Bonjour,
Merci, ca fonctionne:

var viewport;
         function updateViewport() {
		var unscaledViewport = page.getViewport(1);
			var scale = Math.min(($(window).width() / unscaledViewport.width)); 
				viewport = page.getViewport(scale);
				console.log(viewport)
				console.log("Scale: " + scale);
				}
							$(window).resize(updateViewport); 


Mais comment récupère-ton la valeur du variable en dehors du fonction à partir de $(window).resize(updateViewport); ?
Car lorsque je met par exemple la variable scale en dehors du fonction:
var viewport;
         function updateViewport() {
		var unscaledViewport = page.getViewport(1);
			var scale = Math.min(($(window).width() / unscaledViewport.width)); 
				viewport = page.getViewport(scale);
				
				}
							$(window).resize(updateViewport); 
console.log(viewport)
console.log("Scale: " + scale);


Alors ça me retourne un erreur: ReferenceError: scale is not defined
Reivax962
Messages postés
3389
Date d'inscription
jeudi 16 juin 2005
Statut
Membre
Dernière intervention
21 mai 2019
902 -
Bonjour,

Peux-tu nous redonner ton code, tel qu'il est maintenant ?

Xavier
rasielblas
Messages postés
67
Date d'inscription
jeudi 20 mars 2014
Statut
Membre
Dernière intervention
21 mai 2019
-
Bonjour,
Je suis encore sur l'ancien code que vous m'avez suggérer:

var scale ;
var viewport;
function updateViewport() {
   var unscaledViewport = page.getViewport(1);
   scale = Math.min(($(window).width() / unscaledViewport.width)); 
   viewport = page.getViewport(scale);
}
$(window).resize(updateViewport); 
 console.log("viewport", viewport);
 console.log("Scale: " , scale);


Cela m'a retourné scale: undefined, et viewport undefined. Les variables récupère bien le dimension de la fenêtre en temps réel si on le met dans la function mais quand on l’exécute en dehors du function alors elle est initialisé en undefined.
Reivax962
Messages postés
3389
Date d'inscription
jeudi 16 juin 2005
Statut
Membre
Dernière intervention
21 mai 2019
902 -
Bonjour,

C'est normal.
Il faut bien comprendre ce qu'il se passe ici.
Tu as un script (ces 10 lignes) qui est appelé lorsque la page est chargée. Dans l'état, le script fait :
- déclaration des variables ;
- déclaration d'une fonction, updateViewport, qui, quand elle est appelée, affecte des valeurs à tes deux variables ;
- affectation de cette fonction à l'événement Resize ;
- affichage du contenu des variables.

Déclarer la fonction ne l'exécute pas. Donc au chargement de ta page, la fonction n'est pas du tout appelée. Elle n'est appelée que quand la fenêtre est redimensionnée. Les variables ne sont donc initialisées qu'à ce moment.
Par ailleurs, l'affichage de la valeur des variables n'est fait qu'une fois : au chargement de la page. Donc avant que la fonction n'ait été appelée une première fois... Il est normal qu'elles soient encore undefined.

Pour y remédier, tu peux déplacer les deux console.log à l'intérieur du corps de la fonction.
Par ailleurs, je pense que tu as besoin d'initialiser tes variables au chargement de la page, car tu en auras besoin même si l'utilisateur ne redimensionne pas sa page.
Donc, rajoute un simple appel à la fonction (comme montré dans le code que j'avais donné) : updateViewport(); à la fin de ton script.

Xavier
Bonjour,

C'est normal, la variable page n'est pas définie. Si tu utilises PDF.js je t'invite à regarder ceci: https://mozilla.github.io/pdf.js/examples
rasielblas
Messages postés
67
Date d'inscription
jeudi 20 mars 2014
Statut
Membre
Dernière intervention
21 mai 2019
-
Merci pour votre aide, vous avez raison, donc j'ai du insérer tout mes codes à l'intérieur du function updateViewport() et ça a bien marcher, encore merci pour votre coup de pouce, est à la prochaine! :-)
Commenter la réponse de rasielblas