$(document).ready(function(){
$(".menu").siblings().hide();
$("#submit").show();
//$("input[type='submit']").show();
//$("input[type='file']").show();
$("#gallery").show();
//$('.menu, .submenu, .scarpe').val('select');
$(".menu, .submenu1, .submenu2, .misure_magliette").on("change", function(){
val = $(this).val();
console.log(val);
$("."+val).show();
console.log($(this).attr("class"));
if($(this).attr("class") == "menu"){
$("."+val).show();
$("."+val).siblings().hide();
$("#submit").show();
$(".menu").show();
console.log("ok")
}
if($(this).attr("class") == "submenu1" || $(this).attr("class") == "submenu2"){
$("#gallery").show();
}
// $("."+val).val('select');
// $("."+val).siblings().hide();
});
$("input[type='number']").mouseout(function(){
console.log($(this).val());
})
$("input[type='submit']").mouseover(function(){
})
//var fileInput = document.getElementById('file_input');
//fileInput = $(".file_input");
cont =0;
rotate = 0;
/*-----------------------------------------------------------------------------------*/
fileInput = document.getElementsByClassName("file_input");
function main(){
fileInput[cont].addEventListener("change", ()=>{
// $(".file_input").eq(cont).on("change", () => {
//cont++;
//rotate -= 90;
div = document.createElement("div");
for(let file of fileInput[cont].files) {
var image = file
if (image) {
var imageElement = new Image();
imageElement.src = URL.createObjectURL(image);
imageElement.width = 100;
var imageElement2 = new Image();
imageElement2.src = "https://img.icons8.com/material-two-tone/24/000000/rotate-left.png";
//imageElement2.width = 100;
var imageElement3 = new Image();
imageElement3.src="https://img.icons8.com/material-rounded/24/000000/rotate-right.png";
var imageElement4 = new Image();
imageElement4.src="https://img.icons8.com/material-two-tone/24/000000/remove-image.png";
document.getElementById('gallery').appendChild(div);
div.appendChild(imageElement2);
div.appendChild(imageElement3);
div.appendChild(imageElement4);
div.appendChild(imageElement);
$(imageElement2).click(function(){
rotate = rotate - 90;
// rrotate = rotate + 90;
console.log(7)
$(imageElement).css("transform", "rotate("+rotate+"deg)");
// $(imageElement).css("transform", "rotate("+lrotate+"deg)");
});
$(imageElement3).click(function(){
// lrotate = rotate - 90;
rotate = rotate + 90;
console.log(7)
// $(imageElement).css("transform", "rotate("+lrotate+"deg)");
$(imageElement).css("transform", "rotate("+rotate+"deg)");
});
$(imageElement4).click(()=>{
$(imageElement).css("display","none");
})
}
}
$("img").click(function(){
console.log(4);
})
console.log(cont)
cont++
console.log(cont)
});
}
//cont=0;
$("#addimg").click(()=>{
// cont++
$(".file_input").eq(cont).click();
main();
})
form = document.forms[0];
botonSubmit = document.getElementById("submit");
botonSubmit.addEventListener("click", (e)=>{
e.preventDefault();
dati = new FormData(form);
// console.log(dati.get("product"));
if(dati.get("product") == "scarpe"){
console.log(dati.get("product"));
console.log(dati.get("scarpe_genere"));
console.log(dati.get("scarpe_num"));
}
else if(dati.get("product")=="magliette"){
console.log(dati.get("product"));
console.log(dati.get("sesso_magliette"));
console.log(dati.get("misure_magliette"));
}
fetch("output2.php", {
method:'POST',
body: dati
})
})
})