DropCenter, un multi upload drag and drop en HTML5 (sans flash)

Mes excuses pour le titre à rallonge, mais il faut bien faire vivre son référencement XD !!

Voila longtemps que je n’avais pas pondu un LNM (Last Night Making) c’est à dire un programme développé à l’arrache en quelques heures (nocturnes) fonctionnel mais codé à la porco.

Il s’agit d’un script que j’ai longtemps cherché sur le net sans vraiment trouver ce qu’il me fallait, j’ai donc décidé de mettre les mains dans le cambouis quelques heures et, dans ma grande mansuétude, de vous le faire partager .

Voila comment le script se présente :

script php d'upload html5 drag and drop

Ce script, développé en PHP/Javascript (garantis sans flash), permet d’envoyer des fichiers en ligne (upload) d’un simple glisser déposer du bureau vers la page web du script. Le script utilise la technologie HTML5 gracieusement plugué pour jquery par Weixi Yen.

Les avantages de dropCenter :

  • Upload de fichiers multiples
  • Upload simplifié grâce au drag and drop
  • Barre de progression affichant l’état de téléchargement du fichier
  • Design  propre et ergonomique à la web 2.0
  • Possibilité de supprimer les fichiers envoyés
  • Possibilité de renommer les fichiers
  • Reconnais de nombreux formats de fichiers et y associe une icône pour les dissocier entres eux.
  • Script léger et simple à installer
  • Possibilité de limiter la taille, l’extension par fichier …

Inconvénients

  • Ne fonctionne évidemment pas sous les navigateurs datant de l’après guerre
  • N’est pas encore sécurisé (que voulez vous on peux pas tous faire en une heure) il vous faudra mettre un htaccess ou cacher l’url
  • Ne permet pas la création ou l’envois de dossiers. (voyez ça plus comme un dépôt rapide de fichiers en ligne).

Screenshots

Démo & Téléchargement
Démo et téléchargement sur le site officiel : http://projet.webpoint.fr/dropcenter


Installation
1.Décompressez l’archive de dropCenter
2.Envoyez le tout sur votre FTP
3.Autorisez l’écriture sur le répertoire /uploads (chmod 777)
4. Le script est installé !! Pensez a mettre en place un htaccess pour sécuriser l’accès !!

FAQ

Mes gros fichiers ne passent pas, pourquoi?

Il faut augmenter la taille permise (MAX_SIZE) dans le fichier php/config.php. Pensez également a modifier les valeur post_max_size et upload_max_filesize dans le fichier php.ini de votre serveur (/etc/php5/apache2/php.ini sous ubuntu).

Peut on limiter les extensions?

En bricolant légèrement le script c’est très simple, sinon vous pouvez configurer la variable FORBIDEN_FORMAT dans le fichier php/config.php avec toutes les extensions non permises, ceci n’empêchera pas a l’utilisateur d’envoyer le fichier mais ajoutera automatiquement un ‘.txt’ devant le fichier afin qu’il ne puisse pas être exécuté sur votre serveur.

Supprimer un fichier ?

Une fois le fichier uploadé, rafraîchissez la page et survolez le fichier, une croix apparaît en haut a droite, il s’agit du bouton supprimer.

Modifier le nom du fichier ?

Une fois le fichier uploadé, rafraîchissez la page et double cliquez sur le nom du fichier, vous pouvez alors l’éditer, l’appui sur la touche entré valide la modification.

Licence
Ce programme est sous licence MBDFEDCQVV (Mais Bon Dieux Faites En Donc Ce Que Vous Voulez). Merci de respecter toutefois les licences originelles du plugin jQuery Filedrop et du pack d’icone intégré.

A propos
Drop Center V1.0 Alpha 100% pur porc par Idleman.

Nb : Ce script est un LNM (Last Night Making) c’est à dire qu’il à été developpé à l’arrache en quelques heures (nocturne) et qu’il n’est pas conseillé pour un usage professionel et que je n’assume pas tous a fait la malpropreté du code :), merci d’en tenir compte.

Script créé à l’aide du plugin jQuery Filedrop (Weixi Yen) et basé sur la version de Martin Angelov (tutorialzine.com)

Icones pack : Faenza Icons par tiheum (http://tiheum.deviantart.com/art/Faenza-Icons-173323228)


Follow us on Facebook

www.webpoint.fr
webpoint.e-monsite.com  www.prestatic.fr  www.epart.fr/demo 4  www.support-prestashop.fr  www.maxibazare.com  www.conseils-web.fr  referencement-annuaire-web.fr  facebook.com/Webpointfr-622797134842872  facebook.com/prestatic.fr  webpointfr.simplesite.com  webpoint.e-monsite.com  contact29364.wixsite.com/www-webpoint-fr  webpoint.space  webpoint.byethost7.com  akimania.webnode.fr  Dropshipping shopify Retour