The file upload interface in Tiki is
- Not taking advantage of modern browser possibilities
- Not consistent (ex.: The Files Tracker Field accepts drag and drop but not the File Gallery upload)
Tiki should select a modern file upload lib, and proceed to appropriate integration throughout This page is to compare options. See also forum thread about File upload component choice
Library comparison chart
Feature / Library | FileAPI | jQuery File Upload | Bootstrap File Input | elFinder (already in Tiki, and a also a file/image browser) | flow.js |
Client-size resize of images. This is really important because phone nowadays will take huge pictures, and in some cases, there is no setting to reduce picture size. | Yes | Yes | Via events (call any ext plugin) | ||
Upload many files at once (requires modern browser) | Yes | Yes | Yes | Yes | Yes |
Offer simple form based uploads as well as advanced ajax based uploads | Yes | Yes | |||
Templates to control rendering of layout, preview and styles | Yes | Yes | |||
Easily plug and play additional components | Yes | Yes | |||
Inbuilt support to manage previously uploaded files on server. | Yes (only DELETE) | Yes | |||
Ability to preview files for many file types beyond images (e.g. image, text, html, video, audio. etc.) | Yes (images, audio and video, additional types can be realized via plugins) | Yes | |||
Ability to show custom preview file type icons for each file thumbnail. | Yes (can simply be done via templates and CSS) | Yes | |||
Get file from URL (to avoid download and re-upload) | No, but I've posted sample code here: https://gist.github.com/blueimp/5075976 | On wishlist | |||
Enter caption with upload | Yes (see https://github.com/blueimp/jQuery-File-Upload/wiki/How-to-submit-additional-form-data for howto) | Yes (via extraData) | |||
Preview image, audio or video before upload (to avoid accidents) | Yes | Yes | Image | ||
Progress bar | Yes | Yes | Yes | ||
Limit file types for upload | Yes | Yes | Yes | ||
Maximal file size or image dimensions (to block before upload) | Yes (max file size, image dimensions also possible via plugin) | Yes | Manual validation | ||
Chunked upload (to get around server limits) | Yes | Yes | On wishlist | Yes | |
Cancelable uploads (Individual file uploads can be canceled) | Yes | Yes | |||
Resumable uploads | Yes | Yes | |||
Upload from webcam | yes, via camanJS | No, but has API to upload File or Blob | |||
Drag & Drop | Yes | Yes | Yes | Yes | Yes |
Available via Packagist | No | Yes, but Packagist meta data not maintained by main dev | Yes | Not official | Yes |
License | MIT | BSD 3-Clause | MIT | ||
Features that would be nice not just at upload | |||||
Image crop | Yes | No, but possible via processing API | Via events (call any ext plugin) | ||
Watermark | Yes | No, but possible via processing API | |||
Orientation from EXIF | Yes | Yes | Via events (call any ext plugin) | ||
Other criteria | |||||
AngularJS Integration | Yes | Yes |
Some options
FileAPI
jQuery File Upload
- https://github.com/blueimp/jQuery-File-Upload
- "The user interface of all versions except the jQuery UI version is built with Bootstrap and icons from Glyphicons."
Bootstrap File Input
- https://github.com/kartik-v/bootstrap-fileinput
- http://webtips.krajee.com/ajax-based-file-uploads-using-fileinput-plugin/
- https://packagist.org/packages/kartik-v/bootstrap-fileinput
elFinder
- elFinder also does a lot so file picker from elFinder could perhaps be re-used.
flow-php-server
Open Hub stats and comparisons