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

adding news feed chunks

Browse Source
This commit is contained in:
Franzz
2016-06-13 22:17:46 +02:00
parent 68d7711186
commit 7ee14d7d1a
6 changed files with 98 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
inc/spot.php
View File

@@ -2,6 +2,10 @@
class Spot extends Main
{
//Spot Mode
const MODE_HISTO = 'histo';
const MODE_BLOG = 'blog';
//Spot feed
const FEED_ID = '0Y5LrvigElWeAieBGnFol0KBEuOTkFJmm';
const FEED_HOOK = 'https://api.findmespot.com/spot-main-web/consumer/rest-api/2.0/public/feed/';
@@ -16,6 +20,8 @@ class Spot extends Main
const FORMAT_TIME = 'd/m/Y à H:i';
const FEED_CHUNK_SIZE = 15;
public function __construct($oClassManagement, $sProcessPage)
{
parent::__construct($oClassManagement, $sProcessPage);
@@ -74,9 +80,11 @@ class Spot extends Main
);
}
public function getMainPage($asGlobalVars=array(), $sMainPage='index')
public function getMainPage()
{
return parent::getMainPage(array('vars'=>array('feed_id'=>self::FEED_ID)));
return parent::getMainPage(array('vars'=>array( 'feed_id' => self::FEED_ID,
'chunk_size'=> self::FEED_CHUNK_SIZE,
'mode' => Settings::MODE)));
}
/* Getting & Storing messages */
@@ -163,7 +171,7 @@ class Spot extends Main
return $asMessages;
}
public function getNewsFeed()
public function getNewsFeed($iChunk=0)
{
$asFeed = array();
@@ -213,6 +221,10 @@ class Spot extends Main
}
ksort($asFeed);
//split chunks
$asFeed = array_slice($asFeed, $iChunk*self::FEED_CHUNK_SIZE, self::FEED_CHUNK_SIZE);
return self::getJsonResult(true, '', $asFeed);
}

3
index.php
View File

@@ -20,6 +20,7 @@ $sAction = isset($_REQUEST['a'])?$_REQUEST['a']:'';
$sPage = isset($_GET['p'])?$_GET['p']:'index';
$sName = isset($_GET['name'])?$_GET['name']:'';
$sContent = isset($_GET['content'])?$_GET['content']:'';
$iChunk = isset($_GET['chunk'])?$_GET['chunk']:0;
//Initiate class
$oSpot = new Spot($oClassManagement, __FILE__);
@@ -33,7 +34,7 @@ if($sAction!='')
$sResult = $oSpot->getMessages();
break;
case 'feed':
$sResult = $oSpot->getNewsFeed();
$sResult = $oSpot->getNewsFeed($iChunk);
break;
case 'upload':
$sResult = $oSpot->upload();

60
masks/messages.html
View File

@@ -5,20 +5,24 @@
<div id="feed">
<div id="poster">
<input id="post" name="post" type="text" />
<input id="name" name="name" type="text" />
<input id="submit" name="submit" type="button" value="+" />
<input id="name" name="name" type="text" /><button id="submit" name="submit" type="button" class="">+</button>
</div>
<div id="posts">
<div id="posts_list"></div>
<div id="next_posts"><button id="add_posts" name="add_posts" type="button">Messages plus anciens</button>
</div>
<div id="posts"></div>
</div>
</div>
<script type="text/javascript" src="script/lightbox.js"></script>
<script type="text/javascript">
oSpot.pageInit = function(asHash)
{
$('#posts').css('top', $('#poster').outerHeight());
$('#add_posts').click(updateFeed);
self.get('messages', function(oMessages){
//Build Feed
updateFeed();
updateFeed(true);
//setInterval(updateFeed, 60 * 1000); //refresh every minute
//Building messages
@@ -38,17 +42,29 @@ oSpot.pageInit = function(asHash)
});
//Centering map on last message
//var oLastMsg = oMessages[oMessages.length-1];
var agCenter = {lat:0, lng:0};
var iZoom = 0;
if(self.vars('mode')=='blog')
{
var oLastMsg = oMessages[oMessages.length-1];
agCenter.lat = oLastMsg.latitude;
agCenter.lng = oLastMsg.longitude;
iZoom = 12;
}
else
{
agCenter.lat = -43.5;
agCenter.lng = 171.5;
iZoom = 6;
}
var $Map = $("#map").gmap3(
{
map:
{
options:
{
//center:{lat:oLastMsg.latitude, lng:oLastMsg.longitude},
//zoom:12,
center:{lat:-43.5, lng:171.5},
zoom:6,
center:agCenter,
zoom:iZoom,
mapTypeId:google.maps.MapTypeId.HYBRID,
scaleControl:true
}
@@ -100,7 +116,7 @@ oSpot.pageInit = function(asHash)
{
$('#name').val('');
$('#post').val('');
updateFeed();
updateFeed(true);
},
{name:$('#name').val(), content:$('#post').val()}
);
@@ -108,13 +124,23 @@ oSpot.pageInit = function(asHash)
});
};
function updateFeed()
function updateFeed(bFirstChunk)
{
bFirstChunk = bFirstChunk || false;
var $Posts = $('#posts_list');
if(bFirstChunk===true)
{
console.log('first');
$Posts.empty();
self.tmp('news_chunk', 0);
}
self.get('feed', function(asData){
var $Posts = $('#posts').empty();
$.each(asData, function(iKey, asPost){
var $Post = $('<div>', {'class':'post '+asPost.type});
var sRelTime = asPost.relative_time;
var sRelTime = (self.vars('mode')=='histo')?asPost.formatted_time.substr(0, 10):asPost.relative_time;
var sAbsTime = asPost.formatted_time;
var $Body = {};
switch(asPost.type)
@@ -122,12 +148,12 @@ function updateFeed()
case 'message':
$Body = $('<div>')
.append($('<p>').addIcon('fa-compass', true).append(asPost.latitude+' | '+asPost.longitude))
.append($('<p>').addIcon('fa-clock-o', true).append(asPost.formatted_time));
.append($('<p>').addIcon('fa-clock-o', true).append(sAbsTime));
sClass = 'compass';
break;
case 'picture':
var $Image = $('<img>', {'src':asPost.path/*, 'style':'transform:rotate('+asPost.rotate+'deg);'*/});
$Body = $('<a>', {href:asPost.path, 'data-lightbox':'Te Araroa', 'data-title':asPost.formatted_time}).append($Image);
$Body = $('<a>', {href:asPost.path, 'data-lightbox':self.consts.title, 'data-title':sAbsTime}).append($Image);
sClass = 'image';
break;
case 'post':
@@ -148,6 +174,8 @@ function updateFeed()
//if(asPost.type=='picture' && asPost.rotate!='0') $Body.height($Image.height());
});
});
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')});
}
</script>

2
style/spot.css
View File

File diff suppressed because one or more lines are too long

2
style/spot.css.map
View File

File diff suppressed because one or more lines are too long

45
style/spot.scss
View File

@@ -32,35 +32,50 @@
width:30%;
overflow:auto;
input, button {
border:none;
padding:0.5em 1em;
background:#F7F7F7;
}
button {
background:#CCC;
cursor:pointer;
font-weight:bold;
}
button:hover {
background:#F7F7F7;
}
#poster {
padding:1em;
background:#EEE;
border-bottom:1px solid #DDD;
#post, #name, #submit {
width:calc(100% - 2em);
border:none;
padding:0.5em 1em;
}
position:fixed;
#post {
margin-bottom:1em;
width:calc(100% - 2em);
}
#name {
width: calc(100% - 5.5em);
width: calc(100% - 6em);
}
#submit {
margin-left:1em;
width: 3em;
background:#CCC;
cursor:pointer;
font-weight:bold;
}
}
#posts {
font-family: Arial;
overflow:auto;
position:absolute;
top:0;
bottom:0;
width:100%;
.post {
margin:1em;
@@ -129,6 +144,16 @@
.fa.push {
margin-right:0.5em;
}
#next_posts {
margin: 1em;
display:none;
button {
border-radius: 0.5em;
width:100%;
}
}
}
}