aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--templates/web/fixmystreet/common_header_tags.html2
-rw-r--r--web/cobrands/fixmystreet/fixmystreet.js290
-rw-r--r--web/js/fixmystreet.js165
3 files changed, 325 insertions, 132 deletions
diff --git a/templates/web/fixmystreet/common_header_tags.html b/templates/web/fixmystreet/common_header_tags.html
index 8cbd13d2f..ce8b95a93 100644
--- a/templates/web/fixmystreet/common_header_tags.html
+++ b/templates/web/fixmystreet/common_header_tags.html
@@ -9,7 +9,7 @@
<script type="text/javascript" src="[% version('/js/geo.min.js') %]"></script>
-<script type="text/javascript" src="[% version('/js/fixmystreet.js') %]"></script>
+<script type="text/javascript" src="[% version('/cobrands/fixmystreet/fixmystreet.js') %]"></script>
[% map_js %]
diff --git a/web/cobrands/fixmystreet/fixmystreet.js b/web/cobrands/fixmystreet/fixmystreet.js
new file mode 100644
index 000000000..001334a2a
--- /dev/null
+++ b/web/cobrands/fixmystreet/fixmystreet.js
@@ -0,0 +1,290 @@
+/*
+ * fixmystreet.js
+ * FixMyStreet JavaScript
+ */
+
+function form_category_onchange() {
+ var cat = $('#form_category');
+ var args = {
+ category: cat.val()
+ };
+
+ if ( typeof fixmystreet !== 'undefined' ) {
+ args.latitude = fixmystreet.latitude;
+ args.longitude = fixmystreet.longitude;
+ } else {
+ args.latitude = $('input[name="latitude"]').val();
+ args.longitude = $('input[name="longitude"]').val();
+ }
+
+ $.getJSON('/report/new/category_extras', args, function(data) {
+ if ( data.category_extra ) {
+ if ( $('#category_meta').size() ) {
+ $('#category_meta').html( data.category_extra);
+ } else {
+ $('#form_category_row').after( data.category_extra );
+ }
+ } else {
+ $('#category_meta').empty();
+ }
+ });
+}
+
+/*
+ * 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');
+
+ $('#pc').focus();
+
+ $('input[type=submit]').removeAttr('disabled');
+ /*
+ $('#mapForm').submit(function() {
+ if (this.submit_problem) {
+ $('input[type=submit]', this).prop("disabled", true);
+ }
+ return true;
+ });
+ */
+
+ if (!$('#been_fixed_no').prop('checked') && !$('#been_fixed_unknown').prop('checked')) {
+ $('#another_qn').hide();
+ }
+ $('#been_fixed_no').click(function() {
+ $('#another_qn').show('fast');
+ });
+ $('#been_fixed_unknown').click(function() {
+ $('#another_qn').show('fast');
+ });
+ $('#been_fixed_yes').click(function() {
+ $('#another_qn').hide('fast');
+ });
+
+ var timer;
+ function email_alert_close() {
+ $('#email_alert_box').hide('fast');
+ }
+
+ // FIXME - needs to use translated string
+ jQuery.validator.addMethod('validCategory', function(value, element) {
+ return this.optional(element) || value != '-- Pick a category --'; }, validation_strings.category );
+
+ jQuery.validator.addMethod('validName', function(value, element) {
+ var validNamePat = /\ba\s*n+on+((y|o)mo?u?s)?(ly)?\b/i;
+ return this.optional(element) || value.length > 5 && value.match( /\S/ ) && !value.match( validNamePat ); }, validation_strings.category );
+
+ var form_submitted = 0;
+ var submitted = false;
+
+ $("form.validate").validate({
+ rules: {
+ title: { required: true },
+ detail: { required: true },
+ email: { required: true },
+ update: { required: true },
+ rznvy: { required: true }
+ },
+ 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( '&nbsp;' ); } else { err.addClass('label-valid-hidden'); } },
+ errorPlacement: function( error, element ) {
+ element.before( error );
+ },
+ submitHandler: function(form) {
+ if (form.submit_problem) {
+ $('input[type=submit]', form).prop("disabled", true);
+ }
+
+ form.submit();
+ },
+ // make sure we can see the error message when we focus on invalid elements
+ showErrors: function( errorMap, errorList ) {
+ if ( submitted && errorList.length ) {
+ $(window).scrollTop( $(errorList[0].element).offset().top - 120 );
+ }
+ this.defaultShowErrors();
+ submitted = false;
+ },
+ invalidHandler: function(form, validator) { submitted = true; }
+ });
+
+ $('input[type=submit]').click( function(e) { form_submitted = 1; } );
+
+ /* set correct required status depending on what we submit
+ * NB: need to add things to form_category as the JS updating
+ * of this we do after a map click removes them */
+ $('#submit_sign_in').click( function(e) {
+ $('#form_category').addClass('required validCategory').removeClass('valid');
+ $('#form_name').removeClass();
+ } );
+
+ $('#submit_register').click( function(e) {
+ $('#form_category').addClass('required validCategory').removeClass('valid');
+ $('#form_name').addClass('required validName');
+ } );
+
+ $('#problem_submit > input[type="submit"]').click( function(e) {
+ $('#form_category').addClass('required validCategory').removeClass('valid');
+ $('#form_name').addClass('required validName');
+ } );
+
+ $('#update_post').click( function(e) {
+ $('#form_name').addClass('required').removeClass('valid');
+ } );
+
+ $('#form_category').change( form_category_onchange );
+
+ // Geolocation
+ if (geo_position_js.init()) {
+ $('#postcodeForm').after('<a href="#" id="geolocate_link">&hellip; or locate me automatically</a>');
+ $('#geolocate_link').click(function(e) {
+ e.preventDefault();
+ // Spinny thing!
+ $(this).append(' <img src="/i/flower.gif" alt="" align="bottom">');
+ geo_position_js.getCurrentPosition(function(pos) {
+ $('img', this).remove();
+ var latitude = pos.coords.latitude;
+ var longitude = pos.coords.longitude;
+ location.href = '/around?latitude=' + latitude + ';longitude=' + longitude;
+ }, function(err) {
+ $('img', this).remove();
+ if (err.code == 1) { // User said no
+ } else if (err.code == 2) { // No position
+ $(this).html("Could not look up location");
+ } else if (err.code == 3) { // Too long
+ $('this').html("No result returned");
+ } else { // Unknown
+ $('this').html("Unknown error");
+ }
+ }, {
+ timeout: 10000
+ });
+ });
+ }
+
+ /*
+ * 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);
+ });
+});
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( '&nbsp;' ); } 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">&hellip; 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);
- });
});
generated by cgit v1.2.3 (git 2.25.1) at 2025-07-13 14:52:29 +0000