Fat Free PHP Layouts

Question

I'm going through some of the code and projects provided here http://fatfreeframework.com/development . My goal is to create a lightweight MVC kickstarter projecting using F3. I know it's been done before, but I'm using this as a learning exercise and I hope to have something useful come out of it in the end.

The biggest stumbling block I'm coming across right now is the concept of layouts. I know the documentation mentions using templates within templates, but I'm struggling to implement it in practice. In the end, I want to have 1 or 2 layouts (default layout, maybe a custom one for modal popups, etc), and then have my views rendered wrapped inside of those layouts. I want a default layout and then the ability to override the default for the few pages that need custom ones. Here's the code I've been using:

// this is the handler for one of my routes, it's on a controller class called Index
public function index($f3, $params) 
{
    // this (or anything else) should get passed into the view
    $f3->set('listOfItems',array("item1", "item2"));

    // set the view
    $f3->set('content', 'index.htm')

    // render the layout
    \Template::instance()->render('layout.htm');
}

Unfortunately, I keep getting a blank page. Am I going about this completely the wrong direction, or am I on the right track? Is there a way to set a default layout somewhere so it's used until it's overridden?

Answer 1

Well you could create a base class with a default layout. Then you extend it for each controller class. For example:

abstract class Layout {

  protected $tpl='layout.htm';

  function afterRoute($f3,$params) {
    echo \Template::instance()->render($this->tpl);
  }

}

Then:

class OneController extends Layout {

  function index($f3,$params) {
    $f3->set('listOfItems',...);
    $f3->set('content','one/index.htm');
  }

}

class AnotherController extends Layout {

  protected $tpl='popup.htm';//override default layout here

  function index($f3,$params) {
    $f3->set('listOfItems',...);
    $f3->set('content','another/index.htm');
  }

}

In layout.htm:

<body>
  <div id="content">
    <include href="{{@content}}" if="isset(@content)"/>
  </div>
</body>

Structure of the UI folder:

/ui
  |-- layout.htm
  |-- popup.htm
  |-- one
        |-- index.htm
  |-- another
        |-- index.htm

This is just one example of how you could organize your code. F3 is loose enough to let you organize it in a multitude of ways.

Answer 2

I had exactly the same problem - set everything up as required, rendered the layout, and kept getting a blank page. Also when I checked the HTML source of the rendered page it was completely empty.

If you look closely however rendering the layout is not enough, you have to also print it using the echo command. So rather than the following example which appears at first glance to be correct:

$f3->route('GET /',
    function($f3) {

        // Instantiates a View object
        $view = new View;

        // Render the page
        $view->render('template/layout.php');

you actually need the last line to start with echo :

        echo $view->render('template/layout.php');

For more examples see:

Also for some reason (which I'm sure will become clear soon - I've only just started using the Fat Free Framework) you seem to also be able to render an .htm file which contain embedded PHP (ie they don't have to have the .php extension).

Fat Free PHP Layouts

Question

2 answers

solution1
2 ACCPTED 2014-09-25 11:39:11

solution2
0 2015-10-30 21:56:17

Fat Free PHP Layouts

Question

2 answers

solution1 2 ACCPTED 2014-09-25 11:39:11

solution2 0 2015-10-30 21:56:17

solution1
2 ACCPTED 2014-09-25 11:39:11

solution2
0 2015-10-30 21:56:17