' + '# if (typeof images !== \"undefined\" && images.length > 0) { #' + '
![\"#:images[0].alt#\"](\"#:images[0].url#\")
' + '# } #' + '
' + '# if (typeof title !== \"undefined\") { #' + '
#:title#
' + '# } #' + '# if (typeof subtitle !== \"undefined\") { #' + '
#:subtitle#
' + '# } #' + '# if (typeof text !== \"undefined\") { #' + '
#:text#
' + '# } #' + '
' + '# if (typeof buttons !== \"undefined\" && buttons.length > 0) { #' + '
' + '# for (var i = 0; i < buttons.length; i++) { #' + '#:buttons[i].title#' + '# } #' + '
' + '# } #' + '
');\n extend(kendo.chat, {\n Templates: {},\n Components: {}\n });\n kendo.chat.registerTemplate = function (templateName, template) {\n kendo.chat.Templates[templateName] = kendo.template(template);\n };\n kendo.chat.getTemplate = function (templateName) {\n return kendo.chat.Templates[templateName] || TEXT_MESSAGE_TEMPLATE;\n };\n kendo.chat.registerTemplate('text', TEXT_MESSAGE_TEMPLATE);\n kendo.chat.registerTemplate('message', TEXT_MESSAGE_TEMPLATE);\n kendo.chat.registerTemplate('typing', TYPING_INDICATOR_TEMPLATE);\n kendo.chat.registerTemplate('suggestedAction', SUGGESTED_ACTIONS_TEMPLATE);\n kendo.chat.registerTemplate('heroCard', HERO_CARD_TEMPLATE);\n kendo.chat.registerTemplate('application/vnd.microsoft.card.hero', HERO_CARD_TEMPLATE);\n kendo.chat.registerComponent = function (componentName, component) {\n kendo.chat.Components[componentName] = component;\n };\n kendo.chat.getComponent = function (componentName) {\n return kendo.chat.Components[componentName] || null;\n };\n var Component = kendo.chat.Component = kendo.Class.extend({\n init: function (options, view) {\n this.element = $('').addClass(viewStyles.messageListContent).appendTo(this.element);\n },\n _attachEvents: function () {\n var styles = ChatView.styles;\n this.element.on('click' + NS, proxy(this._listClick, this)).on('click' + NS, DOT + styles.message, proxy(this._messageClick, this)).on('click' + NS, DOT + styles.suggestedAction, proxy(this._suggestedActionClick, this)).on('click' + NS, DOT + styles.cardAction + SPACE + DOT + styles.button, proxy(this._cardActionClick, this));\n },\n _scrollable: function () {\n var viewStyles = ChatView.styles;\n this.element.on('click' + NS, DOT + viewStyles.cardDeckScrollWrap + SPACE + DOT + viewStyles.button, proxy(this._scrollButtonClick, this));\n },\n _scrollButtonClick: function (e) {\n var viewStyles = ChatView.styles;\n var button = $(e.currentTarget);\n var scrollToLeft = button.find(DOT + viewStyles.scrollButtonIconLeft).length !== 0;\n var scrollContainer = button.siblings(DOT + viewStyles.cardDeck);\n var lastCard = scrollContainer.find(DOT + viewStyles.card).last();\n var cardWidth = lastCard.outerWidth(true);\n if (scrollToLeft) {\n scrollContainer.scrollLeft(scrollContainer.scrollLeft() - cardWidth);\n } else {\n scrollContainer.scrollLeft(scrollContainer.scrollLeft() + cardWidth);\n }\n },\n getTemplate: function (templateName) {\n return kendo.chat.getTemplate(templateName);\n },\n getComponent: function (type) {\n return kendo.chat.getComponent(type);\n },\n renderMessage: function (message, sender) {\n if (!message.timestamp) {\n message.timestamp = new Date();\n }\n if (!message.text) {\n message.text = '';\n }\n var bubbleElement = this._renderTemplate(message.type, message);\n this._renderBubble(message.type, bubbleElement, sender);\n if (message.type == 'typing') {\n if (this.typingParticipants.length > 0) {\n this._removeTypingParticipant(sender);\n }\n } else {\n this._lastSender = sender.id;\n }\n },\n renderSuggestedActions: function (suggestedActions) {\n this._removeSuggestedActions();\n var element = this._renderTemplate('suggestedAction', { suggestedActions: suggestedActions });\n this.list.append(element);\n this._scrollToBottom();\n },\n renderAttachments: function (options) {\n var wrapper = this._renderAttachmentWrapper(options.attachmentLayout);\n var cardContainer = options.attachmentLayout === 'carousel' ? wrapper.find(DOT + ChatView.styles.cardDeck) : wrapper;\n var attachments = options.attachments;\n if (!attachments.length) {\n return;\n }\n for (var i = 0; i < attachments.length; i++) {\n var cardElement = this._renderTemplate(attachments[i].contentType, attachments[i].content);\n cardContainer.append(cardElement);\n }\n this._removeSuggestedActions();\n this._removeTypingIndicator();\n this.list.append(wrapper);\n this._lastSender = null;\n },\n renderComponent: function (type) {\n var componentType = this.getComponent(type);\n var component = new componentType({}, this);\n this.list.append(component.element);\n this._scrollToBottom();\n },\n _renderAttachmentWrapper: function (layout) {\n var viewStyles = ChatView.styles;\n var wrapper = $('
');\n if (layout === 'carousel') {\n wrapper.addClass(viewStyles.cardDeckScrollWrap);\n var buttonLeft = this._renderScrollButton(viewStyles.scrollButtonIconLeft);\n wrapper.append(buttonLeft);\n wrapper.append($('
').addClass(viewStyles.cardDeck));\n var buttonRight = this._renderScrollButton(viewStyles.scrollButtonIconRight);\n wrapper.append(buttonRight);\n } else {\n wrapper.addClass(viewStyles.cardList);\n }\n return wrapper;\n },\n _renderScrollButton: function (directionClass) {\n var viewStyles = ChatView.styles;\n return $('