0.4.1 to 0.4.2 fails

[imgarylai]

When I updated the gem from 0.4.1 to 0.4.2, this gem doen't work. I downgrade to 0.4.1 and it is work.

It's strange that I didn't get any error messages both in browser console and rails app logs.

Here is my code:

image.js

$(document).on("ready page:load", function () {
  $("#new_image").fileupload({
    dataType: "script", 
    autoUpload: false,
  })
  .on("fileuploadadd", function (e, data) {
    $.each(data.files, function (index, file) {
      data.context = $(tmpl("template-upload", file));
      $('#upload-process-status').append(data.context);
    });
  })
  .on('fileuploadprogress', function (e, data) {
    var progress = Math.floor(data.loaded / data.total * 90);
    if (data.context) {
      data.context.each(function () {
        $(this).find('.progress-bar').css('width', progress + '%');  
      });
    }
  })
  .on("fileuploaddone", function (e, data) {
    if (data.context) {
      data.context.each(function () {
        $(this).find('.progress-bar').css('width', 100 + '%');  
        $(this).fadeOut();
      });
    }
  });
});

$(document).bind('dragover', function (e) {
  var dropZone = $('#dropzone'),
  timeout = window.dropZoneTimeout;
  if (!timeout) {
    dropZone.addClass('in');
  } else {
    clearTimeout(timeout);
  }
  var found = false,
  node = e.target;
  do {
    if (node === dropZone[0]) {
      found = true;
      break;
    }
    node = node.parentNode;
  } while (node != null);
  window.dropZoneTimeout = setTimeout(function () {
    window.dropZoneTimeout = null;
    dropZone.removeClass('in');
  }, 100);
});

rails from

<div class="row well">
  <%= form_for([:dashboard, @work, @image], id: "new_image") do |f| %>
    <span class="btn btn-success fileinput-button">
      <%= icon("plus", "新增圖片") %>
      <%= f.file_field :image, multiple: true, name: "image[image]", hide_label: true %>
    </span>
  <% end %>

  <hr>

  <div id="upload-process-status">

  </div>
  <script id="template-upload" type="text/x-tmpl">
  <div class="progress">
    <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%">
      {%=o.name%}
    </div>
  </div>
  <hr>
  </script>
</div>

[opti]

There are several reasons why it might not work:

• the way how you include necessary files
• API changes of the original plugin, you have to check your code against new api

[nagyt234]

@imgarylai, did you figure out, what was the problem. I have similar issue.

[imgarylai]

@nagyt234 I solved this problem in this way:

$(document).on("ready page:load", function () {
  $("#new_image").fileupload({
    acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
    maxFileSize: 5000000,
    add: function (e, data) {
      $.each(data.files, function (index, file) {
        data.context = $(tmpl("template-upload", file));
        $('#upload-process-status').append(data.context);
        data.submit();
      });
    },
    progress: function (e, data) {
      if (data.context) {
        data.context.each(function () {
        var progress = Math.floor(data.loaded / data.total * 70);
          $(this).find('.progress-bar').css('width', progress + '%');
        });
      }
    },
    done: function (e, data) {
      if (data.context) {
        data.context.each(function () {
          $(this).find('.progress-bar').css('width', 100 + '%');
          $(this).fadeOut();
        });
      }
    }
  });
});

Hope can help you.