how to solve the logo upload popup issue in cart page and file not acceptable function in pdp,cart,quikview pages
for this first we need to check any condition is there for the validation if there we can check the possibility of adding there other wise we need to create a event or function for that to achieve that one
in this case the code is already there so i added the condition inside the if and else in other case we need to create a function.
events: {
'submit [data-action="cart-upload-form"]': 'uploadAction',
},
uploadAction: function uploadAction(e) {
e.preventDefault();
var self = this;
if (jQuery("input[name=fileuploadfield]").val()) {
var readerMTL = new FileReader();
const oFile = document.getElementById("in-modal-fileuploadfield").files[0];
if (oFile.size > 10485760) //10 MB for bytes.
{
alert("File size exeeds 10 MB! Please upload file with size less than 10 MB!");
return false;
}
readerMTL.readAsDataURL($('#in-modal-fileuploadfield')[0].files[0]);
readerMTL.onload = function (reader) {
var mtlFile = reader.currentTarget.result;
mtlFile = mtlFile.replace('data:;base64,', '');
var field = {
allowTypes: {
'rtf': 'RTF',
'doc': 'WORD',
'pdf': 'PDF',
'jpg': 'JPGIMAGE',
'gif': 'GIFIMAGE',
'png': 'PNGIMAGE',
'tiff': 'TIFFIMAGE',
'bmp': 'BMPIMAGE',
'jpeg': 'JPGIMAGE',
'eps': 'POSTSCRIPT',
'svg': 'SVG',
}
}
var logomtlFile = document.getElementById('in-modal-fileuploadfield').files[0];
var fileExt = logomtlFile.name.substr((logomtlFile.name.lastIndexOf('.') + 1));
if (_.isArray(_.keys(field.allowTypes)) && _.keys(field.allowTypes).length > 0) {
if (!_.contains(_.keys(field.allowTypes), fileExt)) {
var message = "File type not allowed"
$('.liquid-pixel-logo-upload-area').addClass('new-product-cls');
var global_view_message = new GlobalViewsMessageView({
message: message,
type: 'error',
closable: true,
});
jQuery('.msgafteruploadfield').hide();
jQuery('.msguploadfield').hide();
jQuery('.fileformaterrormessage').show()
var msgContainerParent = jQuery('.fileformaterrormessage');
msgContainerParent.html(global_view_message.render().$el.html());
}
else {
$('.liquid-pixel-logo-upload-area').removeClass('new-product-cls');
}
}
var imageFileType = field.allowTypes[fileExt]
var b64resizimg = mtlFile.split("base64,")[1];
var file = document.getElementById('in-modal-fileuploadfield').files[0];
var breakpoint = " ";
var fileName = file.name.split(breakpoint)[0];
var timeStamp = new Date().getTime();
if (file) {
var object = {
base64: b64resizimg,
imagefiletype: imageFileType,
filename: fileName + 'liquid12' + timeStamp
}
var url = Utils.getAbsoluteUrl(
getExtensionAssetsPath("services/pdpExtension.Service.ss"))
$.post(url, JSON.stringify(object)).done(function (data) {
var imageUrl = data ? JSON.parse(data).fileUrl : "";
var folderUrl = SC.CONFIGURATION.productConfigurator.folderurl;
if (imageUrl) {
jQuery('.fileformaterrormessage').hide()
jQuery('.msguploadfield').hide();
var fileName = JSON.parse(data).filename;
var newfilename = fileName.trim();
var liquidpixelurl = window.location.origin + folderUrl + JSON.parse(data).filename;
liquidpixelurl = liquidpixelurl.replace(/\s/g, '');
if (fileExt == 'eps' || fileExt == 'png' || fileExt == 'jpg' || fileExt == 'jpeg' || fileExt == 'pdf') {
document.getElementById("in-modal-set-liquid-pixel-logo-url").innerHTML = liquidpixelurl;
self.model.attributes.uploaded_file = true;
self.model.attributes.uploaded_nonprview_file = liquidpixelurl;
} else {
self.model.attributes.uploaded_file = false;
self.model.attributes.uploaded_nonprview_file = liquidpixelurl;
}
var message = "File Uploaded"
var global_view_message = new GlobalViewsMessageView({
message: message,
type: 'success',
closable: true,
});
jQuery('.msgafteruploadfield').show();
var msgContainerParent = jQuery('.msgafteruploadfield');
msgContainerParent.html(global_view_message.render().$el.html());
$('[data-type="add-to-cart"]').attr('disabled', false);
$('.logo-error-message').remove();
}
});
}
}
$('.liquid-pixel-logo-upload-area').removeClass('new-product-cls');
} else {
var message = "No file uploaded"
$('.liquid-pixel-logo-upload-area').addClass('new-product-cls');
var global_view_message = new GlobalViewsMessageView({
message: message,
type: 'error',
closable: true,
});
jQuery('.msgafteruploadfield').hide();
jQuery('.fileformaterrormessage').hide()
jQuery('.msguploadfield').show()
var msgContainerParent = jQuery('.msguploadfield');
msgContainerParent.html(global_view_message.render().$el.html());
}
},