diff options
Diffstat (limited to 'web/js/fixmystreet.js')
| -rw-r--r-- | web/js/fixmystreet.js | 165 |
1 files changed, 34 insertions, 131 deletions
diff --git a/web/js/fixmystreet.js b/web/js/fixmystreet.js index 47ca6efb7..b1a8f1889 100644 --- a/web/js/fixmystreet.js +++ b/web/js/fixmystreet.js @@ -30,61 +30,7 @@ function form_category_onchange() { }); } -/* - * general height fixing function - * - * elem1: element to check against - * elem2: target element - * offest: this will be added (if present) to the final value, useful for height errors - */ -function heightFix(elem1, elem2, offset){ - var h1 = $(elem1).height(), - h2 = $(elem2).height(); - if(offset === undefined){ - offset = 0; - } - if(h1 > h2){ - $(elem2).css({'min-height':h1+offset}); - } -} - - -/* - * very simple tab function - * - * elem: trigger element, must have an href attribute (so probably needs to be an <a>) - */ -function tabs(elem) -{ - var href = elem.attr('href'); - //stupid IE sometimes adds the full uri into the href attr, so trim - var start = href.indexOf('#'), - target = href.slice(start, href.length); - - if(!$(target).hasClass('open')) - { - //toggle class on nav - $('.tab-nav .active').removeClass('active'); - elem.addClass('active'); - - //hide / show the right tab - $('.tab.open').hide().removeClass('open'); - $(target).show().addClass('open'); - } -} - - $(function(){ - //add mobile class if small screen - if(Modernizr.mq('only screen and (max-width:47em)')) { - $('html').addClass('mobile'); - } - //heightfix the desktop .content div - if(Modernizr.mq('only screen and (min-width:48em)')) { - if (!($('body').hasClass('frontpage'))){ - heightFix(window, '.content', -176); - } - } $('html').removeClass('no-js').addClass('js'); @@ -139,13 +85,12 @@ $(function(){ }, messages: validation_strings, onkeyup: false, - onfocusout: false, errorElement: 'div', errorClass: 'form-error', // we do this to stop things jumping around on blur success: function (err) { if ( form_submitted ) { err.addClass('label-valid').removeClass('label-valid-hidden').html( ' ' ); } else { err.addClass('label-valid-hidden'); } }, errorPlacement: function( error, element ) { - element.before( error ); + element.parent('div').before( error ); }, submitHandler: function(form) { if (form.submit_problem) { @@ -189,29 +134,55 @@ $(function(){ $('#form_name').addClass('required').removeClass('valid'); } ); + $('#email_alert').click(function(e) { + if (!$('#email_alert_box').length) { + return true; + } + e.preventDefault(); + if ($('#email_alert_box').is(':visible')) { + email_alert_close(); + } else { + var pos = $(this).position(); + $('#email_alert_box').css( { 'left': ( pos.left - 20 ) + 'px', 'top': ( pos.top + 20 ) + 'px' } ); + $('#email_alert_box').show('fast'); + $('#alert_rznvy').focus(); + } + }).hover(function() { + window.clearTimeout(timer); + }, function() { + timer = window.setTimeout(email_alert_close, 2000); + }); + + $('#email_alert_box').hover(function() { + window.clearTimeout(timer); + }, function() { + timer = window.setTimeout(email_alert_close, 2000); + }); + + $('#form_category').change( form_category_onchange ); // Geolocation if (geo_position_js.init()) { - $('#postcodeForm').after('<a href="#" id="geolocate_link">… or locate me automatically</a>'); + $('#postcodeForm').append('<p id="geolocate_para">Or <a href="#" id="geolocate_link">locate me automatically</a>').css({ "padding-bottom": "0.5em" }); $('#geolocate_link').click(function(e) { e.preventDefault(); // Spinny thing! - $(this).append(' <img src="/i/flower.gif" alt="" align="bottom">'); + $('#geolocate_para').append(' <img src="/i/flower.gif" alt="" align="bottom">'); geo_position_js.getCurrentPosition(function(pos) { - $('img', this).remove(); + $('#geolocate_para img').remove(); var latitude = pos.coords.latitude; var longitude = pos.coords.longitude; location.href = '/around?latitude=' + latitude + ';longitude=' + longitude; }, function(err) { - $('img', this).remove(); + $('#geolocate_para img').remove(); if (err.code == 1) { // User said no } else if (err.code == 2) { // No position - $(this).html("Could not look up location"); + $('#geolocate_para').html("Could not look up location"); } else if (err.code == 3) { // Too long - $('this').html("No result returned"); + $('#geolocate_para').html("No result returned"); } else { // Unknown - $('this').html("Unknown error"); + $('#geolocate_para').html("Unknown error"); } }, { timeout: 10000 @@ -219,72 +190,4 @@ $(function(){ }); } - /* - * Report a problem page - */ - //desktop - if($('#report-a-poblem-sidebar:visible').length > 0){ - heightFix('#report-a-poblem-sidebar:visible', '.content', 26); - } - - //show/hide notes on mobile - $('.mobile #report-a-poblem-sidebar').after('<a href="#" class="rap-notes-trigger button-right">How to send successful reports</a>').hide(); - $('.mobile').on('click', '.rap-notes-trigger', function(e){ - e.preventDefault(); - //check if we've already moved the notes - if($('.rap-notes').length > 0){ - //if we have, show and hide .content - $('.mobile .content').hide(); - $('.rap-notes').show(); - }else{ - //if not, move them and show, hiding .content - $('.mobile .content').after('<div class="content rap-notes"></div>').hide(); - $('#report-a-poblem-sidebar').appendTo('.rap-notes').show().after('<a href="#" class="rap-notes-close button-left">BACK</a>'); - } - }); - $('.mobile').on('click', '.rap-notes-close', function(e){ - e.preventDefault(); - //hide notes, show .content - $('.mobile .content').show(); - $('.rap-notes').hide(); - $('html, body').animate({scrollTop:0}, 1000); - }); - - //move 'skip this step' link on mobile - $('.mobile #skip-this-step').hide(); - $('.mobile #skip-this-step a').appendTo('#key-tools').addClass('chevron').wrap('<li>'); - - /* - * Tabs - */ - //make initial tab active - $('.tab-nav a:first').addClass('active'); - $('.tab:first').addClass('open'); - - //hide other tabs - $('.tab').not('.open').hide(); - - //set up click event - $(".tab-nav").on('click', 'a', function(e){ - e.preventDefault(); - tabs($(this)); - }); - - /* - * Skip to nav on mobile - */ - $('.mobile').on('click', '#nav-link', function(e){ - e.preventDefault(); - var foo = $('.wrapper').height() - 500; - $('html, body').animate({scrollTop:foo}, 1000); - }); - - - /* - * Show stuff on input focus - */ - $('.form-focus-hidden').hide(); - $('.form-focus-trigger').on('focus', function(){ - $('.form-focus-hidden').fadeIn(500); - }); }); |