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

add auto post loader

Browse Source
This commit is contained in:
Franzz
2018-04-15 14:59:39 +02:00
parent 588f9bb102
commit 893e27cb5f
5 changed files with 80 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
inc/spot.php
View File

@@ -280,7 +280,7 @@ class Spot extends Main
ksort($asFeed);
//Split chunks
//$asFeed = array_slice($asFeed, $iChunk*self::FEED_CHUNK_SIZE, self::FEED_CHUNK_SIZE);
$asFeed = array_slice($asFeed, $iChunk*self::FEED_CHUNK_SIZE, self::FEED_CHUNK_SIZE);
return self::getJsonResult(true, '', $asFeed);
}
@@ -304,10 +304,11 @@ class Spot extends Main
{
$iPicTimeStamp = $iPicTakenTimeStamp = $iPicFileTimeStamp = 0;
$asExif = @exif_read_data($sPicPath, 0, true);
if(!$asExif) $asExif['FILE']['FileDateTime'] = filemtime($sPicPath);
//Timestamps
if(!empty($asExif) && array_key_exists('DateTimeOriginal', $asExif['EXIF'])) $iPicTakenTimeStamp = strtotime($asExif['EXIF']['DateTimeOriginal']);
if(!empty($asExif) && array_key_exists('FileDateTime', $asExif['FILE'])) $iPicFileTimeStamp = $asExif['FILE']['FileDateTime'];
if(array_key_exists('EXIF', $asExif) && array_key_exists('DateTimeOriginal', $asExif['EXIF'])) $iPicTakenTimeStamp = strtotime($asExif['EXIF']['DateTimeOriginal']);
if(array_key_exists('FILE', $asExif) && array_key_exists('FileDateTime', $asExif['FILE'])) $iPicFileTimeStamp = $asExif['FILE']['FileDateTime'];
//Merge timestamps
$iPicTimeStamp = ($iPicTakenTimeStamp > 0)?$iPicTakenTimeStamp:$iPicFileTimeStamp;
@@ -316,7 +317,7 @@ class Spot extends Main
//if($iPicTimeStamp >= self::HONEYMOON_DATE_BEG && $iPicTimeStamp <= self::HONEYMOON_DATE_END) $iPicTimeStamp -= 60*60*(12+1); //timezone + daylight saving
//Orientation
if(array_key_exists('Orientation', $asExif['IFD0'])) {
if(array_key_exists('IFD0', $asExif) && array_key_exists('Orientation', $asExif['IFD0'])) {
switch($asExif['IFD0']['Orientation'])
{
case 1: $sRotate = '0'; break; //None

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'})

2
style/spot.css
View File

@@ -10,5 +10,5 @@
* Made by Adrien Grsmto from a fork by Jonathan Nicol
* Under MIT License
*
*/[data-simplebar]{position:relative;z-index:0;overflow:hidden !important;max-height:inherit;-webkit-overflow-scrolling:touch}[data-simplebar="init"]{display:-webkit-box;display:-ms-flexbox;display:flex}.simplebar-scroll-content{overflow-x:hidden !important;overflow-y:scroll;min-width:100% !important;max-height:inherit !important;-webkit-box-sizing:content-box !important;box-sizing:content-box !important}.simplebar-content{overflow-y:hidden !important;overflow-x:scroll;-webkit-box-sizing:border-box !important;box-sizing:border-box !important;min-height:100% !important}.simplebar-track{z-index:1;position:absolute;right:0;bottom:0;width:11px}.simplebar-scrollbar{position:absolute;right:2px;width:7px;min-height:10px}.simplebar-scrollbar:before{position:absolute;content:"";background:black;border-radius:7px;left:0;right:0;opacity:0;-webkit-transition:opacity 0.2s linear;transition:opacity 0.2s linear}.simplebar-track:hover .simplebar-scrollbar:before,.simplebar-track .simplebar-scrollbar.visible:before{opacity:0.5;-webkit-transition:opacity 0 linear;transition:opacity 0 linear}.simplebar-track.vertical{top:0}.simplebar-track.vertical .simplebar-scrollbar:before{top:2px;bottom:2px}.simplebar-track.horizontal{left:0;width:auto;height:11px}.simplebar-track.horizontal .simplebar-scrollbar:before{height:100%;left:2px;right:2px}.horizontal.simplebar-track .simplebar-scrollbar{right:auto;top:2px;height:7px;min-height:0;min-width:10px;width:auto}@-webkit-keyframes fadeIn{from{opacity:0.3}}@-moz-keyframes fadeIn{from{opacity:0.3}}@-ms-keyframes fadeIn{from{opacity:0.3}}@-o-keyframes fadeIn{from{opacity:0.3}}@keyframes fadeIn{from{opacity:0.3}}.flicker,#map .loader{-webkit-animation:fadeIn 0.8s infinite alternate;-moz-animation:fadeIn 0.8s infinite alternate;-ms-animation:fadeIn 0.8s infinite alternate;-o-animation:fadeIn 0.8s infinite alternate;animation:fadeIn 0.8s infinite alternate}#map{position:absolute;left:0;top:0;bottom:0;width:100%;background:#EEE}#map .loader{position:absolute;font-size:3em;width:1em;height:1em;top:calc(50% - 0.5em);left:calc(50% - 0.5em);color:#666}#map #legend{background:white;font-family:Roboto, Arial, sans-serif;background:rgba(255,255,255,0.5);border-radius:3px;padding:1px 0 0 0;margin-bottom:1em;right:calc(30% + 3em) !important;bottom:calc(1em - 10px) !important}#map #legend .line{display:inline-block;border-left:2em solid;line-height:2px;padding-left:0.5em;margin:1em;font-size:1em;color:#222}#map #legend .line.green{border-color:#00ff78}#map #legend .line.blue{border-color:#0000ff}#map #legend .line.red{border-color:#FF7814}#feed{position:absolute;right:1em;top:0em;bottom:0em;width:calc(30% - 1em);button:hover;button-background:#F7F7F7}#feed input,#feed button{border:none;padding:0.5em 1em;background:#F7F7F7}#feed button{background:#CCC;cursor:pointer;font-weight:bold}#feed #posts{font-family:Arial;position:absolute;top:0;bottom:0;width:100%}#feed #posts #poster input,#feed #posts #poster button{border-radius:3px;background-color:#d9deff;color:#323268}#feed #posts #poster #post{margin-bottom:1em;width:calc(100% - 2em)}#feed #posts #poster #name{width:calc(100% - 6em)}#feed #posts #poster #submit{margin-left:1em;background-color:#323268;color:#B4BDFF;margin-bottom:0.5em}#feed #posts #poster #submit:hover{background-color:#d9deff;color:#323268}#feed #posts .post{margin-bottom:1em;background:#B4BDFF;color:#323268;border-radius:0.5em;width:calc(100% - 1em);box-shadow:2px 2px 3px 0px rgba(0,0,0,0.5)}#feed #posts .post:first-child{margin-top:2em}#feed #posts .post .message{margin:0.3em 0 0 0}#feed #posts .post .signature{margin:0.5em 0 0 0;text-align:right;font-style:italic}#feed #posts .post .header{padding:0.5em 1em;font-style:italic;font-size:0.8em;text-align:right}#feed #posts .post .header .index{float:left;font-style:normal}#feed #posts .post .header .time{cursor:default}#feed #posts .post .body{padding:0em 1em 0.5em}#feed #posts .post.picture{background:#F3EC9F;color:#635C28}#feed #posts .post.picture a{display:inline-block;line-height:0;margin:0}#feed #posts .post.picture img{width:100%;image-orientation:from-image;border:1px solid white;outline:none}#feed #posts .post.message{background:#6DFF58;color:#326526;p:first-child;p-margin-top:1em}#feed #posts .post.message p{font-size:0.9em;margin:0.5em 0}#feed #posts .post.message .staticmap{width:100%;border-radius:3px;cursor:pointer}#feed #posts #next_posts{display:none}#feed #posts #next_posts button{margin-top:0;background-color:#CCC;color:#666}#feed #posts #next_posts button:hover{color:#333}#feed #posts .fa.push{margin-right:0.5em}.info-window h1{font-size:1.2em}.info-window p{font-size:1.0em}.info-window i{padding-right:0.5em;font-size:1.33333333em;line-height:0.75em;vertical-align:-15%}.info-window .battery{text-transform:capitalize}.bar{height:18px;background:green}
*/[data-simplebar]{position:relative;z-index:0;overflow:hidden !important;max-height:inherit;-webkit-overflow-scrolling:touch}[data-simplebar="init"]{display:-webkit-box;display:-ms-flexbox;display:flex}.simplebar-scroll-content{overflow-x:hidden !important;overflow-y:scroll;min-width:100% !important;max-height:inherit !important;-webkit-box-sizing:content-box !important;box-sizing:content-box !important}.simplebar-content{overflow-y:hidden !important;overflow-x:scroll;-webkit-box-sizing:border-box !important;box-sizing:border-box !important;min-height:100% !important}.simplebar-track{z-index:1;position:absolute;right:0;bottom:0;width:11px}.simplebar-scrollbar{position:absolute;right:2px;width:7px;min-height:10px}.simplebar-scrollbar:before{position:absolute;content:"";background:black;border-radius:7px;left:0;right:0;opacity:0;-webkit-transition:opacity 0.2s linear;transition:opacity 0.2s linear}.simplebar-track:hover .simplebar-scrollbar:before,.simplebar-track .simplebar-scrollbar.visible:before{opacity:0.5;-webkit-transition:opacity 0 linear;transition:opacity 0 linear}.simplebar-track.vertical{top:0}.simplebar-track.vertical .simplebar-scrollbar:before{top:2px;bottom:2px}.simplebar-track.horizontal{left:0;width:auto;height:11px}.simplebar-track.horizontal .simplebar-scrollbar:before{height:100%;left:2px;right:2px}.horizontal.simplebar-track .simplebar-scrollbar{right:auto;top:2px;height:7px;min-height:0;min-width:10px;width:auto}@-webkit-keyframes fadeIn{from{opacity:0.3}}@-moz-keyframes fadeIn{from{opacity:0.3}}@-ms-keyframes fadeIn{from{opacity:0.3}}@-o-keyframes fadeIn{from{opacity:0.3}}@keyframes fadeIn{from{opacity:0.3}}.flicker,#map .loader{-webkit-animation:fadeIn 0.8s infinite alternate;-moz-animation:fadeIn 0.8s infinite alternate;-ms-animation:fadeIn 0.8s infinite alternate;-o-animation:fadeIn 0.8s infinite alternate;animation:fadeIn 0.8s infinite alternate}#map{position:absolute;left:0;top:0;bottom:0;width:100%;background:#EEE}#map .loader{position:absolute;font-size:3em;width:1em;height:1em;top:calc(50% - 0.5em);left:calc(50% - 0.5em);color:#666}#map #legend{background:white;font-family:Roboto, Arial, sans-serif;background:rgba(255,255,255,0.5);border-radius:3px;padding:1px 0 0 0;margin-bottom:1em;right:calc(30% + 3em) !important;bottom:calc(1em - 10px) !important}#map #legend .line{display:inline-block;border-left:2em solid;line-height:2px;padding-left:0.5em;margin:1em;font-size:1em;color:#222}#map #legend .line.green{border-color:#00ff78}#map #legend .line.blue{border-color:#0000ff}#map #legend .line.red{border-color:#FF7814}#feed{position:absolute;right:1em;top:0em;bottom:0em;width:calc(30% - 1em);button:hover;button-background:#F7F7F7}#feed input,#feed button{border:none;padding:0.5em 1em;background:#F7F7F7}#feed button{background:#CCC;cursor:pointer;font-weight:bold}#feed #posts{font-family:Arial;position:absolute;top:0;bottom:0;width:100%}#feed #posts #poster input,#feed #posts #poster button{border-radius:3px;background-color:#d9deff;color:#323268}#feed #posts #poster #post{margin-bottom:1em;width:calc(100% - 2em)}#feed #posts #poster #name{width:calc(100% - 6em)}#feed #posts #poster #submit{margin-left:1em;background-color:#323268;color:#B4BDFF;margin-bottom:0.5em}#feed #posts #poster #submit:hover{background-color:#d9deff;color:#323268}#feed #posts .post{margin-bottom:1em;background:#B4BDFF;color:#323268;border-radius:3px;width:calc(100% - 1em);box-shadow:2px 2px 3px 0px rgba(0,0,0,0.5)}#feed #posts .post:first-child{margin-top:2em}#feed #posts .post .message{margin:0.3em 0 0 0}#feed #posts .post .signature{margin:0.5em 0 0 0;text-align:right;font-style:italic}#feed #posts .post .header{padding:0.5em 1em;font-style:italic;font-size:0.8em;text-align:right}#feed #posts .post .header .index{float:left;font-style:normal}#feed #posts .post .header .time{cursor:default}#feed #posts .post .body{clear:both;padding:0em 1em 0.5em}#feed #posts .post.picture{background:#F3EC9F;color:#635C28}#feed #posts .post.picture a{display:inline-block;line-height:0;margin:0}#feed #posts .post.picture img{width:100%;image-orientation:from-image;border:1px solid white;outline:none}#feed #posts .post.message{background:#6DFF58;color:#326526;p:first-child;p-margin-top:1em}#feed #posts .post.message p{font-size:0.9em;margin:0.5em 0}#feed #posts .post.message .staticmap{width:100%;border-radius:3px;cursor:pointer}#feed #posts .post.loading .spinner{padding-top:0.5em;text-align:center}#feed #posts .post.loading .spinner .fa-spinner{font-size:1.5em;color:#323268}#feed #posts .fa.push{margin-right:0.5em}.info-window h1{font-size:1.2em}.info-window p{font-size:1.0em}.info-window i{padding-right:0.5em;font-size:1.33333333em;line-height:0.75em;vertical-align:-15%}.info-window .battery{text-transform:capitalize}.bar{height:18px;background:green}
/*# sourceMappingURL=spot.css.map */

2
style/spot.css.map
View File

File diff suppressed because one or more lines are too long

29
style/spot.scss
View File

@@ -121,7 +121,7 @@
margin-bottom: 1em;
background: #B4BDFF;
color: #323268;
border-radius: 0.5em;
border-radius: 3px;
width: calc(100% - 1em);
box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.5);
@@ -153,6 +153,7 @@
}
}
.body {
clear: both;
padding: 0em 1em 0.5em;
}
&.picture {
@@ -191,21 +192,23 @@
cursor: pointer;
}
}
}
#next_posts {
display: none;
button {
margin-top: 0;
background-color: #CCC;
color: #666;
}
button:hover {
color: #333;
&.loading {
.spinner {
padding-top: 0.5em;
text-align: center;
.fa-spinner {
font-size: 1.5em;
color: #323268;
}
}
}
}
#loading {
}
.fa.push {
margin-right: 0.5em;
}