Skip to content
Daniel Spors edited this page Nov 4, 2020 · 3 revisions

The scavix-wdf does not contain a dedicated templating engine. You may include your own or (as we do) just use PHP inline syntax. In fact we astracted UI in a MVC manner, so that *.tpl.php files next to *.class.php files are detected and loade automatically when components are rendered.

Concept

Templates follow a component based concept, so each template should be usable when assigned the correct data (mvc!). Htmlpages are just a special form of template, so using this is really simple:

// home.class.php
class Home extends HtmlPage
{
	function Init()
	{
		$this->append("<h1>Hello World!</h1>")
	}
}

This creates and renders a HTML 5 valid output with just the H1 added to the BODY. Of course you will get more complex :)

Here's how to create a top-navigation:

// topnav.tpl.php
<div class="topnav">
<? foreach( $navitems as $item ): ?>
	<a href="<?=$item['href']?>"><?=$item['label']?></a>
<? endforeach; ?>
</div>

// home.class.php
class Home extends HtmlPage
{
	function Init()
	{
		$navitems = [['href'=>buildQuery('home'),'label'=>'Home']];
		Template::Make('topnav')->set('navitems',$navitems)->appendTo($this);
		$this->content("<h1>Hello World!</h1>");
	}
}

Building blocks

As mentioned above htmlpages are a special form of templates. Biggest difference is, that they may have their own tpl file rendered in the content of the global template of a html page. This way you can create a base class for all your htmlpages and define the basic layout there. Each controller inherits it so they will all look the same.

// basecontroller.tpl.php
<div class="topnav">
<? foreach( $navitems as $item ): ?>
	<a href="<?=$item['href']?>"><?=$item['label']?></a>
<? endforeach; ?>
</div>
<div> class="content">
	<? foreach($content as $c) echo $c; ?>
</div>

// basecontroller.class.php
abstract class BaseController extends HtmlPage
{
	function __initialize()
	{
		parent::__initialize("Site-Name");
		$this->set('navitems',[['href'=>buildQuery('home'),'label'=>'Home']]);
	}
}

// home.class.php
class Home extends BaseController
{
	function Init()
	{
		$this->content("<h1>Hello World!</h1>");
	}
}

// search.class.php
class Search extends BaseController
{
	function Init()
	{
		$this->content("<h1>This is the search page</h1>");
	}
}

As for now we only used 'anonymous' templates, this is when using the Template class for loading and handling of the data. You may also define an own class for a template to be able to process some business logic.

// repeater.tpl.php
<div class="repeater">
	<? foreach($items as $item) echo $item; ?>
</div>

// searchresult.tpl.php
<span class="searchresult"><?=$result?></span>

// repeater.class.php
class Repeater extends Template
{
	function __initialize()
	{
		parent::__initialize();
		$this->set('items',[]);
	}

	function addItem($item)
	{
		if( $item instanceof Template )
			$this->add2var('items',$item);
	}
}

// search.class.php
class Search extends BaseController
{
	function Init()
	{
		$this->content("<h1>This is the search page</h1>");
		$r = Repeater::Make()->appendTo($this);
		$r->addItem("This wont work");
		$r->AddItem(Template::Make('searchresult')->set('result','Whoa'));
	}
}
Clone this wiki locally