Item14972: compatibility with jquery-3

foswiki · Oct 26, 2020 · edd2abc · edd2abc
1 parent fa3b2c3
commit edd2abc
Show file tree

Hide file tree

Showing 7 changed files with 42 additions and 30 deletions.
diff --git a/data/System/JQSelect2Contrib.txt b/data/System/JQSelect2Contrib.txt
@@ -55,13 +55,14 @@ If Select2 is enabled, you will see the result below:
 %$DEPENDENCIES%
 
 ---++ Change History
+|  26 Oct 2020: | compatibility with jquery-3 |
 |  02 Sep 2016: | add =.ui-dialog= class to drop-down window for proper base css (Foswiki:Main/MichaelDaum) |
 |  09 Mar 2015: | initial release on foswiki.org (Foswiki:Main/MichaelDaum) |
 |  04 Oct 2012: | initial check-in of select2 3.2 (Foswiki:Main/JanKrueger) |
 
 %META:FORM{name="PackageForm"}%
 %META:FIELD{name="Author" title="Author" value="[[Foswiki:Main.JanKrueger][Jan Krueger]]"}%
-%META:FIELD{name="Copyright" title="Copyright" value="&copy; 2012 Modell Aachen !GmbH, http://modell-aachen.de/; &copy; 2012-2016 Foswiki Contributors"}%
+%META:FIELD{name="Copyright" title="Copyright" value="&copy; 2012 Modell Aachen !GmbH, http://modell-aachen.de/; &copy; 2012-2020 Foswiki Contributors"}%
 %META:FIELD{name="Description" title="Description" value="%25$SHORTDESCRIPTION%25"}%
 %META:FIELD{name="Home" title="Home" value="Foswiki:Extensions/%TOPIC%"}%
 %META:FIELD{name="License" title="License" value="[[http://www.gnu.org/licenses/gpl.html][GPL (GNU General Public License)]]"}%

diff --git a/lib/Foswiki/Contrib/JQSelect2Contrib.pm b/lib/Foswiki/Contrib/JQSelect2Contrib.pm
@@ -1,7 +1,7 @@
 # Contrib for Foswiki - The Free and Open Source Wiki, http://foswiki.org/
 #
 # Copyright (C) 2012 Modell Aachen GmbH, http://modell-aachen.de/
-# Copyright (C) 2012-2016 Foswiki Contributors. 
+# Copyright (C) 2012-2020 Foswiki Contributors. 
 #
 # This program is free software; you can redistribute it and/or
 # modify it under the terms of the GNU General Public License
@@ -18,8 +18,8 @@ package Foswiki::Contrib::JQSelect2Contrib;
 use strict;
 use warnings;
 
-our $VERSION = '1.01';
-our $RELEASE = '02 Sep 2016';
+our $VERSION = '2.00';
+our $RELEASE = '26 Oct 2020';
 our $SHORTDESCRIPTION = 'Select2 jQuery widget for Foswiki';
 our $NO_PREFS_IN_TOPIC = 1;
 

diff --git a/lib/Foswiki/Contrib/JQSelect2Contrib/Config.spec b/lib/Foswiki/Contrib/JQSelect2Contrib/Config.spec
@@ -1,7 +1,7 @@
 # ---+ Extensions
 # ---++ JQueryPlugin
 # ---+++ Extra plugins
-# **STRING**
+# **STRING EXPERT**
 $Foswiki::cfg{JQueryPlugin}{Plugins}{Select2}{Module} = 'Foswiki::Contrib::JQSelect2Contrib::SELECT2';
 # **BOOLEAN**
 $Foswiki::cfg{JQueryPlugin}{Plugins}{Select2}{Enabled} = 1;

diff --git a/lib/Foswiki/Contrib/JQSelect2Contrib/MANIFEST b/lib/Foswiki/Contrib/JQSelect2Contrib/MANIFEST
@@ -1,3 +1,4 @@
+!noci
 data/System/JQSelect2Contrib.txt 0644
 lib/Foswiki/Contrib/JQSelect2Contrib/Config.spec 0644
 lib/Foswiki/Contrib/JQSelect2Contrib.pm 0644

diff --git a/lib/Foswiki/Contrib/JQSelect2Contrib/SELECT2.pm b/lib/Foswiki/Contrib/JQSelect2Contrib/SELECT2.pm
@@ -1,7 +1,7 @@
 # Plugin for Foswiki - The Free and Open Source Wiki, http://foswiki.org/
 # 
 # Copyright (C) 2012 Modell Aachen GmbH, http://modell-aachen.de/
-# Copyright (C) 2012-2016 Foswiki Contributors. 
+# Copyright (C) 2012-2020 Foswiki Contributors. 
 # 
 # This program is free software; you can redistribute it and/or
 # modify it under the terms of the GNU General Public License
@@ -49,7 +49,7 @@ sub new {
     documentation => "$Foswiki::cfg{SystemWebName}.JQSelect2Contrib",
     javascript => ['jquery.select2.js', 'jquery.select2.init.js', ],
     css => ['jquery.select2.css'],
-    dependencies => ['livequery', 'metadata'],
+    dependencies => ['metadata', 'ui'],
     @_
   ), $class);
 
@@ -79,7 +79,7 @@ sub init {
     my $messageFile = $Foswiki::cfg{PubDir} . '/' . $messagePath;
     if ( -f $messageFile ) {
         my $text .=
-"<script type='text/javascript' src='$Foswiki::cfg{PubUrlPath}/$messagePath'></script>\n";
+"<script src='$Foswiki::cfg{PubUrlPath}/$messagePath'></script>\n";
         Foswiki::Func::addToZone(
             'script', "JQUERYPLUGIN::SELECT2::LANG",
             $text,    'JQUERYPLUGIN::SELECT2'

diff --git a/pub/System/JQSelect2Contrib/jquery.select2.init.uncompressed.js b/pub/System/JQSelect2Contrib/jquery.select2.init.uncompressed.js
@@ -2,13 +2,23 @@
 "use strict";
 jQuery(function($) {
   var defaults = {
-    dropdownCssClass: 'ui-dialog' 
+    dropdownCssClass: 'ui-dialog',
+    sortable: false
   };
 
-  $(".jqSelect2:not(.jqSelect2Inited)").livequery(function() {
+  $(".jqSelect2:not(.inited)").livequery(function() {
     var $this = $(this), 
         opts = $.extend({}, defaults, $this.metadata(), $this.data());
 
-    $this.addClass("jqSelect2Inited").select2(opts);
+    $this.addClass("inited").select2(opts);
+
+    if (opts.sortable) {
+      $this.select2("container").find("ul.select2-choices").sortable({
+        containment: 'parent',
+        items: "> .select2-search-choice",
+        start: function() { $input.select2('onSortStart'); },
+        update: function() { $input.select2('onSortEnd'); }
+      });
+    }
   });
 });
diff --git a/pub/System/JQSelect2Contrib/jquery.select2.uncompressed.js b/pub/System/JQSelect2Contrib/jquery.select2.uncompressed.js
@@ -162,7 +162,7 @@
         });
     }
 
-    $(document).delegate("body", "mousemove", function (e) {
+    $(document).on("mousemove", "body", function (e) {
         $.data(document, "select2-lastpos", {x: e.pageX, y: e.pageY});
     });
 
@@ -340,10 +340,10 @@
             dataText,
             text = function (item) { return ""+item.text; }; // function used to retrieve the text portion of a data item that is matched against the search
 
-        if (!$.isArray(data)) {
+        if (!Array.isArray(data)) {
             text = data.text;
             // if text is not a function we assume it to be a key name
-            if (!$.isFunction(text)) {
+            if (typeof(text) !== "function") {
               dataText = data.text; // we need to store this in a separate variable because in the next step data gets reset and data.text is no longer available
               text = function (item) { return item[dataText]; };
             }
@@ -386,7 +386,7 @@
     function tags(data) {
         // TODO even for a function we should probably return a wrapper that does the same object/string check as
         // the function for arrays. otherwise only functions that return objects are supported.
-        if ($.isFunction(data)) {
+        if (typeof(data) === "function") {
             return data;
         }
 
@@ -414,13 +414,13 @@
      * @param formatter
      */
     function checkFormatter(formatter, formatterName) {
-        if ($.isFunction(formatter)) return true;
+        if (typeof(formatter) === "function" ) return true;
         if (!formatter) return false;
         throw new Error("formatterName must be a function or a falsy value");
     }
 
     function evaluate(val) {
-        return $.isFunction(val) ? val() : val;
+        return typeof(val) === "function" ? val() : val;
     }
 
     function countResults(results) {
@@ -494,7 +494,7 @@
      * also takes care of clicks on label tags that point to the source element
      */
     $(document).ready(function () {
-        $(document).delegate("body", "mousedown touchend", function (e) {
+        $(document).on("mousedown touchend", "body", function (e) {
             var target = $(e.target).closest("div.select2-container").get(0), attr;
             if (target) {
                 $(document).find("div.select2-container-active").each(function () {
@@ -598,10 +598,10 @@
             this.initContainerWidth();
 
             installFilteredMouseMove(this.results);
-            this.dropdown.delegate(resultsSelector, "mousemove-filtered", this.bind(this.highlightUnderEvent));
+            this.dropdown.on("mousemove-filtered", resultsSelector, this.bind(this.highlightUnderEvent));
 
             installDebouncedScroll(80, this.results);
-            this.dropdown.delegate(resultsSelector, "scroll-debounced", this.bind(this.loadMoreIfNeeded));
+            this.dropdown.on("scroll-debounced", resultsSelector, this.bind(this.loadMoreIfNeeded));
 
             // if jquery.mousewheel plugin is installed we can prevent out-of-bounds scrolling of results via mousewheel
             if ($.fn.mousewheel) {
@@ -622,7 +622,7 @@
             search.bind("focus", function () { search.addClass("select2-focused"); if (search.val() === " ") search.val(""); });
             search.bind("blur", function () { search.removeClass("select2-focused");});
 
-            this.dropdown.delegate(resultsSelector, "mouseup", this.bind(function (e) {
+            this.dropdown.on("mouseup", resultsSelector, this.bind(function (e) {
                 if ($(e.target).closest(".select2-result-selectable:not(.select2-disabled)").length > 0) {
                     this.highlightUnderEvent(e);
                     this.selectHighlighted(e);
@@ -637,7 +637,7 @@
             // dom it will trigger the popup close, which is not what we want
             this.dropdown.bind("click mouseup mousedown", function (e) { e.stopPropagation(); });
 
-            if ($.isFunction(this.opts.initSelection)) {
+            if (typeof(this.opts.initSelection) === "function") {
                 // initialize selection based on the current value of the source element
                 this.initSelection();
 
@@ -788,7 +788,7 @@
                             var data = [];
                             $(splitVal(element.val(), opts.separator)).each(function () {
                                 var id = this, text = this, tags=opts.tags;
-                                if ($.isFunction(tags)) tags=tags();
+                                if (typeof(tags) === "function") tags=tags();
                                 $(tags).each(function() { if (equal(this.id, id)) { text = this.text; return false; } });
                                 data.push({id: id, text: text});
                             });
@@ -1197,7 +1197,7 @@
 
             if (opts.maximumSelectionSize >=1) {
                 data = this.data();
-                if ($.isArray(data) && data.length >= opts.maximumSelectionSize && checkFormatter(opts.formatSelectionTooBig, "formatSelectionTooBig")) {
+                if (Array.isArray(data) && data.length >= opts.maximumSelectionSize && checkFormatter(opts.formatSelectionTooBig, "formatSelectionTooBig")) {
             	    render("<li class='select2-selection-limit'>" + opts.formatSelectionTooBig(opts.maximumSelectionSize) + "</li>");
             	    return;
                 }
@@ -1355,7 +1355,7 @@
                     }
 
                     return null;
-                } else if ($.isFunction(this.opts.width)) {
+                } else if (typeof(this.opts.width) === "function") {
                     return this.opts.width();
                 } else {
                     return this.opts.width;
@@ -1567,7 +1567,7 @@
                 killEvent(e);
             }));
 
-            selection.delegate("abbr", "mousedown", this.bind(function (e) {
+            selection.on("mousedown", "abbr", this.bind(function (e) {
                 if (!this.enabled) return;
                 this.clear();
                 killEvent(e);
@@ -1621,7 +1621,7 @@
                 opts.initSelection = function (element, callback) {
                     var selected = element.find(":selected");
                     // a single select box always has a value, no need to null check 'selected'
-                    if ($.isFunction(callback))
+                    if (typeof(callback) === "function")
                         callback({id: selected.attr("value"), text: selected.text()});
                 };
             }
@@ -1803,7 +1803,7 @@
                         data.push({id: elm.attr("value"), text: elm.text()});
                     });
 
-                    if ($.isFunction(callback))
+                    if (typeof(callback) === "function")
                         callback(data);
                 };
             }
@@ -1887,7 +1887,7 @@
                 e.stopImmediatePropagation();
             }));
 
-            this.container.delegate(selector, "mousedown", this.bind(function (e) {
+            this.container.on("mousedown", selector, this.bind(function (e) {
                 if (!this.enabled) return;
                 if ($(e.target).closest(".select2-search-choice").length > 0) {
                     // clicked inside a select2 search choice, do not open
@@ -1899,7 +1899,7 @@
                 e.preventDefault();
             }));
 
-            this.container.delegate(selector, "focus", this.bind(function () {
+            this.container.on("focus", selector, this.bind(function () {
                 if (!this.enabled) return;
                 this.container.addClass("select2-container-active");
                 this.dropdown.addClass("select2-drop-active");