function navigate(url) {
  document.location.href = url;
}

function go_to_shop() {
  navigate('/gravsten');
}

function update_shopping_cart() {
  $.get("/gravsten/shopping_cart", function(data) {
    $(".shopping_cart").html(data);
  });

}

function scroll_to_top() {
  $("html, body").animate({ scrollTop: 0 }, 600);
}

function update_preview_text() {
  if ($('input[name="stone[font]"]:checked').length > 0) {
    $('.line_1').html($('#stone_name_1').val());
    $('.line_2').html($('#stone_name_2').val());

    if ($('#stone_born_on_day').val() && $('#stone_born_on_month').val() && $('#stone_born_on_year').val() && $('#stone_dead_on_day').val() && $('#stone_dead_on_month').val() && $('#stone_dead_on_year').val()) {
      var str = '* ' + $('#stone_born_on_day').val() + '.' + $('#stone_born_on_month').val() + '.' + $('#stone_born_on_year').val() + ' + ' + $('#stone_dead_on_day').val() + '.' + $('#stone_dead_on_month').val() + '.' + $('#stone_dead_on_year').val();
      $('.line_3').html(str)
    }

    if ($('#stone_after_text').val() != '') {
      if ($("#stone_after_text option:selected").val() != 'custom') {
        $('.line_7, .small_line_7, .ultra_small_line_7').html($("#stone_after_text option:selected").html());
      } else {
        $('.line_7, .small_line_7, .ultra_small_line_7').html($("#stone_after_text_custom").val());
      }
    } else {
      $('.line_7, .small_line_7, .ultra_small_line_7').html('');
    }
  }

  if ($('#stone_extra_name_1').is(':checked')) {
    $('.line').addClass('small_line');
    // $('.line_7').removeClass('line_7').addClass('small_line_7');
    $('.line_4').html($('#stone_name_2_1').val());
    $('.line_5').html($('#stone_name_2_2').val());

    if ($('#stone_born_on_2_day').val() && $('#stone_born_on_2_month').val() && $('#stone_born_on_2_year').val() && $('#stone_dead_on_2_day').val() && $('#stone_dead_on_2_month').val() && $('#stone_dead_on_2_year').val()) {
      var str = '* ' + $('#stone_born_on_2_day').val() + '.' + $('#stone_born_on_2_month').val() + '.' + $('#stone_born_on_2_year').val() + ' + ' + $('#stone_dead_on_2_day').val() + '.' + $('#stone_dead_on_2_month').val() + '.' + $('#stone_dead_on_2_year').val();
      $('.line_6').html(str)
    }

    if ($('#stone_name_2').val() != "" || $('#stone_name_2_2').val() != "") {
      // $('.line_26px').addClass('line_26_small');
      // $('.line_22px').addClass('line_22_small');
      $('.line').removeClass('small_line').addClass('ultra_small_line');
      // $('.small_line_7').removeClass('small_line_7').addClass('ultra_small_line_7');
    } else {
      // $('.line_26px').removeClass('line_26_small');
      // $('.line_22px').removeClass('line_22_small');
      // $('.line').removeClass('ultra_small_line').addClass('small_line');
      // $('.ultra_small_line_7').removeClass('ultra_small_line_7').addClass('small_line_7');
    }
  } else {
    $('.line_4').html('');
    $('.line_5').html('');
    $('.line_6').html('');
    $('.line').removeClass('small_line').removeClass('ultra_small_line');
    // $('.small_line_7, .ultra_small_line_7').removeClass('small_line_7').removeClass('ultra_small_line_7').addClass('line_7');
    // $('.line_26px').removeClass('line_26_small');
    // $('.line_22px').removeClass('line_22_small');
  }

  if ($('#stone_extra_name_0').is(':checked')) {
    if ($('#stone_space_for_extra_name_1').is(':checked')) {
      $('.line').addClass('small_line');
    } else {
      $('.line').removeClass('small_line');
    }
  }

  $('.line').each(function() {
    if ($(this).html() == '')
      $(this).hide();
    else
      $(this).show();
  });
}

function stone_extra_name_change() {
  if ($('#stone_extra_name_1').is(':checked')) {
    $('.no_extra_name').hide();
    $('.extra_name').show();
    update_preview_text();
  } else {
    $('.no_extra_name').show();
    $('.extra_name').hide();
    update_preview_text();
  }
  center_line($('.line_7, .small_line_7, .ultra_small_line_7'));
}

function stone_after_text_change() {
  if (this.value == 'custom') {
    $('.after_text_custom').show();
  } else {
    $('.after_text_custom').hide();
  }
  update_preview_text();
}

function update_font() {
  font = $('input[name="stone[font]"]:checked').attr('data-font');
  $('.text_preview').css('font-family', font);
  if (font == 'AntikvaStenStor')
    $('.text_preview').css('text-transform', 'uppercase');
  else
    $('.text_preview').css('text-transform', 'initial');

  update_preview_text();
}

function update_color() {
  color = $('input[name="stone[color]"]:checked').attr('data-color');
  $('.text_preview').css('color', color);
}

function decoration_click() {
  $('#add_decoration').hide();
  $('#stone_decoration_sku').val($(this).attr('data-sku'))
  $('#selected_decoration').html($(this).attr('data-name'));
  $('#remove_decoration').show();
  $.fancybox.close();
  $('.line_8 img').attr("src", "/decorations_image/" + $(this).attr('data-sku'));
  center_line($('.line_8'));
}

function decoration_remove() {
  $('#add_decoration').show();
  $('#stone_decoration_sku').val('');
  $('#selected_decoration').html('');
  $('#remove_decoration').hide();
  $('.line_8 img').attr("src", "");
  return false;
}


function validate_font_and_text() {
  $('div.font_and_text_errors').hide();
  $('div.font_and_text_errors').html('<ul></ul>');
  $('.label_error').hide();

  if ($('input[name="stone[font]"]:checked').length == 0) {
    $('div.font_and_text_errors ul').append('<li>Skrifttype skal vælges</li>');
    $('#font_and_text_font').show();
  }

  if ($('input[name="stone[color]"]:checked').length == 0) {
    $('div.font_and_text_errors ul').append('<li>Farve skal vælges</li>');
    $('#font_and_text_font').show();
  }

  if (!$('#stone_name_1').val()) {
    $('div.font_and_text_errors ul').append('<li>Navn linje 1 skal udfyldes</li>');
    $('#font_and_text_name').show();
  }

  if ($('#stone_born_on_day').val() && $('#stone_born_on_month').val() && $('#stone_born_on_year').val() && $('#stone_dead_on_day').val() && $('#stone_dead_on_month').val() && $('#stone_dead_on_year').val()) {
    var born = new Date($('#stone_born_on_year').val(), parseInt($('#stone_born_on_month').val())-1, $('#stone_born_on_day').val());
    var dead = new Date($('#stone_dead_on_year').val(), parseInt($('#stone_dead_on_month').val())-1, $('#stone_dead_on_day').val());
    if (born > dead) {
      $('div.font_and_text_errors ul').append('<li>Dødsdato kan ikke være før fødselsdato</li>');
      $('#font_and_text_born').show();
      $('#font_and_text_dead').show();
    }
  }

  if ($('#stone_extra_name_1').is(':checked')) {
    if (!$('#stone_name_2_1').val()) {
      $('div.font_and_text_errors ul').append('<li>Ekstra navn linje 1 skal udfyldes</li>');
      $('#font_and_text_name_2').show();
    }

    if ($('#stone_born_on_2_day').val() && $('#stone_born_on_2_month').val() && $('#stone_born_on_2_year').val() && $('#stone_dead_on_2_day').val() && $('#stone_dead_on_2_month').val() && $('#stone_dead_on_2_year').val()) {
      var born = new Date($('#stone_born_on_2_year').val(), parseInt($('#stone_born_on_2_month').val())-1, $('#stone_born_on_2_day').val());
      var dead = new Date($('#stone_dead_on_2_year').val(), parseInt($('#stone_dead_on_2_month').val())-1, $('#stone_dead_on_2_day').val());
      if (born > dead) {
        $('div.font_and_text_errors ul').append('<li>Ekstra dødsdato kan ikke være før fødselsdato</li>');
        $('#font_and_text_born_2').show();
        $('#font_and_text_dead_2').show();
      }
    }
  }

  if ($('div.font_and_text_errors').html() != '<ul></ul>') {
    $('div.font_and_text_errors').show();
    return false;
  }
}

function validate_delivery_and_invoice() {
  $('div.delivery_errors').hide();
  $('div.delivery_errors').html('<ul></ul>');
  $('.label_error').hide();

  if ($('input[name="stone[delivery]"]:checked').length == 0) {
    $('div.delivery_errors ul').append('<li>Leverings type skal vælges</li>');
    $('#delivery_delivery').show();
  }

  if ($('input[name="stone[delivery]"]:checked').length > 0) {
    if ($('input[name="stone[delivery]"]:checked')[0].value == 'full' || $('input[name="stone[delivery]"]:checked')[0].value == 'kirke') {
      if (!$('#order_delivery_name_2').val().trim()) {
        $('div.delivery_errors ul').append('<li>Navn på kirkegård skal udfyldes</li>');
        $('#delivery_delivery_name_2').show();
      }

      if (!$('#order_delivery_postcode_2').val().trim()) {
        $('div.delivery_errors ul').append('<li>Postnr. på kirkegård skal udfyldes</li>');
        $('#delivery_delivery_postcode_2').show();
      }

      if (!$('#order_delivery_address1_2').val().trim()) {
        $('div.delivery_errors ul').append('<li>By på kirkegård skal udfyldes</li>');
        $('#delivery_delivery_address1_2').show();
      }
    }

    if ($('input[name="stone[delivery]"]:checked')[0].value == 'address' || $('input[name="stone[delivery]"]:checked')[0].value == 'address_no_bridge') {
      if (!$('#order_delivery_name_1').val().trim()) {
        $('div.delivery_errors ul').append('<li>Navn til levering skal udfyldes</li>');
        $('#delivery_delivery_name_1').show();
      }

      if (!$('#order_delivery_address1_1').val().trim()) {
        $('div.delivery_errors ul').append('<li>Adresse til levering skal udfyldes</li>');
        $('#delivery_delivery_address1_1').show();
      }

      if (!$('#order_delivery_postcode_1').val().trim()) {
        $('div.delivery_errors ul').append('<li>Postnr. til levering skal udfyldes</li>');
        $('#delivery_delivery_postcode_1').show();
      }

      if (!$('#order_delivery_address2_1').val().trim()) {
        $('div.delivery_errors ul').append('<li>By til levering skal udfyldes</li>');
        $('#delivery_delivery_address2_1').show();
      }
    }
  }

  if (!$('#order_first_name').val().trim()) {
    $('div.delivery_errors ul').append('<li>Fornavn skal udfyldes</li>');
    $('#delivery_first_name').show();
  }

  if (!$('#order_last_name').val().trim()) {
    $('div.delivery_errors ul').append('<li>Efternavn skal udfyldes</li>');
    $('#delivery_last_name').show();
  }

  if (!$('#order_billing_address1').val().trim()) {
    $('div.delivery_errors ul').append('<li>Adresse skal udfyldes</li>');
    $('#delivery_billing_address1').show();
  }

  if (!$('#order_billing_postcode').val().trim()) {
    $('div.delivery_errors ul').append('<li>Postnr. skal udfyldes</li>');
    $('#delivery_billing_postcode').show();
  }

  if (!$('#order_billing_address2').val().trim()) {
    $('div.delivery_errors ul').append('<li>By skal udfyldes</li>');
    $('#delivery_billing_address2').show();
  }

  if (!$('#order_phone_number').val().trim()) {
    $('div.delivery_errors ul').append('<li>Tlf skal udfyldes</li>');
    $('#delivery_phone_number').show();
  } else if (!validatePhone($('#order_phone_number').val())) {
    $('div.delivery_errors ul').append('<li>Tlf er udfyldt forkert</li>');
    $('#delivery_phone_number').show();
  }

  if (!$('#order_email_address').val().trim()) {
    $('div.delivery_errors ul').append('<li>E-mail skal udfyldes</li>');
    $('#delivery_email_address').show();
  } else if (!validateEmail($('#order_email_address').val())) {
    $('div.delivery_errors ul').append('<li>E-mail er udfyldt forkert</li>');
    $('#delivery_email_address').show();
  }

  if ($('div.delivery_errors').html() != '<ul></ul>') {
    $('div.delivery_errors').show();
    return false;
  }
}

function load_font_and_text(data) {
  $('div.font_and_text').html(data);
  $('li.font_and_text_section').addClass('active');
  $('div.font_and_text').slideDown("fast");
  scroll_to_top();

  $('input[name="stone[font]"]').on('click', update_font);
  $('input[name="stone[color]"]').on('click', update_color);
  $('#stone_name_1').on('keyup', function() {
    center_line($('.line_1'));
  });
  $('#stone_name_1').on('keyup', update_preview_text);
  $('#stone_name_2').on('keyup', function() {
    center_line($('.line_2'));
  });
  $('#stone_name_2').on('keyup', update_preview_text);
  $('.input_field select').on('change', update_preview_text);
  $('.input_field select.no_3').on('change', function() {
    center_line($('.line_3'));
  });
  $('.input_field select.no_6').on('change', function() {
    center_line($('.line_6'));
  });
  $('input[name="stone[extra_name]"]').on('click', stone_extra_name_change);
  $('#stone_name_2_1').on('keyup', update_preview_text);
  $('#stone_name_2_1').on('keyup', function() {
    center_line($('.line_4'));
  });
  $('#stone_after_text').on('change', stone_after_text_change);
  $('#stone_name_2_2').on('keyup', update_preview_text);
  $('#stone_name_2_2').on('keyup', function() {
    center_line($('.line_5'));
  });

  $('#stone_after_text_custom').on('keyup', update_preview_text);
  $('#stone_after_text_custom').on('keyup', function() {
    center_line($('.line_7, .small_line_7, .ultra_small_line_7'));
  });
  $('.input_field select#stone_after_text').on('change', function() {
    center_line($('.line_7, .small_line_7, .ultra_small_line_7'));
  });
  $('input[name="stone[space_for_extra_name]"]').on('change', update_preview_text);
  $('.decoration_option').on('click', decoration_click);
  $('#remove_decoration').on('click', decoration_remove);

  $('div.font_and_text').children('form').on('submit', validate_font_and_text)

  $('div.font_and_text').children('form').on('ajax:before', function() {
    $('#stone_design_str').val($('#draggable_area').html());
  });

  $('div.font_and_text').children('form').on('ajax:success', function(obj, data) {
    load_delivery_and_invoice(data);
  });

  $('a.add_item').fancybox();
  update_font();
  update_color();
  update_preview_text();
  update_shopping_cart();
  $('.line').draggable({ containment: "#draggable_area", scroll: false });
  $('.line').each(center_line);
}

function center_line(t) {
  if (typeof(t) == 'object') {
    t.css('width', 'auto');
    t.css('left', ($('#draggable_area').width() / 2) - ($(t).width() / 2));
  }
}

function load_delivery_and_invoice(data) {
  $('div.delivery_and_invoice').html(data);
  $('li.font_and_text_section').removeClass('active');
  $('li.delivery_and_invoice_section').addClass('active');
  $('div.font_and_text').slideUp("fast");
  $('div.delivery_and_invoice').slideDown("fast");
  scroll_to_top();
  $(".fancybox").fancybox();

  $('input[name="stone[delivery]"]').on('click', delivery_click);

  $('div.delivery_and_invoice').children('form').on('submit', validate_delivery_and_invoice)

  $('div.delivery_and_invoice').children('form').on('ajax:success', function(obj, data) {
    load_payment(data);
  });

  $('div.delivery_and_invoice').children('form').on('ajax:error', function() {
    alert('Der skete en fejl, kontroller venligst din indtastning og prøv igen');
  });

  $('#checkoutSteps a.back').off('click').on('click', function () {
    $('.font_and_text_section').click();
    return false;
  });

  delivery_click();
  font_and_text_section_click();
  update_shopping_cart();
}

function delivery_click() {
  $('.delivery_address_1').hide();
  $('.delivery_address_2').hide();
  var t = $('input[name="stone[delivery]"]:checked')[0];

  if (t) {
    if (t.value == 'full' || t.value == 'kirke')
      $('.delivery_address_2').show();

    if (t.value == 'address' || t.value == 'address_no_bridge')
      $('.delivery_address_1').show();
  }
}

function load_payment(data) {
  if (data.indexOf('confirmed') > -1) {
    load_order_complete(data);
    return true;
  }

  $('div.payment').html(data);
  $('li.delivery_and_invoice_section').removeClass('active');
  $('li.payment_section').addClass('active');
  $('div.delivery_and_invoice').slideUp("fast");
  $('div.payment').slideDown("fast");
  scroll_to_top();

  $('#form_creditcard').on('ajax:before', function() {
    $('.payment_creditcard_loader').show();
    $('.payment_creditcard_button').hide();
  });

  $('#form_creditcard').on('ajax:success', function(obj, data) {
    navigate(data.url);
  });

  $('#checkoutSteps a.back').off('click').on('click', function () {
    $('.delivery_and_invoice_section').click();
    return false;
  });

  $('#form_bank').on('ajax:before', function() {
    $('.payment_bank_loader').show();
    $('.payment_bank_button').hide();
  });

  $('#form_bank').on('ajax:success', function(obj, data) {
    if (data.indexOf('confirmed') > -1) {
      load_order_complete(data);
      return true;
    }
  });

  font_and_text_section_click();
  delivery_and_invoice_section_click();
  update_shopping_cart();
}

function load_order_complete(data) {
  $('div.order_complete').html(data);
  $('li.payment_section').removeClass('active');
  $('li.order_complete_section').addClass('active');
  $('div.payment').slideUp("fast");
  $('div.order_complete').slideDown("fast");
  scroll_to_top();
}

function font_and_text_section_click() {
  $('.font_and_text_section').addClass('section-clickable');
  $('.font_and_text_section').off('click').on('click', function() {
    start_checkout('font_and_text');
    $('div.delivery_and_invoice').slideUp("fast");
    $('div.delivery_and_invoice').slideUp("fast");
    $('div.payment').slideUp("fast");
    $('li.delivery_and_invoice_section').removeClass('active');
    $('li.payment_section').removeClass('active');
  });
}

function delivery_and_invoice_section_click() {
  $('.delivery_and_invoice_section').addClass('section-clickable');
  $('.delivery_and_invoice_section').off('click').on('click', function() {
    start_checkout('delivery_and_contact_info');
    $('div.payment').slideUp("fast");
    $('li.payment_section').removeClass('active');
  });
}

function start_checkout(action) {
  $(".fancybox").fancybox();
  if (!action || action == 'font_and_text') {
    $.get("/gravsten/font_and_text", function(data) {
      load_font_and_text(data);
    });
  }

  if (action == 'delivery_and_contact_info') {
    $.get("/gravsten/delivery_and_contact_info", function(data) {
      load_delivery_and_invoice(data);
    });
  }

  if (action == 'payment') {
    $.get("/gravsten/payment", function(data) {
      load_payment(data);
    });
  }
}

function validateEmail(email) {
  var re = /^\S+@\S+\.\S+$/;
  return re.test(email);
}

function validatePhone(phone) {
  var re = /^\+{0,1}\d{8,20}$/
  return re.test(phone);
}


$(document).ready(function() {

  $('.product_form').on('submit', function() {
    if($('select#variant', this).length > 0)
      if (!$('select#variant', this)[0].value) {
        $('.error_missing_variant', this).show();
        return false;
      }
  });

  $('#call_me_form').on('submit', function() {
    if ($('#phone').val() == '') {
      $('#phone_error').html('Du skal udfylde dit telefonnummer i feltet.');
      return false;
    } else if ($('#phone').val().length < 8) {
      $('#phone_error').html('Dit telefonnummer er ikke udfyldt korrekt.');
      return false;
    }
  });
});