Subversion Repositories eFlore/Applications.cel

Rev

Rev 1519 | Go to most recent revision | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 1519 Rev 1524
Line 42... Line 42...
42 
 
 42 
 
43 
//+----------------------------------------------------------------------------------------------------------+
 43 
//+----------------------------------------------------------------------------------------------------------+
44 
//UPLOAD PHOTO : Traitement de l'image
44 
//UPLOAD PHOTO : Traitement de l'image
Line 45... Line 45...
45 
$(document).ready(function() {
 45 
$(document).ready(function() {
46
46
47 
	$("#effacer-miniature").click(function () {
 47 
	$(".effacer-miniature").click(function () {
Line 48... Line -...
48 
		supprimerMiniature();
 - 
 
49 
	});
 - 
 
50
- 
 
51 
	if (HTML5 && window.File && window.FileReader && isCanvasSupported()) {
 - 
 
52 
		if (DEBUG) {
 48 
		supprimerMiniatures($(this));
53 
			console.log("Support OK pour : API File et Canvas.");
 49 
	});
54 
		}
 50
55 
		$('#fichier').bind('change', function(e) {
 51 
	$('#photo-placeholder').click(function(event) {
56 
			afficherMiniatureHtml5(e);
 52 
		$("#fichier").click();
57 
		});
53 
	});
58 
	} else {
 54
59 
		$("#fichier").bind('change', function (e) {
 55 
	$("#fichier").bind('change', function (e) {
60 
			arreter(e);
 56 
		arreter(e);
61 
			var options = {
57 
		var options = {
62 
				success: afficherMiniature, // post-submit callback
58 
			success: afficherMiniature, // post-submit callback
63 
				dataType: 'xml', // 'xml', 'script', or 'json' (expected server response type)
59 
			dataType: 'xml', // 'xml', 'script', or 'json' (expected server response type)
64 
				resetForm: true // reset the form after successful submit
60 
			resetForm: true // reset the form after successful submit
- 
 
 61 
		};
65 
			};
 62 
		$("#miniature").append('<img id="miniature-chargement" class="miniature" alt="chargement" src="'+CHARGEMENT_IMAGE_URL+'"/>');
66 
			$("#miniature").append('<img id="miniature-chargement" class="miniature" alt="chargement" src="'+CHARGEMENT_IMAGE_URL+'"/>');
 63 
		$("#ajouter-obs").attr('disabled', 'disabled');
- 
 
 64 
		if(verifierFormat($("#fichier").val())) {
67 
			$("#ajouter-obs").attr('disabled', 'disabled');
 65 
			$("#form-upload").ajaxSubmit(options);
- 
 
 66 
		} else {
68 
			$("#form-upload").ajaxSubmit(options);
 67 
			window.alert("Le format de fichier n'est pas supporté, les formats acceptés sont "+	$("#fichier").attr("accept"));
Line 69... Line 68...
69 
			return false;
 68 
		}
70 
		});
 69 
		return false;
71 
	}
 70 
	});
72
71
Line 84... Line 83...
84 
		infosAssociee.numNomRet = INFOS_ESPECE_IMPOSEE["nom_retenu.id"];
 83 
		infosAssociee.numNomRet = INFOS_ESPECE_IMPOSEE["nom_retenu.id"];
85 
		infosAssociee.famille = INFOS_ESPECE_IMPOSEE.famille;
 84 
		infosAssociee.famille = INFOS_ESPECE_IMPOSEE.famille;
86 
		infosAssociee.retenu = (INFOS_ESPECE_IMPOSEE.retenu == 'false') ? false : true;
 85 
		infosAssociee.retenu = (INFOS_ESPECE_IMPOSEE.retenu == 'false') ? false : true;
87 
		$("#taxon").data(infosAssociee);
 86 
		$("#taxon").data(infosAssociee);
88 
	}
 87 
	}
- 
 
 88
- 
 
 89 
	$('.effacer-miniature').live('click', function() {
- 
 
 90 
		$(this).parent().remove();
- 
 
 91 
	});
89 
});
 92 
});
Line 90... Line -...
90 
 
 - 
 
91 
function isCanvasSupported(){
 - 
 
92 
	var elem = document.createElement('canvas');
 - 
 
93 
	return !!(elem.getContext && elem.getContext('2d'));
 - 
 
94 
}
 - 
 
95 
 
 93 
 
96 
function afficherMiniatureHtml5(evt) {
 - 
 
97 
	supprimerMiniature();
 - 
 
98
- 
 
99 
	var selectedfiles = evt.target.files;
 - 
 
100 
	var f = selectedfiles[0];// Nous récupérons seulement le premier fichier.
 - 
 
101 
	if (f.type != 'image/jpeg') {
 - 
 
102 
		var message = "Seule les images JPEG sont supportées.";
 - 
 
103 
		$("#miniature-msg").append(message);
 - 
 
104 
	} else if (f.size > 5242880) {
 - 
 
105 
		var message = "Votre image à un poids supérieur à 5Mo.";
 - 
 
106 
		$("#miniature-msg").append(message);
 - 
 
107 
	} else {
 94 
function verifierFormat(nom) {
108 
		var reader = new FileReader();
 - 
 
109 
		// Lit le fichier image commune url de données
 - 
 
110 
		reader.readAsDataURL(f);
 - 
 
111 
		var imgNom = f.name;
 - 
 
112
- 
 
113 
		// Closure pour capturer les infos du fichier
 - 
 
114 
		reader.onload = (function(theFile) {
 - 
 
115 
			return function(e) {
 - 
 
116 
				// Rendre la miniature
 - 
 
117 
				var imageBase64 = e.target.result;
 - 
 
118 
				//$("#miniature").append('<img id="miniature-img" class="miniature b64" src="'+imageBase64+'" alt="'+imgNom+'"/>');
 - 
 
119
- 
 
120 
				// HTML5 Canvas
 - 
 
121 
				var img = new Image();
 - 
 
122 
			    img.src = imageBase64;
 - 
 
123 
			    img.alt = imgNom;
 - 
 
124 
			    img.onload = function() {
 - 
 
125 
			    	transformerImgEnCanvas(this, 100, 100, false, 'white');
 - 
 
126 
			    };
 - 
 
127 
			};
 - 
 
128 
		})(f);
 - 
 
129 
	}
 - 
 
130 
	$("#effacer-miniature").show();
 - 
 
131 
}
 - 
 
132 
 
 - 
 
133 
function transformerImgEnCanvas(img, thumbwidth, thumbheight, crop, background) {
 - 
 
134 
	var canvas = document.createElement('canvas');
 - 
 
135 
	canvas.width = thumbwidth;
 - 
 
136 
	canvas.height = thumbheight;
 - 
 
137 
	var dimensions = calculerDimenssions(img.width, img.height, thumbwidth, thumbheight);
 - 
 
138 
	if (crop) {
 - 
 
139 
		canvas.width = dimensions.w;
 - 
 
140 
		canvas.height = dimensions.h;
 - 
 
141 
		dimensions.x = 0;
 - 
 
142 
		dimensions.y = 0;
 - 
 
143 
	}
 - 
 
144 
	cx = canvas.getContext('2d');
 95 
	var parts = nom.split('.');
145 
	if (background !== 'transparent') {
 - 
 
146 
		cx.fillStyle = background;
 - 
 
147 
		cx.fillRect(0, 0, thumbwidth, thumbheight);
 - 
 
148 
	}
 96 
	extension = parts[parts.length - 1];
149 
	cx.drawImage(img, dimensions.x, dimensions.y, dimensions.w, dimensions.h);
 - 
 
150 
	afficherMiniatureCanvas(img, canvas);
 - 
 
151 
}
 - 
 
152 
 
 - 
 
153 
function calculerDimenssions(imagewidth, imageheight, thumbwidth, thumbheight) {
 - 
 
154 
	var w = 0, h = 0, x = 0, y = 0,
 - 
 
155 
	    widthratio = imagewidth / thumbwidth,
 - 
 
156 
	    heightratio = imageheight / thumbheight,
 - 
 
157 
	    maxratio = Math.max(widthratio, heightratio);
 - 
 
158 
	if (maxratio > 1) {
 - 
 
159 
	    w = imagewidth / maxratio;
 - 
 
160 
	    h = imageheight / maxratio;
 - 
 
161 
	} else {
 - 
 
162 
	    w = imagewidth;
 - 
 
163 
	    h = imageheight;
 - 
 
164 
	}
 - 
 
165 
	x = (thumbwidth - w) / 2;
 - 
 
166 
	y = (thumbheight - h) / 2;
 - 
 
167 
	return {w:w, h:h, x:x, y:y};
 - 
 
168 
}
 - 
 
169 
 
 - 
 
170 
function afficherMiniatureCanvas(imgB64, canvas) {
 - 
 
171 
	var url = canvas.toDataURL('image/jpeg' , 0.8);
 - 
 
172 
	var alt = imgB64.alt;
 - 
 
173 
	var title = Math.round(url.length / 1000 * 100) / 100 + ' KB';
 - 
 
174 
	var miniature = '<img id="miniature-img" class="miniature b64-canvas" src="'+url+'" alt="'+alt+'" title="'+title+'" />';
 - 
 
175 
	$("#miniature").append(miniature);
 - 
 
176 
	$("#miniature-img").data('b64', imgB64.src);
 97 
	return (extension.toLowerCase() == 'jpeg' || extension.toLowerCase() == 'jpg');
Line 177... Line 98...
177 
}
 98 
}
178 
 
 - 
 
179 
function afficherMiniature(reponse) {
99 
 
180 
	supprimerMiniature();
 100 
function afficherMiniature(reponse) {
181 
	if (DEBUG) {
 101 
	if (DEBUG) {
182 
		var debogage = $("debogage", reponse).text();
 102 
		var debogage = $("debogage", reponse).text();
183 
		console.log("Débogage upload : "+debogage);
 103 
		console.log("Débogage upload : "+debogage);
184 
	}
 104 
	}
185 
	var message = $("message", reponse).text();
 105 
	var message = $("message", reponse).text();
186 
	if (message != '') {
 106 
	if (message != '') {
187 
		$("#miniature-msg").append(message);
 107 
		$("#miniature-msg").append(message);
188 
	} else {
 - 
 
189 
		var miniatureUrl = $("miniature-url", reponse).text();
 - 
 
190 
		var imgNom = $("image-nom", reponse).text();
 108 
	} else {
191 
		$("#miniature").append('<img id="miniature-img" class="miniature" alt="'+imgNom+'" src="'+miniatureUrl+'"/>');
 109 
		$("#miniatures").append(creerWidgetMiniature(reponse));
- 
 
 110 
	}
- 
 
 111 
	$('#ajouter-obs').removeAttr('disabled');
- 
 
 112 
}
- 
 
 113 
 
- 
 
 114 
function creerWidgetMiniature(reponse) {
- 
 
 115 
	var miniatureUrl = $("miniature-url", reponse).text();
192 
	}
 116 
	var imgNom = $("image-nom", reponse).text();
- 
 
 117 
	var html =
- 
 
 118 
		'<div class="miniature">'+
- 
 
 119 
			'<img class="miniature-img" class="miniature" alt="'+imgNom+'" src="'+miniatureUrl+'"/>'+
- 
 
 120 
			'<button class="effacer-miniature" type="button">Effacer</button>'+
193 
	$('#ajouter-obs').removeAttr('disabled');
 121 
		'</div>'
Line 194... Line 122...
194 
	$("#effacer-miniature").show();
122 
	return html;
195 
}
 123 
}
196 
 
 124 
 
197 
function supprimerMiniature() {
 - 
 
198 
	$("#miniature").empty();
 125 
function supprimerMiniatures() {
Line 199... Line 126...
199 
	$("#miniature-msg").empty();
 126 
	$("#miniatures").empty();
200 
	$("#effacer-miniature").hide();
 127 
	$("#miniature-msg").empty();
201 
}
 128 
}
Line 370... Line 297...
370 
 
 297 
 
371 
function trouverCommune(pos) {
 298 
function trouverCommune(pos) {
Line 372... Line 299...
372 
	$(function() {
 299 
	$(function() {
373
- 
 
374 
		var url_service = SERVICE_NOM_COMMUNE_URL;
 - 
 
375 
		/*if(NOM_SCI_PROJET != "bdtfx") {
 - 
 
376 
			// Dans le cas d'autres référentiels comme les Antilles, on utilise
 - 
 
377 
			// une localisation mondiale mais approximative (c'est mieux que rien)
 - 
 
Line 378... Line 300...
378 
			url_service = SERVICE_NOM_COMMUNE_URL_ALT
 300
379 
		}*/
 301 
		var url_service = SERVICE_NOM_COMMUNE_URL;
380
302
381 
		var urlNomCommuneFormatee = url_service.replace('{lat}', pos.lat()).replace('{lon}', pos.lng());
 303 
		var urlNomCommuneFormatee = url_service.replace('{lat}', pos.lat()).replace('{lon}', pos.lng());
Line 528... Line 450...
528 
	$("body").on('click', ".supprimer-obs", supprimerObs);
 450 
	$("body").on('click', ".supprimer-obs", supprimerObs);
Line 529... Line 451...
529
451
Line 530... Line 452...
530 
	$("#transmettre-obs").on('click', transmettreObs);
 452 
	$("#transmettre-obs").on('click', transmettreObs);
- 
 
 453
- 
 
 454 
	$("#referentiel").on('change', surChangementReferentiel);
- 
 
 455
- 
 
 456 
	$("body").on('click', ".defilement-miniatures-gauche", function(event) {
- 
 
 457 
			event.preventDefault();
- 
 
 458 
			defilerMiniatures($(this));
- 
 
 459 
	});
- 
 
 460
- 
 
 461 
	$("body").on('click', ".defilement-miniatures-droite", function(event) {
- 
 
 462 
		event.preventDefault();
531
463 
		defilerMiniatures($(this));
Line 532... Line 464...
532 
	$("#referentiel").on('change', surChangementReferentiel);
 464 
	});
533 
});
 465 
});
534 
 
 466 
 
Line 675... Line 607...
675 
		obsNbre = obsNbre + 1;
 607 
		obsNbre = obsNbre + 1;
676 
		$(".obs-nbre").text(obsNbre);
 608 
		$(".obs-nbre").text(obsNbre);
677 
		$(".obs-nbre").triggerHandler('changement');
 609 
		$(".obs-nbre").triggerHandler('changement');
678 
		afficherObs();
 610 
		afficherObs();
679 
		stockerObsData();
 611 
		stockerObsData();
680 
		supprimerMiniature();
 612 
		supprimerMiniatures();
681 
		$("#taxon").val("");
 613 
		$("#taxon").val("");
682 
		$("#taxon").data("numNomSel",undefined);
 614 
		$("#taxon").data("numNomSel",undefined);
683 
	} else {
 615 
	} else {
684 
		afficherPanneau('#dialogue-form-invalide');
 616 
		afficherPanneau('#dialogue-form-invalide');
685 
	}
 617 
	}
Line 748... Line 680...
748 
		'lieudit' : $("#lieudit").val(),
 680 
		'lieudit' : $("#lieudit").val(),
749 
		'station' : $("#station").val(),
 681 
		'station' : $("#station").val(),
750 
		'milieu' : $("#milieu").val(),
 682 
		'milieu' : $("#milieu").val(),
Line 751... Line 683...
751
683
752 
		//Ajout des champs images
 684 
		//Ajout des champs images
753 
		'image_nom' : $("#miniature-img").attr('alt'),
 685 
		'image_nom' : getNomsImgsOriginales(),
754 
		'image_b64' : getB64ImgOriginal()
 686 
		'image_b64' : getB64ImgsOriginales()
755 
	});
 687 
	});
Line 756... Line 688...
756 
}
 688 
}
757 
 
 689 
 
Line 774... Line 706...
774 
	}
 706 
	}
775 
}
 707 
}
Line 776... Line 708...
776 
 
 708 
 
777 
function transmettreObs() {
 709 
function transmettreObs() {
- 
 
 710 
	var observations = $("#liste-obs").data();
Line 778... Line 711...
778 
	var observations = $("#liste-obs").data();
 711 
	console.log(observations);
779
712
780 
	if (observations == undefined || jQuery.isEmptyObject(observations)) {
 713 
	if (observations == undefined || jQuery.isEmptyObject(observations)) {
781 
		afficherPanneau("#dialogue-zero-obs");
 714 
		afficherPanneau("#dialogue-zero-obs");
Line 810... Line 743...
810 
			$(".alert-txt .msg-debug").remove();
 743 
			$(".alert-txt .msg-debug").remove();
811 
			$("#chargement").show();
 744 
			$("#chargement").show();
812 
		},
 745 
		},
813 
		success : function(data, textStatus, jqXHR) {
 746 
		success : function(data, textStatus, jqXHR) {
814 
			$('#dialogue-obs-transaction-ok .alert-txt').append($("#tpl-transmission-ok").clone().html());
 747 
			$('#dialogue-obs-transaction-ok .alert-txt').append($("#tpl-transmission-ok").clone().html());
815 
			supprimerMiniature();
 748 
			supprimerMiniatures();
816 
		},
 749 
		},
817 
		statusCode : {
 750 
		statusCode : {
818 
			500 : function(jqXHR, textStatus, errorThrown) {
 751 
			500 : function(jqXHR, textStatus, errorThrown) {
819 
				erreurMsg += "Erreur 500 :\ntype : "+textStatus+' '+errorThrown+"\n";
 752 
				erreurMsg += "Erreur 500 :\ntype : "+textStatus+' '+errorThrown+"\n";
820 
		    }
 753 
		    }
Line 867... Line 800...
867 
	$station = $("#form-station").valid();
 800 
	$station = $("#form-station").valid();
868 
	$obs = $("#form-obs").valid();
 801 
	$obs = $("#form-obs").valid();
869 
	return ($observateur == true && $station == true && $obs == true) ? true : false;
 802 
	return ($observateur == true && $station == true && $obs == true) ? true : false;
870 
}
 803 
}
Line -... Line 804...
- 
 
 804 
 
- 
 
 805 
function getNomsImgsOriginales() {
- 
 
 806 
	var noms = new Array();
- 
 
 807 
	$(".miniature-img").each(function() {
- 
 
 808 
		noms.push($(this).attr('alt'));
- 
 
 809 
	});
- 
 
 810 
	return noms;
- 
 
 811 
}
871 
 
 812 
 
872 
function getB64ImgOriginal() {
 813 
function getB64ImgsOriginales() {
- 
 
 814 
	var b64 = new Array();
873 
	var b64 = '';
 815 
	$(".miniature-img").each(function() {
874 
	if ($("#miniature-img").hasClass('b64')) {
 816 
		if ($(this).hasClass('b64')) {
875 
		b64 = $("#miniature-img").attr('src');
 817 
			b64.push($(this).attr('src'));
876 
	} else if ($("#miniature-img").hasClass('b64-canvas')) {
 818 
		} else if ($(this).hasClass('b64-canvas')) {
877 
		b64 = $("#miniature-img").data('b64');
 819 
			b64.push($(this).data('b64'));
- 
 
 820 
		}
- 
 
 821 
	});
878 
	}
 822 
 
879 
	return b64;
 823 
	return b64;
Line 880... Line 824...
880 
}
 824 
}
881 
 
 825 
 
Line 901... Line 845...
901 
	$('.obs').remove();
 845 
	$('.obs').remove();
902 
	$("#dialogue-bloquer-creer-obs").hide();
 846 
	$("#dialogue-bloquer-creer-obs").hide();
903 
}
 847 
}
Line 904... Line 848...
904 
 
 848 
 
- 
 
 849 
function ajouterImgMiniatureAuTransfert() {
905 
function ajouterImgMiniatureAuTransfert() {
 850 
	var html = '';
- 
 
 851 
	var miniatures = '';
906 
	var miniature = '';
 852 
	var premiere = true;
- 
 
 853 
	if ($("#miniatures img").length >= 1) {
- 
 
 854 
		$("#miniatures img").each(function() {
- 
 
 855 
			var visible = premiere ? 'miniature-selectionnee' : 'miniature-cachee';
907 
	if ($("#miniature img").length == 1) {
 856 
			premiere = false;
908 
		var css = $("#miniature-img").hasClass('b64') ? 'miniature b64' : 'miniature';
 857 
			var css = $(this).hasClass('b64') ? 'miniature b64' : 'miniature';
909 
		var src = $("#miniature-img").attr("src");
 858 
			var src = $(this).attr("src");
910 
		var alt = $("#miniature-img").attr("alt");
 859 
			var alt = $(this).attr("alt");
- 
 
 860 
			miniature = '<img class="'+css+' '+visible+'"  alt="'+alt+'"src="'+src+'" />';
- 
 
 861 
			miniatures += miniature;
- 
 
 862 
		});
- 
 
 863 
		visible = ($("#miniatures img").length > 1) ? '' : 'defilement-miniatures-cache';
- 
 
 864 
		var html =
- 
 
 865 
			'<div class="defilement-miniatures">'+
- 
 
 866 
				'<a href="#" class="defilement-miniatures-gauche '+visible+'">&#60;</a>'+
- 
 
 867 
				miniatures+
- 
 
 868 
				'<a href="#" class="defilement-miniatures-droite '+visible+'">&#62;</a>'+
911 
		miniature = '<img class="'+css+' " alt="'+alt+'"src="'+src+'" />';
 869 
			'</div>';
912 
	} else {
 870 
	} else {
- 
 
 871 
		html = '<img class="miniature" alt="Aucune photo"src="'+PAS_DE_PHOTO_ICONE_URL+'" />';
- 
 
 872 
	}
- 
 
 873 
	return html;
- 
 
 874 
}
- 
 
 875 
 
- 
 
 876 
function defilerMiniatures(element) {
- 
 
 877
- 
 
 878 
	var miniatureSelectionne = element.siblings("img.miniature-selectionnee");
- 
 
 879 
	miniatureSelectionne.removeClass('miniature-selectionnee');
- 
 
 880 
	miniatureSelectionne.addClass('miniature-cachee');
- 
 
 881 
	var miniatureAffichee = miniatureSelectionne;
- 
 
 882
- 
 
 883 
	if(element.hasClass('defilement-miniatures-gauche')) {
- 
 
 884 
		if(miniatureSelectionne.prev('.miniature').length != 0) {
- 
 
 885 
			miniatureAffichee = miniatureSelectionne.prev('.miniature');
- 
 
 886 
		} else {
- 
 
 887 
			miniatureAffichee = miniatureSelectionne.siblings(".miniature").last();
- 
 
 888 
		}
- 
 
 889 
	} else {
- 
 
 890 
		if(miniatureSelectionne.next('.miniature').length != 0) {
- 
 
 891 
			miniatureAffichee = miniatureSelectionne.next('.miniature');
- 
 
 892 
		} else {
- 
 
 893 
			miniatureAffichee = miniatureSelectionne.siblings(".miniature").first();
913 
		miniature = '<img class="miniature" alt="Aucune photo"src="'+PAS_DE_PHOTO_ICONE_URL+'" />';
 894 
		}
914 
	}
 895 
	}
- 
 
 896 
	console.log(miniatureAffichee);
- 
 
 897 
	miniatureAffichee.addClass('miniature-selectionnee');
915 
	return miniature;
 898 
	miniatureAffichee.removeClass('miniature-cachee');
Line 916... Line 899...
916 
}
 899 
}
917 
 
 900 
 
918 
function ajouterNumNomSel() {
 901 
function ajouterNumNomSel() {