
<mvc:form id="support-chat-tab" servletRelativeAction="/support/sendMessage.action" cssClass="chat"
          data-initializer="support-chat" data-form="resource" data-action="send-message"
          data-disable-controls="sendChatMsg" data-custom-loader="">

    <script id="config:support-chat" type="application/json">
      {
        "initialMessage": "<mvc:message code="GWUA.aiSupportChat.initialMsg" />"
      }
    </script>

    <div class="chat-header">
        <i class="icon icon-user-circle chat__icon text-dark"></i>
        <input type="text" class="form-control" readonly value="<mvc:message code="GWUA.aiSupportChat.headline" />">
        <a href="#" class="icon icon-question-circle" data-help="help_${helplanguage}/support/AISupportChat.xml"></a>
    </div>

    <div class="chat-content js-scrollable">
        <%--  Updates by JS --%>
    </div>

    <div class="chat-footer">
        <input id="support-message" type="text" name="content" class="form-control form-control--lg" data-controls-group="sendChatMsg">
        <button type="button" class="btn btn-icon-lg btn-primary" data-form-submit-event data-controls-group="sendChatMsg">
            <i class="icon icon-paper-plane"></i>
        </button>
    </div>
</mvc:form>

<script id="support-chart-typing-msg" type="text/x-mustache-template">
    <div class="chat__message chat__message--in">
        <i class="icon icon-user-circle chat__icon"></i>
        <div class="message__content"><i class="icon icon-ellipsis-h chat__typing-icon"></i></div>
    </div>
</script>

<script id="support-chart-incoming-message" type="text/x-mustache-template">
    <div class="chat__message chat__message--in">
        <i class="icon icon-user-circle chat__icon"></i>
        <div class="message__content">{{= text }}</div>
    </div>
</script>

<script id="support-chart-outgoing-message" type="text/x-mustache-template">
    <div class="chat__message chat__message--out">
        <div class="message__content">{{= text }}</div>
        <i class="icon icon-user-circle chat__icon"></i>
    </div>
</script>
