PNG  IHDR;IDATxܻn0K )(pA 7LeG{ §㻢|ذaÆ 6lذaÆ 6lذaÆ 6lom$^yذag5bÆ 6lذaÆ 6lذa{ 6lذaÆ `}HFkm,mӪôô! x|'ܢ˟;E:9&ᶒ}{v]n&6 h_tڠ͵-ҫZ;Z$.Pkž)!o>}leQfJTu іچ\X=8Rن4`Vwl>nG^is"ms$ui?wbs[m6K4O.4%/bC%t Mז -lG6mrz2s%9s@-k9=)kB5\+͂Zsٲ Rn~GRC wIcIn7jJhۛNCS|j08yiHKֶۛkɈ+;SzL/F*\Ԕ#"5m2[S=gnaPeғL lذaÆ 6l^ḵaÆ 6lذaÆ 6lذa; _ذaÆ 6lذaÆ 6lذaÆ RIENDB` jQuery.filer 1.0 ============ jQuery.filer - Simple HTML5 File Uploader, a plugin tool for jQuery which change completely File Input and make it with multiple file selection, drag&drop support, different validations, thumbnails, icons, instant upload, print-screen upload and many other features and options. Demo | Documentation Features ------- * Completely change File Input * Upload files after choosing * Add more files to input without uploading them * Validate files(limit, size, extension) * Create thumbs * Custom icons for each type of file * Custom templates & themes for: input, thumbs, icons * Remove Choosed/Uploaded files * Append existing files to input for a preview * Image paste from clipboard * Custom captions * Custom callbacks * Templates inline variables, ex: {{fi-limit}} * All icons in a one beautiful font * Drag & Drop Option * Trigger options Usage ------- __Styles:__ Include the jquery.filer css file in your html page. ~~~~ html ~~~~ __Javascript:__ Include the jQuery library and jquery.filer script file in your html page. ~~~~ html ~~~~ Create link elements whose href attributes will contain the path of the element you wish to open within the iLightbox. ~~~~ html
~~~~ The plugin is named "filer" and can be applied to any element. You will probably also specify some options while applying the plugin. ~~~~ javascript $(document).ready(function() { $('#input_file').filer({ limit: null, maxSize: null, extensions: null, changeInput: true, showThumbs: true, appendTo: null, theme: "default", templates: { box: '', item: '
  • \
    \
    \
    \
    \
    \ {{fi-name | limitTo: 25}}\
    \ {{fi-image}}\
    \
    \
      \
    • {{fi-progressBar}}
    • \
    \
      \
    • \
    \
    \
    \
    \
  • ', itemAppend: '
  • \
    \
    \
    \
    \
    \ {{fi-name | limitTo: 25}}\
    \ {{fi-image}}\
    \
    \
      \ {{fi-icon}} {{fi-size2}}\
    \
      \
    • \
    \
    \
    \
    \
  • ', progressBar: '
    ', itemAppendToEnd: false, removeConfirmation: true, _selectors: { list: '.jFiler-item-list', item: '.jFiler-item', progressBar: '.bar', remove: '.jFiler-item-trash-action', } }, uploadFile: { url: "upload.php", data: {}, type: 'POST', enctype: 'multipart/form-data', beforeSend: function(){}, success: function(data, el){ var parent = el.find(".jFiler-jProgressBar").parent(); el.find(".jFiler-jProgressBar").fadeOut("slow", function(){ $("
    Success
    ").hide().appendTo(parent).fadeIn("slow"); }); }, error: function(el){ var parent = el.find(".jFiler-jProgressBar").parent(); el.find(".jFiler-jProgressBar").fadeOut("slow", function(){ $("
    Error
    ").hide().appendTo(parent).fadeIn("slow"); }); }, statusCode: {}, onProgress: function(){}, }, dragDrop: { dragEnter: null, dragLeave: null, drop: null, }, addMore: true, clipBoardPaste: true, excludeName: null, beforeShow: function(){return true}, onSelect: function(){}, afterShow: function(){}, onRemove: function(){}, onEmpty: function(){}, captions: { button: "Choose Files", feedback: "Choose files To Upload", feedback2: "files were chosen", drop: "Drop file here to Upload", removeConfirmation: "Are you sure you want to remove this file?", errors: { filesLimit: "Only {{fi-limit}} files are allowed to be uploaded.", filesType: "Only Images are allowed to be uploaded.", filesSize: "{{fi-name}} is too large! Please upload file up to {{fi-maxSize}} MB.", filesSizeAll: "Files you've choosed are too large! Please upload files up to {{fi-maxSize}} MB." } } }); }); ~~~~ Options & Features ------- Fully documentation of plugin options and features. __Options:__ * __limit__ Maximum Limit of files. {null, Number} * __maxSize__ Maximum Size of files. {null, Number(in MB's)} * __extensions__ Whitelist for file extension. {null, Array} * __changeInput__ Change input. {Boolean, String(DOM Element), Object(DOM Element)} * __showThumbs__ Show input files as thumbnails. {Boolean} * __appendTo__ Append thumbnails to element. {null, String(Dom Element)} * __theme__ jQuery.filer theme. {null, String} * __templates__ * __box__ Thumbnails box element {null, String} * __item__ Thumbnails file item element {String(use Filer Variables), Function} * __itemAppend__ Thumbnails appended file item element {String(use Filer Variables), Function} * __progressBar__ Thumbnails file item upload progress bar element {String} * __itemAppendToEnd__ Append file item to the end of list {Boolean} * __removeConfirmation__ Remove file confirmation {Boolean} * __selectors__ * __list__ List selector {String} * __item__ Item selector {String} * __progressBar__ Progress bar selector {String} * __remove__ Remove button selector {String} * __uploadFile__ * __url__ URL to which the request is sent {String} * __data__ Data to be sent to the server {Object} * __type__ The type of request {String} * __enctype__ Request enctype {String} * __beforeSend__ A pre-request callback function {Function} * __success__ A function to be called if the request succeeds {Function} * __error__ A function to be called if the request fails {Function} * __statusCode__ An object of numeric HTTP codes {Function} * __onProgress__ A function called while uploading file with progress percentage {Function} * __dragDrop__ * __dragEnter__ A function that is fired when a dragged element enters the input. {Function} * __dragLeave__ A function that is fired when a dragged element leaves the input. {Function} * __drop__ A function that is fired when a dragged element is dropped on a valid drop target. * __addMore__ Multiple file selection without instant uploading {Boolean} * __clipBoardPaste__ Printscreen paste and upload {Boolean} * __excludeName__ Removed files input name {null, String} Default: jfiler-items-exclude-(input file name)-(input id) * __beforeShow__ A function that is fired before showing thunbnails {Function} * __onSelect__ A function that is fired after selecting files {Function} * __afterShow__ A function that is fired after appending all thumbnails items {Function} * __onRemove__ A function that is fired after deleting a file {Function} * __onEmpty__ A function that is fired when no files are selected {Function} * __captions__ * __button__ New Input button text {String} * __feedback__ New Input field text {String} * __feedback2__ New Input after choosing files text {String} * __drop__ New Input on drag text {String} * __removeConfirmation__ Remove file confirmation text {String} * __errors__ * __filesLimit__ {String(use Filer Variables)} * __filesType__ {String(use Filer Variables)} * __filesSize__ {String(use Filer Variables)} * __filesSizeAll__ {String(use Filer Variables)} __Triggers:__ * $('#input_file').trigger("filer.append", {files:[]}) * $('#input_file').trigger("filer.remove", {id:0}) * $('#input_file').trigger("filer.reset") * $('#input_file').trigger("filer.getList", {files:[]}) __Attributes:__ * data-jfiler-name | name of input (is used while applying plugin to a non file input) * data-jfiler-limit | files limit * data-jfiler-maxSize | files maximum size * data-jfiler-extensions | separeted with comma * data-jfiler-changeInput | {Boolean, String} * data-jfiler-showThumbs | show thumbnails * data-jfiler-appendTo | append thumbnails to selector * data-jfiler-theme | custom filer theme * data-jfiler-excludeName | exclude files input name * data-jfiler-files | append files, ex: "{"files":[{"name":"appended_file.jpg","size":5453,"type":"image/jpg",file:"/path/to/file/appended_file.jpg"}]}" Filer Variables ------- Filer Variables are created for simple usage them in the plugin string options. To use them just write {{fi-(variable name)}}. Below are all available variables that can be used: * fi-name * fi-size * fi-size2 * fi-type * fi-extension * fi-icon * fi-icon2 * fi-id * fi-image * fi-progressBar * fi-limit * fi-maxSize Contribute ------- Want to be part of this project? Great! All are welcome! Whether you find a bug, have a great feature request or you fancy owning a task from the road map above feel free to get in touch.
    By themes you can contribute to plugin by making a Pull Request to /css/themes/ and writing a short description containing plugin templates options. ### PHP File Uploader ### PHP File Uploader is an easy to use, hi-performance File Upload Script which allows you to upload files to webserver. You can get it on the link below.
    PHP Uploader License ------- > Licensed under MIT license.