Commit Graph

99 Commits

Author SHA1 Message Date
Chris Hill-Scott
16fbfe49a3 Fix missing CSRF token on send SMS page
As part of https://github.com/alphagov/notifications-admin/pull/187 the file
upload pattern was changed to auto-submit once a file had been picked. The
form that was submitted was, however, missing a CSRF token, as well as a submit
button for non-JS users.

This commit makes the file upload pattern self-contained, so that it will always
include a form with a CSRF token in a hidden input and a submit button, which is
then hidden when Javascript loads.
2016-02-23 07:29:50 +00:00
Chris Hill-Scott
97a3bf9225 Remove the ‘manage templates’ page
The ‘manage templates’ page was almost identical to the ‘send text messages’
page.

This commit consolidates them into one and makes them all hang together.

Part of this means tweaks to the javascript so that files upload as soon as
you’ve chosen them.
2016-02-22 13:39:02 +00:00
Chris Hill-Scott
bf3f6d7d3e Fix users page for research
For the lab sessions, users should just see themselves as the only user, not
all the fake users (it might confuse them).
2016-02-22 13:39:02 +00:00
Chris Hill-Scott
17b99c9bf2 Add pages to invite, edit, and delete users
This takes the original prototype version of this page, and, using the same
fake data (ie nothing is wired up):
- adds an invite users page
- adds an edit (and delete) user page

Both these pages allow the user to set another user’s permissions.

This commit adds images for the ticks and crosses, so we have control over their
appearance.
2016-02-22 13:39:02 +00:00
Chris Hill-Scott
73deae9bff Preview service name when adding a new service
This commit adds a new page, which appears after a user enters the name for
their new service. It shows how the service name will appear in emails and
text messages.

This means that the new service is not created until after they have confirmed
that the name is appropriate in context.

This has also involved:
- visual changes to the ‘email template’ pattern, which wasn’t very refined
  before
- removing a bunch of words from the enter service name page, because most users
  don’t read them, and we reckon that showing a preview is a better way of
  getting them to understand what is meant by service name

Still to do:
- validating the the generated email address for a service is unique (on the
  API) side
- having the API return the generated email address, rather than determining it
  in the admin app
2016-02-19 16:38:46 +00:00
Chris Hill-Scott
eec56c2778 Add flow for sending yourself a text message
This commit adds a shortcut, which (in the background) does the creation and
uploading of a CSV file for you.

This enables users to send themselves a test message without having to fiddle
about with CSV files.
2016-02-18 15:59:57 +00:00
Chris Hill-Scott
426a23decd Add a hint about how to use placeholders
Since placeholders (almost) work now, it’s worth telling people what the syntax
is.

This commit also removes the ‘template type’ picker, since you can only create
SMS templates at the moment. This will be revisited when we start looking at how
you add an email template.
2016-02-18 15:23:14 +00:00
Chris Hill-Scott
45cacd82d3 Validate CSVs fully
This commit extends the existing function to validate each row’s phone number
to also validate that all the required data is present.

It does this using the checking that the `Template` class can do when given
a template and a `dict` of values.
2016-02-18 15:07:15 +00:00
Chris Hill-Scott
efb2140bbb Check CSV files match the template
This commit adds a first stab at checking whether a CSV file has the right
data to fill the placeholders.

The UI is very much first bash, but I’d like to get this merged and see how it
feels. The main thing is that we’ve got all the bit in place now to do this
logic.
2016-02-18 15:07:14 +00:00
Chris Hill-Scott
97304a6681 Remove ‘info’ banner type
We’re not using this banner type anywhere any more
2016-02-15 11:37:40 +00:00
Chris Hill-Scott
bd33fa3c26 Use tablular numbers for ‘big number’ pattern
> Tabular numbers have numerals of a standard fixed width. As all numbers have
> the same width, sets of numbers may be more easily compared. We recommend
> using them where different numbers are likely to be compared, or where
> different numbers should line up with each other, eg in tables.

The big number pattern is good candidate for tabluar numbers, especially if
we ever have these numbers update dynamically (in that case tabular numbers
won’t jump around like lining ones would).
2016-02-10 11:03:56 +00:00
Chris Hill-Scott
7e8046be47 Add syntax highlighting to code examples in docs
Uses the Pygments[1] package.

1. http://pygments.org/
2016-02-09 10:33:49 +00:00
Adam Shimali
3b7d1f9d12 Merge pull request #160 from alphagov/front-end-lint
Add linting for SASS and Javascript
2016-02-08 13:37:45 +00:00
Chris Hill-Scott
3f365058ef Fix problems found by SASS Lint 2016-02-08 12:02:22 +00:00
Chris Hill-Scott
d1a7c8ef39 Make ‘edit template’ textboxes the same width
This involves:
- removing the hard coded width on any textbox that does placeholder
  highlighting
- adding JS to make sure that the extra layers on top of the textbox inherit
  the width of the textbox that the user types in (so the layers don’t get
  misaligned)

Keeping the textboxes at 2/3 width for consistency with how wide the messages
are on the ‘manage templates’ page.
2016-02-08 10:03:30 +00:00
NIcholas Staples
7854617453 Merge pull request #155 from alphagov/fixes-to-front-end-patterns
Fixes to front end patterns
2016-02-05 11:39:46 +00:00
Chris Hill-Scott
f5807d939a Add secondary link pattern to page footer
This commit brings back the ‘link under the green button’ bit of the page footer
component.

Previous it had been changed to be a grey button. But there are use cases for
both, maybe even simultaneously.
2016-02-05 10:34:26 +00:00
Chris Hill-Scott
7e670d9662 Limit number of jobs on dashboard to 5
…and add a link to view the rest of the jobs if there are more than 5.
2016-02-04 17:25:29 +00:00
Chris Hill-Scott
a7d6d85d8b Make first page of ‘send texts’ use links not form
This doesn’t need to be a form—it’s not changing any data.

And having the primary action on the page as ‘Use this template’ it makes it
clear what the page is for.
2016-02-04 14:13:57 +00:00
Chris Hill-Scott
26adcc64c1 Updates to ‘send SMS’ page
Based on discussion with Pete.

Make the blue banner an ‘important’ banner (copied from Register to Vote, used
because it’s not as boxy and fits on the page better).

Remove the back button because you haven’t changed any data yet. If you need to
go back you can just press back or start again.

Make the filename stand out more.

Remove the ‘download example’ link. Will need to revist the best way of doing
this.

Make text messages consistently 2/3rd width.
2016-02-04 14:06:19 +00:00
Chris Hill-Scott
48df622aba Add two steps to onboarding banner
It’s not obvious what the first steps are when you’ve just signed up.

This commit changes the banner on the dashboard to make it obvious.
2016-02-04 10:59:18 +00:00
Chris Hill-Scott
28f700366c Fix spacing of first page headers
This commit customises the margins of the first header on each page so that it
lines up with the navigation.
2016-02-04 10:59:18 +00:00
Chris Hill-Scott
4280c21b23 Updates to send and check SMS pages
Adds a back button instead of a back link (more prominent, you’re likely to
go back on these pages if you’ve made a mistake)

Tweaks to wording
2016-02-04 10:59:18 +00:00
Chris Hill-Scott
856296df5d Updates to display of jobs
This commit:
- adds the template to the jobs page (and puts it at the top of the send SMS
  page) so that it consistently appears in the same place throughout the
  journey
- put the real data about a job on the jobs page and on the dashboard
2016-02-04 10:59:03 +00:00
Chris Hill-Scott
3e7bb42323 Replace message previews on check page with table
The first 3/last 3 messages didn’t test well, it wasn’t immediately obvious what
was going on.

This commit replaces it with just a preview of the first message, and a table
showing the details of the subsequent messages.
2016-02-04 10:44:20 +00:00
Chris Hill-Scott
4447af3fec Add custom file upload component
The default browser file upload control is difficult to style, but looks totally
out of place.

This commit replaces it with one that has a GOV.UK style button, as a first
step.

Based heavily on this example:
http://tympanus.net/codrops/2015/09/15/styling-customizing-file-inputs-smart-way/
2016-02-03 17:16:17 +00:00
Chris Hill-Scott
8d3e3e6943 Change wording on the banner
We can ignore any mention of trial/test/mode if we just talk about ‘not live’.

It also feels sensible to link through to the page where you can make that
change, rather than dig through the navigation.
2016-02-03 11:18:02 +00:00
Chris Hill-Scott
776539462e Make autofocus textbox module
This commit adds a very small Javascript module to autofocus a textbox on page
load. It should only be used once per page.

It also adds a parameter to the textbox macro which adds the attribute to
trigger autofocus.
2016-02-02 16:38:10 +00:00
Chris Hill-Scott
9c856af789 Allow textboxes to have width set, default to 2/3
For entering 2 or 3fa codes, we want a textbox that’s just over 6 characters
wide.

To do this, a width can now be passed to the textbox macro. The possible widths
are the same as those provided by GOV.UK Elements, and in the same format (eg
1-4, 1-2, 2-3…)

This commit also adds a new width (5em) which is suitable for 3fa codes, and
adds it to the verify page.
2016-02-02 15:59:41 +00:00
Chris Hill-Scott
71fd7f98a7 Reduce spacing between textbox and ‘I have’t rec…’
The grouping on this page was weird because these links were two far away from
the associated textbox, and too close to the next textbox.

This commit adds them as parameters to the textbox macro, which means their
relative spacing can be controlled exactly, and thus reduced.
2016-02-02 15:59:41 +00:00
Chris Hill-Scott
686c4127cd Various tweaks
- remove black border from banner
- make banners have internal columns
- make nav 2/3rd width, 19px text and more spaced out
- only show the ‘restricted mode’ banner where it’s needed
- rename ‘restricted mode’ to ‘trial mode’
2016-02-02 15:01:17 +00:00
Chris Hill-Scott
46db79c421 Add a new style of banner—‘tip’
This banner is meant for onboarding users and giving them prompts about what
they should do next.
2016-02-02 09:44:24 +00:00
Chris Hill-Scott
2ef1057180 Make spacing and position of banners consistent
Banners should always be the first thing on the page.

Because headers already have padding we don’t want to put padding on the
container.

So banners should also have top padding to distance then from the red bar.

They should also sit in the 3/4 column if the page has side navigation. This
commit adds a new template (`withoutnav_template.html`) which extends
`admin_template.html`. All views then extend one or the other, never the
`admin_template.html` directly. This means that `admin_template.html` doesn’t
have to make decisions about where the flash messages are displayed.
2016-02-01 13:52:46 +00:00
Chris Hill-Scott
286fc308d9 Make the header bar red
Red for admin is a good reckon.
2016-02-01 13:52:46 +00:00
Chris Hill-Scott
f6aed4fa06 Remove ‘BETA’ label
There’s an argument to be made that the beta label should only apply to
the public-facing parts of services/platforms.

Removing it from here means that we don’t need to deal with the hassle of how it
fits into the navigation. If we have to bring it back then we could follow the
banner example here instead:

http://govuk-elements.herokuapp.com/alpha-beta-banners/#beta-banner
2016-02-01 13:52:46 +00:00
Chris Hill-Scott
e97f69e801 Make ‘GOV.UK Notify’ less shouty
‘GOV.UK’ in the template is set in 30px type to line up perfectly with the
crown. When adding more text, it looks too big.

This commit reduces the type size to 27px (which is still a core type size) and
tweaks the spacing so that things still look nice/aligned.
2016-02-01 13:52:45 +00:00
Chris Hill-Scott
3617f2e936 Move service and user nav to proposition header
This commit moves user-related navigation into the proposition header (the black
bar) at the top of the site. It adds some custom SASS to override GOV.UK
template and align these navigation items to the right (because it looks
better).

It then removes the service chooser dropdown (and its associated SASS and JS) in
favour of a link alongside the user-related navigation items. ‘Switch service’
is the best language for this that we’ve come up with so far.

This means that the only way of adding a new service is from the `/services`
page. So this commit removes the redirect if you land on this page with only one
service (else it would prevent you from ever being able to add more).
2016-02-01 13:52:45 +00:00
Chris Hill-Scott
e03813ceef Make 'API key was revoked' banner green 2016-01-26 16:26:08 +00:00
Chris Hill-Scott
4e158e203c Update styleguide 2016-01-26 16:20:57 +00:00
Chris Hill-Scott
396f8415c6 SKIRMISH MODE 2016-01-22 14:51:01 +00:00
Chris Hill-Scott
6f1f514b2b Add restricted mode warning
For the hack day, we should only let developers use the platform in restricted
mode. This commit adds a banner telling them this.

Can’t get the app running locally, so fingers crossed it actually looks how
I imagine it’s going to look…
2016-01-22 11:00:44 +00:00
Rebecca Law
8737edfad1 Merge branch 'master' of github.com:alphagov/notifications-admin into api-keys-flow
Conflicts:
	tests/app/main/views/test_api_keys.py
2016-01-21 12:31:28 +00:00
Chris Hill-Scott
9784a9936c Add pages for create/view/revoke API keys
Copying what they’ve done on GOV.UK Pay, we should let users:
- generate as many keys as they want
- only see the key at time of creation
- give keys a name
- revoke any key at any time (this should be a one way operation)

And based on discussions with @minglis and @servingUpAces, the keys should be
used in conjunction with some kind of service ID, which gets encrypted with the
key. In other words the secret itself never gets sent over the wire.

This commit adds the UI (but not the underlying API integration) for doing the
above.
2016-01-20 16:22:23 +00:00
Chris Hill-Scott
b6390b02a3 Remove old template picker 2016-01-20 13:20:16 +00:00
Chris Hill-Scott
482abb97d5 Put message previews on ‘Send SMS’ page
A previous commit removed these to differentiate between this page and the
manage templates page. It turns out that we do want previews on this page
because:
- the users for the two pages might be different—they might only be allowed to
  do one or the other depending what permissions they have
- it’s useful to see what the placeholders in the message are before uploading
  a CSV, to make sure the CSV has the correct column headings

This commit re-adds the message preview with a simpler UI. Discussed with
@antimega and we both agreed that the speech bubble tails on the messages should
go.
2016-01-20 13:12:20 +00:00
Rebecca Law
762ab8e394 Merge pull request #85 from alphagov/remove-placeholder-data
Remove placeholder logs of notifications sent
2016-01-19 16:05:40 +00:00
Chris Hill-Scott
ba0c9ac6c1 Remove placeholder logs of notifications sent
From the:
- dashboard
- activity page

This info will be confusing for users at the hack day, because it will say
they’ve already sent messages when they first sign up.

This involved changing the table macro to have a nice ‘no rows’ message.
2016-01-19 12:04:18 +00:00
Chris Hill-Scott
a08089a47d Use HTML5 details element for the service switcher
The previous service switcher was built purely in Javascript, which meant that,
for the purposes of progressive enhancement, it had to load in the open state.
Setting it to the closed state with Javascript happened a fraction of a second
after page load. This caused an unpleasant flicker as the whole page shifted up
and down as it loaded.

This commit changes the switcher to use the native HTML5 `details` and
`summary` elements[1].

This commit adds a polyfill from GOV.UK Elements for browsers which don’t
support `details`/`summary`.

1. http://html5doctor.com/the-details-and-summary-elements/
2016-01-19 11:45:18 +00:00
Chris Hill-Scott
2ab8c473cb Even out spacing in navigation 2016-01-18 14:31:27 +00:00
Chris Hill-Scott
81d4230b61 Page for adding a new service
This page is exactly the same as the page for adding your first service, save
the heading text.

So all this commit does is:
- set up two routes (`/add-service`, `/add-service/first`) for each of the two
  journeys and change the existing journeys to use the `/add-service/first`
  route
- add logic to show different heading text depending on the journey
- add a link to the new (`/add-service`) route in the service chooser dropdown
2016-01-18 11:03:25 +00:00