CODEWITHSUNDEEP
javascriptshopifyliquid
Liam
Liam

Reputation: 13

Shopify estimated delivery

I am looking to show an estimated delivery date on the product page for each delivery option we have. I have read through the code in Shopify Variants by Steph Sharp which would work brilliantly except we would need it to be fixed to the current day up until 3pm and then switch to the next working day after 3pm. (Basically taking away the option for the customer to choose the dispatch day.)

I can’t quite get it to work by butchering this code into our template. This is what I have butchered together which seems to work okay but rather than have MON, TUE, WED, … I want to set them as the future dates. Any advice?

EDIT: Also I heard Palec is after using a timer code with this code too. So I will add that in.

<script language="JavaScript">
function day(a) {
    var date = new Date();

    var days = ["Mon","Tue","Wed","Thur","Fri","Mon","Tue","Wed","Thur","Fri","Mon","Tue","Wed","Thur","Fri"];

    var today = date.getDay();

    if (today == 1) today = 0; //Monday
    if (today == 2) today = 1; //Tuesday
    if (today == 3) today = 2; //Wednesday
    if (today == 4) today = 4; //Thursday
    if (today == 5) today = 5; //Friday
    if (today == 6) today = -1; //Saturday Moved To Monday
    if (today == 0) today = -1; //Sunday Moved To Monday

    h = date.getHours();
    if (h <= 9) h = "0" + h;
    time = h;

    if (time > 15) today++;

    var expected = today + a;

    var main = days[expected];

    document.write('STANDARD DELIVERY ESTIMATE:  ');
    document.write(main);
}
</script>

<body>
<script language="JavaScript">
day(1)
</script>

Upvotes: 0

Views: 2564

Answers (2)

Liam
Liam

Reputation: 13

This is my final code, based on Steph Sharp’s answer.

function day(a) {
    var date = new Date();
    var hours = date.getHours();

    // If after 3pm, add 1 day
    if (hours >= 15) a++;

    var expectedDeliveryDate = addWeekdays(date, a);
    document.write(expectedDeliveryDate.toDateString() + ' with Standard Delivery');
}

function addWeekdays(fromDate, days) {
    var count = 0;
    while (count < days) {
        fromDate.setDate(fromDate.getDate() + 1);
        if (fromDate.getDay() != 0 && fromDate.getDay() != 6) // Skip weekends
            count++;
    }
    return fromDate;
}

Also added a timer:

function ShowTime() {
    var now = new Date();
    var hrs = 15 - now.getHours();
    if (hrs < 0) hrs += 24;
    var mins = 60 - now.getMinutes();
    var secs = 60 - now.getSeconds();
    timeLeft = "" + hrs + ' hours ' + mins + ' minutes ' + secs + ' seconds';
    $("#countdown").html(timeLeft);
}

var countdown = setInterval(ShowTime, 1000);
function StopTime() {
    clearInterval(countdown);
}

Upvotes: 0

Steph Sharp
Steph Sharp

Reputation: 11682

I would try something like this:

function day(a) {
    var date = new Date();
    var hours = date.getHours();

    // If after 3pm, add 1 day
    if(hours > 15) a++;

    var expectedDeliveryDate = addWeekdays(date, a);
    document.write(expectedDeliveryDate.toDateString() + ' with Standard Delivery');
}

function addWeekdays(fromDate, days) {
    var count = 0;
    while (count < days) {
        fromDate.setDate(fromDate.getDate() + 1);
        if (fromDate.getDay() != 0 && fromDate.getDay() != 6) // Skip weekends
            count++;
    }
    return fromDate;
}

(The code in the addWeekdays function is from this answer on Stack Overflow.)

This code just displays the day name (like the code in your question), but you can format expectedDeliveryDate however you want.

EDIT: I updated my code to use expectedDeliveryDate.toDateString() as specified in the comments. Note that you no longer need the days array or expectedDeliveryDay variable. (You've still got them in your answer but they're not being used.)

Upvotes: 1

Related Questions