Scroll on user page to get older posts.

This commit is contained in:
Pierre 2018-02-03 17:58:00 +01:00
parent 5c26e28e46
commit 12209718de
2 changed files with 76 additions and 9 deletions

View File

@ -10,14 +10,20 @@ ComunicWeb.components.posts.interface = {
* Get user posts
*
* @param {int} userID The ID of the target user
* @param {int} lastPostID The ID of the last post loaded
* @param {function} callback Callback function
*/
get_user: function(userID, callback){
get_user: function(userID, lastPostID, callback){
//Load the previous posts to the loaded post if required
if(lastPostID > 0)
lastPostID = lastPostID-1;
//Prepare the API request
var APIuri = "posts/get_user";
var params = {
userID: userID
userID: userID,
startFrom: lastPostID
};
//Make the request

View File

@ -6,6 +6,16 @@
ComunicWeb.pages.userPage.posts = {
/**
* Last displayed post ID
*/
_last_post_id: 0,
/**
* Specify if post loading is locked
*/
_load_post_locked: false,
/**
* Display the posts
*
@ -15,6 +25,10 @@ ComunicWeb.pages.userPage.posts = {
*/
display: function(userInfos, params, target){
//Reset last post id
this._last_post_id = 0;
this._load_post_locked = true;
//Create posts blocks
var postsBlock = createElem2({
appendTo: target,
@ -36,8 +50,47 @@ ComunicWeb.pages.userPage.posts = {
});
loadingMsg.style.textAlign = "center";
//Trigger an event the the user reach the end of the page
$(window).scroll(function(){
//Cancel event if it came by error
if(!postsBlock.isConnected)
return false;
//Cancel event if the page is locked
if(ComunicWeb.pages.userPage.posts._load_post_locked !== false)
return;
//Check if we reached the bottom of the page
if($(window).scrollTop() + $(window).height() < $(document).height() - 50){
return;
}
//Lock the loading state
ComunicWeb.pages.userPage.posts._load_post_locked = true;
//Load next posts
ComunicWeb.pages.userPage.posts._load_posts(userInfos, postsBody);
});
//Load the posts
this._load_posts(userInfos, postsBody, function(){
loadingMsg.remove();
});
},
/**
* Load the posts for the user
*
* @param {Object} userInfos Informations about the user to load
* @param {HTMLElement} target The target for the posts
* @param {function} callback What to do once the posts have been loaded
*/
_load_posts(userInfos, target, callback){
//Get the posts from the API
ComunicWeb.components.posts.interface.get_user(userInfos.userID, function(result){
ComunicWeb.components.posts.interface.get_user(userInfos.userID, this._last_post_id, function(result){
//Check for errors
if(result.error){
@ -46,13 +99,18 @@ ComunicWeb.pages.userPage.posts = {
}
else {
//Empty the target
emptyElem(postsBody);
//Show the posts
ComunicWeb.pages.userPage.posts._show(result, postsBody);
ComunicWeb.pages.userPage.posts._show(result, target);
}
//Unlock posts loading
ComunicWeb.pages.userPage.posts._load_post_locked = false;
//Call callback (if any)
if(callback)
callback();
});
},
@ -72,10 +130,13 @@ ComunicWeb.pages.userPage.posts = {
//Display post
ComunicWeb.components.posts.ui.display_post(posts[i], target);
//Update last post ID (if small than previous one or if it has not been initialized yet)
this._last_post_id = posts[i].ID;
}
//Check if there is not any posts
if(target.children.length == 0){
if(posts.length == 0 && this._last_post_id == 0){
this._no_posts_msg(target);
}