Browse Source

Empty history styles improved

master
Igor Zhukov 10 years ago
parent
commit
6ad025b408
  1. 5
      app/css/app.css
  2. 7
      app/js/controllers.js
  3. 13
      app/js/directives.js
  4. 15
      app/partials/im.html

5
app/css/app.css

@ -1630,8 +1630,9 @@ span.emoji { @@ -1630,8 +1630,9 @@ span.emoji {
.im_history_empty {
text-align: center;
color: #999;
font-size: 1.5em;
padding: 0 50px;
font-size: 18px;
line-height: 18px;
padding: 1px 50px;
}
.im_history_to_bottom .im_history_not_selected,
.im_history_to_bottom .im_history_empty {

7
app/js/controllers.js

@ -431,6 +431,7 @@ angular.module('myApp.controllers', []) @@ -431,6 +431,7 @@ angular.module('myApp.controllers', [])
var peerData = AppPeersManager.getPeer(peerID);
// console.log('update', preload, peerData);
if (!peerData || peerData.deleted) {
safeReplaceObject($scope.state, {loaded: false});
return false;
}
@ -523,10 +524,8 @@ angular.module('myApp.controllers', []) @@ -523,10 +524,8 @@ angular.module('myApp.controllers', [])
: AppMessagesManager.getHistory($scope.curDialog.inputPeer, maxID);
safeReplaceObject($scope.state, {loaded: false});
$scope.state.mayBeHasMore = true;
getMessagesPromise.then(function (historyResult) {
safeReplaceObject($scope.state, {loaded: true});
if (curJump != jump) return;
offset += historyResult.history.length;
@ -535,6 +534,8 @@ angular.module('myApp.controllers', []) @@ -535,6 +534,8 @@ angular.module('myApp.controllers', [])
maxID = historyResult.history[historyResult.history.length - 1];
updateHistoryPeer();
safeReplaceObject($scope.state, {loaded: true});
angular.forEach(historyResult.history, function (id) {
$scope.history.push(AppMessagesManager.wrapForHistory(id));
});

13
app/js/directives.js

@ -298,6 +298,9 @@ angular.module('myApp.directives', ['myApp.filters']) @@ -298,6 +298,9 @@ angular.module('myApp.directives', ['myApp.filters'])
});
$scope.$on('ui_editor_resize', updateSizes);
$scope.$on('ui_height', function () {
updateSizes();
});
var atBottom = true;
$(scrollableWrap).on('scroll', function (e) {
@ -1016,6 +1019,8 @@ angular.module('myApp.directives', ['myApp.filters']) @@ -1016,6 +1019,8 @@ angular.module('myApp.directives', ['myApp.filters'])
function link($scope, element, attrs) {
var prevMargin = false;
var updateMargin = function () {
var height = element[0].offsetHeight,
contHeight = $($window).height(),
@ -1023,6 +1028,12 @@ angular.module('myApp.directives', ['myApp.filters']) @@ -1023,6 +1028,12 @@ angular.module('myApp.directives', ['myApp.filters'])
margin = height < contHeight ? parseInt((contHeight - height) * ratio) : '';
element.css({marginTop: margin, marginBottom: margin});
if (prevMargin !== margin) {
$scope.$emit('ui_height');
}
prevMargin = margin;
};
onContentLoaded(updateMargin);
@ -1033,6 +1044,8 @@ angular.module('myApp.directives', ['myApp.filters']) @@ -1033,6 +1044,8 @@ angular.module('myApp.directives', ['myApp.filters'])
onContentLoaded(updateMargin);
});
};
})

15
app/partials/im.html

@ -59,10 +59,10 @@ @@ -59,10 +59,10 @@
</div>
<div class="im_history_col_wrap" ng-controller="AppImHistoryController">
<div ng-show="state.notSelected" class="im_history_not_selected" my-vertical-position="0.3">
<div ng-show="state.notSelected" class="im_history_not_selected" my-vertical-position="0.35">
Please select a chat to start messaging
</div>
<div ng-show="!state.notSelected &amp;&amp; !state.loaded" class="im_history_not_selected" my-vertical-position="0.3">
<div ng-show="!state.notSelected &amp;&amp; !state.loaded" class="im_history_not_selected" my-vertical-position="0.35">
Loading history<span my-loading-dots></span>
</div>
@ -122,11 +122,16 @@ @@ -122,11 +122,16 @@
<div class="im_history_scrollable_wrap content">
<div class="im_history_scrollable">
<div class="im_history" ng-class="{im_history_selectable: selectActions}">
<div class="im_history_empty" ng-show="!history.length" my-vertical-position="0.3">
No messages here yet...
<div ng-if="!history.length" class="im_history_empty" ng-switch="state.mayBeHasMore">
<div my-vertical-position="0.25" ng-switch-when="true">
Loading history<span my-loading-dots></span>
</div>
<div my-vertical-position="0.25" ng-switch-default>
No messages here yet...
</div>
</div>
<div class="im_history_messages">
<div class="im_history_message_wrap" my-message bindonce ng-repeat="historyMessage in history"></div>
</div>

Loading…
Cancel
Save