diff --git a/js/file-selector.js b/js/file-selector.js index 42a726c1..687920d0 100644 --- a/js/file-selector.js +++ b/js/file-selector.js @@ -26,7 +26,7 @@ $(document).ready(function () { }); // disabled by user, or incompatible browser. -if (localStorage.file_dragdrop == 'false' || !(window.FileReader && window.File)) +if (localStorage.file_dragdrop == 'false' || !(window.URL.createObjectURL && window.File)) return; // multipost not enabled @@ -59,9 +59,9 @@ function addThumb(file) { var fileName = (file.name.length < 24) ? file.name : file.name.substr(0, 22) + '…'; var fileType = file.type.split('/')[0]; var fileExt = file.type.split('/')[1]; - var $fileThumb; + var $container = $('
'); - $('.file-thumbs').append($('
') + $container .addClass('tmb-container') .data('file-ref', file) .append( @@ -69,21 +69,14 @@ function addThumb(file) { $('
').addClass('file-tmb'), $('
').addClass('tmb-filename').html(fileName) ) - ); + .appendTo($('.file-thumbs')); + var $fileThumb = $container.find('.file-tmb'); if (fileType == 'image') { // if image file, generate thumbnail - var reader = new FileReader(); - - reader.onloadend = function () { - var dataURL = reader.result; - var $fileThumb = getThumbElement(file).find('.file-tmb'); - $fileThumb.css('background-image', 'url('+ dataURL +')'); - }; - - reader.readAsDataURL(file); + var objURL = window.URL.createObjectURL(file); + $fileThumb.css('background-image', 'url('+ objURL +')'); } else { - $fileThumb = getThumbElement(file).find('.file-tmb'); $fileThumb.html('' + fileExt.toUpperCase() + ''); } } @@ -142,13 +135,21 @@ var dropHandlers = { $(document).on(dropHandlers, '.dropzone'); $(document).on('click', '.dropzone .remove-btn', function (e) { + e.stopPropagation(); + var file = $(e.target).parent().data('file-ref'); + getThumbElement(file).remove(); removeFile(file); - $(e.target).parent().remove(); }); -$(document).on('click', '.dropzone .file-hint', function (e) { +$(document).on('keypress click', '.dropzone, .dropzone .file-hint', function (e) { + e.stopPropagation(); + + // accept mosue click or Enter + if (e.which != 1 || e.which != 13) + return; + var $fileSelector = $(''); $fileSelector.on('change', function (e) { diff --git a/templates/post_form.html b/templates/post_form.html index 0d02dc4e..777e02e1 100644 --- a/templates/post_form.html +++ b/templates/post_form.html @@ -92,7 +92,7 @@