TypeError: $.blueimp.fileupload.prototype.options.processQueue is undefined

[wlgithub]

Dear all,

I am trying to integrate it with a Ruby on Rails project and here is the error I got which I'm not sure how to solve

[11:38:46.409] TypeError: $.blueimp.fileupload.prototype.options.processQueue is undefined @ http://127.0.0.1:3000/jquery-file-upload/jquery.fileupload-image.js:39

Here is the 39'th line in jquery.fileupload-image.js:

=====jquery.fileupload-image.js===== /_jslint nomen: true, unparam: true, regexp: true / /_global define, window, document, DataView, Blob, Uint8Array /

(function (factory) { 'use strict'; if (typeof define === 'function' && define.amd) { // Register as an anonymous AMD module: define([ 'jquery', 'load-image', 'load-image-meta', 'load-image-exif', 'load-image-ios', 'canvas-to-blob', './jquery.fileupload-process' ], factory); } else { // Browser globals: factory( window.jQuery, window.loadImage ); } }(function ($, loadImage) { 'use strict';

// Prepend to the default processQueue:
$.blueimp.fileupload.prototype.options.processQueue.unshift(
    {
        action: 'loadImageMetaData',
        disableImageHead: '@',
        disableExif: '@',
        disableExifThumbnail: '@',
        disableExifSub: '@',
        disableExifGps: '@',
        disabled: '@disableImageMetaDataLoad'
    },
    {
        action: 'loadImage',
        // Use the action as prefix for the "@" options:
        prefix: true,
        fileTypes: '@',
        maxFileSize: '@',
        noRevoke: '@',
        disabled: '@disableImageLoad'
    },

Here is my man.js file file

/*

• jQuery File Upload Plugin JS Example 8.3.0
• https://github.com/blueimp/jQuery-File-Upload *
• Copyright 2010, Sebastian Tschan
• https://blueimp.net *
• Licensed under the MIT license:
• http://www.opensource.org/licenses/MIT _/ /jslint nomen: true, regexp: true / /_global $, window, blueimp */

$(function () { 'use strict';

         // Initialize the jQuery File Upload widget:

    $('#fileupload').fileupload(

        {
                // Uncomment the following to send cross-domain cookies:
                //xhrFields: {withCredentials: true},

                url: '<%= gallery_paintings_path(@gallery.id) %>',
            sequentialUploads: true,
            dataType: 'json',
                        done: function (e, data) {
                                    $.each(data.result, function (index, file) {
                                    $('<li><img src="'+file.thumbnail_url+'"></li>').appendTo('#thumbs');
                                    });
                            }

        }   //this is an object storing parameter, value pairs. Here url value is set to 'server/php/
    );

        // Enable iframe cross-domain access via redirect option:

    //set the redirect option to cors/results.html?%s where %s is replaced with arguments after "?"

    //$('#fileupload').fileupload(
        //  'option',
        //  'redirect',
        //  window.location.href.replace( /\/[^\/]*$/,  '/cors/result.html?%s'  )
        //);

        // Add the fileupload-processing class to the #fileupload element
        $('#fileupload').addClass('fileupload-processing');

    //set the url, maxFileSize, acceptFileTypes, disableImageResize etc options
    $('#fileupload').fileupload('option', 
            {
                        url: '<%= gallery_paintings_path(@gallery.id) %>',
                            maxFileSize:    5000000,
                maxNumberOfFiles: 100,
                        acceptFileTypes: '/(\.|\/)(gif|jpe?g|png)$/i'
                }
    );

    //set the overall progress bar call back function
    //$('#fileupload')
    //      .bind('fileuploadprogressall', 
    //          function (e, data){
        //              var progress = parseInt(data.loaded / data.total * 100, 10); //calculate progress
        //              $('#progress .bar').css(
            //                  'width',
        //                  progress + '%'
        //                  );          //change the width of the progress bar css style
        //          }
    //
    //);

    //set the interval of updating progress (milliseconds)
    $('#fileupload').fileupload('option',
            'progressInterval',
             100
    );

    //display the image being added 
    $('#fileupload').bind('fileuploadadd', 
            function (e, data)  {
                                data.context = $('<button/>').text('Upload').appendTo(document.body).click(
                            function () {
                                            data.context = $('<p/>').text('Uploading...').replaceAll(
                                                    $(this));
                                        data.submit();
                                    }
                            );
                }
    );

    //callback after done
    //$('#fileupload').bind('fileuploaddone', 
    //           function (e, data) {
            //              data.context.text('Upload finished.');
        //           }
    //);

        $.ajax(
        {
            //These are ajax options, see jQuery File Upload Options 
                    // Uncomment the following to send cross-domain cookies:
                    //xhrFields: {withCredentials: true},
                    url: $('#fileupload').fileupload('option', 'url'),   //these retrieves the 'url' option (fileupload('option', 'url') is a getter for url)
                    dataType: 'json',                    //set dataType to json
                    context: $('#fileupload')[0]                 //set context 
            }
    ).always(
        function () {
                    $(this).removeClass('fileupload-processing'); //remove fileupload-processing class from #fileupload element
            }
    ).done(
        function (result) {
                    $(this).fileupload('option', 'done').call(this, null, {result: result}); 
            //fetches the 'done' call back function and call it with three arguments (this, null, {result : result})
            }
    );
}

);

Thanks!

[blueimp]

Did you include the processing plugin? https://github.com/blueimp/jQuery-File-Upload/blob/master/js/jquery.fileupload-process.js

Please see #2190

[wlgithub]

Thanks, yes I did include the process plugin, but I added after the main.js sentence. It is interesting that I have to put the jquery.fileupload-process.js in front of the main.js