[Harrogate,Zurich] Remove inline/header script.

11 files changed, 181 insertions, 203 deletions

diff --git a/templates/web/harrogate/footer.html b/templates/web/harrogate/footer.html
index 47eef161b..2cbe8f986 100644
--- a/templates/web/harrogate/footer.html
+++ b/templates/web/harrogate/footer.html
@@ -36,6 +36,7 @@
     [% END %]
 
     [% INCLUDE 'common_footer_tags.html' %]
+    <script src="[% version('/cobrands/harrogate/js.js') %]"></script>
 
 </body>
 </html>
diff --git a/templates/web/harrogate/report/new/after_category.html b/templates/web/harrogate/report/new/after_category.html
index b67019353..c00185d74 100644
--- a/templates/web/harrogate/report/new/after_category.html
+++ b/templates/web/harrogate/report/new/after_category.html
@@ -1,34 +1,3 @@
-<script>
-    // we link to the informational articles rather than the forms, because in some
-    // cases the former have more information or links to track progress of faults
-    // etc..
-    var links = {
-        'Bus stops': 'http://www.northyorks.gov.uk/article/25853/Bus-stops-and-shelters',
-        // Pavements/footpaths (multiple options)
-        'Potholes': 'http://www.northyorks.gov.uk/article/25215/Roads---potholes',
-        // Roads/highways (multiple options)
-        'Road traffic signs': 'http://www.northyorks.gov.uk/article/25667/Road-signs-and-bollards',
-        // Street lighting (not considered, as also a Harrogate category)
-        'Traffic lights': 'http://www.northyorks.gov.uk/article/25626/Traffic-lights',
-        'default': 'http://www.northyorks.gov.uk/article/28237/Report-it-online'
-    };
-    $(function () {
-        var notice = $('.nycc-notice');
-        $("#problem_form").on("change.category", "select#form_category", function(){
-            var cat = $(this).val();
-            if (cat.search(/NYCC/) > 0) {
-                cat = cat.replace(' (NYCC)', '');
-                var link = links[cat] || links ['default'];
-                notice.find('a').attr({ href: link });
-                notice.show();
-            }
-            else {
-                notice.hide();
-            }
-
-        });
-    });
-</script>
 <noscript>
   <p class="nycc-notice">
     Please report issues for categories labelled <b>(NYCC)</b> directly to
diff --git a/templates/web/zurich/admin/header.html b/templates/web/zurich/admin/header.html
index a423cf22f..40847f190 100644
--- a/templates/web/zurich/admin/header.html
+++ b/templates/web/zurich/admin/header.html
@@ -24,14 +24,3 @@
     select { width: auto; }
     .admin-report-edit select { max-width: 100%; }
 </style>
-<script>
-$(function(){
-    $('.row-link').hover(function(){
-        $(this).toggleClass("active");
-    }).click(function(){
-        window.location = this.getElementsByTagName('a')[0];
-    }).find('td:last').hide();
-    $('th.edit').hide();
-});
-</script>
-
diff --git a/templates/web/zurich/admin/report_edit-sdm.html b/templates/web/zurich/admin/report_edit-sdm.html
index b8de2a5ef..509ddfd7c 100644
--- a/templates/web/zurich/admin/report_edit-sdm.html
+++ b/templates/web/zurich/admin/report_edit-sdm.html
@@ -101,12 +101,6 @@
 
 <div class="admin-report-edit admin-report-edit--interact">
 
-<script type="text/javascript">
-    $(function(){
-        $('#map_box .noscript').clone().removeClass('noscript').addClass('map_clone print-only').prependTo('.admin-report-edit--interact');
-    });
-</script>
-
 <p align="right" class="screen-only"><input type="submit" name="send_back" value="[% loc('Not for my subdivision') %]"></p>
 <p align="right" class="screen-only"><input type="submit" name="not_contactable" value="[% loc('Customer not contactable') %]"></p>
 
@@ -124,15 +118,6 @@
 <p class="screen-only">
     <label for="time_spent">[% loc('Time spent (in minutes):') %]</label>
     <input type="text" name="time_spent" id="form_time_spent" style="width: 4em" value="0">
-    <script>
-        $(function () {
-            $('#form_time_spent').spinner({
-                spin: function (e, ui) {
-                    if (ui.value < 0) { return false }
-                }
-            });
-        });
-    </script>
 </p>
 
 <p class="clearfix screen-only">
diff --git a/templates/web/zurich/admin/report_edit.html b/templates/web/zurich/admin/report_edit.html
index 215373eca..4ef55e75a 100644
--- a/templates/web/zurich/admin/report_edit.html
+++ b/templates/web/zurich/admin/report_edit.html
@@ -107,7 +107,7 @@
     <dd>[% problem.get_time_spent %]</dd>
 
   [% IF problem.photo %]
-    <dd>
+    <dd data-confirm="[% loc('Rotating this photo will discard unsaved changes to the report.') | html %]">
       [% FOR photo IN problem.photos %]
         <div class="update-img">
             <a href="[% c.cobrand.base_url %][% photo.url_temp_full %]" rel="fancy">
@@ -131,12 +131,6 @@
 
 [% status_message %]
 
-<script type="text/javascript">
-    $(function(){
-        $('#map_box .noscript').clone().removeClass('noscript').addClass('map_clone print-only').prependTo('.admin-report-edit--interact');
-    });
-</script>
-
 <dl [% IF status_message %]class="with-message"[% END %]>
 
     <dt class="screen-only">
@@ -157,7 +151,7 @@
         <span class="mock-label">[% loc('State:') %]</span>
     </dt>
     <dd class="screen-only">
-        <select name="state"  id="state">
+        <select name="state"  id="state" data-pstate="[% pstate %]">
             <option value="">--</option>
           [% FOREACH s IN states %]
             <option [% 'selected ' IF s.state == pstate %] value="[% s.state %]">[% s.trans %]</option>
@@ -300,108 +294,6 @@
 
 </div>
 
-<script type="text/javascript">
-$(function(){
-    var form_fields_changed = false;
-
-    $('#form_time_spent').spinner({
-        spin: function (e, ui) {
-            if (ui.value < 0) { return false }
-            form_fields_changed = true;
-        }
-    });
-
-    setTimeout(function(){
-        $('.message-updated').fadeOut(250, function(){
-            $(this).remove();
-        });
-    }, 5000);
-
-    // When the user changes a select box, this bit of code
-    // makes the labels for the other two select boxes grey.
-    $('.assignation__select, .assignation select').change(function(){
-        if (this.value == "") {
-            $('.assignation').css('color', '#000');
-        } else {
-            var a = $(this).closest('li').css('color', '#000');
-            $('.assignation select').not(this).val("");
-            $('.assignation').not(a).css('color', '#999');
-        }
-    });
-
-    $('#state').change(function(){
-        // Show or hide the automatic reply field
-        var state = $(this).val();
-
-        // show or disable assignation, templates, public_response, publish if
-        // same or different state to the one we started on
-        if ((state === '[% pstate %]')) {
-            $('input[name=publish_response]').show();
-            $('.response_templates_select').show();
-            $('#status_update_container').show();
-
-            if (state === 'confirmed') {
-                $('#assignation__category').show();
-                $('#assignation__subdivision').show();
-            }
-            if ((state === 'closed') || (state === 'investigating')) {
-                $('#assignation__external').show();
-            } else {
-                $('#assignation__external').hide();
-            }
-        }
-        else {
-            $('input[name=publish_response]').hide();
-            $('.response_templates_select').hide();
-            $('#status_update_container').hide();
-
-            $('#assignation__category').hide();
-            $('#assignation__subdivision').hide();
-            $('#assignation__category select').val('');
-            $('#assignation__subdivision select').val('');
-
-            $('#assignation__external select').val('');
-            $('#assignation__external').hide();
-            $('#external_body').hide();
-            $('#third_personal, label[for=third_personal]').hide();
-        }
-
-    }).change();
-
-    $("form#report_edit input[type=submit]").click(function() {
-        $("form#report_edit").data("clicked_button", $(this).attr("name"));
-    });
-
-    $("form#report_edit").submit(function() {
-        // Make sure the external body field has a value if it's visible
-        // and the form is submitted as a 'save' action (i.e. not a rotate
-        // photo).
-        var clicked = $(this).data("clicked_button");
-        if (clicked == "publish_response" || clicked == "Submit changes") {
-            var visible = $("select#body_external:visible").length > 0;
-            var val = parseInt($("select#body_external").val());
-            if (visible && isNaN(val)) {
-                $("#assignation__external .error").removeClass("hidden");
-                $("select#body_external").focus().get(0).scrollIntoView();
-                return false;
-            }
-        }
-        // If the user has clicked to rotate a photo and has edited other
-        // fields, ask for confirmation before submitting the form
-        if (/rotate_photo/.test(clicked) && form_fields_changed) {
-            var message = "[% loc('Rotating this photo will discard unsaved changes to the report.') %]";
-            if (!confirm(message)) {
-                return false;
-            }
-        }
-    });
-
-    $("form#report_edit").find("input, select, textarea").change(function() {
-        form_fields_changed = true;
-    });
-});
-</script>
-
 <div id="print_report_map" class="print-only">
 [% INCLUDE 'maps/noscript_map.html' map=print_report_map nsm_prefix="large_" %]
 </div>
diff --git a/templates/web/zurich/admin/response_templates_select.html b/templates/web/zurich/admin/response_templates_select.html
index c0f4104c8..853956a0d 100644
--- a/templates/web/zurich/admin/response_templates_select.html
+++ b/templates/web/zurich/admin/response_templates_select.html
@@ -1,25 +1,8 @@
-[% template_name="templates_for_${for}" %]
-
-[% response_templates = problem.response_templates %]
 <div class="response_templates_select">
-<select id="[% template_name %]">
-    <option value="">[% loc('Choose a template') %]</option>
-[% FOR t IN response_templates %]
-    <option value="[% t.id %]"> [% t.title | html %] </option>
-[% END %]
-</select>
+    <select id="templates_for_[% for %]" class="js-template-name" data-for="[% for %]">
+        <option value="">[% loc('Choose a template') %]</option>
+      [% FOR t IN problem.response_templates %]
+        <option value="[% t.text | html %]"> [% t.title | html %] </option>
+      [% END %]
+    </select>
 </div>
-<script>
-    $(function () {
-        var response_template_texts = {
-            [% FOR t IN response_templates %]
-                [% t.id %]: '[% t.text | escape_js %]' [% loop.last ? '' : ',' %]
-            [% END %]
-        };
-        $('#[% template_name %]').change(function () {
-            var val = $(this).val();
-            var text = response_template_texts[val];
-            $('#[% for %]').val( text );
-        });
-    });
-</script>
diff --git a/templates/web/zurich/around/intro.html b/templates/web/zurich/around/intro.html
index b60fa7388..c113afca7 100644
--- a/templates/web/zurich/around/intro.html
+++ b/templates/web/zurich/around/intro.html
@@ -1,11 +1 @@
             <h1>[% loc('Report, view, or discuss local problems') %]</h1>
-
-<!-- FIXME Better place for this -->
-<script>
-    $(function() {
-        $( "#pc" ).autocomplete({
-            minLength: 3,
-            source: "/ajax/geocode"
-        });
-    });
-</script>
diff --git a/templates/web/zurich/footer.html b/templates/web/zurich/footer.html
index c5f7685a0..98c24964e 100644
--- a/templates/web/zurich/footer.html
+++ b/templates/web/zurich/footer.html
@@ -35,7 +35,10 @@
     </div>
     </div>
 
+    <script src="[% version('/cobrands/zurich/validation_rules.js') %]"></script>
     [% INCLUDE 'common_footer_tags.html' %]
+    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js" charset="utf-8"></script>
+    <script src="[% version('/cobrands/zurich/js.js') %]"></script>
 
 </body>
 </html>
diff --git a/templates/web/zurich/header.html b/templates/web/zurich/header.html
index 7697a6055..303d861a4 100644
--- a/templates/web/zurich/header.html
+++ b/templates/web/zurich/header.html
@@ -20,9 +20,6 @@
         <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/redmond/jquery-ui.css">
 
         [% INCLUDE 'common_header_tags.html' %]
-        <script src="[% version('/cobrands/zurich/validation_rules.js') %]"></script>
-
-        <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js" charset="utf-8"></script>
 
         [% INCLUDE 'tracking_code.html' %]
 
diff --git a/web/cobrands/harrogate/js.js b/web/cobrands/harrogate/js.js
new file mode 100644
index 000000000..3c0e41d26
--- /dev/null
+++ b/web/cobrands/harrogate/js.js
@@ -0,0 +1,34 @@
+// we link to the informational articles rather than the forms, because in some
+// cases the former have more information or links to track progress of faults
+// etc..
+
+(function() {
+
+var links = {
+    'Bus stops': 'http://www.northyorks.gov.uk/article/25853/Bus-stops-and-shelters',
+    // Pavements/footpaths (multiple options)
+    'Potholes': 'http://www.northyorks.gov.uk/article/25215/Roads---potholes',
+    // Roads/highways (multiple options)
+    'Road traffic signs': 'http://www.northyorks.gov.uk/article/25667/Road-signs-and-bollards',
+    // Street lighting (not considered, as also a Harrogate category)
+    'Traffic lights': 'http://www.northyorks.gov.uk/article/25626/Traffic-lights',
+    'default': 'http://www.northyorks.gov.uk/article/28237/Report-it-online'
+};
+
+$(function () {
+    var notice = $('.nycc-notice');
+    $("#problem_form").on("change.category", "select#form_category", function(){
+        var cat = $(this).val();
+        if (cat.search(/NYCC/) > 0) {
+            cat = cat.replace(' (NYCC)', '');
+            var link = links[cat] || links ['default'];
+            notice.find('a').attr({ href: link });
+            notice.show();
+        }
+        else {
+            notice.hide();
+        }
+    });
+});
+
+})();
diff --git a/web/cobrands/zurich/js.js b/web/cobrands/zurich/js.js
new file mode 100644
index 000000000..d895789f1
--- /dev/null
+++ b/web/cobrands/zurich/js.js
@@ -0,0 +1,135 @@
+$(function() {
+    // Front page
+
+    $( "#pc" ).autocomplete({
+        minLength: 3,
+        source: "/ajax/geocode"
+    });
+
+    /*
+     * Admin things
+     */
+
+    // Row highlighting/clicking
+
+    $('.row-link').hover(function(){
+        $(this).toggleClass("active");
+    }).click(function(){
+        window.location = this.getElementsByTagName('a')[0];
+    }).find('td:last').hide();
+
+    $('th.edit').hide();
+
+    // Map copy for printing
+
+    if ($('.admin-report-edit--interact').length) {
+        $('#map_box .noscript').clone().removeClass('noscript').addClass('map_clone print-only').prependTo('.admin-report-edit--interact');
+    }
+
+    // Response templates
+
+    $('.js-template-name').change(function() {
+        var $this = $(this);
+        $('#' + $this.data('for')).val($this.val());
+    });
+
+    // Report editing
+
+    var form_fields_changed = false;
+
+    $('#form_time_spent').spinner({
+        spin: function (e, ui) {
+            if (ui.value < 0) { return false; }
+            form_fields_changed = true;
+        }
+    });
+
+    setTimeout(function(){
+        $('.message-updated').fadeOut(250, function(){
+            $(this).remove();
+        });
+    }, 5000);
+
+    // When the user changes a select box, this bit of code
+    // makes the labels for the other two select boxes grey.
+    $('.assignation__select, .assignation select').change(function(){
+        if (this.value === "") {
+            $('.assignation').css('color', '#000');
+        } else {
+            var a = $(this).closest('li').css('color', '#000');
+            $('.assignation select').not(this).val("");
+            $('.assignation').not(a).css('color', '#999');
+        }
+    });
+
+    $('form#report_edit #state').change(function(){
+        // Show or hide the automatic reply field
+        var state = $(this).val();
+
+        // show or disable assignation, templates, public_response, publish if
+        // same or different state to the one we started on
+        if (state === $(this).data('pstate')) {
+            $('input[name=publish_response]').show();
+            $('.response_templates_select').show();
+            $('#status_update_container').show();
+
+            if (state === 'confirmed') {
+                $('#assignation__category').show();
+                $('#assignation__subdivision').show();
+            }
+            if ((state === 'closed') || (state === 'investigating')) {
+                $('#assignation__external').show();
+            } else {
+                $('#assignation__external').hide();
+            }
+        }
+        else {
+            $('input[name=publish_response]').hide();
+            $('.response_templates_select').hide();
+            $('#status_update_container').hide();
+
+            $('#assignation__category').hide();
+            $('#assignation__subdivision').hide();
+            $('#assignation__category select').val('');
+            $('#assignation__subdivision select').val('');
+
+            $('#assignation__external select').val('');
+            $('#assignation__external').hide();
+            $('#external_body').hide();
+            $('#third_personal, label[for=third_personal]').hide();
+        }
+
+    }).change();
+
+    $("form#report_edit input[type=submit]").click(function() {
+        $("form#report_edit").data("clicked_button", $(this).attr("name"));
+    });
+
+    $("form#report_edit").submit(function() {
+        // Make sure the external body field has a value if it's visible
+        // and the form is submitted as a 'save' action (i.e. not a rotate
+        // photo).
+        var clicked = $(this).data("clicked_button");
+        if (clicked == "publish_response" || clicked == "Submit changes") {
+            var visible = $("select#body_external:visible").length > 0;
+            var val = parseInt($("select#body_external").val(), 10);
+            if (visible && isNaN(val)) {
+                $("#assignation__external .error").removeClass("hidden");
+                $("select#body_external").focus().get(0).scrollIntoView();
+                return false;
+            }
+        }
+        // If the user has clicked to rotate a photo and has edited other
+        // fields, ask for confirmation before submitting the form
+        if (/rotate_photo/.test(clicked) && form_fields_changed) {
+            var message = $(this).parent().data('confirm');
+            if (!confirm(message)) {
+                return false;
+            }
+        }
+    });
+
+    $("form#report_edit").find("input, select, textarea").change(function() {
+        form_fields_changed = true;
+    });
+});