How to validate a file in a javascript
<p>I am trying to show the errors that can occur by uploading a file (file extension, size).
I am using <a href="https://github.com/tors/jquery-fileupload-rails-paperclip-example" rel="nofollow">an adapted version of Jquery Fiel Upload for Ruby on Rails</a></p>

<p>I need to validate a file (ending of a file,  size of the file) before uploading and as nobody has an idea <a href="http://stackoverflow.com/questions/13109333/how-can-i-associate-error-messages-to-the-error-key-in-json-response">how to do it with JSON</a> I want to ask if somebody knows how to do it in a following javascript:</p>

<pre><code>&lt;script type="text/javascript" charset="utf-8"&gt;
          $(function () {
              // Initialize the jQuery File Upload widget:
              $('#fileupload').fileupload();
              // 
              // Load existing files:
              $.getJSON($('#fileupload').prop('action'), function (files) {
                var fu = $('#fileupload').data('fileupload'), 
                  template;
                fu._adjustMaxNumberOfFiles(-files.length);
                console.log(files);
                template = fu._renderDownload(files)
                  .appendTo($('#fileupload .files'));
                // Force reflow:
                fu._reflow = fu._transition &amp;&amp; template.length &amp;&amp;
                  template[0].offsetWidth;
                template.addClass('in');
                $('#loading').remove();
              });

          });
    &lt;/script&gt;
</code></pre>

<p><br>
<br>
I am thinking of something like this (the code downstairs) but I need to rewrite the above code to present validation line <code>types = /(\.|\/)(gif|jpe?g|png)$/i</code> and to have a error-message  <code>alert("#{file.name} is not a gif, jpeg, or png image file")</code> . As I am not god at writing javascripts I am asking for help.
<br>
<br></p>

<pre><code>jQuery -&gt;
  $('#new_painting').fileupload
    dataType: "script"
    add: (e, data) -&gt;
      types = /(\.|\/)(gif|jpe?g|png)$/i
      file = data.files[0]
      if types.test(file.type) || types.test(file.name)
        data.context = $(tmpl("template-upload", file))
        $('#new_painting').append(data.context)
        data.submit()
      else
        alert("#{file.name} is not a gif, jpeg, or png image file")
    progress: (e, data) -&gt;
      if data.context
        progress = parseInt(data.loaded / data.total * 100, 10)
        data.context.find('.bar').css('width', progress + '%')
</code></pre>
