| @@ -35,6 +35,10 @@ $(document).ready(function() { | |||
| $("[name='shippingMethodId']").on('change', () => { | |||
| changeDelivery(fp); | |||
| }); | |||
| /* Set first selectable day selected */ | |||
| setDateSelected(); | |||
| changeDelivery(fp); | |||
| } | |||
| @@ -63,7 +67,7 @@ $(document).ready(function() { | |||
| var hash = this.hash; | |||
| var sTop = parseInt($(hash).offset().top - $(".header-inner").outerHeight() - 12); | |||
| scrollTo(sTop, 800); | |||
| scrollToPos(sTop, 800); | |||
| window.location.hash = hash; | |||
| } // End if | |||
| }); | |||
| @@ -72,7 +76,7 @@ $(document).ready(function() { | |||
| // c = element or pixel position | |||
| // e = duration | |||
| // d = (optative) ease function. Default easeOutCuaic | |||
| function scrollTo(c,e,d){d||(d=easeOutCuaic);var a=document.documentElement;if(0===a.scrollTop){var b=a.scrollTop;++a.scrollTop;a=b+1===a.scrollTop--?a:document.body}b=a.scrollTop;0>=e||("object"===typeof b&&(b=b.offsetTop),"object"===typeof c&&(c=c.offsetTop),function(a,b,c,f,d,e,h){function g(){0>f||1<f||0>=d?a.scrollTop=c:(a.scrollTop=b-(b-c)*h(f),f+=d*e,setTimeout(g,e))}g()}(a,b,c,0,1/e,20,d))}; | |||
| function scrollToPos(c,e,d){d||(d=easeOutCuaic);var a=document.documentElement;if(0===a.scrollTop){var b=a.scrollTop;++a.scrollTop;a=b+1===a.scrollTop--?a:document.body}b=a.scrollTop;0>=e||("object"===typeof b&&(b=b.offsetTop),"object"===typeof c&&(c=c.offsetTop),function(a,b,c,f,d,e,h){function g(){0>f||1<f||0>=d?a.scrollTop=c:(a.scrollTop=b-(b-c)*h(f),f+=d*e,setTimeout(g,e))}g()}(a,b,c,0,1/e,20,d))}; | |||
| function easeOutCuaic(t){ | |||
| t--; | |||
| return t*t*t+1; | |||
| @@ -86,7 +90,32 @@ function manipulateDateInputValue() { | |||
| } | |||
| } | |||
| function setDateSelected() { | |||
| let spwnFirstSelectableDay = $(".flatpickr-day:not(.flatpickr-disabled)").first().text(); | |||
| let spwnFPdate = new Date(); | |||
| let spwnDay = spwnFPdate.getDate(); | |||
| let spwnMonth = spwnFPdate.getMonth(); | |||
| let spwnMonthTemp = 0; | |||
| spwnMonth = spwnMonth + 1; | |||
| if((String(spwnMonth)).length === 1) { | |||
| spwnMonthTemp = spwnMonth; | |||
| spwnMonth = '0' + spwnMonth; | |||
| } | |||
| if (spwnFirstSelectableDay < spwnDay) { | |||
| spwnMonth = spwnMonthTemp + 1; | |||
| if((String(spwnMonth)).length === 1) { | |||
| spwnMonth = '0' + spwnMonth; | |||
| } | |||
| } | |||
| let spwnFrmattedDate = spwnFPdate.getFullYear() + '/' + spwnMonth + '/' + spwnFirstSelectableDay; | |||
| fp.setDate(new Date(spwnFrmattedDate)); | |||
| spawnDateInputValue = spwnFirstSelectableDay + '.' + spwnMonth + '.' + spwnFPdate.getFullYear(); | |||
| } | |||
| function changeDelivery(fp) { | |||
| $("body").on("click", "#spwn-delivery .spwn-delivery--time span", function() { | |||
| $("#spwn-delivery .spwn-delivery--time span").removeClass("active"); | |||
| $(this).addClass("active"); | |||
| @@ -115,16 +144,18 @@ function changeDelivery(fp) { | |||
| } | |||
| setIncludedDays("evening", fp, daysToAdd); | |||
| $("#spwn-delivery p").text("Abendzustellung gewählt. Bitte wählen Sie nun eine Wunsch-Zeit:"); | |||
| $("#spwn-delivery .spwn-delivery--time").append("<span class='active'>18 - 21 Uhr</span><span>20 - 23 Uhr</span>"); | |||
| $("#spwn-delivery .spwn-delivery--time").append("<span class='active'>18 - 20 Uhr</span><span>19 - 21 Uhr</span><span>20 - 22 Uhr</span>"); | |||
| // If not date from DPD days | |||
| if (!$(".flatpickr-day").hasClass("selected")) { | |||
| setDateSelected(); | |||
| } | |||
| if ($(".flatpickr-day").hasClass("selected")) { | |||
| if (spawnDateInputValue === "" || spawnDateInputValue.indexOf("Uhr") === -1) { | |||
| manipulateDateInputValue(); | |||
| } | |||
| // If DPD date is not in Abendzustellung range | |||
| } else { | |||
| $(".confirm-delivery-date #dtgs-datepicker-inputfield").val(""); | |||
| spawnDateInputValue = ""; | |||
| setDateSelected(); | |||
| } | |||
| } else { | |||
| // DPD | |||
| @@ -142,8 +173,7 @@ function changeDelivery(fp) { | |||
| $("#spwn-delivery p").text("DPD gewählt. Die Zustellung erfolgt zwischen 7 und 13 Uhr."); | |||
| if (!$(".flatpickr-day").hasClass("selected")) { | |||
| // If Abendzustellung date is not in DPD range | |||
| $(".confirm-delivery-date #dtgs-datepicker-inputfield").val(""); | |||
| spawnDateInputValue = ""; | |||
| setDateSelected(); | |||
| } | |||
| } | |||
| } else { | |||
| @@ -157,8 +187,7 @@ function changeDelivery(fp) { | |||
| $("#spwn-delivery p").text("DPD gewählt. Die Zustellung erfolgt zwischen 7 und 18 Uhr."); | |||
| if (!$(".flatpickr-day").hasClass("selected")) { | |||
| // If Abendzustellung or DPD DE date is not in DPD AT range | |||
| $(".confirm-delivery-date #dtgs-datepicker-inputfield").val(""); | |||
| spawnDateInputValue = ""; | |||
| setDateSelected(); | |||
| } | |||
| } | |||
| } | |||
| @@ -177,3 +177,8 @@ input.custom-number[type=number] { | |||
| } | |||
| } | |||
| } | |||
| .confirm-delivery-date.do-not-show, | |||
| #spwn-delivery { | |||
| display: none !important; | |||
| } | |||
| @@ -0,0 +1,33 @@ | |||
| {% set totalWeight = 0 %} | |||
| {% for lineItem in page.cart.lineItems %} | |||
| {% if lineItem.deliveryInformation.weight != null %} | |||
| {% set totalWeight = totalWeight + (lineItem.quantity * lineItem.deliveryInformation.weight) %} | |||
| {% endif %} | |||
| {% endfor %} | |||
| {% block page_checkout_confirm_delivery_date %} | |||
| {% if page.extensions.DeliveryDateConfig.data.deliveryDateActive %} | |||
| <div class="confirm-delivery-date{% if totalWeight < 0.5 %} do-not-show{% endif %}"> | |||
| <div class="row"> | |||
| <div class="col-sm-12"> | |||
| <div class="card checkout-card"> | |||
| <div class="card-body"> | |||
| <div class="card-title"> | |||
| {{ "dtgs-delivery-date.confirmDatePanelHeader"|trans }} | |||
| </div> | |||
| <p> | |||
| {{ "dtgs-delivery-date.confirmDatePanelText"|trans }} | |||
| </p> | |||
| <input | |||
| type="text" | |||
| id="dtgs-datepicker-inputfield" | |||
| class="form-control dtgs-datepicker-input{% if formViolations.getViolations('deliverydate') is not empty %} is-invalid{% endif %}" | |||
| form="confirmOrderForm" | |||
| {% if page.extensions.DeliveryDateConfig.data.deliveryDateRequired %}required="required"{% endif %} | |||
| {% if page.extensions.DeliveryDateConfig.data.deliveryDateInSession is not empty %}value="{{ page.extensions.DeliveryDateConfig.data.deliveryDateInSession }}"{% endif %} /> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| {% endif %} | |||
| {% endblock %} | |||
| @@ -35,6 +35,10 @@ $(document).ready(function() { | |||
| $("[name='shippingMethodId']").on('change', () => { | |||
| changeDelivery(fp); | |||
| }); | |||
| /* Set first selectable day selected */ | |||
| setDateSelected(); | |||
| changeDelivery(fp); | |||
| } | |||
| @@ -63,7 +67,7 @@ $(document).ready(function() { | |||
| var hash = this.hash; | |||
| var sTop = parseInt($(hash).offset().top - $(".header-inner").outerHeight() - 12); | |||
| scrollTo(sTop, 800); | |||
| scrollToPos(sTop, 800); | |||
| window.location.hash = hash; | |||
| } // End if | |||
| }); | |||
| @@ -72,7 +76,7 @@ $(document).ready(function() { | |||
| // c = element or pixel position | |||
| // e = duration | |||
| // d = (optative) ease function. Default easeOutCuaic | |||
| function scrollTo(c,e,d){d||(d=easeOutCuaic);var a=document.documentElement;if(0===a.scrollTop){var b=a.scrollTop;++a.scrollTop;a=b+1===a.scrollTop--?a:document.body}b=a.scrollTop;0>=e||("object"===typeof b&&(b=b.offsetTop),"object"===typeof c&&(c=c.offsetTop),function(a,b,c,f,d,e,h){function g(){0>f||1<f||0>=d?a.scrollTop=c:(a.scrollTop=b-(b-c)*h(f),f+=d*e,setTimeout(g,e))}g()}(a,b,c,0,1/e,20,d))}; | |||
| function scrollToPos(c,e,d){d||(d=easeOutCuaic);var a=document.documentElement;if(0===a.scrollTop){var b=a.scrollTop;++a.scrollTop;a=b+1===a.scrollTop--?a:document.body}b=a.scrollTop;0>=e||("object"===typeof b&&(b=b.offsetTop),"object"===typeof c&&(c=c.offsetTop),function(a,b,c,f,d,e,h){function g(){0>f||1<f||0>=d?a.scrollTop=c:(a.scrollTop=b-(b-c)*h(f),f+=d*e,setTimeout(g,e))}g()}(a,b,c,0,1/e,20,d))}; | |||
| function easeOutCuaic(t){ | |||
| t--; | |||
| return t*t*t+1; | |||
| @@ -86,7 +90,32 @@ function manipulateDateInputValue() { | |||
| } | |||
| } | |||
| function setDateSelected() { | |||
| let spwnFirstSelectableDay = $(".flatpickr-day:not(.flatpickr-disabled)").first().text(); | |||
| let spwnFPdate = new Date(); | |||
| let spwnDay = spwnFPdate.getDate(); | |||
| let spwnMonth = spwnFPdate.getMonth(); | |||
| let spwnMonthTemp = 0; | |||
| spwnMonth = spwnMonth + 1; | |||
| if((String(spwnMonth)).length === 1) { | |||
| spwnMonthTemp = spwnMonth; | |||
| spwnMonth = '0' + spwnMonth; | |||
| } | |||
| if (spwnFirstSelectableDay < spwnDay) { | |||
| spwnMonth = spwnMonthTemp + 1; | |||
| if((String(spwnMonth)).length === 1) { | |||
| spwnMonth = '0' + spwnMonth; | |||
| } | |||
| } | |||
| let spwnFrmattedDate = spwnFPdate.getFullYear() + '/' + spwnMonth + '/' + spwnFirstSelectableDay; | |||
| fp.setDate(new Date(spwnFrmattedDate)); | |||
| spawnDateInputValue = spwnFirstSelectableDay + '.' + spwnMonth + '.' + spwnFPdate.getFullYear(); | |||
| } | |||
| function changeDelivery(fp) { | |||
| $("body").on("click", "#spwn-delivery .spwn-delivery--time span", function() { | |||
| $("#spwn-delivery .spwn-delivery--time span").removeClass("active"); | |||
| $(this).addClass("active"); | |||
| @@ -115,16 +144,18 @@ function changeDelivery(fp) { | |||
| } | |||
| setIncludedDays("evening", fp, daysToAdd); | |||
| $("#spwn-delivery p").text("Abendzustellung gewählt. Bitte wählen Sie nun eine Wunsch-Zeit:"); | |||
| $("#spwn-delivery .spwn-delivery--time").append("<span class='active'>18 - 21 Uhr</span><span>20 - 23 Uhr</span>"); | |||
| $("#spwn-delivery .spwn-delivery--time").append("<span class='active'>18 - 20 Uhr</span><span>19 - 21 Uhr</span><span>20 - 22 Uhr</span>"); | |||
| // If not date from DPD days | |||
| if (!$(".flatpickr-day").hasClass("selected")) { | |||
| setDateSelected(); | |||
| } | |||
| if ($(".flatpickr-day").hasClass("selected")) { | |||
| if (spawnDateInputValue === "" || spawnDateInputValue.indexOf("Uhr") === -1) { | |||
| manipulateDateInputValue(); | |||
| } | |||
| // If DPD date is not in Abendzustellung range | |||
| } else { | |||
| $(".confirm-delivery-date #dtgs-datepicker-inputfield").val(""); | |||
| spawnDateInputValue = ""; | |||
| setDateSelected(); | |||
| } | |||
| } else { | |||
| // DPD | |||
| @@ -142,8 +173,7 @@ function changeDelivery(fp) { | |||
| $("#spwn-delivery p").text("DPD gewählt. Die Zustellung erfolgt zwischen 7 und 13 Uhr."); | |||
| if (!$(".flatpickr-day").hasClass("selected")) { | |||
| // If Abendzustellung date is not in DPD range | |||
| $(".confirm-delivery-date #dtgs-datepicker-inputfield").val(""); | |||
| spawnDateInputValue = ""; | |||
| setDateSelected(); | |||
| } | |||
| } | |||
| } else { | |||
| @@ -157,8 +187,7 @@ function changeDelivery(fp) { | |||
| $("#spwn-delivery p").text("DPD gewählt. Die Zustellung erfolgt zwischen 7 und 18 Uhr."); | |||
| if (!$(".flatpickr-day").hasClass("selected")) { | |||
| // If Abendzustellung or DPD DE date is not in DPD AT range | |||
| $(".confirm-delivery-date #dtgs-datepicker-inputfield").val(""); | |||
| spawnDateInputValue = ""; | |||
| setDateSelected(); | |||
| } | |||
| } | |||
| } | |||
| @@ -165,3 +165,8 @@ input.custom-number[type=number] { | |||
| } | |||
| } | |||
| } | |||
| .confirm-delivery-date.do-not-show, | |||
| #spwn-delivery { | |||
| display: none !important; | |||
| } | |||
| @@ -79,6 +79,7 @@ | |||
| border-bottom: 1px solid #86b04b; | |||
| } | |||
| .product-detail-name { | |||
| font-weight: bold; | |||
| color: $sw-color-brand-secondary; | |||
| line-height: 40px !important; | |||
| } | |||
| @@ -0,0 +1,33 @@ | |||
| {% set totalWeight = 0 %} | |||
| {% for lineItem in page.cart.lineItems %} | |||
| {% if lineItem.deliveryInformation.weight != null %} | |||
| {% set totalWeight = totalWeight + (lineItem.quantity * lineItem.deliveryInformation.weight) %} | |||
| {% endif %} | |||
| {% endfor %} | |||
| {% block page_checkout_confirm_delivery_date %} | |||
| {% if page.extensions.DeliveryDateConfig.data.deliveryDateActive %} | |||
| <div class="confirm-delivery-date{% if totalWeight < 0.5 %} do-not-show{% endif %}"> | |||
| <div class="row"> | |||
| <div class="col-sm-12"> | |||
| <div class="card checkout-card"> | |||
| <div class="card-body"> | |||
| <div class="card-title"> | |||
| {{ "dtgs-delivery-date.confirmDatePanelHeader"|trans }} | |||
| </div> | |||
| <p> | |||
| {{ "dtgs-delivery-date.confirmDatePanelText"|trans }} | |||
| </p> | |||
| <input | |||
| type="text" | |||
| id="dtgs-datepicker-inputfield" | |||
| class="form-control dtgs-datepicker-input{% if formViolations.getViolations('deliverydate') is not empty %} is-invalid{% endif %}" | |||
| form="confirmOrderForm" | |||
| {% if page.extensions.DeliveryDateConfig.data.deliveryDateRequired %}required="required"{% endif %} | |||
| {% if page.extensions.DeliveryDateConfig.data.deliveryDateInSession is not empty %}value="{{ page.extensions.DeliveryDateConfig.data.deliveryDateInSession }}"{% endif %} /> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| {% endif %} | |||
| {% endblock %} | |||