web2019/static/js/shop/utils.js

'use strict';
import {v4 as uuidv4} from "uuid";


export const data = window.shop_data;
export const itemsUnfoldedList = Array.from(data.columns.backlog.categories.map(groupId => groupId.itemIds).flat());

export const copy = (
    model,
    source,
    destination,
    draggableSource,
    droppableDestination
) => {
    const destClone = Array.from(destination.items);

    destClone.splice(droppableDestination.index, 0, ...draggableSource.map((dragged_item, _) => {
        return {
            ...model[dragged_item],
            id: uuidv4(),
        }
    }));

    return destClone;
};

export const reorder = (list, startIndex, endIndex) => {
    const result = Array.from(list);
    const [removed] = result.splice(startIndex, 1);
    result.splice(endIndex, 0, removed);

    return result;
};

export const remove = (list, startIndex) => {
    const result = Array.from(list);
    result.splice(startIndex, 1);
    return result;
};

export const productStyle = (style, snapshot, removeAnim, hovered, selected, cart=false) => {
    const custom = {
        opacity: snapshot.isDragging ? .7 : 1,
        backgroundColor: (hovered || selected) ? '#eae7f7' : 'initial',
    };

    if (!cart && snapshot.draggingOver == null && // hack for backlog
        ((!snapshot.isDragging) // prevent next elements from animation
            || (snapshot.isDragging && snapshot.isDropAnimating))) { // prevent dragged element from weird animation
        style.transform = "none";
    }

    if (!snapshot.isDropAnimating) {
        return { ...style, ...custom};
    }

    if (removeAnim) {
        // cannot be 0, but make it super tiny
        custom.transitionDuration = '0.001s';
    }

    return {
        ...style,
        ...custom,
    };
}

export const cartStyle = (style, snapshot) => {
    const isDraggingOver = snapshot.isDraggingOver;
    return {
        ...style,
        ...{
            backgroundColor: isDraggingOver ? '#f2f2f2' : '#f9f9f9',
            border: isDraggingOver ? '1px dashed #ccc' : '0',
        },
    };
}


export const nbrOccupiedSlotsInCrate = (items) => {
    return items.reduce((prev, next) => {
        return prev + (next.hp === 8 ? 2 : 1);
    }, 0);
};

export function formatMoney(amount, decimalCount = 2, decimal = ".", thousands = ",") {
    // https://stackoverflow.com/questions/149055/how-can-i-format-numbers-as-currency-string-in-javascript
    // changes: return amount if error in order to avoid empty value
    try {
        decimalCount = Math.abs(decimalCount);
        decimalCount = isNaN(decimalCount) ? 2 : decimalCount;

        const negativeSign = amount < 0 ? "-" : "";

        let i = parseInt(amount = Math.abs(Number(amount) || 0).toFixed(decimalCount)).toString();
        let j = (i.length > 3) ? i.length % 3 : 0;

        return negativeSign + (j ? i.substr(0, j) + thousands : '') + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + thousands) + (decimalCount ? decimal + Math.abs(amount - i).toFixed(decimalCount).slice(2) : "");
    } catch (e) {
        return amount;
    }
};