Product information: Lining material: Microfiber Heel height: high heels (6-8CM) Heel shape: stiletto heels Sole material: rubber Toe bracket shape: Tip Wearing method: oversleeves/shoe covers Function: breathable wear-resistant
Packing list: A pair of high heels Product Image:
var url,dataUrl, cartUrl;
$(function(){
$('#J_AddProductFm').on('click','.upload-add-img',function(){
var addImg = $(this).parent().parent().children('li').length,
html = '';
html += '
You can only upload up to three pictures';
html += '
';
if (addImg > 3) {
$(this).parent().parent().prev('.upload-imgs-tips').html(html);
return;
}
$(this).parent().find('.upload-input').click();
});
$('#J_AddProductFm').on('click', '.delete', function () {
$(this).parent().remove();
});
$('#J_AddProductFm').on('change', '.upload-input', function () {
change(this);
});
function change(file){
var pic = $(file).parent().find(".preview")
,addImg = $(file).parent().find(".upload-add-img")
,deleteImg = $(file).parent().find(".delete")
,ext = file.value.substring(file.value.lastIndexOf(".") + 1).toLowerCase()
,filename = $(file).attr('name')
,html = '
'
+ '
'
+ ''
+ '
'
+ ''
+ '
'
+ ''
+ '
';
if (ext != 'png' && ext != 'jpg' && ext != 'jpeg' && ext != 'gif') {
if (ext != '') {
alert("The format of the image must be png or jpg or jpeg format!");
}
return;
}
$(file).parent().after(html);
var isIE = navigator.userAgent.match(/MSIE/) != null,
isIE6 = navigator.userAgent.match(/MSIE 6.0/) != null,
isIE10 = navigator.userAgent.match(/MSIE 10.0/) != null;
if (isIE && !isIE10) {
file.select();
var reallocalpath = document.selection.createRange().text;
if (isIE6) {
pic.attr("src",reallocalpath);
} else {
pic.css("filter","progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale',src=\"" + reallocalpath + "\")");
pic.attr('src','data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
}
addImg.hide();
deleteImg.show();
} else {
html5Reader(file,pic,addImg,deleteImg);
}
}
function html5Reader(file, pic, addImg, deleteImg) {
var file = file.files[0];
var reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function (e) {
pic.attr("src", this.result);
}
addImg.hide();
deleteImg.show();
}
// Drop-down options
$('.select-content').on('click','.select-options',function(){
var u = $(this).parents('.select-content').find('.select-item');
if(u.is(':hidden')){
$('.select-item').hide();
u.show();
}else{
u.hide();
}
});
$('.select-content').on('mousedown','.J_selectList',function(){
var p = $(this).parents('.select-content'),
v = $(this).attr('data-val'),
i = p.find('.select-options'),
inVal = p.find('.hide-val'),
list = p.find('.select-item');
i.text($(this).text());
inVal.val(v);
list.hide();
if (v == '' || v == undefined) {
p.find('.error').show();
} else {
p.find('.error').hide();
}
});
$(document).click(function(event){
var s = $('.select-content');
if(!s.is(event.target) && s.has(event.target).length === 0){
$('.select-item').hide();
}
});
// Qty Calculation
$('#J_quantity').qtyCalculation({
add:'#J_add',
reduces:'#J_reduce',
maxVal: '99'
});
cartUrl = 'https://tanotuan.com/ajax_product/addCartAjax';
$('img.J_imgCarousel').one('load',function(){
// 1st carousel, main
$('.carousel-main').flickity({
pageDots: false,
wrapAround:true,
setGallerySize:true,
adaptiveHeight:false,
prevNextButtons:false
});
// 2nd carousel, navigation
$('.carousel-nav').flickity({
asNavFor: ".carousel-main",
contain: true,
pageDots: false,
prevNextButtons:false
});
}).each(function() {
if(this.complete) $(this).load();
});
$('.J_optionList:radio:checked,.custom-radio input[type=radio]:checked,.custom-checkbox input[type=checkbox]:checked').next().addClass('active');
$('#J_AddProductFm').on('change','input.J_optionList',function(){
var t = $(this);
if (t.is(':checked')){
t.next().addClass('active').siblings().removeClass('active');
}
});
$('#J_AddProductFm').on('change','.custom-radio>input',function(){
var t = $(this);
if (t.is(':checked')){
t.next().addClass('active').parent().siblings().find('label').removeClass('active');
}
});
$('#J_AddProductFm').on('change','.custom-checkbox>input',function(){
var t = $(this);
if (t.is(':checked')){
t.next().addClass('active');
}else {
t.next().removeClass('active');
}
});
// product tab
$('.tab-title').on('click', function(){
var $this = $(this);
if ($this.hasClass('active')){
$this.removeClass('active').next('.tab-content').stop(true, true).slideUp(300);
} else {
$this.parent().siblings('li').find('.tab-title').removeClass('active').next('.tab-content').stop(true, true).slideUp(300);
$this.addClass('active').next('.tab-content').stop(true, true).slideDown(300).show();
}
});
//Verification Requirements && add product
$('#J_btnGroup').on('click','.J_cart',function(){
$(this).attr('type','submit').siblings().attr('type','button');
dataUrl = $(this).attr('data-url');
});
$('#J_AddProductFm').validate({
ignore:'',
messages:{
'options[1]':'Please select a valid shoe.' },
errorPlacement: function(error, element) {
$(element).parent().parent().after().append(error);
},
errorElement: "div",
submitHandler:function(form){
var pID = '60';
var formData = new FormData($('#J_AddProductFm')[0]);
if (dataUrl == '0') {
url = cartUrl + '?pID='+pID+'&type=0'
} else if (dataUrl == '1') {
url = cartUrl + '?pID='+pID+'&type=1'
}
$('#J_btnGroup button[type=button]').attr('disabled',true);
$('#J_cartModal').addClass('show');
setTimeout(function(){
$(form).reqForm({
url:url,
type:'post',
data:formData,
processData : false,
contentType : false,
ataType: "json",
cache: false,
// message:2,
successMessage:true,
loadHtml:'',
success:function(result){
if(result){
$('#J_cartModal').removeClass('show');
$('#J_btnGroup button[type=button]').attr('type','submit');
$('#J_btnGroup button[type=submit]').attr('disabled',false);
}
if(result.error=='1'){
return;
}
if (dataUrl == '0') {
window.location.href = result.url;
} else {
window.location.href = result.url;
}
},
error:function(error){
$('#J_cartModal').removeClass('show');
$('#J_btnGroup button[type=button]').attr('type','submit');
$('#J_btnGroup button[type=submit]').attr('disabled',false);
}
})
}, 100);
}
});
});