Use blockier-templates

This commit is contained in:
2022-02-21 16:13:28 +00:00
parent 7023025fdc
commit e58f514896
5 changed files with 148 additions and 227 deletions

View File

@@ -4,6 +4,7 @@
</div>
<div class="row">
{% block organisation_form %}
{% block organisation_field_name %}
{% if 'name' not in form.fields.hidden %}
<div class="col-sm-12">
<div class="form-group">
@@ -15,6 +16,9 @@
</div>
</div>
{% endif %}
{% endblock %}
{% block organisation_field_slug %}
{% if 'slug' not in form.fields.hidden %}
<div class="col-sm-12">
<div class="form-group">
@@ -35,6 +39,9 @@
{% else %}
<input type="hidden" name="slug" autocomplete="off" value="{{organisation.slug}}">
{% endif %}
{% endblock %}
{% block organisation_field_description %}
{% if 'description' not in form.fields.hidden %}
<div class="col-sm-12">
<div class="form-group">
@@ -44,14 +51,17 @@
</div>
{% endif %}
{% endblock %}
{% endblock %}
</div><br>
<div class="row">
{% block organisation_form_buttons %}
<div class="col-xs-6 col-sm-4">
<button type="submit" class="btn btn-block btn-lg btn-success">{{form.submit_text}}</button>
</div>
<div class="col-xs-4 col-sm-3 pull-right">
<button type="button" class="btn btn-block btn-lg btn-link" data-dismiss="modal">{{translate("CANCEL")}}</button>
</div>
{% endblock %}
</div>
</form>
<!-- Include validation rules -->

View File

@@ -1,4 +1,4 @@
{% extends "pages/abstract/dashboard.html.twig" %}
{% extends "@blockier-templates/pages/abstract/dashboard.html.twig" %}
{% block stylesheets_page %}
<!-- Page-specific CSS asset bundle -->
@@ -133,6 +133,7 @@
</div>
</div>
{% endblock %}
{% block scripts_page %}
<!-- Include page variables -->
<script>

View File

@@ -1,11 +1,4 @@
{# This partial template renders a table of organisations, to be populated with rows via an AJAX request.
# This extends a generic template for paginated tables.
#
# Note that this template contains a "skeleton" table with an empty table body, and then a block of Handlebars templates which are used
# to render the table cells with the data from the AJAX request.
#}
{% extends "tables/table-paginated.html.twig" %}
{% extends "tables/organisations.html.twig" %}
{% block table %}
<table id="{{table.id}}" class="tablesorter table table-bordered table-hover table-striped" data-sortlist="{{table.sortlist}}">
@@ -24,61 +17,21 @@
</table>
{% endblock %}
{% block table_cell_templates %}
{# This contains a series of <script> blocks, each of which is a client-side Handlebars template.
# Note that these are NOT Twig templates, although the syntax is similar. We wrap them in the `verbatim` tag,
# so that Twig will output them directly into the DOM instead of trying to treat them like Twig templates.
#
# These templates require handlebars-helpers.js, moment.js
#}
{% verbatim %}
<script id="organisation-table-column-info" type="text/x-handlebars-template">
{% block table_cell_template_info %}
{% verbatim %}
<script id="organisation-table-column-info" type="text/x-handlebars-template">
<td data-text="{{row.name}}">
<strong>
<a href="{{site.uri.public}}/organisations/o/{{row.slug}}">{{row.name}}</a>
</strong>
</td>
</script>
</script>
{% endverbatim %}
{% endblock %}
<script id="organisation-table-column-description" type="text/x-handlebars-template">
<td>
{{row.description}}
</td>
</script>
<script id="user-table-column-status" type="text/x-handlebars-template">
<td
{{#ifx row.flag_approved '==' 1 }}
data-text="approved"
{{ else }}
data-text="pending"
{{/ifx }}
>
{{#ifx row.flag_approved '==' 1 }}
<span>
{% endverbatim %}{{translate("APPROVED")}}{% verbatim %}
</span>
{{ else }}
<span class="text-danger">
{% endverbatim %}{{translate("PENDING")}}{% verbatim %}
</span>
{{/ifx }}
</td>
</script>
<script id="organisation-table-column-memberCount" type="text/x-handlebars-template">
<td>
{{row.member_count}}
</td>
</script>
<script id="organisation-table-column-adminCount" type="text/x-handlebars-template">
<td>
{{row.admin_count}}
</td>
</script>
<script id="organisation-table-column-actions" type="text/x-handlebars-template">
{% block table_cell_template_actions %}
{% verbatim %}
<script id="organisation-table-column-actions" type="text/x-handlebars-template">
<td>
<div class="btn-group">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
@@ -99,6 +52,8 @@
</ul>
</div>
</td>
</script>
{% endverbatim %}
</script>
{% endverbatim %}
{% endblock %}
{% block table_cell_template_join %}{% endblock %}

View File

@@ -28,12 +28,7 @@
{% endblock %}
{% block table_cell_templates %}
{# This contains a series of <script> blocks, each of which is a client-side Handlebars template.
# Note that these are NOT Twig templates, although the syntax is similar. We wrap them in the `verbatim` tag,
# so that Twig will output them directly into the DOM instead of trying to treat them like Twig templates.
#
# These templates require handlebars-helpers.js, moment.js
#}
{% block table_cell_template_info %}
{% verbatim %}
<script id="organisation-table-column-info" type="text/x-handlebars-template">
<td data-text="{{row.name}}">
@@ -50,13 +45,21 @@
</strong>
</td>
</script>
{% endverbatim %}
{% endblock %}
{% block table_cell_template_description %}
{% verbatim %}
<script id="organisation-table-column-description" type="text/x-handlebars-template">
<td>
{{row.description}}
</td>
</script>
{% endverbatim %}
{% endblock %}
{% block table_cell_template_status %}
{% verbatim %}
<script id="user-table-column-status" type="text/x-handlebars-template">
<td
{{#ifx row.flag_approved '==' 1 }}
@@ -76,19 +79,31 @@
{{/ifx }}
</td>
</script>
{% endverbatim %}
{% endblock %}
{% block table_cell_template_memberCount %}
{% verbatim %}
<script id="organisation-table-column-memberCount" type="text/x-handlebars-template">
<td>
{{row.member_count}}
</td>
</script>
{% endverbatim %}
{% endblock %}
{% block table_cell_template_adminCount %}
{% verbatim %}
<script id="organisation-table-column-adminCount" type="text/x-handlebars-template">
<td>
{{row.admin_count}}
</td>
</script>
{% endverbatim %}
{% endblock %}
{% block table_cell_template_join %}
{% verbatim %}
<script id="organisation-table-column-join" type="text/x-handlebars-template">
<td>
<div class="btn-group">
@@ -112,8 +127,12 @@
</div>
</td>
</script>
{% endverbatim %}
{% endblock %}
{% endverbatim %}{% if hasRole('site-admin') or hasRole('organisations-admin') %}{% verbatim %}
{% block table_cell_template_actions %}
{% if hasRole('site-admin') or hasRole('organisations-admin') %}
{% verbatim %}
<script id="organisation-table-column-actions" type="text/x-handlebars-template">
<td>
<div class="btn-group">
@@ -163,7 +182,9 @@
</div>
</td>
</script>
{% endverbatim %}{% else %}{% verbatim %}
{% endverbatim %}
{% else %}
{% verbatim %}
<script id="organisation-table-column-actions" type="text/x-handlebars-template">
<td>
{{#ifx row.is_admin '==' 1 }}
@@ -192,6 +213,9 @@
{{/ifx }}
</td>
</script>
{% endverbatim %}{% endif %}{% verbatim %}
{% endverbatim %}
{% endif %}
{% endblock %}
{% block table_cell_template_extra %}{% endblock %}
{% endblock %}

View File

@@ -1,11 +1,4 @@
{# This partial template renders a table of users, to be populated with rows via an AJAX request.
# This extends a generic template for paginated tables.
#
# Note that this template contains a "skeleton" table with an empty table body, and then a block of Handlebars templates which are used
# to render the table cells with the data from the AJAX request.
#}
{% extends "tables/table-paginated.html.twig" %}
{% extends "@blockier-templates/tables/users.html.twig" %}
{% block table %}
<table id="{{table.id}}" class="tablesorter table table-bordered table-hover table-striped" data-sortlist="{{table.sortlist}}">
@@ -28,83 +21,10 @@
</table>
{% endblock %}
{% block table_cell_templates %}
{# This contains a series of <script> blocks, each of which is a client-side Handlebars template.
# Note that these are NOT Twig templates, although the syntax is similar. We wrap them in the `verbatim` tag,
# so that Twig will output them directly into the DOM instead of trying to treat them like Twig templates.
#
# These templates require handlebars-helpers.js, moment.js
#}
{% verbatim %}
<script id="user-table-column-info" type="text/x-handlebars-template">
<td data-text="{{row.last_name}}">
<strong>
<a href="{{site.uri.public}}/users/u/{{row.user_name}}">{{row.first_name}} {{row.last_name}} ({{row.user_name}})</a>
</strong>
<div class="js-copy-container">
<span class="js-copy-target">{{row.email}}</span>
<button class="btn btn-xs uf-copy-trigger js-copy-trigger"><i class="fas fa-copy"></i></button>
</div>
</td>
</script>
<script id="user-table-column-organisations" type="text/x-handlebars-template">
{{#if row.organisations.length }}
<td style="line-height: 2em;">
{{#each row.organisations }}
<a href="{% endverbatim %}{{site.uri.public}}{% verbatim %}/organisations/o/{{this.slug}}" class="label label-primary {{#if this.pivot.flag_admin }}organisation-admin{{/if}}" title="{{this.description}}" data-text="{{this.name}}" style="font-size: 100%;">{{this.name}}</a><br>
{{/each}}
</td>
{{ else }}
<td></td>
{{/if }}
</script>
<script id="user-table-column-last-activity" type="text/x-handlebars-template">
{{#if row.last_activity }}
<td data-num="{{dateFormat row.last_activity.occurred_at format='x'}}">
{{dateFormat row.last_activity.occurred_at format="dddd"}}<br>{{dateFormat row.last_activity.occurred_at format="MMM Do, YYYY h:mm a"}}
<br>
<i>{{row.last_activity.description}}</i>
</td>
{{ else }}
<td data-num="0">
<i>{% endverbatim %}{{translate("UNKNOWN")}}{% verbatim %}</i>
</td>
{{/if }}
</script>
<script id="user-table-column-status" type="text/x-handlebars-template">
<td
{{#ifx row.flag_enabled '==' 0 }}
data-text="disabled"
{{ else }}
{{#ifx row.flag_verified '==' 0 }}
data-text="unactivated"
{{ else }}
data-text="active"
{{/ifx }}
{{/ifx }}
>
{{#ifx row.flag_enabled '==' 0 }}
<span class="text-muted">
{% endverbatim %}{{translate("DISABLED")}}{% verbatim %}
</span>
{{ else }}
{{#ifx row.flag_verified '==' 0 }}
<span class="text-yellow">
{% endverbatim %}{{translate("UNACTIVATED")}}{% verbatim %}
</span>
{{ else }}
<span>
{% endverbatim %}{{translate("ACTIVE")}}{% verbatim %}
</span>
{{/ifx }}
{{/ifx }}
</td>
</script>
<script id="user-table-column-actions" type="text/x-handlebars-template">
{% block table_cell_template_actions %}
{% verbatim %}
<script id="user-table-column-actions" type="text/x-handlebars-template">
<td class="uf-table-fit-width">
<div class="btn-group">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">{% endverbatim %}{{translate("ACTIONS")}}{% verbatim %}<span class="caret"></span></button>
@@ -155,14 +75,25 @@
</ul>
</div>
</td>
</script>
</script>
{% endverbatim %}
{% endblock %}
<script id="user-table-column-via-roles" type="text/x-handlebars-template">
<td>
{{#each row.roles_via }}
<a href="{% endverbatim %}{# Handlebars can't access variables in the global scope, so we have to use Twig to insert the base url #}{{site.uri.public}}{% verbatim %}/roles/r/{{this.slug}}" class="label label-primary" title="{{this.description}}">{{this.name}}</a>
{% block table_cell_template_extra %}
{% block table_cell_template_organisations %}
{% verbatim %}
<script id="user-table-column-organisations" type="text/x-handlebars-template">
{{#if row.organisations.length }}
<td style="line-height: 2em;">
{{#each row.organisations }}
<a href="{% endverbatim %}{{site.uri.public}}{% verbatim %}/organisations/o/{{this.slug}}" class="label label-primary {{#if this.pivot.flag_admin }}organisation-admin{{/if}}" title="{{this.description}}" data-text="{{this.name}}" style="font-size: 100%;">{{this.name}}</a><br>
{{/each}}
</td>
{{ else }}
<td></td>
{{/if }}
</script>
{% endverbatim %}
{% endblock %}
{% endblock %}