templates: Abstract render_bundle behind a Jinja2 macro.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
This commit is contained in:
Anders Kaseorg 2019-09-13 17:44:46 -07:00 committed by Tim Abbott
parent 1df5cdc41a
commit 9b38bcc2a6
40 changed files with 61 additions and 55 deletions

View File

@ -70,8 +70,8 @@ needs to be accessible from one of the entry points defined in
`app` and `common` bundles. `app` and `common` bundles.
* If it's just used on a single standalone page (e.g. `/stats`), * If it's just used on a single standalone page (e.g. `/stats`),
create a new entry point in `tools/webpack.assets.json`. Use the create a new entry point in `tools/webpack.assets.json`. Use the
`render_bundle` function in the relevant Jinja2 template to inject `bundle` macro (defined in `templates/zerver/base.html`) in the
the compiled JS and CSS. relevant Jinja2 template to inject the compiled JS and CSS.
If you want to test minified files in development, look for the If you want to test minified files in development, look for the
`DEBUG =` line in `zproject/settings.py` and set it to `False`. `DEBUG =` line in `zproject/settings.py` and set it to `False`.

View File

@ -9,7 +9,7 @@
{% block customhead %} {% block customhead %}
{{ super() }} {{ super() }}
{{ render_bundle('activity') }} {{ bundle('activity') }}
{% endblock %} {% endblock %}
{% block content %} {% block content %}

View File

@ -7,14 +7,14 @@
{% endblock %} {% endblock %}
{% block customhead %} {% block customhead %}
{{ render_bundle('portico') }} {{ bundle('portico') }}
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="app portico-page"> <div class="app portico-page">
{{ render_bundle('translations') }} {{ bundle('translations') }}
{{ render_bundle('stats') }} {{ bundle('stats') }}
<div class="page-content"> <div class="page-content">
<div id="id_stats_errors" class="alert alert-error"></div> <div id="id_stats_errors" class="alert alert-error"></div>

View File

@ -9,8 +9,8 @@
{% block customhead %} {% block customhead %}
{{ super() }} {{ super() }}
{{ render_bundle('activity') }} {{ bundle('activity') }}
{{ render_bundle('support') }} {{ bundle('support') }}
{% endblock %} {% endblock %}
{% block content %} {% block content %}

View File

@ -2,7 +2,7 @@
{% block customhead %} {% block customhead %}
{{ super() }} {{ super() }}
{{ render_bundle('confirm-preregistrationuser') }} {{ bundle('confirm-preregistrationuser') }}
{% endblock %} {% endblock %}
{% block content %} {% block content %}

View File

@ -2,8 +2,8 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{{ render_bundle('billing') }} {{ bundle('billing') }}
<script src="https://checkout.stripe.com/checkout.js"></script> <script src="https://checkout.stripe.com/checkout.js"></script>
{% endblock %} {% endblock %}
@ -13,7 +13,7 @@
{% include 'zerver/billing_nav.html' %} {% include 'zerver/billing_nav.html' %}
{{ render_bundle('translations') }} {{ bundle('translations') }}
<div class="portico-landing billing-upgrade-page"> <div class="portico-landing billing-upgrade-page">
<div class="hero small-hero"></div> <div class="hero small-hero"></div>

View File

@ -6,7 +6,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}
{% block portico_content %} {% block portico_content %}

View File

@ -11,8 +11,8 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{{ render_bundle('upgrade') }} {{ bundle('upgrade') }}
<script src="https://checkout.stripe.com/checkout.js"></script> <script src="https://checkout.stripe.com/checkout.js"></script>
{% endblock %} {% endblock %}
@ -22,7 +22,7 @@
{% include 'zerver/billing_nav.html' %} {% include 'zerver/billing_nav.html' %}
{{ render_bundle('translations') }} {{ bundle('translations') }}
<div class="portico-landing billing-upgrade-page"> <div class="portico-landing billing-upgrade-page">
<div class="hero small-hero"></div> <div class="hero small-hero"></div>

View File

@ -6,7 +6,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}
{% block portico_content %} {% block portico_content %}

View File

@ -16,8 +16,8 @@
{% endblock %} {% endblock %}
{% block commonjs %} {% block commonjs %}
{{ render_bundle('app', attrs='nonce="%s"' % (csp_nonce,)) }} {{ bundle('app') }}
{{ render_bundle('katex', attrs='nonce="%s"' % (csp_nonce,)) }} {{ bundle('katex') }}
{% endblock %} {% endblock %}
{% block customhead %} {% block customhead %}

View File

@ -5,7 +5,7 @@
<style media="screen"> <style media="screen">
.app.portico-page { padding-bottom: 0px; } .app.portico-page { padding-bottom: 0px; }
</style> </style>
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}
{% block portico_content %} {% block portico_content %}

View File

@ -11,11 +11,11 @@
} }
</style> </style>
{{ render_bundle('translations', attrs='nonce="%s"' % (csp_nonce,)) }} {{ bundle('translations') }}
{{ render_bundle('katex', attrs='nonce="%s"' % (csp_nonce,)) }} {{ bundle('katex') }}
{{ render_bundle('portico') }} {{ bundle('portico') }}
{{ render_bundle('archive') }} {{ bundle('archive') }}
{{ render_bundle('archive-styles') }} {{ bundle('archive-styles') }}
{% endblock %} {% endblock %}

View File

@ -6,7 +6,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}

View File

@ -26,11 +26,16 @@
var page_params = {debug_mode: false}; var page_params = {debug_mode: false};
</script> </script>
{% endblock %} {% endblock %}
{% macro bundle(name) %}
{{ render_bundle(name, attrs='nonce="%s"' % (csp_nonce,) if csp_nonce else '') }}
{% endmacro %}
<!-- This is a temporary block to enable webpack transition <!-- This is a temporary block to enable webpack transition
This allows pages requiring common files via webpack to override This allows pages requiring common files via webpack to override
this block --> this block -->
{% block commonjs %} {% block commonjs %}
{{ render_bundle('common', attrs='nonce="%s"' % (csp_nonce,)) }} {{ bundle('common') }}
{% endblock %} {% endblock %}
{% block customhead %} {% block customhead %}
{% endblock %} {% endblock %}

View File

@ -2,7 +2,7 @@
{# Login page. #} {# Login page. #}
{% block portico_content %} {% block portico_content %}
{{ render_bundle('dev-login') }} {{ bundle('dev-login') }}
<!-- The following empty tag has unique data-page-id so that this <!-- The following empty tag has unique data-page-id so that this
page can be easily identified in it's respective JavaScript file --> page can be easily identified in it's respective JavaScript file -->
<div data-page-id="dev-login"></div> <div data-page-id="dev-login"></div>

View File

@ -1,7 +1,7 @@
{% extends "zerver/base.html" %} {% extends "zerver/base.html" %}
{% block porticocustomhead %} {% block porticocustomhead %}
{{ render_bundle('portico') }} {{ bundle('portico') }}
{% endblock %} {% endblock %}
{% block content %} {% block content %}

View File

@ -28,5 +28,5 @@
</div> </div>
</div> </div>
{{ render_bundle("help") }} {{ bundle("help") }}
{% endblock %} {% endblock %}

View File

@ -1,6 +1,6 @@
{% extends "zerver/base.html" %} {% extends "zerver/base.html" %}
{% block content %} {% block content %}
{{ render_bundle('email-log') }} {{ bundle('email-log') }}
<div class="container"> <div class="container">
<div style="position: fixed"> <div style="position: fixed">
<div class="alert"> <div class="alert">

View File

@ -4,7 +4,7 @@
{% set OPEN_GRAPH_DESCRIPTION = 'First class threading on top of everything you could want from real-time chat.' %} {% set OPEN_GRAPH_DESCRIPTION = 'First class threading on top of everything you could want from real-time chat.' %}
{% block customhead %} {% block customhead %}
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}
{% block portico_content %} {% block portico_content %}

View File

@ -6,7 +6,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}

View File

@ -6,7 +6,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}

View File

@ -9,7 +9,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}
{% block portico_content %} {% block portico_content %}

View File

@ -6,7 +6,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}

View File

@ -5,7 +5,7 @@
<!-- Bootstrap 2.3.2--> <!-- Bootstrap 2.3.2-->
<script src="https://stackpath.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script> <script src="https://stackpath.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
<style> <style>
.portico-page { .portico-page {
padding-bottom: 0px; padding-bottom: 0px;

View File

@ -6,7 +6,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}

View File

@ -3,8 +3,8 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('integrations-dev-panel') }} {{ bundle('integrations-dev-panel') }}
{{ render_bundle('portico') }} {{ bundle('portico') }}
{% endblock %} {% endblock %}

View File

@ -2,7 +2,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('integrations') }} {{ bundle('integrations') }}
{% endblock %} {% endblock %}
{% block hello_page_container %} hello-main{% endblock %} {% block hello_page_container %} hello-main{% endblock %}

View File

@ -3,7 +3,7 @@
{% block customhead %} {% block customhead %}
{{ super() }} {{ super() }}
{{ render_bundle('signup') }} {{ bundle('signup') }}
{% endblock %} {% endblock %}
{% block portico_content %} {% block portico_content %}

View File

@ -2,7 +2,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}
{% block portico_content %} {% block portico_content %}

View File

@ -7,8 +7,8 @@
#} #}
{% block porticocustomhead %} {% block porticocustomhead %}
{{ render_bundle('translations') }} {{ bundle('translations') }}
{{ render_bundle('portico') }} {{ bundle('portico') }}
{% endblock %} {% endblock %}
{% block content %} {% block content %}

View File

@ -4,5 +4,5 @@
{% block customhead %} {% block customhead %}
{{ super() }} {{ super() }}
{{ render_bundle('signup') }} {{ bundle('signup') }}
{% endblock %} {% endblock %}

View File

@ -6,7 +6,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}
{% block portico_content %} {% block portico_content %}

View File

@ -2,7 +2,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}

View File

@ -8,8 +8,8 @@ Form is validated both client-side using jquery-validate (see signup.js) and ser
{% block customhead %} {% block customhead %}
{{ super() }} {{ super() }}
{{ render_bundle('zxcvbn') }} {{ bundle('zxcvbn') }}
{{ render_bundle('translations') }} {{ bundle('translations') }}
{% endblock %} {% endblock %}
{% block portico_content %} {% block portico_content %}

View File

@ -1,7 +1,7 @@
{% extends "zerver/portico_signup.html" %} {% extends "zerver/portico_signup.html" %}
{% block customhead %} {% block customhead %}
{{ super() }} {{ super() }}
{{ render_bundle('zxcvbn') }} {{ bundle('zxcvbn') }}
{% endblock %} {% endblock %}
{% block portico_content %} {% block portico_content %}

View File

@ -6,7 +6,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}

View File

@ -9,7 +9,7 @@
<script> <script>
var contributors_list = {{ contrib|safe }}; var contributors_list = {{ contrib|safe }};
</script> </script>
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}
{% block portico_content %} {% block portico_content %}

View File

@ -4,7 +4,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}

View File

@ -9,7 +9,7 @@
{% block customhead %} {% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ render_bundle('landing-page') }} {{ bundle('landing-page') }}
{% endblock %} {% endblock %}

View File

@ -336,6 +336,7 @@ def is_django_block_tag(tag):
'for', 'for',
'if', 'if',
'ifequal', 'ifequal',
'macro',
'verbatim', 'verbatim',
'blocktrans', 'blocktrans',
'trans', 'trans',