diff options
Diffstat (limited to 'templates')
| -rw-r--r-- | templates/web/fixmystreet.com/around/postcode_form.html | 48 | ||||
| -rw-r--r-- | templates/web/fixmystreet.com/header_extra.html | 20 |
2 files changed, 68 insertions, 0 deletions
diff --git a/templates/web/fixmystreet.com/around/postcode_form.html b/templates/web/fixmystreet.com/around/postcode_form.html new file mode 100644 index 000000000..afb3b66fb --- /dev/null +++ b/templates/web/fixmystreet.com/around/postcode_form.html @@ -0,0 +1,48 @@ +[%# Identical to parent, but with an extra div and javascript for our homepage A/B test %] + +<div id="front-main"> + <div id="front-main-container"> + [% INCLUDE 'around/intro.html' %] + + <div id="homepage-ab-test"> + <p><a id="cta-report">Report a problem</a></p> + <p><a id="cta-view">Or view problems in an area you know</a></p> + </div> + + [% + question = c.cobrand.enter_postcode_text || loc('Enter a nearby street name and area'); + %] + <form action="[% c.uri_for('/around') %]" method="get" name="postcodeForm" id="postcodeForm"> + <label for="pc">[% question %]:</label> + <div> + <input type="text" name="pc" value="[% pc | html %]" id="pc" size="10" maxlength="200" placeholder="[% tprintf(loc('e.g. ‘%s’ or ‘%s’'), c.cobrand.example_places) %]"> + <input type="submit" value="[% loc('Go') %]" id="sub"> + </div> + [% IF partial_token %] + <input type="hidden" name="partial" value="[% partial_token.token %]"> + [% END %] + </form> + </div> +</div> + +<script type="text/javascript"> +$(function(){ + $('#homepage-ab-test a').on('click', function(e){ + e.preventDefault(); + $('#homepage-ab-test').fadeOut(250, function(){ + + /* fadeIn() normal form, and focus input */ + $('#postcodeForm').fadeIn(250, function(){ + $('#pc').focus(); + }); + + /* Can't just fadeIn() because #geolocate_link + should have { display: inline-block } */ + $('#geolocate_link').css({ + opacity: 0, + display: 'inline-block' + }).animate({ opacity: 1 }, 250); + }); + }); +}); +</script> diff --git a/templates/web/fixmystreet.com/header_extra.html b/templates/web/fixmystreet.com/header_extra.html index 27ffc12a1..17cb822b7 100644 --- a/templates/web/fixmystreet.com/header_extra.html +++ b/templates/web/fixmystreet.com/header_extra.html @@ -1,3 +1,23 @@ <script src="[% start %][% version('/js/jquery.cookie.min.js') %]" type="text/javascript" charset="utf-8"></script> +[%# We are conducting an A/B experiment on the homepage %] +[% IF c.req.uri.path == '/' %] +<script src="//www.google-analytics.com/cx/api.js?experiment=cX9Tbz_VRl-cZDM5WVRgTQ"></script> +<script> +var variation = cxApi.chooseVariation(), + docElement = document.documentElement, + className = docElement.className; +docElement.className = className + ' ' + 'variant' + variation; +</script> +<style> +html.variant1 #homepage-ab-test { + display: block; +} +html.variant1 #postcodeForm, +html.variant1 #front-main a#geolocate_link { + display: none; +} +</style> +[% END %] + [% INCLUDE 'tracking_code.html' %] |