[ticket/17100] Use twig functions for form elements

PHPBB3-17100
This commit is contained in:
Marc Alexander 2023-04-09 13:12:39 +02:00
parent 69f5d5f40f
commit 60dacf0bfe
No known key found for this signature in database
GPG key ID: 50E0D2423696F995
21 changed files with 313 additions and 116 deletions

View file

@ -37,7 +37,6 @@
<!-- IF S_ATTACHMENT_SETTINGS -->
{% import 'macros/form_macros.twig' as form_macros %}
<form id="attachsettings" method="post" action="{U_ACTION}">
<!-- BEGIN options -->
<!-- IF options.S_LEGEND -->
@ -52,7 +51,7 @@
<dt><label for="{options.KEY}">{options.TITLE}{L_COLON}</label><!-- IF options.S_EXPLAIN --><br /><span>{options.TITLE_EXPLAIN}</span><!-- ENDIF --></dt>
<dd>
{% if options.CONTENT is iterable %}
{{ form_macros.build_template(options.CONTENT)}}
{{ FormsBuildTemplate(options.CONTENT)}}
{% else %}
{options.CONTENT}
{% endif %}
@ -210,8 +209,7 @@
<dt><label for="extgroup_filesize">{L_MAX_EXTGROUP_FILESIZE}{L_COLON}</label></dt>
<dd>
<input type="number" id="extgroup_filesize" min="0" max="999999999999999" step="any" name="max_filesize" value="{EXTGROUP_FILESIZE}" />
{% from 'macros/form_macros.twig' import select %}
{{ select(EXT_GROUP_SIZE_OPTIONS) }}
{{ FormsSelect(EXT_GROUP_SIZE_OPTIONS) }}
</dd>
</dl>
<dl>

View file

@ -13,7 +13,6 @@
</div>
<!-- ENDIF -->
{% import 'macros/form_macros.twig' as form_macros %}
<form id="acp_board" method="post" action="{U_ACTION}">
<!-- BEGIN options -->
@ -30,7 +29,7 @@
<dt><label for="{options.KEY}">{options.TITLE}{L_COLON}</label><!-- IF options.S_EXPLAIN --><br /><span>{options.TITLE_EXPLAIN}</span><!-- ENDIF --></dt>
<dd>
{% if options.CONTENT is iterable %}
{{ form_macros.build_template(options.CONTENT)}}
{{ FormsBuildTemplate(options.CONTENT)}}
{% else %}
{{ options.CONTENT }}
{% endif %}

View file

@ -32,8 +32,7 @@
<dl>
<dt><label for="{{ LANG_OPTIONS.id }}">{L_BOT_LANG}{L_COLON}</label><br /><span>{L_BOT_LANG_EXPLAIN}</span></dt>
<dd>
{% import 'macros/form_macros.twig' as form_macros %}
{{ form_macros.select(LANG_OPTIONS) }}
{{ FormsSelect(LANG_OPTIONS) }}
</dd>
</dl>
<dl>

View file

@ -65,8 +65,7 @@
<!-- ENDIF -->
<fieldset class="quick">
{% from 'macros/form_macros.twig' import select %}
{{ select(INACTIVE_OPTIONS) }}
{{ FormsSelect(INACTIVE_OPTIONS) }}
<input class="button2" type="submit" name="submit" value="{L_SUBMIT}" />
<p class="small"><a href="#" onclick="marklist('inactive', 'mark', true); return false;">{L_MARK_ALL}</a> &bull; <a href="#" onclick="marklist('inactive', 'mark', false); return false;">{L_UNMARK_ALL}</a></p>
{S_FORM_TOKEN}

View file

@ -43,8 +43,7 @@
<dl>
<dt><label for="{{ LANG_OPTIONS.id }}">{L_BOARD_LANGUAGE}{L_COLON}</label></dt>
<dd>
{% import 'macros/form_macros.twig' as form_macros %}
{{ form_macros.select(LANG_OPTIONS) }}
{{ FormsSelect(LANG_OPTIONS) }}
</dd>
</dl>
<dl>

View file

@ -1,15 +1,14 @@
<dl>
{% from "macros/form_macros.twig" import select %}
<dt><label for="timezone">{{ lang('BOARD_TIMEZONE') | lang('COLON') }}</label></dt>
<dt><label for="timezone">{{ lang('BOARD_TIMEZONE') ~ lang('COLON') }}</label></dt>
{% if TIMEZONE_OPTIONS %}
<dd id="tz_select_date hidden">
{% set tz_date_data = TIMEZONE_OPTIONS|merge({ options: [{ value: "", label: lang('SELECT_CURRENT_TIME') }]|merge(TIMEZONE_OPTIONS.options) }) %}
{{ select(tz_date_data, 'autowidth tz_select', 'tz_date', 'tz_date', true) }}
{% set tz_date_data = TIMEZONE_OPTIONS | merge({options: [{ value: "", label: lang('SELECT_CURRENT_TIME')}] | merge(TIMEZONE_OPTIONS.options) }) %}
{{ FormsSelect(tz_date_data | merge({class: 'autowidth tz_select', id: 'tz_date', name: 'tz_date', group_only: true})) }}
</dd>
{% endif %}
<dd>
{% set tz_select_data = TIMEZONE_OPTIONS|merge({ options: [{ value: "", label: lang('SELECT_TIMEZONE') }]|merge(TIMEZONE_OPTIONS.options) }) %}
{{ select(tz_select_data, 'autowidth tz_select', 'timezone') }}
{% set tz_select_data = TIMEZONE_OPTIONS | merge({ options: [{ value: "", label: lang('SELECT_TIMEZONE') }] | merge(TIMEZONE_OPTIONS.options) }) %}
{{ FormsSelect(tz_select_data | merge({class: 'autowidth tz_select', id: 'timezone'})) }}
{% INCLUDEJS('timezone.js') %}
</dd>

View file

@ -69,6 +69,13 @@ services:
template.twig.extensions.debug:
class: Twig\Extension\DebugExtension
template.twig.extensions.forms:
class: phpbb\template\twig\extension\forms
arguments:
- '@user'
tags:
- { name: twig.extension }
template:
class: phpbb\template\twig\twig
arguments:

View file

@ -75,7 +75,7 @@ class environment extends \Twig\Environment
$options = array_merge(array(
'cache' => (defined('IN_INSTALL')) ? false : $cache_path,
'debug' => false,
'debug' => true,
'auto_reload' => (bool) $this->phpbb_config['load_tplcompile'],
'autoescape' => false,
), $options);

View file

@ -0,0 +1,217 @@
<?php
/**
*
* This file is part of the phpBB Forum Software package.
*
* @copyright (c) phpBB Limited <https://www.phpbb.com>
* @license GNU General Public License, version 2 (GPL-2.0)
*
* For full copyright and license information, please see
* the docs/CREDITS.txt file.
*
*/
namespace phpbb\template\twig\extension;
use phpbb\template\twig\environment;
use phpbb\user;
use Twig\Extension\AbstractExtension;
use Twig\TwigFunction;
class forms extends AbstractExtension
{
/** @var user */
protected $user;
/**
* Constructor.
*
* @param user $user User object
*/
public function __construct(user $user)
{
$this->user = $user;
}
/**
* Returns the name of this extension.
*
* @return string The extension name
*/
public function getName()
{
return 'forms';
}
/**
* Returns a list of functions to add to the existing list.
*
* @return TwigFunction[] Array of twig functions
*/
public function getFunctions(): array
{
return [
new TwigFunction('FormsBuildTemplate', [$this, 'build_template'], ['needs_environment' => true]),
new TwigFunction('FormsDimension', [$this, 'dimension'], ['needs_environment' => true]),
new TwigFunction('FormsInput', [$this, 'input'], ['needs_environment' => true]),
new TwigFunction('FormsRadioButtons', [$this, 'radio_buttons'], ['needs_environment' => true]),
new TwigFunction('FormsSelect', [$this, 'select'], ['needs_environment' => true]),
new TwigFunction('FormsTextarea', [$this, 'textarea'], ['needs_environment' => true]),
];
}
/**
* Renders a form template
*
* @param environment $environment
* @param array $form_data
*
* @return string Rendered form template
*/
public function build_template(environment $environment, array $form_data): string
{
try
{
return $environment->render('macros/forms/build_template.twig', [
'form_data' => $form_data ?? [],
]);
}
catch (\Twig\Error\Error $e)
{
return '';
}
}
/**
* Renders form dimension fields
*
* @param environment $environment The twig environment
* @param array $form_data The form data
*
* @return string Form dimension fields
*/
public function dimension(environment $environment, array $form_data): string
{
try
{
return $environment->render('macros/forms/dimension.twig', [
'WIDTH' => $form_data['width'],
'HEIGHT' => $form_data['height'],
]);
}
catch (\Twig\Error\Error $e)
{
return '';
}
}
/**
* Renders a form input field
*
* @param environment $environment The twig environment
* @param array $form_data The form data
*
* @return string Form input field
*/
public function input(environment $environment, array $form_data): string
{
try
{
return $environment->render('macros/forms/input.twig', [
'ID' => (string) $form_data['id'] ?? '',
'TYPE' => (string) $form_data['type'],
'NAME' => (string) $form_data['name'],
'SIZE' => (int) $form_data['size'] ?? 0,
'MAXLENGTH' => (int) $form_data['maxlength'] ?? 0,
'MIN' => (int) $form_data['min'] ?? 0,
'MAX' => (int) $form_data['max'] ?? 0,
'STEP' => (int) $form_data['step'] ?? 0,
'CHECKED' => (bool) $form_data['checked'] ?? false,
'CLASS' => (string) $form_data['class'] ?? '',
'VALUE' => (string) $form_data['value'],
]);
}
catch (\Twig\Error\Error $e)
{
return '';
}
}
/**
* Renders form radio buttons
*
* @param environment $environment The twig environment
* @param array $form_data The form data
*
* @return string Form radio buttons
*/
public function radio_buttons(environment $environment, array $form_data): string
{
try
{
return $environment->render('macros/forms/radio_buttons.twig', [
'FIRST_BUTTON' => $form_data['buttons'][0],
'FIRST_BUTTON_LABEL' => $form_data['buttons'][0]['label'],
'SECOND_BUTTON' => $form_data['buttons'][1],
'SECOND_BUTTON_LABEL' => $form_data['buttons'][1]['label'],
]);
}
catch (\Twig\Error\Error $e)
{
return '';
}
}
/**
* Renders a form select field
*
* @param environment $environment The twig environment
* @param array $form_data The form data
*
* @return string Form select field
*/
public function select(environment $environment, array $form_data): string
{
try
{
return $environment->render('macros/forms/select.twig', [
'ID' => (string) $form_data['id'] ?? '',
'CLASS' => (string) $form_data['class'] ?? '',
'NAME' => (string) $form_data['name'],
'TOGGLEABLE' => (bool) $form_data['toggleable'] ?? false,
'OPTIONS' => $form_data['options'] ?? [],
'GROUP_ONLY' => (bool) $form_data['group_only'] ?? false,
]);
}
catch (\Twig\Error\Error $e)
{
return '';
}
}
/**
* Renders a form textarea field
*
* @param environment $environment
* @param array $form_data
*
* @return string Form textarea field
*/
public function textarea(environment $environment, array $form_data): string
{
try
{
return $environment->render('macros/forms/textarea.twig', [
'ID' => (string) $form_data['id'] ?? '',
'NAME' => (string) $form_data['name'] ?? '',
'ROWS' => (int) $form_data['rows'] ?? 1,
'COLS' => (int) $form_data['cols'] ?? 1,
'CONTENT' => (string) $form_data['content'] ?? '',
]);
}
catch (\Twig\Error\Error $e)
{
return '';
}
}
}

View file

@ -90,6 +90,7 @@ class twig extends \phpbb\template\base
{
$this->twig->addExtension($extension);
}
$this->twig->addExtension(new \Twig\Extension\DebugExtension());
// Add admin namespace
if ($this->path_helper->get_adm_relative_path() !== null

View file

@ -1,86 +0,0 @@
{% macro input(form_data) %}
{% apply replace({"\n": ' ', '\t': ''}) %}
<input
{% if form_data.id %}id="{{ form_data.id }}"{% endif %}
type="{{ form_data.type }}"
name="{{ form_data.name }}"
{% if form_data.size %}size="{{ form_data.size }}"{% endif %}
{% if form_data.maxlength %}maxlength="{{ form_data.maxlength }}"{% endif %}
{% if form_data.min %}min="{{ form_data.min }}"{% endif %}
{% if form_data.max %}max="{{ form_data.max }}"{% endif %}
{% if form_data.step %}step="{{ form_data.step }}"{% endif %}
{% if form_data.type == 'password' %}autocomplete="off"{% endif %}
{% if form_data.checked %}checked="checked"{% endif %}
{% if form_data.class %}class="{{ form_data.class }}"{% endif %}
value="{{ form_data.value }}">
{% endapply %}
{% endmacro %}
{% macro dimension(form_data) %}
{{ _self.input(form_data.width) }} x {{ _self.input(form_data.height) }}
{% endmacro %}
{% macro textarea(form_data) %}
{% apply replace({"\n": ' ', '\t': ''}) %}
<textarea
id="{{ form_data.id }}"
name="{{ form_data.name }}"
rows="{{ form_data.rows }}"
cols="{{ form_data.cols }}">
{{ form_data.content }}
</textarea>
{% endapply %}
{% endmacro %}
{% macro radio_buttons(form_data) %}
<label>{{ _self.input(form_data.buttons[0]) ~ form_data.buttons[0].label }}</label>
<label>{{ _self.input(form_data.buttons[1]) ~ form_data.buttons[1].label }}</label>
{% endmacro %}
{% macro select(form_data, class, id, name, group_only) %}
{% apply replace({"\n": ' ', '\t': ''}) %}
<select
{% if id %}id="{{ id }}"{% endif %}
{% if class %}class="{{ class }}"{% endif %}
name="{% if name %}{{ name }}{% else %}{{ form_data.name }}{% endif %}"
{% if form_data.toggleable %}data-togglable-settings="true"{% endif %}
{% if form_data.size %}size="{{ form_data.size }}"{% endif %}>
{% endapply %}
{% for element in form_data.options %}
{% if not group_only and element.options %}
{% apply replace({"\n": ' ', '\t': ''}) %}
<optgroup
label="{{ element.label }}"
{% for key, value in element.data %}
data-{{ key }}="{{ value }}"
{% endfor %}>
{% endapply %}
{% for option in element.options %}
<option value="{{ option.value }}"{% if option.selected %} selected="selected"{% endif %}>{{ option.label }}</option>
{% endfor %}
</optgroup>
{% else %}
<option value="{{ element.value }}"{% if element.selected %} selected="selected"{% endif %}>{{ element.label }}</option>
{% endif %}
{% endfor %}
</select>
{% endmacro %}
{% macro build_template(form_data) %}
{% if form_data.tag == 'input' %}
{{ _self.input(form_data) }}
{% elseif form_data.tag == 'dimension' %}
{{ _self.dimension(form_data) }}
{% elseif form_data.tag == 'radio' %}
{{ _self.radio_buttons(form_data) }}
{% elseif form_data.tag == 'select' %}
{{ _self.select(form_data) }}
{% elseif form_data.tag == 'textarea' %}
{{ _self.textarea(form_data) }}
{% elseif form_data[0] %}
{% for element in form_data %}
{{ _self.build_template(element) }}
{% endfor %}
{% endif %}
{% if form_data.append %}{{ form_data.append }}{% endif %}
{% endmacro %}

View file

@ -0,0 +1,16 @@
{% if form_data.tag == 'input' %}
{{ FormsInput(form_data) }}
{% elseif form_data.tag == 'dimension' %}
{{ FormsDimension(form_data) }}
{% elseif form_data.tag == 'radio' %}
{{ FormsRadioButtons(form_data) }}
{% elseif form_data.tag == 'select' %}
{{ FormsSelect(form_data) }}
{% elseif form_data.tag == 'textarea' %}
{{ FormsTextarea(form_data) }}
{% elseif form_data[0] %}
{% for element in form_data %}
{{ FormsBuildTemplate(element) }}
{% endfor %}
{% endif %}
{% if form_data.append %}{{ form_data.append }}{% endif %}

View file

@ -0,0 +1 @@
{{ FormsInput(WIDTH) }} x {{ FormsInput(HEIGHT) }}

View file

@ -0,0 +1,15 @@
{% apply replace({"\n": ' ', "\t": ''}) %}
<input
{% if ID %}id="{{ ID }}" {% endif %}
type="{{ TYPE }}"
name="{{ NAME }}"
{% if SIZE %}size="{{ SIZE }}" {% endif %}
{% if MAXLENGTH %}maxlength="{{ MAXLENGTH }}" {% endif %}
{% if MIN %}min="{{ MIN }}" {% endif %}
{% if MAX %}max="{{ MAX }}" {% endif %}
{% if STEP %}step="{{ STEP }}" {% endif %}
{% if TYPE == 'password' %}autocomplete="off" {% endif %}
{% if CHECKED %}checked="checked" {% endif %}
{% if CLASS %}class="{{ CLASS }}" {% endif %}
value="{{ VALUE }}">
{% endapply %}

View file

@ -0,0 +1,2 @@
<label>{{ FormsInput(FIRST_BUTTON) ~ FIRST_BUTTON_LABEL }}</label>
<label>{{ FormsInput(SECOND_BUTTON) ~ SECOND_BUTTON_LABEL }}</label>

View file

@ -0,0 +1,26 @@
{% apply replace({"\n": ' ', "\t": ''}) %}
<select
{% if ID %}id="{{ ID }}" {% endif %}
{% if CLASS %}class="{{ CLASS }}" {% endif %}
name="{{ NAME }}"
{% if TOGGLEABLE %}data-togglable-settings="true" {% endif %}
{% if SIZE %}size="{{ SIZE }}" {% endif %}>
{% endapply %}
{% for element in OPTIONS %}
{% if not GROUP_ONLY and element.options %}
{% apply replace({"\n": ' ', '\t': ''}) %}
<optgroup
label="{{ element.label }}"
{% for key, value in element.data %}
data-{{ key }}="{{ value }}"
{% endfor %}>
{% endapply %}
{% for option in element.options %}
<option value="{{ option.value }}"{% if option.selected %} selected="selected"{% endif %}>{{ option.label }}</option>
{% endfor %}
</optgroup>
{% else %}
<option value="{{ element.value }}"{% if element.selected %} selected="selected"{% endif %}>{{ element.label }}</option>
{% endif %}
{% endfor %}
</select>

View file

@ -0,0 +1,9 @@
{% apply replace({"\n": ' ', '\t': ''}) %}
<textarea
id="{{ ID }}"
name="{{ NAME }}"
rows="{{ ROWS }}"
cols="{{ COLS }}">
{{ CONTENT }}
</textarea>
{% endapply %}

View file

@ -1,16 +1,15 @@
<dl>
{% from "macros/form_macros.twig" import select %}
<dt><label for="timezone">{{ lang('BOARD_TIMEZONE') ~ lang('COLON') }}</label></dt>
{% if TIMEZONE_OPTIONS %}
<dd id="tz_select_date hidden">
{% set tz_date_data = TIMEZONE_OPTIONS|merge({ options: [{ value: "", label: lang('SELECT_CURRENT_TIME') }]|merge(TIMEZONE_OPTIONS.options) }) %}
{{ select(tz_date_data, 'autowidth tz_select', 'tz_date', 'tz_date', true) }}
{% set tz_date_data = TIMEZONE_OPTIONS | merge({ options: [{ value: "", label: lang('SELECT_CURRENT_TIME') }] | merge(TIMEZONE_OPTIONS.options) }) %}
{{ FormsSelect(tz_date_data | merge({class: 'autowidth tz_select', id: 'tz_date', name: 'tz_date', group_only: true})) }}
<input type="button" id="tz_select_date_suggest" class="button1 button button-form-bold" style="display: none;" timezone-preselect="<!-- IF S_TZ_PRESELECT -->true<!-- ELSE -->false<!-- ENDIF -->" data-l-suggestion="{L_TIMEZONE_DATE_SUGGESTION}" value="{L_TIMEZONE_DATE_SUGGESTION}" />
</dd>
{% endif %}
<dd>
{% set tz_select_data = TIMEZONE_OPTIONS|merge({ options: [{ value: "", label: lang('SELECT_TIMEZONE') }]|merge(TIMEZONE_OPTIONS.options) }) %}
{{ select(tz_select_data, 'autowidth tz_select timezone', 'timezone') }}
{% set tz_select_data = TIMEZONE_OPTIONS | merge({ options: [{ value: "", label: lang('SELECT_TIMEZONE') }] | merge(TIMEZONE_OPTIONS.options) }) %}
{{ FormsSelect(tz_select_data | merge({class: 'autowidth tz_select', id: 'timezone'})) }}
{% INCLUDEJS('timezone.js') %}
</dd>

View file

@ -6,8 +6,7 @@
<form method="post" action="{S_UCP_ACTION}" id="register">
<p class="rightside">
<label for="{{ LANG_OPTIONS.id }}">{{ lang('LANGUAGE') ~ lang('COLON') }}</label>
{% import "macros/form_macros.twig" as form_macros %}
{{ form_macros.select(LANG_OPTIONS) }}
{{ FormsSelect(LANG_OPTIONS) }}
{S_HIDDEN_FIELDS}
</p>
</form>

View file

@ -54,8 +54,7 @@
<dl>
<dt><label for="{{ LANG_OPTIONS.id }}">{L_BOARD_LANGUAGE}{L_COLON}</label></dt>
<dd>
{% import "macros/form_macros.twig" as form_macros %}
{{ form_macros.select(LANG_OPTIONS) }}
{{ FormsSelect(LANG_OPTIONS) }}
</dd>
</dl>
<!-- ENDIF -->

View file

@ -61,8 +61,7 @@
<dl>
<dt><label for="{{ LANG_OPTIONS.id }}">{{ lang('LANGUAGE') ~ lang('COLON') }}</label></dt>
<dd>
{% import "macros/form_macros.twig" as form_macros %}
{{ form_macros.select(LANG_OPTIONS) }}
{{ FormsSelect(LANG_OPTIONS) }}
</dd>
</dl>
<script>