How to validate a file in a javascript

How to validate a file in a javascript

Hello!
I am trying to show the errors that can occur by uploading a file (file extension, size). 
I am using an adapted version of Jquery Fiel Upload for Ruby on Rails

I need to validate a file (ending of a file,  size of the file) before uploading and as nobody has an idea how to do it with JSON I want to ask if somebody knows how to do it in a following javascript: 

  1.     <script type="text/javascript" charset="utf-8"> 
  2.               $(function () { 
  3.                   // Initialize the jQuery File Upload widget: 
  4.                   $('#fileupload').fileupload(); 
  5.                   // 
  6.                   // Load existing files: 
  7.                   $.getJSON($('#fileupload').prop('action'), function (files) { 
  8.                     var fu = $('#fileupload').data('fileupload'), 
  9.                       template; 
  10.                     fu._adjustMaxNumberOfFiles(-files.length); 
  11.                     console.log(files); 
  12.                     template = fu._renderDownload(files) 
  13.                       .appendTo($('#fileupload .files')); 
  14.                     // Force reflow: 
  15.                     fu._reflow = fu._transition && template.length && 
  16.                       template[0].offsetWidth; 
  17.                     template.addClass('in'); 
  18.                     $('#loading').remove(); 
  19.                   }); 
  20.             
  21.               }); 
  22.         </script> 


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

  1.     jQuery -> 
  2.       $('#new_painting').fileupload 
  3.         dataType: "script" 
  4.         add: (e, data) -> 
  5.           types = /(\.|\/)(gif|jpe?g|png)$/i 
  6.           file = data.files[0] 
  7.           if types.test(file.type) || types.test(file.name) 
  8.             data.context = $(tmpl("template-upload", file)) 
  9.             $('#new_painting').append(data.context) 
  10.             data.submit() 
  11.           else 
  12.             alert("#{file.name} is not a gif, jpeg, or png image file") 
  13.         progress: (e, data) -> 
  14.           if data.context 
  15.             progress = parseInt(data.loaded / data.total * 100, 10) 
  16.             data.context.find('.bar').css('width', progress + '%') 



  
  I know that it is a very bad validation to check the extension but I still need it.
Many thanks in advanced.