import Vue from "vue";
import g11n from "./store/modules/g11n";
import checkout from "./store/modules/checkout";
import shopAddress from "./store/modules/shop-address";

import Cart from "./components/vue/cart/cart";
import ProductActions from "./components/vue/product/productActions";
import CartLink from "./components/vue/cart/cartLink";

import ShopAddresses from "./components/vue/Addresses";
import Order from "./components/vue/checkoutConfirmation/order";
import NameAndAddress from "./components/vue/checkoutConfirmation/nameAndAddress";

import PasswordPreview from "./components/vue/forms/password_preview";
import RegionSelect from "./components/vue/forms/regionSelect";
import SiteModule from "./store/modules/site";

export function boot(store) {
    store.registerModule('g11n', g11n);
    store.registerModule('checkout', checkout);
    store.unregisterModule('address'); //Unregisters the site users one.
    store.registerModule('address', shopAddress); //Registers the shop one, that "extends" the site users one
    store.registerModule('sites', SiteModule);
}

export function register(store) {
    if(document.querySelector('.js-confirmation-screen')) {
        new Vue({
            el: '.js-confirmation-screen',
            components: { Order, NameAndAddress },
            store,
            created() {
                this.$store.dispatch('g11n/translation/loadTranslations', [
                    { key: 'checkout' },
                    { key: 'shop/cart'},
                    { key: 'form'},
                    { key: 'address'}
                ]);
                this.$store.dispatch('checkout/loadCheckoutInformation');
                this.$store.dispatch('checkout/loadCheckoutUser');
            }
        });
    }

    if(document.querySelector('.js-shop-addresses')) {
        new Vue({
            el: '.js-shop-addresses',
            components: { ShopAddresses },
            store
        });
    }

    if (document.querySelector('.js-cart-container')) {
        new Vue({
            el: '.js-cart-container',
            components: {'cart': Cart},
            store,
        });
    }
    if (document.querySelector('.js-product')) {
        new Vue({
            el: '.js-product',
            components: {'productActions': ProductActions},
            store,
        });
    }

    if (document.querySelector('.js-cart-link-container')) {
        new Vue({
            el: '.js-cart-link-container',
            components: {'cartLink': CartLink},
            store,
        });
    }

    if(document.querySelector('.js-account-data')) {
        new Vue({
            el: '.js-account-data',
            components: { PasswordPreview, RegionSelect },
            store,
            created() {
                this.$store.dispatch('g11n/translation/loadTranslations', [
                    { key: 'form.show' },
                    { key: 'form.hide' },
                ]);
            }
        });
    }

    if(document.querySelector('.js-register-form')) {
        new Vue({
            el: '.js-register-form',
            components: { PasswordPreview },
            store,
            created() {
                this.$store.dispatch('g11n/translation/loadTranslations', [
                    { key: 'form.show' },
                    { key: 'form.hide' },
                ]);
            }
        });
    }
}