Skip to main content

Vanilla JS

<html>
    <head>
        <title>Embedded Chat Example</title>
        <style>
            .chat-component {
                width: 500px;
                height: 500px;
            }
        </style>
        <script src="https://cdn.jsdelivr.net/npm/@halosight-public/halosight-embedding-helper@latest/dist/index.min.js"></script>
    </head>

    <body>
        <div class="chat-component" id="halosight-chat"></div>

        <script>
            const halosight = new HalosightEmbed({
                targetElementId: 'halosight-chat',
                agentId: 'YOUR_AGENT_ID',
                type: 'chat',
            })
                .onRegister(() => {
                    // Customize the UI
                    halosight.insertUiAttributes({
                        title: 'My Cool Chat',
                    });
                    // Insert agent arguments
                    halosight.insertAgentArguments({
                        accountId: 'YOUR_ACCOUNT_ID',
                    });
                })
                .onSendEmail((event, response) => {
                    console.log('Email Event', event);

                    // Simulate sending the email.
                    // NOTE: Halosight does not send the email on your behalf.
                    // Halosight will return an email event that you can use
                    // to send the email. You can respond back to let
                    // Halosight know if the request was successful by
                    // using response.success() or response.error().
                    setTimeout(() => {
                        response.success();
                    }, 2000);
                });
        </script>
    </body>
</html>