function createStore(reducer) {
    let state = reducer(undefined, {})
    let cbs = []
    return {
        dispatch(action) {
            const newState = reducer(state, action)
            if (newState !== state) {
                state = newState
                for (let cb of cbs)
                    cb()
            }
        },
        getState() {
            return state
        },
        subscribe(cb) {
            cbs.push(cb)
            return () => cbs = cbs.filter(c => c !== cb)
        }
    }
}

function reducer(state, { type, ШО, СКОКА, КАССА, БАБЛО }) {
    if (!state) {
        return {
            пиво: {
                количество: 100,
                цена: 22.5
            },
            чипсы: {
                количество: 100,
                цена: 24.5
            },
            сиги: {
                количество: 100,
                цена: 62
            },
            касса: 0
        }
    }

    if (type === 'КУПИТЬ') {

        if ((state[ШО].количество - СКОКА) < 0 || БАБЛО.value < (СКОКА * state[ШО].цена)) {
            if (БАБЛО.value < (СКОКА * state[ШО].цена) && СКОКА < state[ШО].количество) {
                alert("Нехватает бабок")
            } else if (СКОКА > state[ШО].количество && state[ШО].количество !== 0) {
                alert("Нет в наличии такого количества")
            } else {
                alert("Товар закончился")
            }
            return {
                ...state,
                [ШО]: state[ШО],
                [КАССА]: state[КАССА]
            }
        } else {
            БАБЛО.value = БАБЛО.value - (state[ШО].цена * СКОКА)
            return {
                ...state,
                [ШО]: {
                    количество: state[ШО].количество - СКОКА,
                    цена: state[ШО].цена
                },
                [КАССА]: state[КАССА] + (state[ШО].цена * СКОКА)
            }
        }
    }
    return state
}

const store = createStore(reducer)
const showcase = store.subscribe(() => {
    showState(store.getState());
})


const купи = (СКОКА, БАБЛО) => ({ type: 'КУПИТЬ', ШО: shopWindow.value, КАССА: "касса", СКОКА, БАБЛО })

let showState = (obj, product = shopWindow.value, productImg) => {
    if (product === "пиво") {
        parent = beer;
        productImg = "img/beer.png";
    } else if (product === "чипсы") {
        parent = chips;
        productImg = "img/chips.png";
    } else {
        parent = cigarettes;
        productImg = "img/cigarettes.png";
    }

    while (parent.firstChild) {
        parent.firstChild.remove()
    }

    if (obj[product].количество > 0) {
        for (let i = 0; i < obj[product].количество; i++) {
            let img = document.createElement("img");
            img.style.width = "35px";
            img.style.borderBottom = "1px solid #000"
            img.src = productImg;
            parent.append(img)
        }
    } else {
        let h2 = document.createElement("h2");
        h2.style.fontSize = "28px"
        h2.innerText = "ЗАКОНЧИЛОСЬ";
        parent.append(h2)
    }

    cashbox.innerText = `КАССА: ${obj.касса} грн`
}

let shopWindow = document.createElement("select")
shopWindow.style.height = "21.5px";

let cashbox = document.createElement("div");
cashbox.innerText = `КАССА: 0 грн`;
shopSeller.append(cashbox);

for (let key in store.getState()) {
    if (key !== "касса") {
        let option = document.createElement("option");
        option.value = key;
        option.innerText = key;
        shopWindow.append(option)

        let div = document.createElement("div");
        div.innerText = `${key} по ${store.getState()[key].цена} грн`
        shopSeller.append(div)
    }
}
shopSeller.append(shopWindow);

let input = document.createElement("input");
input.type = "number";
input.placeholder = "СКОКА ПОКУПАЕМ";
let cash = document.createElement("input");
cash.type = "number";
cash.placeholder = "МОЕ БАБЛО";
shopSeller.append(input)
shopSeller.append(cash)
let btn = document.createElement("input");
btn.type = "button";
btn.value = "Купить"
shopSeller.append(btn)

btn.onclick = () => {
    store.dispatch(купи(input.value, cash))
}

showState(store.getState(), "пиво")
showState(store.getState(), "чипсы")
showState(store.getState(), "сиги")
