aside.chat( ng-controller="ChatController" infinite-scroll="loadMore()" infinite-scroll-disabled="chat.loading || chat.atEnd" infinite-scroll-initialize="ui.chatOpen" ) .messages( infinite-scroll="loadMore()" infinite-scroll-disabled="chat.loading || chat.atEnd" infinite-scroll-initialize="ui.chatOpen" scroll-glue ) .infinite-scroll-inner ul.list-unstyled li.message( ng-repeat="message in chat.groupedMessages | orderBy:'timestamp':false" ng-controller="ChatMessageController" ng-class="{'self': message.user.id == user.id }" ) div.date(ng-if="$index == 0 || (message.timestamp - chat.groupedMessages[$index - 1].timestamp) > 5 * 60 * 1000") {{ message.timestamp | formatDate:'h:MMa' }} {{ message.timestamp | relativeDate }} span.avatar img(ng-src="{{message.user.gravatar_url}}") div.message-wrapper .name(ng-if="message.user.id != user.id") {{ message.user.first_name }} .message( ng-style="{\ 'border-color': 'hsl({{ hue(message.user) }}, 60%, 80%)',\ 'background-color': 'hsl({{ hue(message.user) }}, 60%, 97%)'\ }" ) .arrow(ng-style="{'border-color': 'hsl({{ hue(message.user) }}, 60%, 80%)'}") p(ng-repeat="content in message.contents") {{ content }} .new-message textarea(placeholder="Your message...", on-enter="sendMessage()", ng-model="newMessageContent")