franzz/spot
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

add auto post loader

Browse Source
This commit is contained in:
francois
2018-04-15 14:59:39 +02:00
parent 32108b0141
commit 8ff7185ff3
5 changed files with 80 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
masks/messages.html
View File

@@ -11,7 +11,7 @@
<div id="posts">
<div id="poster"></div>
<div id="posts_list"></div>
<div id="next_posts"><button id="add_posts" name="add_posts" type="button" class="post">Messages plus anciens</button></div>
<div id="loading"></div>
</div>
</div>
</div>
@@ -20,12 +20,25 @@
oSpot.pageInit = function(asHash)
{
self.tmp('$Map', $('#map'));
$('#add_posts').click(updateFeed);
//Add Loading
var asLoading = {
type: 'loading',
formatted_time: '',
relative_time: '',
displayed_id: 'Chargement...'
};
getPost(asLoading).appendTo($('#loading'));
//$('#add_posts').click(updateFeed);
self.get('messages', function(oMessages){
//Build Feed
self.tmp('updatable', true);
self.tmp('out-of-data', 'boolean');
updateFeed(true);
//setInterval(updateFeed, 60 * 1000); //refresh every minute
self.tmp('simple-bar', new SimpleBar($('#posts')[0]));
self.tmp('simple-bar').getScrollElement().addEventListener('scroll', onFeedScroll);
//Centering map
var agCenter = {lat:0, lng:0};
@@ -209,29 +222,48 @@ function getBoundsZoomLevel(bounds, mapDim) {
return Math.min(latZoom, lngZoom, ZOOM_MAX);
}
function onFeedScroll(){
var $Box = $(this);
var $BoxContent = $Box.find('.simplebar-content');
if(($Box.scrollTop() + $(window).height()) / $BoxContent.height() >= 0.8) updateFeed();
}
function updateFeed(bFirstChunk)
{
bFirstChunk = bFirstChunk || false;
var $Posts = $('#posts_list');
if(bFirstChunk===true)
{
$Posts.empty();
self.tmp('news_chunk', 0);
if(self.tmp('updatable')) {
if(!self.tmp('out-of-data') || bFirstChunk) {
var $Posts = $('#posts_list');
if(bFirstChunk===true) {
$Posts.empty();
self.tmp('news_chunk', 0);
}
self.tmp('updatable', false);
$('#loading').fadeIn('fast');
self.get('feed', function(asData) {
$.each(asData, function(iKey, asPost){
getPost(asPost).appendTo($Posts);
});
//oSimpleBar.recalculate();
self.tmp('news_chunk', self.tmp('news_chunk') + 1);
self.tmp('out-of-data', Object.keys(asData).length != self.vars('chunk_size'));
self.tmp('updatable', true);
$('#loading').fadeOut('fast');
}, {
'chunk': self.tmp('news_chunk')
});
}
}
else if(bFirstChunk) { //Delaying important data load
if(typeof oUpdateTimer != 'undefined') clearTimeout(oUpdateTimer);
oUpdateTimer = setTimeout(function(){updateFeed(true);}, 200);
}
self.get('feed', function(asData){
$.each(asData, function(iKey, asPost){
getPost(asPost).appendTo($Posts);
});
if(bFirstChunk===true) oSimpleBar = new SimpleBar($('#posts')[0]);
//else oSimpleBar.recalculate();
self.tmp('news_chunk', self.tmp('news_chunk') + 1);
$('#next_posts').toggle(Object.keys(asData).length == self.vars('chunk_size'));
}, {'chunk':self.tmp('news_chunk')});
}
function getPost(asPost) {
@@ -275,6 +307,10 @@ function getPost(asPost) {
.append($('<button>', {type:'button', id:'submit', name:'submit'}).addIcon('fa-send'));
sClass = 'comment';
break;
case 'loading':
$Body = $('<p>', {'class':'spinner'}).addIcon('fa-spin fa-spinner');
sClass = 'tasks';
break;
}
$Post
.append($('<div>', {'class':'header'})