Add a version of the tour for live services

At the moment if you’re invited to a live broadcast service you get the
training mode tour. This is misleading, and could make people think they
weren’t in danger of sending a real alert.

This commit adds a short, 2 step tour for users invited to a live
broadcast service.

app/templates/service_navigation.html

@@ -0,0 +1,31 @@
+<div class="navigation-service">
+  {% if current_service.organisation_id %}
+    {% if current_user.platform_admin or
+      (current_user.belongs_to_organisation(current_service.organisation_id) and current_service.live) %}
+      <a href="{{ url_for('.organisation_dashboard', org_id=current_service.organisation_id) }}" class="govuk-link govuk-link--no-visited-state navigation-organisation-link">{{ current_service.organisation_name }}</a>
+    {% endif %}
+  {% endif %}
+  <div class="navigation-service-name govuk-!-font-weight-bold">
+    {{ current_service.name }}
+      {% if not current_service.active %}
+        <span class="navigation-service-type navigation-service-type--suspended">Suspended</span>
+      {% elif current_service.has_permission('broadcast') %}
+        {% if current_service.trial_mode %}
+          <span class="navigation-service-type navigation-service-type--training">Training
+        {% elif current_service.broadcast_channel == 'severe' %}
+          <span class="navigation-service-type navigation-service-type--live">Live
+        {% elif current_service.broadcast_channel == 'test' %}
+          <span class="navigation-service-type navigation-service-type--live">{{ current_service.broadcast_channel|title }}
+          {% if current_service.allowed_broadcast_provider == "all" %}
+            (all networks)
+          {% else %}
+            ({{ current_service.allowed_broadcast_provider }})
+          {% endif %}
+        {% elif current_service.broadcast_channel == 'government' %}
+          <span class="navigation-service-type navigation-service-type--government">Government
+        {% endif %}
+        </span>
+    {% endif %}
+  </div>
+  <a href="{{ url_for('main.choose_account') }}" class="govuk-link govuk-link--no-visited-state navigation-service-switch">Switch service</a>
+</div>

app/templates/views/broadcast/tour/live/1.html

@@ -0,0 +1,37 @@
+{% from "components/banner.html" import banner_wrapper %}
+
+{% extends "admin_template.html" %}
+
+{% block per_page_title %}
+  You’ve been invited to send live emergency alerts.
+{% endblock %}
+
+{% set mainClasses = "govuk-!-padding-top-0 govuk-!-padding-bottom-0" %}
+
+{% block content %}
+
+  {% include "service_navigation.html" %}
+
+  <div class="banner-tour banner-tour-no-fixed-height banner-tour-with-service-name">
+    <div class="govuk-grid-row">
+      <div class="govuk-grid-column-one-half">
+        <h1 class="heading-medium">
+          You’ve been invited to send live emergency alerts.
+        </h1>
+        <p class="govuk-body heading-medium">
+          Members of the public will receive alerts you send from this service.
+        </p>
+        <p class="govuk-body heading-medium">
+          <a class="govuk-link govuk-link--no-visited-state" href='{{ url_for(".broadcast_tour_live", service_id=current_service.id, step_index=2) }}'>
+            Continue
+          </a>
+        </p>
+      </div>
+      <div class="govuk-grid-column-one-half">
+        <img src="{{ asset_url('images/broadcast-tour/live/1.png') }}" alt="">
+        <link rel="preload" href="{{ asset_url('images/broadcast-tour/live/2.png') }}" as="image">
+      </div>
+    </div>
+  </div>
+
+{% endblock %}

app/templates/views/broadcast/tour/live/2.html

@@ -0,0 +1,33 @@
+{% from "components/banner.html" import banner_wrapper %}
+
+{% extends "admin_template.html" %}
+
+{% block per_page_title %}
+  You can always go back to training mode by clicking ‘Switch service’ in the top right.
+{% endblock %}
+
+{% set mainClasses = "govuk-!-padding-top-0 govuk-!-padding-bottom-0" %}
+
+{% block content %}
+
+  {% include "service_navigation.html" %}
+
+  <div class="banner-tour banner-tour-no-fixed-height banner-tour-with-service-name">
+    <div class="govuk-grid-row">
+      <div class="govuk-grid-column-one-half">
+        <h1 class="heading-medium">
+          You can always go back to training mode by clicking ‘Switch service’ in the top right.
+        </h1>
+        <p class="govuk-body heading-medium">
+          <a class="govuk-link govuk-link--no-visited-state" href='{{ url_for(".service_dashboard", service_id=current_service.id) }}'>
+            Continue
+          </a>
+        </p>
+      </div>
+      <div class="govuk-grid-column-one-half">
+        <img src="{{ asset_url('images/broadcast-tour/live/2.png') }}" alt="">
+      </div>
+    </div>
+  </div>
+
+{% endblock %}

app/templates/withnav_template.html

@@ -8,37 +8,7 @@
 
 {% block main %}
   <div class="govuk-width-container">
-    <div class="navigation-service">
-      {% if current_service.organisation_id %}
-        {% if current_user.platform_admin or
-          (current_user.belongs_to_organisation(current_service.organisation_id) and current_service.live) %}
-          <a href="{{ url_for('.organisation_dashboard', org_id=current_service.organisation_id) }}" class="govuk-link govuk-link--no-visited-state navigation-organisation-link">{{ current_service.organisation_name }}</a>
-        {% endif %}
-      {% endif %}
-      <div class="navigation-service-name govuk-!-font-weight-bold">
-        {{ current_service.name }}
-          {% if not current_service.active %}
-            <span class="navigation-service-type navigation-service-type--suspended">Suspended</span>
-          {% elif current_service.has_permission('broadcast') %}
-            {% if current_service.trial_mode %}
-              <span class="navigation-service-type navigation-service-type--training">Training
-            {% elif current_service.broadcast_channel == 'severe' %}
-              <span class="navigation-service-type navigation-service-type--live">Live
-            {% elif current_service.broadcast_channel == 'test' %}
-              <span class="navigation-service-type navigation-service-type--live">{{ current_service.broadcast_channel|title }}
-              {% if current_service.allowed_broadcast_provider == "all" %}
-                (all networks)
-              {% else %}
-                ({{ current_service.allowed_broadcast_provider }})
-              {% endif %}
-            {% elif current_service.broadcast_channel == 'government' %}
-              <span class="navigation-service-type navigation-service-type--government">Government
-            {% endif %}
-            </span>
-        {% endif %}
-      </div>
-      <a href="{{ url_for('main.choose_account') }}" class="govuk-link govuk-link--no-visited-state navigation-service-switch">Switch service</a>
-    </div>
+    {% include "service_navigation.html" %}
     <div class="govuk-grid-row govuk-!-padding-bottom-12">
       {% if help %}
         <div class="govuk-grid-column-one-third">