Bonjour,

Voici quelques jours que je galère avec le redimensionnement d'image côté client.

Dans mon code (ci dessous), lorsque je me mets en mode débug dans firefox et que je fais des arrêts sur la ligne "if(position!=-1)", je vois que le code y passe trois fois puis envoie bien l'image.

Cependant lorsque je retire les points d’arrêt et lance le même code, le navigateur plante.

Voici le code:

function voir_fentre_chargement_photo_tet()
{
	document.getElementById('block_chargement_en_cours').style.display = 'block';

	var $test = 0;
	var chaine = "";

	while($test==0)
	{
		//on recupere les info du upload
		var filesToUpload = document.getElementById('bouton_joindre_hoto_tet_new');

		var reader = new FileReader();
		reader.readAsDataURL(filesToUpload.files[0]);
		
		reader.addEventListener('load', function()
		{
			// recuperer le canvas
			var canvas_dessin = document.getElementById('canvas_charg_photo');
			var ctx = canvas_dessin.getContext("2d");
			
			//on creer une image
			var image1 = document.createElement("img");
			
			image1.src = reader.result;
			
			var largeur_image1 = image1.width;
			var hauteur_image1 = image1.height;
			
			var MAX_WIDTH = 600;
			var MAX_HEIGHT = 600;
			
			if(largeur_image1>=hauteur_image1)
			{
				if (largeur_image1 > MAX_WIDTH) 
				{
					hauteur_image1 *= MAX_WIDTH / largeur_image1;
					largeur_image1 = MAX_WIDTH;
				}
			}
			else
			{
				if (hauteur_image1 > MAX_HEIGHT)
				{
					largeur_image1 *= MAX_HEIGHT / hauteur_image1;
					hauteur_image1 = MAX_HEIGHT;
				}
			}
			
			//on redimentionne le canvas
			document.getElementById('canvas_charg_photo').width = largeur_image1;
			document.getElementById('canvas_charg_photo').height = hauteur_image1;
			
			ctx.drawImage(image1,0,0,largeur_image1,hauteur_image1);
			
			var image_finale = new Image();
			image_finale.src = canvas_dessin.toDataURL('image/jpeg', 1.0);

			document.getElementById('hidden_code_photo_send').value = image_finale.src;
			
			chaine = image_finale.src;
		});

		var position = chaine.indexOf("base64"); 
		
		if(position!=-1)
		{
			$test = 1;
		}
	}
	
	document.getElementById('hidden_code_photo_send').value = chaine;
	document.creeer_la_photo_pour_tet.submit();		
}

-
Edité par AdoAdo 27 juin 2018 à 17:16:52