[Define New Theme] 14. Template files need re-broken out into more modular codebase

General discussion of development ideas and the approaches taken in the 3.x branch of phpBB. The current feature release of phpBB 3 is 3.3/Proteus.
Forum rules
Please do not post support questions regarding installing, updating, or upgrading phpBB 3.3.x. If you need support for phpBB 3.3.x please visit the 3.3.x Support Forum on phpbb.com.

If you have questions regarding writing extensions please post in Extension Writers Discussion to receive proper guidance from our staff and community.
Post Reply
User avatar
hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 968
Joined: Sat Dec 25, 2010 9:02 pm
Contact:

[Define New Theme] 14. Template files need re-broken out into more modular codebase

Post by hanakin »

*Note This is part 14 of a series found here

Warning is going to be a very lengthy post so get some coffee!


In order to provide for a more modular and cleaner CodeBase we need to break our template files up in a more thoughtful manner.

we need to instead break our files into global elements, block level elements, and component-based elements.

How we do this is a matter for discussion but by doing this we allow for the code to be more modular and more maintainable overtime.

For example:

Viewforum.html would be a global level template file.

The different blocks or sections of this would be their own block level template files.

So header, primary-navigation, actionbar, forum, stats, footer

Then if further separation is needed you can have smaller component based template files to re-create those reusable pieces of code. This comes in handy when working with looping through elements such as the form rows.

As far as how to break these out naming wise and folder structure wise I'm open to suggestions however I had a few different ideas

The easiest way would be to define a master template for all the header and footer includes. Then establish global template files to extend the master layout. These would keep the current names such as viewforum, UCP, MCP etc.

We would then break these files up into individual blocks and prepend the word block into the front of them to provide separation from the global template files.

We could then further break these down into reusable pieces of code that we call components that could be prepended with the word component or partial however we want to label it.

This is just one example of how we can better organize the template directory. We can of course do the same thing with folders so you have a master layout and all of your global files in the main template directory. Then you have a separate directory for blocks and components.

Thoughts and suggestions
Donations welcome via Paypal Image

keith10456
Registered User
Posts: 523
Joined: Sat Apr 22, 2006 10:29 pm
Contact:

Re: [Define New Theme] 14. Template files need re-broken out into more modular codebase

Post by keith10456 »

The overall concept sounds like it makes sense. However, I look forward to the comments of others that are more experienced/advanced in website design.

User avatar
PayBas
Registered User
Posts: 305
Joined: Tue Jul 29, 2008 6:08 pm
Contact:

Re: [Define New Theme] 14. Template files need re-broken out into more modular codebase

Post by PayBas »

Sounds good. I've actually tried this, but it can be tricky. Take this code for example, which is a tools include template:

Code: Select all

<!-- IF S_VIEWFORUM -->
<form method="post" action="{S_FORUM_ACTION}">
<!-- ELSEIF S_VIEWTOPIC -->
<form id="viewtopic" method="post" action="{S_TOPIC_ACTION}">
<!-- ELSEIF S_IN_SEARCH -->
<form method="post" action="{S_SEARCH_ACTION}">
<!-- ENDIF -->

<fieldset class="display-options">
	<label for="sk">{BLABLA} </label>
	<input class="button2" type="submit" name="sort" value="{BLABLA2}" />
</fieldset>

<!-- IF S_VIEWFORUM or S_VIEWTOPIC or S_IN_SEARCH -->
</form>
<!-- ENDIF -->
You could argue that this will not be a problem if the templates are harmonized better, but still...

Second point is that I'm not exactly sure how the twig caching system works with loop includes.

User avatar
wilkinsocks
Registered User
Posts: 5
Joined: Tue May 05, 2015 5:33 am
Location: United Kingdom

Re: [Define New Theme] 14. Template files need re-broken out into more modular codebase

Post by wilkinsocks »

I've been using Laravel (a somewhat new mvc framework) recently to build some PHP applications, and it's got this templating system part of it that I personally find quite effective. I'll admit, I've not really looked into twig yet, sorry if it already does the same thing.

You make a master file. Example below.

Code: Select all

<html>
<head>
	<title>@yield('title')</title>
</head>
<body>
	<div class="content">
		@yield('content')
	</div>
</body>
</html>
All other files extend a master such as the one above. Example Below.

Code: Select all

@extends('master')

@section('title')
	Page title
@endsection

@section('content')
	Some HTML
	{{ Some php }}
	
	@foreach ($users as $user)
    		<p>This is user {{ $user->id }}</p>
	@endforeach
	
@endsection

Laravel call these template files 'blades', so the files are like: 'FileName.blade.php'

If you consider WordPress' and phpbb's current method is much more basic, just including the header and a footer within each file. The cool thing about this method is that you can place 'yield tags' wherever you want or need. A good example is within the header and towards the bottom of the page to include JS scripts on a page by page basis as opposed to including them on every single page. Do we really need to load scripts required for the registration on every single page for instance?

I've dug out a class that controls it for their framework from the source if anyone is interested https://github.com/laravel/framework/bl ... mpiler.php

Nicofuma
3.2 Release Manager
3.2 Release Manager
Posts: 299
Joined: Sun Apr 13, 2014 1:40 am
Location: Paris

Re: [Define New Theme] 14. Template files need re-broken out into more modular codebase

Post by Nicofuma »

It's perfectly possible to do that with twig and it's even the preferred way :)

We don't use it yet in phpbb because prosilver is old but it shouldn't be the case for the new theme :)
Member of the phpBB Development-Team
No Support via PM

Khaos-Rage
Registered User
Posts: 35
Joined: Wed Aug 06, 2014 12:27 am

Re: [Define New Theme] 14. Template files need re-broken out into more modular codebase

Post by Khaos-Rage »

wilkinsocks wrote:I've been using Laravel (a somewhat new mvc framework) recently to build some PHP applications, and it's got this templating system part of it that I personally find quite effective.
Yeah phpBB is built using some of the Symfony components. Laravel also uses some of the Symfony components eg. (routing). And Twig is basically what your describing. Currently phpBB uses a lexer for twig.

Taken from Twig site. This is a example of basic twig.

Code: Select all

{% extends "layout.html" %}

{% block content %}
    Content of the page...
{% endblock %}

Post Reply