arnaucube
arnaucube/commonroutesAppPublic Self-hosted repository
users pagination implemented in infinite scroll
arnaucode idoctnef@openmailbox.org
Wed, 12 Jul 2017 12:54:16 +0200
commit

9f5e0cab75c0623da8cb004ce0e0fa21b8a35071

parent

d42957fcabf2f7e56133b6dff7976ca401364b67

M README.md → README.md

@@ -2,13 +2,4 @@ # carsincommonApp

server code: https://github.com/arnaucode/carsincommonServer - -**ToDos:** -``` --page for user to view joins that has done --allow travel crator to accept join petitions and reject people --add to travel the date of destination --user comments and system to profile, to valorate users --notifications system syncronized - -``` +![carsincommon](https://raw.githubusercontent.com/arnaucode/carsincommonApp/master/carsincommon.png "carsincommon")
M www/js/offerCar.js → www/js/offerCar.js

@@ -33,7 +33,7 @@ data: $scope.newtravel

}) .then(function(data) { console.log(data); - window.location="#app/travels" + window.location="#app/travels"; }, function(data) { // optional // failed
M www/js/translations.js → www/js/translations.js

@@ -5,6 +5,8 @@ "Menu": "Menu",

"Signup": "Signup", "Login": "Login", "Travels": "Travels", + "travels": "travels", + "likes": "likes", "Travels_feed": "Travels feed", "Users": "Users", "Notifications": "Notifications",

@@ -76,7 +78,7 @@ "Pendent_petitions": "Pendent petitions",

"load_more": "load more", "view_likes": "view likes", "Edit_profile": "Edit profile", - "Travels_offering": "Travels offering", + "Travels_publicated": "Travels publicated", "Travels_joining": "Travels joining" }, "catalan": {
M www/js/travel.js → www/js/travel.js

@@ -79,6 +79,7 @@ $scope.travels = response.data;

localStorage.setItem('c_travels', JSON.stringify($scope.travels)); localStorage.setItem('c_travelsLastDate', JSON.stringify(new Date())); + window.location="#app/users/userTravels/" + $scope.storageuser._id; }, function(response) { // optional // failed
M www/js/users.js → www/js/users.js

@@ -1,34 +1,60 @@

angular.module('app.users', ['pascalprecht.translate']) -.controller('UsersCtrl', function($scope, $http, $ionicModal, $timeout, $ionicLoading, $filter) { - $scope.users=""; + .controller('UsersCtrl', function($scope, $http, $ionicModal, $timeout, $ionicLoading, $filter) { + $scope.users = []; + $scope.loadMorePagination = true; + $scope.page = 0; - $scope.users=JSON.parse(localStorage.getItem('c_users')); + //$scope.users = JSON.parse(localStorage.getItem('c_users')); $scope.doRefresh = function() { - /* users refresh: */ - $http.get(urlapi + 'users') - .success(function(data, status, headers, config){ - console.log('data success'); - console.log(data); // for browser console - $scope.users = data; // for UI - localStorage.setItem('c_users', JSON.stringify($scope.users)); - $scope.$broadcast('scroll.refreshComplete');//refresher stop + /* users refresh: */ + $http.get(urlapi + 'users?page=' + $scope.page) + .then(function(data) { + console.log('data success'); + console.log(data); - //set userdata - $scope.userdata = $filter('filter')($scope.users, {username: $scope.storageusername}, true)[0]; - console.log("userdata"); - console.log($scope.userdata); - localStorage.setItem("c_userdata", JSON.stringify($scope.userdata)); - }) - .error(function(data, status, headers,config){ - console.log('data error'); - $scope.$broadcast('scroll.refreshComplete');//refresher stop - }) - .then(function(result){ - users = result.data; + $scope.users = $scope.users.concat(data.data); + $scope.$broadcast('scroll.refreshComplete'); //refresher stop + $scope.$broadcast('scroll.infiniteScrollComplete'); + if (data.data.length < 1) { + console.log("setting loadMorePagination to false"); + $scope.loadMorePagination = false; + $scope.$broadcast('scroll.infiniteScrollComplete'); + } + + + /*localStorage.setItem('c_users', JSON.stringify($scope.users)); + $scope.$broadcast('scroll.refreshComplete'); //refresher stop + + //set userdata + $scope.userdata = $filter('filter')($scope.users, { + username: $scope.storageusername + }, true)[0]; + console.log("userdata"); + console.log($scope.userdata); + localStorage.setItem("c_userdata", JSON.stringify($scope.userdata));*/ + }, function(data) { + console.log('data error'); + $scope.$broadcast('scroll.refreshComplete'); //refresher stop + $ionicLoading.show({ + template: 'Error connecting server', + noBackdrop: true, + duration: 2000 + }); }); }; $scope.doRefresh(); -}); + + $scope.paginationNext = function() { + if ($scope.loadMorePagination == true) { + $scope.page++; + console.log($scope.page); + $scope.doRefresh(); + } else { + console.log("limit pagination reached"); + $scope.$broadcast('scroll.infiniteScrollComplete'); + } + }; + });
M www/templates/main.html → www/templates/main.html

@@ -1,8 +1,13 @@

<ion-view view-title="Main"> <ion-content class="has-footer"> - <a ng-href="#/app/users/{{storageuser._id}}" class="item item-icon-left o_purpleG300to500"> - <i class="icon ion-person"></i> + <a ng-href="#/app/users/{{storageuser._id}}" class="item item-avatar o_purpleG300to500"> + <!--<i class="icon ion-person"></i>--> + <img ng-src="{{storageuser.avatar}}"> {{storageuser.username}} {{'profile' | translate}} + <p style="color:#ffffff;"> + {{storageuser.travels.length}} {{'travels' | translate }}, + {{storageuser.likes.length}} {{'likes' | translate }} + </p> </a> <a ng-href="#/app/newTravel" class="item item-icon-left o_purpleG300to500"> <i class="icon ion-map"></i>
M www/templates/userTravels.html → www/templates/userTravels.html

@@ -6,7 +6,7 @@ on-refresh="doRefresh()">

</ion-refresher> <div class="list"> <div class="item item-divider o_purple300" ng-show="travels[0]"> - {{'Travels_offering' | translate}} + {{'Travels_publicated' | translate}} </div> <a ng-repeat="travel in travels | orderBy: 'date'" class="item item-icon-left" href="#/app/travels/{{travel._id}}">
M www/templates/users.html → www/templates/users.html

@@ -1,5 +1,5 @@

<ion-view view-title="{{'Users' | translate}}"> - <ion-content class="has-footer"> + <ion-content> <ion-refresher pulling-text="{{'Pull_to_refresh' | translate}}..." on-refresh="doRefresh()">

@@ -20,5 +20,10 @@ {{user.description}}

</p> </a> </div> + <ion-infinite-scroll + ng-if="loadMorePagination" + on-infinite="paginationNext()" + distance="1%"> + </ion-infinite-scroll> </ion-content> </ion-view>