fix infinitescroll when list is not long enough to fill the screen

This commit is contained in:
Athou
2013-03-28 15:10:55 +01:00
parent 79740937b9
commit b1e9be765b
5 changed files with 43 additions and 45 deletions

View File

@@ -2,8 +2,8 @@
<div class="pull-right" spinner shown="loading"></div> <div class="pull-right" spinner shown="loading"></div>
<div> <div>
<div class="btn-group read-mode" data-toggle="buttons-radio"> <div class="btn-group read-mode" data-toggle="buttons-radio">
<button type="button" class="btn" ng-model="settings.readingMode" btn-radio="'unread'">Unread</button> <button type="button" class="btn" ng-model="settingsService.settings.readingMode" btn-radio="'unread'">Unread</button>
<button type="button" class="btn" ng-model="settings.readingMode" btn-radio="'all'">All</button> <button type="button" class="btn" ng-model="settingsService.settings.readingMode" btn-radio="'all'">All</button>
</div> </div>
<button type="button" class="btn" ng-click="refresh()"><i class="icon-refresh"></i> Refresh</button> <button type="button" class="btn" ng-click="refresh()"><i class="icon-refresh"></i> Refresh</button>

View File

@@ -88,52 +88,53 @@ module.controller('CategoryTreeCtrl', function($scope, $routeParams, $location,
}); });
}); });
module.controller('FeedListCtrl', function($scope, $routeParams, $http, module.controller('FeedListCtrl', function($scope, $routeParams, $http, $route,
EntryService, SettingsService) { $window, EntryService, SettingsService) {
$scope.selectedType = $routeParams._type; $scope.selectedType = $routeParams._type;
$scope.selectedId = $routeParams._id; $scope.selectedId = $routeParams._id;
$scope.settings = SettingsService.settings; $scope.name = null;
$scope.$watch('settings.readingMode', function() { $scope.entries = [];
$scope.refreshList();
$scope.settingsService = SettingsService;
$scope.$watch('settingsService.settings.readingMode', function(newValue,
oldValue) {
if (newValue && oldValue && newValue != oldValue) {
$route.reload();
}
}); });
$scope.limit = 20; $scope.limit = 10;
$scope.busy = false; $scope.busy = false;
$scope.hasMore = true; $scope.hasMore = true;
$scope.refreshList = function() {
$scope.entryList = EntryService.get({
type : $scope.selectedType,
id : $scope.selectedId,
readType : $scope.settings.readingMode,
offset : 0,
limit : 30
});
};
$scope.loadMoreEntries = function() { $scope.loadMoreEntries = function() {
if (!$scope.hasMore) if (!$scope.hasMore)
return; return;
if (!$scope.entryList || !$scope.entryList.entries)
return;
if ($scope.busy) if ($scope.busy)
return; return;
$scope.busy = true; $scope.busy = true;
var limit = $scope.limit;
if ($scope.entries.length == 0) {
$window = angular.element($window);
limit = $window.height() / 33;
limit = parseInt(limit) + 5;
}
EntryService.get({ EntryService.get({
type : $scope.selectedType, type : $scope.selectedType,
id : $scope.selectedId, id : $scope.selectedId,
readType : $scope.settings.readingMode, readType : $scope.settingsService.settings.readingMode,
offset : $scope.entryList.entries.length, offset : $scope.entries.length,
limit : $scope.limit limit : limit
}, function(data) { }, function(data) {
var entries = data.entries for ( var i = 0; i < data.entries.length; i++) {
for ( var i = 0; i < entries.length; i++) { $scope.entries.push(data.entries[i]);
$scope.entryList.entries.push(entries[i]);
} }
$scope.name = data.name;
$scope.busy = false; $scope.busy = false;
$scope.hasMore = entries.length == $scope.limit $scope.hasMore = data.entries.length == limit
}); });
} }
@@ -153,7 +154,6 @@ module.controller('FeedListCtrl', function($scope, $routeParams, $http,
$scope.isOpen = false; $scope.isOpen = false;
$scope.entryClicked = function(entry, event) { $scope.entryClicked = function(entry, event) {
console.log('click !')
$scope.mark(entry, true); $scope.mark(entry, true);
if (!event.ctrlKey && event.which != 2) { if (!event.ctrlKey && event.which != 2) {
event.preventDefault(); event.preventDefault();

View File

@@ -93,7 +93,6 @@ module.directive('category', function($compile) {
}; };
$scope.toggleCategory = function(category) { $scope.toggleCategory = function(category) {
console.log(category.expanded)
SubscriptionService.collapse({ SubscriptionService.collapse({
id : category.id, id : category.id,
collapse : !category.expanded collapse : !category.expanded
@@ -117,11 +116,11 @@ module.directive('toolbar', function($routeParams, $route, SettingsService,
} }
$scope.loading = true; $scope.loading = true;
$scope.$watch(totalActiveAjaxRequests, function () { $scope.$watch(totalActiveAjaxRequests, function() {
$scope.loading = !(totalActiveAjaxRequests() === 0); $scope.loading = !(totalActiveAjaxRequests() === 0);
}); });
$scope.settings = SettingsService.settings; $scope.settingsService = SettingsService;
$scope.refresh = function() { $scope.refresh = function() {
$route.reload(); $route.reload();
}; };

View File

@@ -59,9 +59,10 @@ module.factory('SubscriptionService', [
}); });
}; };
s.subscribe = function(sub, callback) { s.subscribe = function(sub, callback) {
res.subscribe(sub, function(data){ res.subscribe(sub, function(data) {
s.init(); s.init();
if(callback) callback(data); if (callback)
callback(data);
}); });
}; };
@@ -118,9 +119,8 @@ module.factory('EntryService', [ '$resource', '$http',
module.service('SettingsService', function($resource) { module.service('SettingsService', function($resource) {
var s = {} var s = {}
s.settings = {}; s.settings = {};
s.settings.readingMode = 'unread';
$resource('rest/settings/get').get(function(data) { $resource('rest/settings/get').get(function(data) {
s.settings.readingMode = data.readingMode; s.settings = data;
}); });
s.save = function() { s.save = function() {
$resource('rest/settings/save').save(s.settings); $resource('rest/settings/save').save(s.settings);

View File

@@ -1,11 +1,11 @@
<div ng-controller="FeedListCtrl"> <div ng-controller="FeedListCtrl">
<div class="entrylist-header"> <div class="entrylist-header">
<h3><span>{{entryList.name}}&nbsp;</span><span ng-show="entryList.name && selectedType == 'category'"> &#187;</span></h3> <h3 ui-if="name"><span>{{name}}&nbsp;</span><span ng-show="name && selectedType == 'category'"> &#187;</span></h3>
</div> </div>
<div infinite-scroll="loadMoreEntries()" infinite-scroll-disabled="busy" infinite-scroll-distance="1" id="feed-accordion"> <div infinite-scroll="loadMoreEntries()" infinite-scroll-disabled="busy || !settingsService.settings.readingMode" infinite-scroll-distance="1" id="feed-accordion">
<div ng-repeat="entry in entryList.entries" class="entry"> <div ng-repeat="entry in entries" class="entry">
<a href="{{entry.url}}" target="_blank" class="entry-heading" ng-click="entryClicked(entry, $event)" <a href="{{entry.url}}" target="_blank" class="entry-heading" ng-click="entryClicked(entry, $event)"
ng-class="{open: current == entry, closed: current != entry}"> ng-class="{open: current == entry, closed: current != entry}">
<span ui-if="selectedType == 'category'" class="feed-name">{{entry.feedName}}</span> <span ui-if="selectedType == 'category'" class="feed-name">{{entry.feedName}}</span>
@@ -15,13 +15,12 @@
<div class="entry-body" ui-if="isOpen && current == entry"> <div class="entry-body" ui-if="isOpen && current == entry">
<div> <div>
<h4> <h4>
<a href="{{entry.url}}" target="_blank">{{entry.title}}</a> <a href="{{entry.url}}" target="_blank" ng-bind-html-unsafe="entry.title"></a>
</h4> </h4>
</div> </div>
<div ng-bind-html-unsafe="entry.content"></div> <div ng-bind-html-unsafe="entry.content"></div>
</div> </div>
</div> </div>
<div class="no-entries" ng-show="entryList.entries.length == 0">"{{entryList.name}}" has no unread items.</div> <div class="no-entries" ng-show="entries.length == 0 && !busy">"{{name}}" has no unread items.</div>
<div ng-show="busy">Loading data...</div>
</div> </div>
</div> </div>