<commit_before>This plugin uses XHR for uploading multiple files with progress-bar in FF3.6+, Safari4+,
Chrome and falls back to hidden iframe based upload in other browsers,
providing good user experience everywhere.

### <a href="http://valums.com/files/2010/file-uploader/demo.htm">Demo</a> ###

### Features ###
* multiple file select in FF, Chrome, Safari
* progress-bar in FF, Chrome6+, Safari
* drag-and-drop file select in FF, Chrome 
* stylable via CSS
* uploads are cancellable
* no external dependencies
* doesn't use Flash
* fully working with https
* keyboard support in FF, Chrome, Safari
* supports IE6-8, Firefox 3-4beta, Safari4-5, Chrome, Opera

### Known Issues ###
Plugin breaks back button functionality in Opera.

### License ###
This plugin is open sourced under <a href="http://www.gnu.org/copyleft/gpl.html">GNU GPL</a>.
If this license doesn't suit you contact andrew (at) valums.com for another options.
	
### Setting up ###

Include fileuploader.js and fileuploader.css into your page.

Create container element.

    <div id="file-uploader">       
        <noscript>          
            <p>Please enable JavaScript to use file uploader.</p>
            <!-- or put a simple form for upload here -->
        </noscript>         
    </div>
    
Initialize uploader when the DOM is ready.

    var uploader = new qq.FileUploader({
        // pass the dom node (ex. $(selector)[0] for jQuery users)
        element: document.getElementById('file-uploader'),
        // path to server-side upload script
        action: '/server/upload'
    });

Don't forget to setup the server side script, some examples can be found in the "server" folder.
If you can't find an example for your server platform, send me a mail to andrew (at) valums.com.
I will be glad to help.

### Configuring ###

Below is the list of important options, more details are given below. 

    // container element DOM node (ex. $(selector)[0] for jQuery users)
    element: null,
    // url of the server-side upload script, should be on the same domain
    action: '/server/upload',
    // additional data to send, name-value pairs
    params: {},
    // ex. ['jpg', 'jpeg', 'png', 'gif'] or []
    allowedExtensions: [],        
    // size limit in bytes, 0 - no limit
    // this option isn't supported in all browsers
    sizeLimit: 0,
    onSubmit: function(id, fileName){},
    onComplete: function(id, fileName, responseJSON){},
    messages: {
        // contains test string, see fileuploader.js for details            
    },
    showMessage: function(message){
        alert(message);
    }        

Instance methods

* setParams(newParams)        
* isUploading() Returns true if some files are being uploaded, false otherwise 

#### Limiting file type and size ####

Pass them as the options to constructor, the uploader will show a message if the 
user selects a file that doesn't match the criteria. The sizeLimit option only works
in most modern browsers at the moment. And you must add the same checks in your server-side
script.

    var uploader = new qq.FileUploader({
        element: document.getElementById('file-uploader'),
        action: '/server-side.upload',
        // ex. ['jpg', 'jpeg', 'png', 'gif'] or []
        allowedExtensions: [],        
        // size limit in bytes, 0 - no limit
        // this option isn't supported in all browsers
        sizeLimit: 0        
    });

#### Changing alert/messages to something more user friendly ####

If you limited file types and max size, you will probably want to change the default alert and
messages as you see fit, this is possible using showMessage callback and messages option.
This also makes localization much easier. Look into qq.FileUploader for default values.

#### Sending additional params ####

To add a parameter that will be passed as a query string with each upload use params option. 

    var uploader = new qq.FileUploader({
        element: document.getElementById('file-uploader'),
        action: '/server-side.upload',
        // additional data to send, name-value pairs
        params: {
            param1: 'value1',
            param2: 'value2'
        }
    });

To change params based on the state of your app, use <commit_msg>Fixed formatting in readme<commit_after>This plugin uses XHR for uploading multiple files with progress-bar in FF3.6+, Safari4+,
Chrome and falls back to hidden iframe based upload in other browsers,
providing good user experience everywhere.

### <a href="http://valums.com/files/2010/file-uploader/demo.htm">Demo</a> ###

### Features ###
* multiple file select in FF, Chrome, Safari
* progress-bar in FF, Chrome6+, Safari
* drag-and-drop file select in FF, Chrome 
* stylable via CSS
* uploads are cancellable
* no external dependencies
* doesn't use Flash
* fully working with https
* keyboard support in FF, Chrome, Safari
* supports IE6-8, Firefox 3-4beta, Safari4-5, Chrome, Opera

### License ###
This plugin is open sourced under <a href="http://www.gnu.org/copyleft/gpl.html">GNU GPL</a>.
If this license doesn't suit you contact andrew (at) valums.com for another options.

### Known Issues ###
Plugin breaks back button functionality in Opera.
	
### Setting up ###

Include fileuploader.js and fileuploader.css into your page.

Create container element.

    <div id="file-uploader">       
        <noscript>          
            <p>Please enable JavaScript to use file uploader.</p>
            <!-- or put a simple form for upload here -->
        </noscript>         
    </div>
    
Initialize uploader when the DOM is ready.

    var uploader = new qq.FileUploader({
        // pass the dom node (ex. $(selector)[0] for jQuery users)
        element: document.getElementById('file-uploader'),
        // path to server-side upload script
        action: '/server/upload'
    });

Don't forget to setup the server side script, some examples can be found in the "server" folder.
If you can't find an example for your server platform, send me a mail to andrew (at) valums.com.
I will be glad to help.

### Configuring ###

Below is the list of important options, more details are given below. 

    // container element DOM node (ex. $(selector)[0] for jQuery users)
    element: null,
    // url of the server-side upload script, should be on the same domain
    action: '/server/upload',
    // additional data to send, name-value pairs
    params: {},
    // ex. ['jpg', 'jpeg', 'png', 'gif'] or []
    allowedExtensions: [],        
    // size limit in bytes, 0 - no limit
    // this option isn't supported in all browsers
    sizeLimit: 0,
    onSubmit: function(id, fileName){},
    onComplete: function(id, fileName, responseJSON){},
    messages: {
        // error messages, see fileuploader.js for details            
    },
    showMessage: function(message){
        alert(message);
    }        

Instance methods

* setParams(newParams)        
* isUploading() Returns true if some files are being uploaded, false otherwise 

#### Limiting file type and size ####

Pass them as the options to constructor, the uploader will show a message if the 
user selects a file that doesn't match the criteria. The sizeLimit option only works
in most modern browsers at the moment. And you must add the same checks in your server-side
script.

    var uploader = new qq.FileUploader({
        element: document.getElementById('file-uploader'),
        action: '/server-side.upload',
        // ex. ['jpg', 'jpeg', 'png', 'gif'] or []
        allowedExtensions: [],        
        // size limit in bytes, 0 - no limit
        // this option isn't supported in all browsers
        sizeLimit: 0        
    });

#### Changing alert/messages to something more user friendly ####

If you limited file types and max size, you will probably want to change the default alert and
messages as you see fit, this is possible using showMessage callback and messages option.
Localization also meant to be done using this option. Look into qq.FileUploader for default values.

#### Sending additional params ####

To add a parameter that will be passed as a query string with each upload use params option. 

    var uploader = new qq.FileUploader({
        element: document.getElementById('file-uploader'),
        action: '/server-side.upload',
        // additional data to send, name-value pairs
        params: {
            param1: 'value1',
            param2: 'value2'
        }
    });

To change params based on the state of your app, use 
{'fraction_non_alphanumeric': 0.09932917500294222, 'fraction_numerical': 0.005649052606802401, 'mean_word_length': 2.855716878402904, 'pattern_counts': {'":': 0, '<': 25, '<?xml version=': 0, '>': 25, 'https://': 0, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6452515', 'n_tokens_mistral': 2337, 'n_tokens_neox': 2240, 'n_words': 1003}