It looks like you're new here. If you want to get involved, click one of these buttons!
Just finished posting a tutorial on how to connect Backbone.js with Elefant in the back-end:
I am trying to make use of this tutorial along with the code example for paging a dataset found at: http://www.elefantcms.com/wiki/Code-example:-Paging-a-data-set
The code example includes the logic for getting the dataset for a page in the handler for the page (apps/myapp/handlers/example.php) while the tutorial has it in a library class (apps/todos/lib/TodoApi.php). The "get_item" function from the latter has no capability of pagination, it either returns a single row or all rows. How can I merge these two examples to use backbone's RESTful capabilities with pagination?
I would probably do it with something like the following gist instead of Elefant's simplistic pager handler:
The Elefant pager is server-side, so it won't easily play nicely with Backbone via REST. But it should be pretty easy to tie together by extending the new PaginatedCollection and PaginatedView instead of the regular Backbone.Collection and Backbone.View on the client side, and modifying the TodoApi::get_item() method to limit results by the page and perPage GET parameters on the server side.
Translating $_GET['page'] and $_GET['perPage'] into a $limit and $offset, you would just have to change the ->fetch_orig(); call in get_item() to be ->fetch_orig($limit, $offset);
From the look of it, Backbone should take care of fetching the right items automatically, but you'll still need to tie your own paging links into the view. The pagination.jst file from the gist should help with that.
Let me know how it goes. I'd love to see what you come up with!
Just saw this post about a new Backbone paginator as well:
In the tutorial it specifies using $page->add_script() as follows:
However that gives this result:
<title>myapp.phpfogapp.com - Todos
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="/css/reset.css" />
<link rel="stylesheet" type="text/css" href="/css/text.css" />
<link rel="stylesheet" type="text/css" href="/css/960.css" />
<link rel="stylesheet" type="text/css" href="/css/style.css" />
<link rel="stylesheet" type="text/css" href="/apps/admin/css/jquery.jgrowl.css"></script>
<link rel="stylesheet" type="text/css" href="/apps/admin/css/top-bar.css"></script>
Notice beginning at the third line from the bottom.
I found I instead had to use:
$page->add_script ('<link rel="stylesheet" type="text/css" href="/apps/todos/css/todos.css"></script>');
to get it to work.
Strange, are you using Elefant 1.2 or an earlier version? The early releases used to require the <script> tags, but recent versions should work fine both ways (I double checked with my test copy and both seem to work the same).
I am using phpfog and whatever they automatically install.
In step 2 of the tutorial, the link to Underscore.js is broken. Perhaps you want to use https://github.com/documentcloud/underscore/blob/master/underscore-min.js instead.
Fixed the underscore link, thanks for catching that!
PHPFog may have an older version, I'm going to tweet at them in case they haven't updated it recently. Newer versions of Elefant should report the version number in the footer of the admin pages btw :)
Just checked and it looks like they haven't updated Elefant in a while! Letting them know now.
There is no version number report on my admin page so you must be correct about that. Is there a simple way to upgrade?
Since PHP Fog uses their own git repository for managing sites, adding the main Elefant repository as a remote in your local copy of it might be the easiest way. Something like this:
# add and track the elefant project
git remote add --track master elefant git://github.com/jbroadway/elefant.git
# fetch the latest elefant updates
git fetch elefant
# merge them with your site
git merge elefant/master
A few things to notes about the above: