Tester le 'accept' aussi sur la zone de glisser des fichiers. (559a4d52) · Validations · tofulm / bigup

css/bigup.css

+9 −9

Numéro de ligne d'origine	Numéro de ligne de diff	Ligne de diff
		.bigup.fichiers {
		.bigup_fichiers {
		margin-bottom:1em;
		}
		.bigup.fichiers .fichier {
		.bigup_fichiers .fichier {
		background:rgba(255,255,255,.95);
		border: 1px solid #ddd;
		padding:10px;
		}
		.bigup.fichiers .fichier:first-child {
		.bigup_fichiers .fichier:first-child {
		border-top-left-radius:5px;
		border-top-right-radius:5px;
		}
		.bigup.fichiers .fichier:last-child {
		.bigup_fichiers .fichier:last-child {
		border-bottom-left-radius:5px;
		border-bottom-right-radius:5px;
		}
		.bigup.fichiers .fichier + .fichier {
		.bigup_fichiers .fichier + .fichier {
		border-top:none;
		}
		.bigup.fichiers .actions {
		.bigup_fichiers .actions {
		float:right;
		margin-top:1em;
		}
		.bigup.fichiers img {
		.bigup_fichiers img {
		float:left;
		margin-right: 0.5em;
		}
		.bigup.fichiers .infos {
		.bigup_fichiers .infos {
		margin-left:1em;
		}
		.bigup.fichiers .infos span {
		.bigup_fichiers .infos span {
		display:block;
		}

javascript/bigup.js.html

+90 −6

Numéro de ligne d'origine	Numéro de ligne de diff	Ligne de diff
		@@ -32,6 +32,7 @@ $.fn.bigup = function() {

		// La librairie d'upload
		var flow = new Flow({
		input: $(this),
		target: target,
		fileParameterName: name,
		testChunks: true,
		@@ -68,14 +69,44 @@ $.fn.bigup = function() {
		flow.assignBrowse($zone.find('.dropfilebutton'), false, !multiple, {accept: accept});
		flow.assignDrop($zone);

		// Téléverser aussitôt les fichiers déposés
		flow.on('filesSubmitted', function (file) {
		console.log('filesSubmitted', file);
		flow.upload();
		// Valider chaque fichier déposé en fonction du 'accept' de l'input.
		flow.on('fileAdded', function(file, event){
		if (typeof file.flowObj.opts.query.accept !== undefined) {
		var accept = file.flowObj.opts.query.accept;
		if (accept && !$.bigup_isValidFile(file.file, accept)) {
		// TODO: afficher une vraie erreur
		console.log("Fichier non accepté !");
		return false;
		}
		}
		});

		flow.on('fileAdded', function(file, event){
		console.log("added", file);
		// Téléverser aussitôt les fichiers valides déposés
		flow.on('filesSubmitted', function (files) {
		console.log('filesSubmitted', files);
		if (files.length) {
		for (var i = 0; i < files.length; i++) {
		var file = files[i];

		var $input = file.flowObj.opts.input;
		var name = file.flowObj.opts.fileParameterName;

		// Trouver une zone où afficher les fichiers dans le HTML existant
		var $zone = $input.parents('form').find(".fichiers_" + name);

		// S'il n'y en a pas, créer le template par défaut et l'ajouter
		if (!$zone.length) {
		var template = "<div class='bigup_fichiers fichiers_" + name + "'></div>";
		$input.before(template);
		$zone = $form.find(".fichiers_" + name);
		}

		// Ajouter le fichier à la zone
		var template = $.bigup_template_fichier(file.file);
		$zone.append(template);
		}
		flow.upload();
		}
		});

		flow.on('fileProgress', function(file, chunk){
		@@ -94,6 +125,39 @@ $.fn.bigup = function() {
		});
		}

		/**
		* Vérifier un fichier par rapport à un attribut 'accept'
		* Code issu de Dropzone.
		*/
		$.bigup_isValidFile = function(file, acceptedFiles) {
		var baseMimeType, mimeType, validType, _i, _len;
		if (!acceptedFiles) {
		return true;
		}
		acceptedFiles = acceptedFiles.split(",");
		mimeType = file.type;
		baseMimeType = mimeType.replace(/\/.*$/, "");
		for (_i = 0, _len = acceptedFiles.length; _i < _len; _i++) {
		validType = acceptedFiles[_i];
		validType = validType.trim();
		if (validType.charAt(0) === ".") {
		if (file.name.toLowerCase().indexOf(validType.toLowerCase(), file.name.length - validType.length) !== -1) {
		return true;
		}
		} else if (/\/\*$/.test(validType)) {
		if (baseMimeType === validType.replace(/\/.*$/, "")) {
		return true;
		}
		} else {
		if (mimeType === validType) {
		return true;
		}
		}
		}
		return false;
		};


		/**
		* Crée un template HTML de la zone de dépot de fichier pour un nom de champ donné.
		*/
		@@ -111,4 +175,24 @@ $.bigup_template = function(name, multiple) {
		return template;
		};

		/**
		* Crée un template HTML de la vue d'un fichier
		*/
		$.bigup_template_fichier = function(file) {

		var template =
		'\n<div class="fichier">'
		+ '\n\t<div class="actions">'
		+ '\n\t</div>'
		+ '\n\t<img width="52" height="52" alt="" src="../plugins-dist/medias/prive/vignettes/jpg.png">'
		+ '\n\t<div class="infos">'
		+ '\n\t\t<span class="name"><strong>' + file.name + '</strong></span>'
		+ '\n\t\t<span class="size">' + file.size + '</span>'
		+ '\n\t\t<span class="mime">' + file.type + '</span>'
		+ '\n\t</div>'
		+ '\n</div>\n';

		return template;
		};

		})(jQuery);

saisies/bigup.html

+1 −1

Numéro de ligne d'origine	Numéro de ligne de diff	Ligne de diff
		@@ -2,7 +2,7 @@
		#SET{multiple,#ENV{multiple}\|=={oui}}

		<B_fichiers>
		<div class='bigup fichiers'>
		<div class='bigup_fichiers fichiers_#ENV{nom}'>
		<BOUCLE_fichiers(DATA){source tableau, #FICHIERS}>
		<div class='fichier'>
		<div class='actions'>