const DS_EL = {
    cell: '.calendar__cell_cnt',
    dateSelection: '.date-selection',
    loader: '.rapid-loader',
    title: '.delivery-btn .title',
    subtitle: '.delivery-btn .subtitle',
    infoIcon: '.rapid-info-icon',
    image: '.delivery-btn__image',
};

const DS_CLASSES = {
    selectedCell: 'calendar__cell_selected',
    isSelected: 'date-selection_selected',
    rapidCell: 'calendar__cell_rapid',
    hidden: 'd-none',
};

let rapidLoaderShown = false;
let isDateSelected = false;

function generateRapidEstimate() {
    const scenario = Math.floor(Math.random() * 4);

    switch (scenario) {
        case 0: {
            const mins = Math.floor(Math.random() * 59) + 1;
            const padded = String(mins).padStart(2, '0');
            const word = mins === 1 ? 'minute' : 'minutes';
            return `Delivered in as little as <br>${padded} ${word} for &pound;10.00`;
        }
        case 1: {
            const mins = Math.floor(Math.random() * 60);
            const padded = String(mins).padStart(2, '0');
            const word = mins === 1 ? 'minute' : 'minutes';
            const minutePart = mins === 0 ? '00 minutes' : `${padded} ${word}`;
            return `Delivered in as little as <br>1 hour ${minutePart} for &pound;10.00`;
        }
        case 2: {
            const mins = Math.floor(Math.random() * 60);
            const padded = String(mins).padStart(2, '0');
            const word = mins === 1 ? 'minute' : 'minutes';
            const minutePart = mins === 0 ? '00 minutes' : `${padded} ${word}`;
            return `Delivered in as little as <br>2 hours ${minutePart} for &pound;10.00`;
        }
        default:
            return null;
    }
}

function updateDeliveryInfo() {
    const $subtitle = $(DS_EL.subtitle);
    const $infoIcon = $subtitle.find(DS_EL.infoIcon).detach();
    const estimate = generateRapidEstimate();

    if (estimate) {
        $subtitle.html(estimate);
        $infoIcon.removeClass(DS_CLASSES.hidden);
    } else {
        $subtitle.html('Delivery within 3 hours for <b>&pound;10.00');
        $infoIcon.addClass(DS_CLASSES.hidden);
    }

    $subtitle.append($infoIcon);
    $infoIcon.filter('[data-toggle="tooltip"]').tooltip();
}

function showRapidLoader() {
    const $self = $(DS_EL.dateSelection);
    const $loader = $(DS_EL.loader);
    $loader.removeClass(DS_CLASSES.hidden);

    setTimeout(() => {
        $loader.addClass(DS_CLASSES.hidden);
        $self.addClass(DS_CLASSES.isSelected);
        updateRapidInfo();
    }, 3000);
}

function updateNonRapidInfo() {
    const $title = $(DS_EL.title);
    const $subtitle = $(DS_EL.subtitle);
    const $infoIcon = $subtitle.find(DS_EL.infoIcon).detach();
    const $image = $(DS_EL.image);

    $title.text('Next or Named day delivery');
    $subtitle.html('Delivery between 7am - 7pm for &pound;12.00');
    $infoIcon.addClass(DS_CLASSES.hidden);
    $subtitle.append($infoIcon);
    $image.addClass(DS_CLASSES.hidden);
}

function updateRapidInfo() {
    const $title = $(DS_EL.title);
    const $image = $(DS_EL.image);

    $title.text('Rapid delivery');
    $image.removeClass(DS_CLASSES.hidden);
    updateDeliveryInfo();
}

function selectTimeSlot(e) {
    const $self = $(DS_EL.dateSelection);
    const $cell = $(e.target).closest(DS_EL.cell);
    const isRapid = $cell.hasClass(DS_CLASSES.rapidCell);

    $(DS_EL.cell).removeClass(DS_CLASSES.selectedCell);
    $cell.addClass(DS_CLASSES.selectedCell);
    $self.trigger('selected');
    isDateSelected = true;

    if (isRapid) {
        if (!rapidLoaderShown) {
            rapidLoaderShown = true;
            showRapidLoader();
            return;
        } else {
            $self.addClass(DS_CLASSES.isSelected);
            updateRapidInfo();
        }
    } else {
        $self.addClass(DS_CLASSES.isSelected);
        updateNonRapidInfo();
    }
}

function initDateSelection() {
    const $self = $(DS_EL.dateSelection);

    if (!$self.length) {
        return;
    }

    $self.on('click', DS_EL.cell, selectTimeSlot);
}

var Wick = window.Wick || {};

Wick.DateSelection = {
    isDateSelected: () => isDateSelected,
};

$(document).ready(function () {
    initDateSelection();
});
