Merge pull request #51 from alphagov/service-settings-flow

Add pages for service settings flow
This commit is contained in:
Chris Hill-Scott
2016-01-11 11:55:46 +00:00
38 changed files with 576 additions and 106 deletions

View File

@@ -20,11 +20,9 @@
GOV.UK Notify admin
{% endblock %}
{% block cookie_message %}
{% endblock %}
{% block inside_header %}
{% endblock %}
{% block header_class %}with-proposition{% endblock %}

View File

@@ -0,0 +1,20 @@
{% macro browse_list(items) %}
{% if items %}
<nav class="browse-list">
<ul>
{% for item in items %}
{% if item.title and item.link %}
<li class="browse-list-item">
<a href="{{ item.link }}" class="browse-list-link{% if item.destructive %}-destructive{% endif %}">{{ item.title }}</a>
{% if item.hint %}
<div class="browse-list-hint">
{{ item.hint }}
</div>
{% endif %}
</li>
{% endif %}
{% endfor %}
</ul>
</nav>
{% endif %}
{% endmacro %}

View File

@@ -0,0 +1,11 @@
{% macro page_footer(button_text=None, back_link=False, back_link_text="Back", destructive=False) %}
<div class="page-footer">
{% if button_text %}
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
<input type="submit" class="button{% if destructive %}-destructive{% endif %}" value="{{ button_text }}" />
{% endif %}
{% if back_link %}
<a class="page-footer-back-link" role="button" href="{{ back_link }}">{{ back_link_text }}</a>
{% endif %}
</div>
{% endmacro %}

View File

@@ -1,9 +0,0 @@
{% macro submit_form(button_text, back_link=False) %}
<div class="submit-form">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
<input type="submit" class="button" value="{{ button_text }}" />
{% if back_link %}
<a class="submit-form-back-link" role="button" href="{{ back_link }}">Back</a>
{% endif %}
</div>
{% endmacro %}

View File

@@ -1,4 +1,4 @@
{% macro table(items, caption='', field_headings='', field_headings_visible=True, caption_visible=True) -%}
{% macro mapping_table(caption='', field_headings=[], field_headings_visible=True, caption_visible=True) -%}
<table class="table">
<caption class="heading-medium table-heading{{ ' visuallyhidden' if not caption_visible}}">
{{ caption }}
@@ -17,21 +17,34 @@
</tr>
</thead>
<tbody>
{% if items %}
{% for item in items %}
<tr class="table-row">
{{ caller(item) }}
</tr>
{% endfor %}
{% else %}
<p class="table-no-content">
{{ empty_message }}
</p>
{% endif %}
{{ caller() }}
</tbody>
</table>
{%- endmacro %}
{% macro list_table(items, caption='', empty_message='', field_headings=[], field_headings_visible=True, caption_visible=True) -%}
{% if items %}
{% set parent_caller = caller %}
{% call mapping_table(caption, field_headings, field_headings_visible, caption_visible) %}
{% for item in items %}
{% call row() %}
{{ parent_caller(item) }}
{% endcall %}
{% endfor %}
{%- endcall %}
{% else %}
<p class="summary-item-no-content">
{{ empty_message }}
</p>
{% endif %}
{%- endmacro %}
{% macro row() -%}
<tr class="table-row">
{{ caller() }}
</tr>
{%- endmacro %}
{% macro field(align='left', status='') -%}
<td class="table-field{% if align == 'right' %}-right-aligned{% endif %}">
<span class="{{ 'table-field-status-' + status if status }}">{{ caller() }}</span>

View File

@@ -1,8 +1,8 @@
{% macro textbox(name, label, value='', small=True, highlight_tags=False) %}
{% macro textbox(name, label, value='', small=True, highlight_tags=False, password=False) %}
<div class="form-group">
<label class="form-label" for="{{ name }}">{{ label }}</label>
{% if small %}
<input class="form-control" id="{{ name }}" name="{{ name }}" type="text" value="{{ value }}">
<input class="form-control" id="{{ name }}" name="{{ name }}" type="{{ 'password' if password else 'text' }}" value="{{ value }}">
{% else %}
<textarea
class="form-control {% if highlight_tags %}textbox-highlight-textbox{% endif %}"

View File

@@ -10,7 +10,7 @@
</ul>
<ul>
<li><a href="{{ url_for('.manageusers') }}">Manage users</a></li>
<li><a href="{{ url_for('.servicesettings') }}">Service settings</a></li>
<li><a href="{{ url_for('.service_settings') }}">Service settings</a></li>
</ul>
<ul>
<li><a href="/user-profile">Your details</a></li>

View File

@@ -1,4 +1,5 @@
{% extends "withnav_template.html" %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | API keys and documentation
@@ -10,8 +11,9 @@ GOV.UK Notify | API keys and documentation
<p>Here's where developers can access information about the API and access keys</p>
<p><a href="dashboard">Back to dashboard</a></p>
{{ page_footer(
back_link=url_for('.dashboard'),
back_link_text='Back to dashboard'
) }}
{% endblock %}

View File

@@ -2,7 +2,7 @@
{% from "components/sms-message.html" import sms_message %}
{% from "components/table.html" import table, field %}
{% from "components/placeholder.html" import placeholder %}
{% from "components/submit-form.html" import submit_form %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | Send text messages
@@ -17,9 +17,8 @@
<form method="POST" enctype="multipart/form-data">
{{ submit_form(
"Send {} text messages".format(number_of_recipients),
url_for(".sendsms")
{{ page_footer(
"Send {} text messages".format(number_of_recipients)
) }}
<h3 class="heading-small">First 3 messages</h2>
@@ -57,13 +56,11 @@
<a href="#">See all</a>
</p>
{{ submit_form(
"Send {} text messages".format(number_of_recipients),
url_for(".sendsms")
{{ page_footer(
button_text = "Send {} text messages".format(number_of_recipients),
back_link = url_for(".sendsms")
) }}
</form>
{% endblock %}

View File

@@ -1,5 +1,5 @@
{% extends "withnav_template.html" %}
{% from "components/table.html" import table, field %}
{% from "components/table.html" import list_table, field %}
{% from "components/big-number.html" import big_number %}
{% block page_title %}
@@ -25,9 +25,10 @@
</li>
</ul>
{% call(item) table(
{% call(item) list_table(
jobs[:3],
caption="Recent text messages",
empty_message="No recent text messages",
field_headings=['Job', 'File', 'Time', 'Status']
) %}
{% call field() %}

View File

@@ -1,6 +1,6 @@
{% extends "withnav_template.html" %}
{% from "components/textbox.html" import textbox %}
{% from "components/submit-form.html" import submit_form %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | Edit template
@@ -13,9 +13,12 @@ GOV.UK Notify | Edit template
<form method="post">
{{ textbox(name='template_name', label='Template name', value=template_name) }}
{{ textbox(name='template_body', label='Message', small=False, value=template_body, highlight_tags=True) }}
{{ submit_form('Save and continue') }}
{{ page_footer(
'Save and continue',
back_link=url_for('.dashboard'),
back_link_text='Back to manage templates'
) }}
</form>
<p><a href="manage-templates">Back to manage templates</a></p>
{% endblock %}

View File

@@ -1,4 +1,5 @@
{% extends "admin_template.html" %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify
@@ -18,8 +19,8 @@ GOV.UK Notify
{{ render_field(form.email_address, class='form-control-2-3') }}
<span class="font-xsmall">Your email address must end in .gov.uk</span>
<p>
<button class="button" role="button">Resend confirmation code</button>
</p>
{{ page_footer('Resend confirmation code') }}
</form>
</div>
</div>

View File

@@ -1,5 +1,5 @@
{% extends "withnav_template.html" %}
{% from "components/table.html" import table, field, right_aligned_field_heading %}
{% from "components/table.html" import list_table, field, right_aligned_field_heading %}
{% from "components/big-number.html" import big_number %}
{% from "components/banner.html" import banner %}
@@ -41,7 +41,7 @@ GOV.UK Notify | Notifications activity
Sent with template <a href="{{ url_for('.edit_template') }}">{{ template_used }}</a> at {{ uploaded_file_time }}
</p>
{% call(item) table(
{% call(item) list_table(
messages,
caption='Messages',
caption_visible=False,

View File

@@ -1,5 +1,5 @@
{% extends "withnav_template.html" %}
{% from "components/table.html" import table, field %}
{% from "components/table.html" import list_table, field %}
{% block page_title %}
GOV.UK Notify | Notifications activity
@@ -9,7 +9,7 @@ GOV.UK Notify | Notifications activity
<h1 class="heading-xlarge">Notifications activity</h1>
{% call(item) table(
{% call(item) list_table(
jobs,
caption="Recent activity",
caption_visible=False,

View File

@@ -1,4 +1,5 @@
{% extends "withnav_template.html" %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | Manage users
@@ -10,8 +11,9 @@ GOV.UK Notify | Manage users
<p>Here's where you can add or remove users of a service.</p>
<p><a href="dashboard">Back to dashboard</a></p>
{{ page_footer(
back_link = url_for('.dashboard'),
back_link_text = 'Back to dashboard'
) }}
{% endblock %}

View File

@@ -1,5 +1,6 @@
{% extends "withnav_template.html" %}
{% from "components/sms-message.html" import sms_message, message_status %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | Notifications activity
@@ -21,9 +22,9 @@ GOV.UK Notify | Notifications activity
</div>
</div>
<p>
<a href="{{ url_for('.showjob') }}">View other notifications in this job</a>
</p>
{{ page_footer(
back_link = url_for('.showjob'),
back_link_text = 'View other messages in this job'
) }}
{% endblock %}

View File

@@ -1,4 +1,5 @@
{% extends "admin_template.html" %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | Create an account
@@ -21,9 +22,7 @@ GOV.UK Notify | Create an account
{{ render_field(form.mobile_number, class='form-control-2-3') }}
{{ render_field(form.password, class='form-control-2-3') }}
<span class="font-xsmall">Your password must have at least 10 characters</span></label>
<p>
<button class="button" role="button">Continue</button>
</p>
{{ page_footer("Continue") }}
</form>
</div>
</div>

View File

@@ -6,7 +6,6 @@ GOV.UK Notify | Send email
{% block maincolumn_content %}
<h1 class="heading-xlarge">Send email</h1>
<p>This page will be where we construct email messages</p>
@@ -15,5 +14,4 @@ GOV.UK Notify | Send email
<a class="button" href="check-email" role="button">Continue</a>
</p>
{% endblock %}

View File

@@ -1,5 +1,6 @@
{% extends "withnav_template.html" %}
{% from "components/sms-message.html" import sms_message %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | Send text messages
@@ -39,11 +40,7 @@
<input type="file" />
</p>
<p>
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}" />
<input type="submit" class="button" value="Continue" />
</p>
{{ page_footer("Continue") }}
</form>

View File

@@ -1,17 +1,39 @@
{% extends "withnav_template.html" %}
{% from "components/browse-list.html" import browse_list %}
{% block page_title %}
GOV.UK Notify | Service settings
GOV.UK Notify | Service settings
{% endblock %}
{% block maincolumn_content %}
<h1 class="heading-xlarge">Service settings</h1>
<p>Here's where users can update their service profile.</p>
<p><a href="dashboard">Back to dashboard</a></p>
<h1 class="heading-xlarge">Service settings</h1>
{{ browse_list([
{
'title': 'Change your service name',
'link': url_for('.name'),
'hint': 'Your service name ({}) is included in every sent notification'.format(service.name)
},
{
'title': 'Request to go live and turn off sending restrictions',
'link': url_for('.request_to_go_live'),
'hint': 'A live service can send notifications to any phone number or email address',
} if not service.live else {
},
{
'title': 'Turn off all outgoing notifications',
'link': url_for('.status'),
'destructive': True
} if service.active else {
'title': 'Restart sending notifications',
'link': url_for('.status')
},
{
'title': 'Delete this service from Notify',
'link': url_for('.delete'),
'destructive': True
},
]) }}
{% endblock %}

View File

@@ -0,0 +1,27 @@
{% extends "withnav_template.html" %}
{% from "components/textbox.html" import textbox %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | Service settings
{% endblock %}
{% block maincolumn_content %}
<h1 class="heading-xlarge">{{ heading }}</h1>
<div class="grid-row">
<div class="column-three-quarters">
<form method="post">
{{ textbox('new_name', 'Enter your password', password=True) }}
{{ page_footer(
'Confirm',
destructive=destructive,
back_link=url_for('.service_settings')
) }}
</form>
</div>
</div>
{% endblock %}

View File

@@ -0,0 +1,44 @@
{% extends "withnav_template.html" %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | Service settings
{% endblock %}
{% block maincolumn_content %}
<h1 class="heading-xlarge">Delete this service from Notify</h1>
<div class="grid-row">
<div class="column-three-quarters">
<p>
This cant be undone. You will lose:
</p>
<ul class="list list-bullet">
<li>
any data youve uploaded messages
</li>
<li>
any templates youve created
</li>
<li>
the history of
</li>
<li>
API keys
</li>
</ul>
<form method="post">
{{ page_footer(
'Yes, delete {}'.format(service.name),
destructive=True,
back_link=url_for('.service_settings')
) }}
</form>
</div>
</div>
{% endblock %}

View File

@@ -0,0 +1,30 @@
{% extends "withnav_template.html" %}
{% from "components/textbox.html" import textbox %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | Service settings
{% endblock %}
{% block maincolumn_content %}
<h1 class="heading-xlarge">Change your service name</h1>
<div class="grid-row">
<div class="column-three-quarters">
<p>
Your service name ({{ service.name }}) is included in every sent notification
</p>
<form method="post">
{{ textbox('new_name', 'New name', value=service.name) }}
{{ page_footer(
'Save',
back_link=url_for('.service_settings')
) }}
</form>
</div>
</div>
{% endblock %}

View File

@@ -0,0 +1,49 @@
{% extends "withnav_template.html" %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | Service settings
{% endblock %}
{% block maincolumn_content %}
<h1 class="heading-xlarge">Request to go live</h1>
<div class="grid-row">
<div class="column-three-quarters">
<p>
A live service can send messages to any phone number or email address.
</p>
<p>
First you need to:
</p>
<ul class="list list-bullet">
<li>
have spoken to someone
</li>
<li>
have permission from someone else
</li>
<li>
etc.
</li>
</ul>
<p>
It takes a few working days for your request to be approved.
</p>
<form method="post">
{{ page_footer(
'Send request',
back_link=url_for('.service_settings')
) }}
</form>
</div>
</div>
{% endblock %}

View File

@@ -0,0 +1,37 @@
{% extends "withnav_template.html" %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | Service settings
{% endblock %}
{% block maincolumn_content %}
<h1 class="heading-xlarge">Turn off all outgoing notifications</h1>
<div class="grid-row">
<div class="column-three-quarters">
<p>
Youll still be able to send notifications to yourself by uploading a
CSV file.
</p>
<p>
You can start sending notifications again when youre ready.
</p>
<form method="post">
{{ page_footer(
'Turn off all outgoing notifications',
destructive=True,
back_link=url_for('.service_settings')
) }}
</form>
</div>
</div>
{% endblock %}

View File

@@ -1,4 +1,5 @@
{% extends "admin_template.html" %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
Sign in
@@ -19,9 +20,7 @@ Sign in
<p>
<span class="font-xsmall"><a href="">Forgotten password?</a></span>
</p>
<p>
<button class="button" role="button">Continue</button>
</p>
{{ page_footer("Continue") }}
</form>
</div>
</div>

View File

@@ -1,4 +1,5 @@
{% extends "admin_template.html" %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify
@@ -15,9 +16,7 @@ GOV.UK Notify
<form autocomplete="off" action="" method="post">
{{ form.hidden_tag() }}
{{ render_field(form.mobile_number, class='form-control-2-3') }}
<p>
<button class="button" role="button">Resend confirmation code</button>
</p>
{{ page_footer("Resend confirmation code") }}
</form>
</div>
</div>

View File

@@ -1,4 +1,5 @@
{% extends "admin_template.html" %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | Text verification
@@ -16,10 +17,8 @@ GOV.UK Notify | Text verification
<form autocomplete="off" action="" method="post">
{{ form.hidden_tag() }}
{{ render_field(form.sms_code, class='form-control-1-4') }}
<span class="font-xsmall"><a href="{{ url_for('.verification_code_not_received') }}">I haven't received a text</a></span>
<p>
<button class="button" role="button">Continue</button>
</p>
<span class="font-xsmall"><a href="{{ url_for('.verification_code_not_received') }}">I haven't received a text</a></span>
{{ page_footer("Continue") }}
</form>
</div>
</div>

View File

@@ -1,4 +1,5 @@
{% extends "withnav_template.html" %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | User settings
@@ -10,7 +11,9 @@ GOV.UK Notify | User settings
<p>Here's where users can update their profile, password etc.</p>
<p><a href="dashboard">Back to dashboard</a></p>
{{ page_footer(
back_link = url_for('.dashboard'),
back_link_text = 'Back to dashboard'
) }}
{% endblock %}

View File

@@ -1,4 +1,5 @@
{% extends "admin_template.html" %}
{% from "components/page-footer.html" import page_footer %}
{% block page_title %}
GOV.UK Notify | Confirm email address and mobile number
@@ -18,9 +19,7 @@ GOV.UK Notify | Confirm email address and mobile number
<span class="font-xsmall"><a href="{{ url_for('.check_and_resend_email_code')}}">I haven't received an email</a></span>
{{ render_field(form.sms_code, class='form-control-1-4') }}
<span class="font-xsmall"><a href="{{ url_for('.check_and_resend_text_code') }}">I haven't received a text</a></span>
<p>
<button class="button" role="button">Continue</button>
</p>
{{ page_footer("Continue") }}
</form>
</div>
</div>