Skip to content

Commit

Permalink
Move bundle loader into page-template to prevent relative path issues…
Browse files Browse the repository at this point in the history 
… in other projects, and make pattern library templates extend page-template (#323)
  • Loading branch information
@bameyrick
bameyrick authored Apr 25, 2019
1 parent a2021da commit 4a744eb
Show file tree
Hide file tree
Showing 4 changed files with 126 additions and 139 deletions.
20 changes: 0 additions & 20 deletions src/styles/page-template/_bundle-loader.njk
View file

This file was deleted.

164 changes: 90 additions & 74 deletions src/styles/page-template/_template.njk
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,91 +52,107 @@
{% block head %}{% endblock %}
</head>
<body{% if page.bodyClasses %} class="{{ page.bodyClasses }}"{% endif %}>
<div class="page">
<div class="page__content">
{% block bodyStart %}{% endblock %}
{% block skipLink %}
{{
onsSkipToContent({
"url": "#main-content",
"text": "Skip to main content"
})
}}
{% endblock %}
{% if form %}
<form
{% if form.classes %}class="{{ form.classes }}"{% endif %}
method="POST"
{% if form.attributes %}{% for attribute, value in (form.attributes.items() if form.attributes is mapping and form.attributes.items else form.attributes) %}{{ attribute }}{% if value %}="{{value}}" {% endif %}{% endfor %}{% endif %}
>
{% endif %}
{% block preHeader %}{% endblock %}
{% block header %}
{{
onsHeader({
"title": page.header.title | default(page.title),
"language": page.language,
"button": page.signoutButton,
"toggleButton": page.toggleButton,
"navigation": page.navigation,
"phase": page.phase,
"assetsURL": assetsURL,
"serviceLinks": page.serviceLinks
})
}}
{% endblock %}
{% block main %}
{% block prePage %}{% endblock %}
<div class="page__container container {{ containerClasses }}">
<div class="grid">
<div class="grid__col col-8@m">
<main id="main-content" class="page__main {{ pageClasses }}">
{% block content %}{% endblock %}
</main>
{% block page %}
<div class="page">
<div class="page__content">
{% block bodyStart %}{% endblock %}
{% block skipLink %}
{{
onsSkipToContent({
"url": "#main-content",
"text": "Skip to main content"
})
}}
{% endblock %}
{% if form %}
<form
{% if form.classes %}class="{{ form.classes }}"{% endif %}
method="POST"
{% if form.attributes %}{% for attribute, value in (form.attributes.items() if form.attributes is mapping and form.attributes.items else form.attributes) %}{{ attribute }}{% if value %}="{{value}}" {% endif %}{% endfor %}{% endif %}
>
{% endif %}
{% block preHeader %}{% endblock %}
{% block header %}
{{
onsHeader({
"title": page.header.title | default(page.title),
"language": page.language,
"button": page.signoutButton,
"toggleButton": page.toggleButton,
"navigation": page.navigation,
"phase": page.phase,
"assetsURL": assetsURL,
"serviceLinks": page.serviceLinks
})
}}
{% endblock %}
{% block main %}
{% block prePage %}{% endblock %}
<div class="page__container container {{ containerClasses }}">
<div class="grid">
<div class="grid__col col-8@m">
<main id="main-content" class="page__main {{ pageClasses }}">
{% block content %}{% endblock %}
</main>
</div>
</div>
</div>
</div>
{% endblock %}
{% endblock %}

{% if form %}
</form>
{% endif %}
{% if form %}
</form>
{% endif %}
</div>
{% block footer %}
{% if page.footer %}
{{
onsFooter({
"assetsURL": assetsURL,
"classes": "page__footer",
"language": page.language,
"lang": currentLanguageISOCode,
"rows": page.footer.rows,
"cols": page.footer.cols,
"poweredByONS": page.footer.poweredByONS,
"OGLLink": page.footer.OGLLink,
"button": page.signoutButton,
"feedback": page.feedback,
"serviceLinks": page.serviceLinks
})
}}
{% endif %}
{% endblock %}
{% block bodyEnd %}{% endblock %}
</div>
{% block footer %}
{% if page.footer %}
{{
onsFooter({
"assetsURL": assetsURL,
"classes": "page__footer",
"language": page.language,
"lang": currentLanguageISOCode,
"rows": page.footer.rows,
"cols": page.footer.cols,
"poweredByONS": page.footer.poweredByONS,
"OGLLink": page.footer.OGLLink,
"button": page.signoutButton,
"feedback": page.feedback,
"serviceLinks": page.serviceLinks
})
}}
{% endif %}
{% endblock %}
{% block bodyEnd %}{% endblock %}
</div>

{% if assetsURL %}
<script>window.ONS_assets_base_URL = "{{ assetsURL }}/" </script>
{% endif %}
{% endblock %}

{% if isPatternLib %}
{% set scripts = assetsURL + "/scripts/main.js," + assetsURL + "/scripts/patternlib.js" %}
{% else %}
{% set scripts = assetsURL + "/scripts/main.js" %}
{% endif %}

{% include './_bundle-loader.njk' %}

<script{% if csp_nonce %} nonce="{{ csp_nonce() }}"{% endif %}>document.documentElement.className = document.documentElement.className.replace("no-js","has-js")</script>
<script{% if csp_nonce %} nonce="{{ csp_nonce() }}"{% endif %}>
(function() {
{% if assetsURL -%}window.ONS_assets_base_URL = "{{ assetsURL }}/";{%- endif %}
var s = '{{ scripts | safe }}'.split(','),
c = document.createElement('script');

if (!('noModule' in c)) {
for (var i = 0; i < s.length; i++) {
s[i] = s[i].replace('.js', '.es5.js');
}
}

for (var i = 0; i < s.length; i++) {
var e = document.createElement('script');

e.src = s[i];

document.body.appendChild(e);
}
})();
</script>

{% if devMode %}
<script>document.write('<script src="//' + (location.hostname || 'localhost').split(':')[0] + ':35729/livereload.js" defer><\/script>');</script>
Expand Down
48 changes: 25 additions & 23 deletions src/views/layouts/_master.njk
View file
Original file line number Diff line number Diff line change
@@ -1,23 +1,25 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="/favicons/favicon.ico">
<title>{{ pageInfo.title }}</title>
<link rel="stylesheet" href="/css/main.css">
<link rel="stylesheet" href="/css/patternlib.css">
</head>

<body class="patternlib-page{{ ' patternlib-page--example' if example }}{{ ' u-p-no' if page.fullWidth }}">
{% block master_body %}
{% endblock %}
<script>window.ONS_assets_base_URL = "/" </script>
{% set scripts = "/scripts/main.js,/scripts/patternlib.js" %}
{% include 'styles/page-template/_bundle-loader.njk' %}
<script>document.documentElement.className = document.documentElement.className.replace('no-js','has-js')</script>
{% if devMode %}
<script>document.write('<script src="//' + (location.hostname || 'localhost').split(':')[0] + ':35729/livereload.js" defer></' + 'script>'); </script>
{% endif %}
</body>
</html>
{% extends "styles/page-template/_template.njk" %}

{% set bodyClasses = "patternlib-page" %}

{% if page == null %}
{% set page = {} %}
{% endif %}

{% if example %}
{% set bodyClasses = bodyClasses + " patternlib-page--example" %}
{% endif %}

{% if page.fullWidth %}
{% set bodyClasses = bodyClasses + " u-p-no" %}
{% endif %}

{% set page = page | setAttribute("bodyClasses", bodyClasses) %}

{% block head %}
<link rel="stylesheet" href="/css/patternlib.css">
{% endblock %}

{% block page %}
{% block master_body %}{% endblock %}
{% endblock %}
33 changes: 11 additions & 22 deletions src/views/layouts/_prototype.njk
View file
Original file line number Diff line number Diff line change
@@ -1,22 +1,11 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="/favicons/favicon.ico">
<title>{{ pageInfo.title }}</title>
<link rel="stylesheet" href="/css/main.css">
<link rel="stylesheet" href="/css/patternlib.css">
</head>

<body class="proto">
{% block prototype_body %}
{% endblock %}
<script>window.ONS_assets_base_URL = "/" </script>
{% set scripts = "/scripts/main.js,/scripts/patternlib.js" %}
{% include 'styles/page-template/_bundle-loader.njk' %}
{% if devMode %}
<script>document.write('<script src="//' + (location.hostname || 'localhost').split(':')[0] + ':35729/livereload.js" defer></' + 'script>'); </script>
{% endif %}
</body>
</html>
{% extends "styles/page-template/_template.njk" %}

{% if page == null %}
{% set page = {} %}
{% endif %}

{% set page = page | setAttribute("bodyClasses", "proto") %}

{% block page %}
{% block prototype_body %}{% endblock %}
{% endblock %}

0 comments on commit 4a744eb

Please sign in to comment.