<?php
/**
 * Webkul Software.
 *
 * @category  Webkul
 * @package   Webkul_MpBuyerSellerChat
 * @author    Webkul
 * @copyright Copyright (c)  Webkul Software Private Limited (https://webkul.com)
 * @license   https://store.webkul.com/license.html
 */
?>

<script>
    window.chatboxConfig = <?= /* @noEscape */ \Zend_Json::encode($block->getChatBoxConfig()); ?>;
</script>
<?= /* @noEscape */ $block->getChildHtml('style_template'); ?>
<div id="chatbox-component" class="chatbox-component" data-bind="scope:'chatbox-content'" class="field">
    <!-- ko template: getTemplate() --><!-- /ko -->
    <script type="text/x-magento-init">
    {
        "#chatbox-component": {
            "Magento_Ui/js/core/app":  <?= /* @noEscape */ $block->getJsLayout();?>
        }
    }
    </script>
    <?= /* @noEscape */ $block->getChildHtml('reply_template'); ?>
    <audio controls="controls" class="wk_sound_play hide" id="myAudio" style="display: none;">
        <source src="<?= /* @noEscape */
        $block->getViewFileUrl('Webkul_MpBuyerSellerChat::images/sound/notify.ogg'); ?>" 
        type="audio/ogg">
    </audio>
</div>
<script id="notification-template" type="text/x-magento-template">
    <div class="chat-message-admin chat-message-notification">
        <div class="msg_notification" id="<%- data.customerId %>">
            <div class="wk_msgLogo">
                <img src="<%- data.image %>">
            </div>
            <div class="wk_msgdetails">
                <div class="wk_userName"><%- data.customerName %></div>
                <div class="wk_userMsg"><%- data.message %></div>
                <div class="wk_userLink">
                    <span class="wk_msgClose">
                        <i class="fa fa-times-circle"></i>
                    </span>
                </div>
            </div>
        </div>
    </div>
</script>