From 9d71ef3179646d3d50803b2af3171022cf8c452f Mon Sep 17 00:00:00 2001
From: Ole Laursen <olau@iola.dk>
Date: Thu, 5 Feb 2015 13:48:27 +0000
Subject: [PATCH] Summary: Move select2 field handling to a separate .js file,
 currently we only include the select2 things on pages with forms that need it
 anyway, and this makes it easier to use it in the Secretariat code  -
 Legacy-Id: 8986

---
 ietf/secr/templates/drafts/edit.html          | 49 +----------------
 ietf/secr/templates/sreq/edit.html            | 49 +----------------
 ietf/secr/templates/sreq/new.html             | 49 +----------------
 ietf/templates/doc/change_shepherd.html       |  1 +
 ietf/templates/doc/draft/change_replaces.html |  1 +
 ietf/templates/group/edit.html                |  1 +
 ietf/templates/group/edit_milestones.html     |  1 +
 ietf/templates/group/stream_edit.html         |  1 +
 ietf/templates/ipr/details_edit.html          |  1 +
 ietf/templates/liaisons/edit.html             |  1 +
 ietf/templates/nomcom/edit_position.html      |  1 +
 static/js/ietf.js                             | 54 ------------------
 static/js/select2-field.js                    | 55 +++++++++++++++++++
 13 files changed, 66 insertions(+), 198 deletions(-)
 create mode 100644 static/js/select2-field.js

diff --git a/ietf/secr/templates/drafts/edit.html b/ietf/secr/templates/drafts/edit.html
index 1c89d33ae..777c6d0d1 100644
--- a/ietf/secr/templates/drafts/edit.html
+++ b/ietf/secr/templates/drafts/edit.html
@@ -11,54 +11,7 @@
   <link rel="stylesheet" href="/css/lib/select2.css">
   <link rel="stylesheet" href="/css/lib/select2-bootstrap.css">
   <script src="/js/lib/select2-3.5.2.min.js"></script>
-  <script>
-// this is copy-pasted from ietf.js, we should include that here too instead of this
-$(document).ready(function () {
-    $(".select2-field").each(function () {
-        var e = $(this);
-        if (e.data("ajax-url")) {
-            var maxEntries = e.data("max-entries");
-            var multiple = maxEntries != 1;
-            var prefetched = e.data("pre");
-            e.select2({
-                multiple: multiple,
-                minimumInputLength: 2,
-                width: "off",
-                allowClear: true,
-                maximumSelectionSize: maxEntries,
-                ajax: {
-                    url: e.data("ajax-url"),
-                    dataType: "json",
-                    quietMillis: 250,
-                    data: function (term, page) {
-                        return {
-                            q: term,
-                            p: page
-                        };
-                    },
-                    results: function (results) {
-                        return {
-                            results: results,
-                            more: results.length == 10
-                        };
-                    }
-                },
-                escapeMarkup: function (m) {
-                    return m;
-                },
-                initSelection: function (element, cb) {
-                    if (!multiple && prefetched.length > 0)
-                        cb(prefetched[0]);
-                    else
-                        cb(prefetched);
-
-                },
-                dropdownCssClass: "bigdrop"
-            });
-        }
-    });
-});
-  </script>
+  <script src="/js/select2-field.js"></script>
 {% endblock %}
 
 {% block breadcrumbs %}{{ block.super }}
diff --git a/ietf/secr/templates/sreq/edit.html b/ietf/secr/templates/sreq/edit.html
index ef1829e53..f1c7a35bd 100755
--- a/ietf/secr/templates/sreq/edit.html
+++ b/ietf/secr/templates/sreq/edit.html
@@ -9,54 +9,7 @@
   <link rel="stylesheet" href="/css/lib/select2.css">
   <link rel="stylesheet" href="/css/lib/select2-bootstrap.css">
   <script src="/js/lib/select2-3.5.2.min.js"></script>
-  <script>
-// this is copy-pasted from ietf.js, we should include that here too instead of this
-$(document).ready(function () {
-    $(".select2-field").each(function () {
-        var e = $(this);
-        if (e.data("ajax-url")) {
-            var maxEntries = e.data("max-entries");
-            var multiple = maxEntries != 1;
-            var prefetched = e.data("pre");
-            e.select2({
-                multiple: multiple,
-                minimumInputLength: 2,
-                width: "off",
-                allowClear: true,
-                maximumSelectionSize: maxEntries,
-                ajax: {
-                    url: e.data("ajax-url"),
-                    dataType: "json",
-                    quietMillis: 250,
-                    data: function (term, page) {
-                        return {
-                            q: term,
-                            p: page
-                        };
-                    },
-                    results: function (results) {
-                        return {
-                            results: results,
-                            more: results.length == 10
-                        };
-                    }
-                },
-                escapeMarkup: function (m) {
-                    return m;
-                },
-                initSelection: function (element, cb) {
-                    if (!multiple && prefetched.length > 0)
-                        cb(prefetched[0]);
-                    else
-                        cb(prefetched);
-
-                },
-                dropdownCssClass: "bigdrop"
-            });
-        }
-    });
-});
-  </script>
+  <script src="/js/select2-field.js"></script>
 {% endblock %}
 
 {% block breadcrumbs %}{{ block.super }} 
diff --git a/ietf/secr/templates/sreq/new.html b/ietf/secr/templates/sreq/new.html
index 9edd700a4..7543fda3b 100755
--- a/ietf/secr/templates/sreq/new.html
+++ b/ietf/secr/templates/sreq/new.html
@@ -9,54 +9,7 @@
   <link rel="stylesheet" href="/css/lib/select2.css">
   <link rel="stylesheet" href="/css/lib/select2-bootstrap.css">
   <script src="/js/lib/select2-3.5.2.min.js"></script>
-  <script>
-// this is copy-pasted from ietf.js, we should include that here too instead of this
-$(document).ready(function () {
-    $(".select2-field").each(function () {
-        var e = $(this);
-        if (e.data("ajax-url")) {
-            var maxEntries = e.data("max-entries");
-            var multiple = maxEntries != 1;
-            var prefetched = e.data("pre");
-            e.select2({
-                multiple: multiple,
-                minimumInputLength: 2,
-                width: "off",
-                allowClear: true,
-                maximumSelectionSize: maxEntries,
-                ajax: {
-                    url: e.data("ajax-url"),
-                    dataType: "json",
-                    quietMillis: 250,
-                    data: function (term, page) {
-                        return {
-                            q: term,
-                            p: page
-                        };
-                    },
-                    results: function (results) {
-                        return {
-                            results: results,
-                            more: results.length == 10
-                        };
-                    }
-                },
-                escapeMarkup: function (m) {
-                    return m;
-                },
-                initSelection: function (element, cb) {
-                    if (!multiple && prefetched.length > 0)
-                        cb(prefetched[0]);
-                    else
-                        cb(prefetched);
-
-                },
-                dropdownCssClass: "bigdrop"
-            });
-        }
-    });
-});
-  </script>
+  <script src="/js/select2-field.js"></script>
 {% endblock %}
 
 {% block breadcrumbs %}{{ block.super }} 
diff --git a/ietf/templates/doc/change_shepherd.html b/ietf/templates/doc/change_shepherd.html
index 9a4e075ed..3d1ed0ef3 100644
--- a/ietf/templates/doc/change_shepherd.html
+++ b/ietf/templates/doc/change_shepherd.html
@@ -30,4 +30,5 @@
 
 {% block js %}
   <script src="/js/lib/select2-3.5.2.min.js"></script>
+  <script src="/js/select2-field.js"></script>
 {% endblock %}
diff --git a/ietf/templates/doc/draft/change_replaces.html b/ietf/templates/doc/draft/change_replaces.html
index c1c71cd68..c27b8cee8 100644
--- a/ietf/templates/doc/draft/change_replaces.html
+++ b/ietf/templates/doc/draft/change_replaces.html
@@ -29,4 +29,5 @@
 
 {% block js %}
   <script src="/js/lib/select2-3.5.2.min.js"></script>
+  <script src="/js/select2-field.js"></script>
 {% endblock %}
diff --git a/ietf/templates/group/edit.html b/ietf/templates/group/edit.html
index 3d1423588..6046b6a17 100644
--- a/ietf/templates/group/edit.html
+++ b/ietf/templates/group/edit.html
@@ -52,6 +52,7 @@ so. New accounts can be <a href="{% url "create_account" %}">created here</a>.</
 
 {% block js %}
   <script src="/js/lib/select2-3.5.2.min.js"></script>
+  <script src="/js/select2-field.js"></script>
   <script>
    $(document).ready(function () {
        $("#id_acronym").closest(".form-group").each(function() {
diff --git a/ietf/templates/group/edit_milestones.html b/ietf/templates/group/edit_milestones.html
index 608d90c8d..1e246d1bf 100644
--- a/ietf/templates/group/edit_milestones.html
+++ b/ietf/templates/group/edit_milestones.html
@@ -94,6 +94,7 @@
 
 {% block js %}
   <script src="/js/lib/select2-3.5.2.min.js"></script>
+  <script src="/js/select2-field.js"></script>
   <script src="/js/lib/bootstrap-datepicker.js"></script>
   <script src="/js/edit-milestones.js"></script>
 {% endblock %}
diff --git a/ietf/templates/group/stream_edit.html b/ietf/templates/group/stream_edit.html
index b49263b54..8f50c89f8 100644
--- a/ietf/templates/group/stream_edit.html
+++ b/ietf/templates/group/stream_edit.html
@@ -43,4 +43,5 @@
 
 {% block js %}
   <script src="/js/lib/select2-3.5.2.min.js"></script>
+  <script src="/js/select2-field.js"></script>
 {% endblock %}
diff --git a/ietf/templates/ipr/details_edit.html b/ietf/templates/ipr/details_edit.html
index 68782115a..569389305 100644
--- a/ietf/templates/ipr/details_edit.html
+++ b/ietf/templates/ipr/details_edit.html
@@ -242,6 +242,7 @@
 
 {% block js %}
   <script src="/js/lib/select2-3.5.2.min.js"></script>
+  <script src="/js/select2-field.js"></script>
   <script src="/js/lib/bootstrap-datepicker.js"></script>
   <script src="/js/ipr-edit.js"></script>
 {% endblock %}
diff --git a/ietf/templates/liaisons/edit.html b/ietf/templates/liaisons/edit.html
index 2be67a8cd..c8e4fb86f 100644
--- a/ietf/templates/liaisons/edit.html
+++ b/ietf/templates/liaisons/edit.html
@@ -61,5 +61,6 @@
 {% block js %}
   <script src="/js/lib/bootstrap-datepicker.js"></script>
   <script src="/js/lib/select2-3.5.2.min.js"></script>
+  <script src="/js/select2-field.js"></script>
   <script src="/js/liaisons.js"></script>
 {% endblock %}
diff --git a/ietf/templates/nomcom/edit_position.html b/ietf/templates/nomcom/edit_position.html
index 681856374..cd6938d57 100644
--- a/ietf/templates/nomcom/edit_position.html
+++ b/ietf/templates/nomcom/edit_position.html
@@ -28,4 +28,5 @@
 
 {% block content_end %}
   <script src="/js/lib/select2-3.5.2.min.js"></script>
+  <script src="/js/select2-field.js"></script>
 {% endblock %}
diff --git a/static/js/ietf.js b/static/js/ietf.js
index a7f45a71b..b37ff1db0 100644
--- a/static/js/ietf.js
+++ b/static/js/ietf.js
@@ -206,60 +206,6 @@ $(".snippet .show-all").click(function () {
 //	}
 // });
 
-function setupSelect2Field(e) {
-    var url = e.data("ajax-url");
-    if (!url)
-        return;
-
-    var maxEntries = e.data("max-entries");
-    var multiple = maxEntries != 1;
-    var prefetched = e.data("pre");
-    e.select2({
-        multiple: multiple,
-        minimumInputLength: 2,
-        width: "off",
-        allowClear: true,
-        maximumSelectionSize: maxEntries,
-        ajax: {
-            url: url,
-            dataType: "json",
-            quietMillis: 250,
-            data: function (term, page) {
-                return {
-                    q: term,
-                    p: page
-                };
-            },
-            results: function (results) {
-                return {
-                    results: results,
-                    more: results.length == 10
-                };
-            }
-        },
-        escapeMarkup: function (m) {
-            return m;
-        },
-        initSelection: function (element, cb) {
-            if (!multiple && prefetched.length > 0)
-                cb(prefetched[0]);
-            else
-                cb(prefetched);
-
-        },
-        dropdownCssClass: "bigdrop"
-    });
-}
-
-$(document).ready(function () {
-    $(".select2-field").each(function () {
-        if ($(this).closest(".template").length > 0)
-            return;
-
-        setupSelect2Field($(this));
-    });
-});
-
 // Use the Bootstrap3 tooltip plugin for all elements with a title attribute
 $('[title][title!=""]').tooltip();
 
diff --git a/static/js/select2-field.js b/static/js/select2-field.js
new file mode 100644
index 000000000..993b57f89
--- /dev/null
+++ b/static/js/select2-field.js
@@ -0,0 +1,55 @@
+// currently we only include select2 CSS/JS on those pages where forms
+// need it, so the generic setup code here is also kept separate
+function setupSelect2Field(e) {
+    var url = e.data("ajax-url");
+    if (!url)
+        return;
+
+    var maxEntries = e.data("max-entries");
+    var multiple = maxEntries != 1;
+    var prefetched = e.data("pre");
+    e.select2({
+        multiple: multiple,
+        minimumInputLength: 2,
+        width: "off",
+        allowClear: true,
+        maximumSelectionSize: maxEntries,
+        ajax: {
+            url: url,
+            dataType: "json",
+            quietMillis: 250,
+            data: function (term, page) {
+                return {
+                    q: term,
+                    p: page
+                };
+            },
+            results: function (results) {
+                return {
+                    results: results,
+                    more: results.length == 10
+                };
+            }
+        },
+        escapeMarkup: function (m) {
+            return m;
+        },
+        initSelection: function (element, cb) {
+            if (!multiple && prefetched.length > 0)
+                cb(prefetched[0]);
+            else
+                cb(prefetched);
+
+        },
+        dropdownCssClass: "bigdrop"
+    });
+}
+
+$(document).ready(function () {
+    $(".select2-field").each(function () {
+        if ($(this).closest(".template").length > 0)
+            return;
+
+        setupSelect2Field($(this));
+    });
+});