Skip to content

Instantly share code, notes, and snippets.

@dmitry-mukhin
Last active August 29, 2015 14:20
Show Gist options
  • Save dmitry-mukhin/0e8e6e96a2e75e639aa0 to your computer and use it in GitHub Desktop.
Save dmitry-mukhin/0e8e6e96a2e75e639aa0 to your computer and use it in GitHub Desktop.
._list {
padding-top: 20px;
}
._item {
padding: 0 0 10px;
display: inline-block;
text-align: center;
vertical-align: top;
width: 100px;
word-break: break-word;
font-size: 12px;
line-height: normal;
}
._item img {
display: block;
width: 80px;
height: 80px;
padding: 0 10px 6px;
}
$ = uploadcare.jQuery;
$(function() {
function installWidgetPreviewMultiple(widget, list, data) {
widget.onChange(function(fileGroup) {
list.empty();
data.val('');
if (fileGroup) {
$.when.apply(null, fileGroup.files()).done(function() {
$.each(arguments, function(i, fileInfo) {
var src = fileInfo.cdnUrl + '-/scale_crop/160x160/center/';
list.append(
$('<div/>', {'class': '_item'}).append(
[$('<img/>', {src: src}), fileInfo.name])
);
data.val(data.val() + "\n" + fileInfo.cdnUrl);
});
});
}
});
}
$('.pwebcontact-form').attr('role', "uploadcare-upload-form");
$('#pwebcontact1_field-upload')
.attr("role", "uploadcare-uploader")
.data("multiple", "true")
.hide();
$('#pwebcontact1_field-uploads').hide();
$('#pwebcontact1_field-uploads-lbl').hide();
$('#pwebcontact1_field-uploads').after('<div class="_tb_list"></div>');
uploadcare.start();
var widget = uploadcare.MultipleWidget('[role=uploadcare-uploader]');
installWidgetPreviewMultiple(widget, $('._tb_list'), $('#pwebcontact1_field-uploads'));
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment