Empty jqxhr.responseText still generates img tag with empty src attribute

[angheloko]

In my upload.php, I return nothing when a file fails validation (e.g. size limit). The default behavior is that an img tag will always be generated regardless of the return value of the server side uploading script.

To prevent the unnecessary image tag from being generated, I have the following in my uploadComplete function, which checks the response text if it is a valid URL.

var $progress = $('.progress:first', this.$el),
    $img,
    urlPattern = new RegExp("(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*");

$progress.attr('value', 100);
$progress.html(100);

if (urlPattern.test(jqxhr.responseText)) {
  $progress.before('<div class="mediumInsert-images"><img src="'+ jqxhr.responseText +'" draggable="true" alt=""></div>');
  $img = $progress.siblings('img');
  $progress.remove();

  $img.load(function () {
    $img.parent().mouseleave().mouseenter();
  });
}
else {
  $progress.remove();
}

[linkesch]

Good point, but I see that your server returns absolute path to an uploaded image and your RegExp handles only that. To make a really universal solution, we need to think about relative paths, too.

You wrote, that your upload script returns nothing, if an image wasn't uploaded. Maybe better would be just to test, if jqxhr.responseText is empty or not. What do you think?

You can make it yourself and submit a pull request, or I will make it in the future.

[angheloko]

Testing for blank return value is also OK. I'm just thinking if there'd be a case where the developer might want to display the error / reason. Displaying the error / reason might be "intrusive" and may not be the ideal behavior for an editor that aims to be minimalist but what would be the best way to let the user know of the error.

I can do a pull request.

[linkesch]

Maybe a good way to do it would be to replace a progress bar with an error message and to hide it after 5 seconds or so.