restyle spinner and show more messages "button"
update the ensureMessagesAreLoaded() to not be executed when every message has been loaded and make a loadPreviousMessages method who works similar but dispatches a different action
@@ -21,6 +21,7 @@ import {
deepFreeze,
clone,
checkHttpStatus,
+ dispatchEvent,
} from '../utils.js'
import {
callAgreementsFetch,
@@ -122,15 +123,17 @@ function genComponentConf() {
</div>
</div>
<div class="pm__content">
+ <div class="pm__content__loadspinner"
+ ng-if="self.connection.get('isLoading')">
<img src="images/spinner/on_white.gif"
alt="Loading&hellip;"
- ng-show="self.connection.get('loadingEvents')"
class="hspinner"/>
- <a ng-show="self.eventsLoaded && !self.connection.get('loadingEvents') && !self.allLoaded"
- ng-click="self.connections__showMoreMessages(self.connection.get('uri'), 5)"
- href="">
- show more
- </a>
+ </div>
+ <button class="pm__content__loadbutton won-button--outlined thin red"
+ ng-if="!self.connection.get('isLoading') && !self.allLoaded"
+ ng-click="self.loadPreviousMessages()">
+ Load previous messages
+ </button>
<won-connection-message
ng-repeat="msg in self.chatMessages"
connection-uri="self.connectionUri"
@@ -327,7 +330,6 @@ function genComponentConf() {
theirNeed,
connectionUri,
connection,
- eventsLoaded: true, //TODO: CHECK IF MESSAGES ARE CURRENTLY LOADED
chatMessages: sortedMessages,
lastUpdateTimestamp: connection && connection.get('lastUpdateDate'),
isSentRequest: connection && connection.get('state') === won.WON.RequestSent,
@@ -356,22 +358,28 @@ function genComponentConf() {
this.updateScrollposition()
)
)
-
}
ensureMessagesAreLoaded() {
delay(0).then(() => {
// make sure latest messages are loaded
- if (
- this.connection &&
- !this.connection.get('loadingEvents')
- //&& !this.eventsLoaded
- ) {
- this.connections__showLatestMessages(this.connection.get('uri'), 4);
+ const INITIAL_MESSAGECOUNT = 15;
+ if ( this.connection && !this.connection.get('isLoading') && !(this.allLoaded || this.connection.get('messages').size > 0)) {
+ this.connections__showLatestMessages(this.connection.get('uri'), INITIAL_MESSAGECOUNT);
}
})
}
+ loadPreviousMessages() {
+ delay(0).then(() => {
+ const MORE_MESSAGECOUNT = 5;
+ if ( this.connection && !this.connection.get('isLoading') ) {
+ this.connections__showMoreMessages(this.connection.get('uri'), MORE_MESSAGECOUNT);
+ }
+ });
+
+ }
+
snapToBottom() {
this._snapBottom = true;
this.scrollToBottom();
