2017-08-03 09:45:52 +02:00

264 lines
8.6 KiB
JavaScript

var
_factor = 1,
_max_amount = 460,
_unit = 360/_max_amount ,
_flag = false,
_angle = {'x': 0, 'y': 0};
_anglelast = {'x': 0, 'y': 0};
;
var monthR = ["","Janvier","Février","Mars","Avril","Mai","Juin","Juillet","Août","Septembre","Octobre","Novembre","Décembre"];
var faceDeg = {
'top': { 'x': 0, 'y': 0, },
'bottom': { 'x': 0, 'y': 0, },
'back': { 'x': 0, 'y': 0, },
'front': { 'x': 0, 'y': 45, },
'left': { 'x': 0, 'y': 0, },
'right': { 'x': 0, 'y': 0, },
};
// Start when DOM is ready
$(function() {
initInfos();
initFaces();
initDrag();
});
function initFaces()
{
// Reset faces
$(".container-db .db-cube1 .back").addClass('face-custom-txt');
$(".container-db .db-cube1 .back").addClass('face-custom-img');
$('#custom_elmts .noms-holder').clone().appendTo(".container-db .db-cube1 .front");
$('#custom_elmts .noms-holder').clone().appendTo(".container-db .db-cube2 .bottom");
// Doublecube holder
if (theme == "ivoire" || theme == "tendance" || theme == "champetre" || theme == "uv") {
$('#custom_elmts .date-holder').clone().appendTo(".container-db .db-cube1 .left");
}
if (theme == "oriental") {
$('#custom_elmts .date-holder').clone().appendTo(".container-db .db-cube2 .top");
}
if(theme == "chocolate" || theme == "cinema" || theme == "oriental" || theme == "fleurs"
|| theme == "vintage" || theme == "voyage" || theme == "gourmandise") {
console.log('date');
$('#custom_elmts .date-holder').clone().appendTo(".container-db .db-cube2 .right");
}
$('.container-db .db-cube1 .top').css({'background-image':'url('+themeImg+'/box/1-TOP.png)'});
$('.container-db .db-cube1 .bottom').css({'background-image':'url('+themeImg+'/box/1-BOTTOM.png)'});
$('.container-db .db-cube1 .back').css({'background-image':'url('+themeImg+'/box/1-BACK.png)'});
$('.container-db .db-cube1 .front').css({'background-image':'url('+themeImg+'/box/1-FRONT.png)'});
$('.container-db .db-cube1 .left').css({'background-image':'url('+themeImg+'/box/1-LEFT.png)'});
$('.container-db .db-cube1 .right').css({'background-image':'url('+themeImg+'/box/1-RIGHT.png)'});
$('.container-db .db-cube2 .top').css({'background-image':'url('+themeImg+'/box/2-TOP.png)'});
$('.container-db .db-cube2 .bottom').css({'background-image':'url('+themeImg+'/box/2-BOTTOM.png)'});
$('.container-db .db-cube2 .back').css({'background-image':'url('+themeImg+'/box/2-BACK.png)'});
$('.container-db .db-cube2 .front').css({'background-image':'url('+themeImg+'/box/2-FRONT.png)'});
$('.container-db .db-cube2 .left').css({'background-image':'url('+themeImg+'/box/2-LEFT.png)'});
$('.container-db .db-cube2 .right').css({'background-image':'url('+themeImg+'/box/2-RIGHT.png)'});
$('.container-db').addClass(theme);
// Chocos holder
$('#custom_elmts .noms-holder').clone().appendTo(".chocos-holder .choco1 .front");
$('#custom_elmts .noms-holder').clone().appendTo(".chocos-holder .choco4 .front");
$('#custom_elmts .date-holder').clone().appendTo(".chocos-holder .choco2 .front");
// Chocos background image
$('.chocos-holder .choco1 .front').css({'background-image':'url('+themeImg+'/chocos/1F.png)'});
$('.chocos-holder .choco1 .back').css({'background-image':'url('+themeImg+'/chocos/1B.png)'});
$('.chocos-holder .choco2 .front').css({'background-image':'url('+themeImg+'/chocos/2F.png)'});
$('.chocos-holder .choco2 .back').css({'background-image':'url('+themeImg+'/chocos/2B.png)'});
$('.chocos-holder .choco3 .front').css({'background-image':'url('+themeImg+'/chocos/3F.png)'});
$('.chocos-holder .choco3 .back').css({'background-image':'url('+themeImg+'/chocos/3B.png)'});
$('.chocos-holder .choco4 .front').css({'background-image':'url('+themeImg+'/chocos/4F.png)'});
$('.chocos-holder .choco4 .back').css({'background-image':'url('+themeImg+'/chocos/4B.png)'});
$('.chocos-holder .choco5 .front').css({'background-image':'url('+themeImg+'/chocos/5F.png)'});
$('.chocos-holder .choco5 .back').css({'background-image':'url('+themeImg+'/chocos/5B.png)'});
$('.chocos-holder').addClass(theme);
$('.chocos-holder .flip-container').eq(4).show();
}
//=== Events
$('#NOM1').on('keyup click', function(){
defNOM1($(this));
console.log($('.noms-holder').parent('figure').attr('class'));
rotateDC(0,45);
});
$('#NOM2').on('keyup click', function(){
defNOM2($(this));
rotateDC(0,45);
});
$('#PERSOTXT').on('keyup click', function(){
var txt = $(this).val().replace(/\n/g, "<br />");
$('.face-custom-img').empty();
$('.face-custom-txt').html('<div class="freetext-holder"></div>');
$('.freetext-holder').html(txt).css({'margin-top':-$('.freetext-holder').height()*0.5});
rotateDC(0,180);
});
$('#DATEMARIAGE').on('change click', function(e) {
defDATEMARIAGE($(this));
rotateDC(0,90);
});
$('.FACELIBRE').on('change', function(e) {
defFACELIBRE($(this));
rotateDC(0,180);
});
$('#EMBALLAGE').on('change', function(e) {
defEMBALLAGE($(this));
});
$('#PELLICULAGE').on('change', function(e) {
defPELLICULAGE($(this));
});
function initDrag()
{
$('#simu-box').on(events.start, function(e) {
if (hasTouchSupport) {
var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];
p0 = { 'x': touch.pageX, 'y': touch.pageY };
} else {
p0 = { 'x': e.clientX, 'y': e.clientY };
}
_flag = true;
$(document).on(events.move, drag);
$('.simu-container').removeClass('animated');
e.preventDefault();
});
$(document).on(events.end, function(e) {
var p1;
if (hasTouchSupport) {
var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];
p1 = { 'x': touch.pageX, 'y': touch.pageY };
} else {
p1 = { 'x': e.clientX, 'y': e.clientY };
}
_flag = false;
$(document).off(events.move, drag);
_angle = {'x': _anglelast.x, 'y': _anglelast.y}
});
}
function drag(e) {
/* distance and angle values since starting to drag */
var p1;
if(hasTouchSupport) {
var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];
p1 = { 'x': touch.pageX - p0.x, 'y': touch.pageY - p0.y }
} else {
p1 = { 'x': e.clientX - p0.x, 'y': e.clientY - p0.y }
}
var angle = {'x': -p1.y*_unit, 'y': p1.x*_unit};
tmp = 'rotateX(' + (_angle.x + angle.x) + 'deg)' + 'rotateY(' + (_angle.y + angle.y) + 'deg) scale(.92)';
$('.simu-container').css({'-webkit-transform' : tmp , 'transform' : tmp});
_anglelast = {'x': (_angle.x + angle.x), 'y': (_angle.y + angle.y)}
};
// === Functions
function initInfos()
{
defNOM1($('#NOM1'));
defNOM2($('#NOM2'));
defDATEMARIAGE($('#DATEMARIAGE'));
defFACELIBRE($('.FACELIBRE'));
defPELLICULAGE($('#PELLICULAGE'));
defEMBALLAGE($('#EMBALLAGE'));
}
function defDATEMARIAGE(obj){
var day = obj.val().substring(0,2);
var month = obj.val().substring(3,5);
var year = obj.val().substring(6,10);
$('.day').html(day);
$('.month').html(monthR[parseInt(month)]);
$('.year').html(year);
}
function defNOM1(obj){
$('.nom_1').html(obj.val())
$('.initiale_1').html(obj.val().substring(0,1));
}
function defNOM2(obj){
$('.nom_2').html(obj.val())
$('.initiale_2').html(obj.val().substring(0,1));
}
function defFACELIBRE(obj){
var choice = obj.find('option:selected').text();
$(".face-custom-txt").empty();
$('.face-custom-img').empty();
if (choice == "Aucune") {
//Nothing
} else if(choice == "Image") {
} else if(choice == "Texte") {
var txt = $('#PERSOTXT').val().replace(/\n/g, "<br/>");
$('.face-custom-txt').html('<div class="freetext-holder"></div>');
$('.freetext-holder').html(txt).css({'margin-top':-$('.freetext-holder').height()*0.5});
} else if(choice == "Initiales") {
$('#custom_elmts .initiales-holder').clone().appendTo(".face-custom-txt");
}
}
function defPELLICULAGE(obj){
$('.matface').remove();
if(obj.find('option:selected').text() == "Mat") {
$('.cubeface').append('<div class="matface"></div>')
}
}
function defEMBALLAGE(obj){
var choice = obj.find('option:selected').text();
$('.flip-container').removeClass('argent');
$('.flip-container').removeClass('or');
if (choice == "Argenté") {
$('.flip-container').addClass('argent');
} else if (choice == "Doré") {
$('.flip-container').addClass('or');
}
}
function formatDateInput(date)
{
var day = date.substring(6,8);
var month = date.substring(4,6)
var year = date.substring(0,4)
return year+'-'+month+'-'+day;
}
function todaySimu()
{
var today = new Date();
var dd = (today.getDate()).toString();
var mm = (today.getMonth()+1).toString(); //January is 0!
var yyyy = (today.getFullYear()).toString();
if(dd<10) dd='0'+dd;
if(mm<10) mm='0'+mm;
return yyyy+mm+dd;
}
function rotateDC(rX,rY)
{
$('.simu-container').addClass('animated');
tmp = 'rotateX(' + rX + 'deg)' + 'rotateY(' + rY + 'deg)';
$('.simu-container').css({'transform' : tmp});
_angle = {'x': rX, 'y': rY}
_anglelast = {'x': rX, 'y': rY}
}