(() => {
    const Yoti = window.Yoti = window.Yoti || { AI: {}, AV: {}, Capture: {} };

    Yoti.AI.URL = 'https://api.provemyage.com';
    Yoti.AI.UI = '/yoti-ai';

    Yoti.Capture = Yoti.Capture || {};
    Yoti.Age = Yoti.Age || {};

    Yoti.Age.Context = 'age';
    Yoti.Capture.Context = 'capture';

    const loadIframe = (elm, context) => {
        return new Promise((resolve) => {
            const iframe = document.createElement('iframe');

            iframe.onload = () => {
                resolve();
            };
            iframe.setAttribute('allow', 'camera');
            iframe.src = Yoti.AI.UI;

            if (elm instanceof Node) {
                elm.appendChild(iframe);
            } else {
                document.querySelector(elm).appendChild(iframe);
            }

            context.iframe = iframe;
        });
    };

    const messageBus = {
        send: (msg, context) => {
            const {
                iframe: {
                    contentWindow,
                },
            } = context;

            contentWindow.postMessage(JSON.stringify(msg), new URL(Yoti.AI.URL).origin);
        },

        receive: async (msg) => {
            const { type, context } = msg;
            Yoti.Capture.handleMessage(msg);

            switch (type) {
            case 'complete':
                if (context === 'capture') Yoti.Capture.complete(msg.data);
                if (context === 'age') Yoti.Age.complete(msg.data);
                break;
            default:
                break;
            }
        },

        init: (context) => {
            window.addEventListener('message', (message) => {
                if (message.origin === new URL(Yoti.AI.URL).origin) {
                    const data = JSON.parse(message.data);

                    if (data.context === context) messageBus.receive(data);
                }
            }, false);
        },
    };

    // Face capture
    Yoti.Capture.init = (elm) => {
        // listen for messages
        messageBus.init(Yoti.Capture.Context);

        // load the content
        loadIframe(elm, Yoti.Capture)
            .then(() => {
                const msg = {
                    type: 'ready',
                    context: Yoti.Capture.Context,
                    data: {
                        hostname: new URL(Yoti.AI.URL).origin,
                    },
                };

                // pass the client key to iframe
                messageBus.send(msg, Yoti.Capture);
            })
            .catch(err => console.error(err));
    };

    Yoti.Capture.handleMessage = () => {};
    Yoti.Capture.complete = data => console.log('capture completed', data);

    // Age verification
    // initialise
    Yoti.Age.init = () => {
        // listen for messages
        messageBus.init(Yoti.Age.Context);

        // load the content
        const [elm] = document.querySelectorAll('*[data-yoti-age-scenario-id]');

        loadIframe(elm, Yoti.Age)
            .then(() => {
                const msg = {
                    type: 'ready',
                    context: Yoti.Age.Context,
                    data: {
                        applicationId: elm.getAttribute('data-yoti-age-application-id'),
                        hostname: new URL(Yoti.AI.URL).origin,
                        scenarioId: elm.getAttribute('data-yoti-age-scenario-id'),
                    },
                };

                // pass the client data to iframe
                messageBus.send(msg, Yoti.Age);
            })
            .catch(err => console.error(err));
    };

    Yoti.Age.handleMessage = () => {};
    Yoti.Age.complete = (data) => {
        const { callback_url: url, token: encryptedToken } = data;

        const token = encodeURIComponent(encryptedToken);

        if (window.location.search) {
            const [, b = null] = url.split('?');
            window.location = `${url}${(b && b.length > 1) ? '&' : '?'}${window.location.search}&token=${token}`;
        } else {
            window.location = `${url}?token=${token}`;
        }
    };
})();