Fix #61 - Add support for jQuery UI 1.12.

Add custom.combobox widget from jquery-ui.com Autocomplete example. Add CommonJS support. Signed-off-by: Jonathan Horowitz <[email protected]>
gvas · Apr 6, 2017 · 6476aa0 · 6476aa0
1 parent 075b303
commit 6476aa0
Show file tree

Hide file tree

Showing 41 changed files with 455 additions and 186 deletions.
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -10,9 +10,9 @@ module.exports = function (grunt) {
             tunnelId: Math.floor((new Date()).getTime() / 1000 - 1230768000).toString(),
             coreFiles: ['src/utils.js', 'src/bindingHandler.js'],
             widgets: ['src/accordion.js', 'src/autocomplete.js', 'src/button.js',
-                'src/buttonset.js', 'src/datepicker.js', 'src/dialog.js', 'src/menu.js',
-                'src/progressbar.js', 'src/selectmenu.js', 'src/slider.js',
-                'src/spinner.js', 'src/tabs.js', 'src/tooltip.js']
+                'src/buttonset.js', 'src/checkboxradio.js', 'src/controlgroup.js', 'src/custom.combobox.js',
+				'src/datepicker.js', 'src/dialog.js', 'src/menu.js', 'src/progressbar.js', 'src/selectmenu.js',
+				'src/slider.js', 'src/spinner.js', 'src/tabs.js', 'src/tooltip.js']
         }
     });
 };
diff --git a/README.md b/README.md
@@ -23,6 +23,5 @@ Tests
 Compatibility
 -----
 
-From jQuery UI 1.8 to jQuery UI 1.11.x.
-jQuery UI 1.12 deprecated some API and the "compatibility layer" is broken.
+From jQuery UI 1.8 to jQuery UI 1.12.x.
 
diff --git a/dist/amd/accordion.js b/dist/amd/accordion.js
@@ -1,3 +1,4 @@
+/*jshint strict: false */
 /*global define*/
 define(
 
@@ -11,8 +12,6 @@ define(
 
     function ($, ko, utils, BindingHandler) {
 
-        'use strict';
-
         var Accordion = function () {
             /// <summary>Constructor.</summary>
 
@@ -25,12 +24,18 @@ define(
                 this.events = ['change', 'changestart', 'create'];
                 this.hasRefresh = false;
                 this.eventToWatch = 'change';
-            } else {
+            } else if (utils.uiVersion.major === 1 && (utils.uiVersion.minor >= 9 && utils.uiVersion.minor <= 11)) {
                 this.options = ['active', 'animate', 'collapsible', 'disabled', 'event',
                     'header', 'heightStyle', 'icons'];
                 this.events = ['activate', 'beforeActivate', 'create'];
                 this.hasRefresh = true;
                 this.eventToWatch = 'activate';
+            } else {
+                this.options = ['active', 'animate', 'classes', 'collapsible', 'disabled',
+                     'event', 'header', 'heightStyle', 'icons'];
+                this.events = ['activate', 'beforeActivate', 'create'];
+                this.hasRefresh = true;
+                this.eventToWatch = 'activate';
             }
         };
 

diff --git a/dist/amd/autocomplete.js b/dist/amd/autocomplete.js
@@ -1,3 +1,4 @@
+/*jshint strict: false */
 /*global define*/
 define(
 
@@ -9,23 +10,24 @@ define(
 
     function (BindingHandler, utils) {
 
-        'use strict';
-
         var Autocomplete = function () {
             /// <summary>Constructor.</summary>
 
             BindingHandler.call(this, 'autocomplete');
 
             this.options = ['appendTo', 'autoFocus', 'delay', 'disabled', 'minLength',
                 'position', 'source'];
+            this.events = ['change', 'close', 'create', 'focus', 'open', 'search',
+                'select'];
 
-            if (utils.uiVersion.major === 1 && utils.uiVersion.minor === 8) {
-                this.events = ['change', 'close', 'create', 'focus', 'open', 'search',
-                    'select'];
+            if (utils.uiVersion.major === 1 && (utils.uiVersion.minor >= 9 && utils.uiVersion.minor <= 11)) {
+                this.events.push('response');
+                this.options.push('messages');
             } else {
+                this.events.push('response');
                 this.options.push('messages');
-                this.events = ['change', 'close', 'create', 'focus', 'open', 'response',
-                    'search', 'select'];
+                this.options.push('classes');
+
             }
         };
 

diff --git a/dist/amd/bindingHandler.js b/dist/amd/bindingHandler.js
@@ -1,3 +1,4 @@
+/*jshint strict: false */
 /*global define*/
 define(
 
@@ -10,8 +11,6 @@ define(
 
     function ($, ko, utils) {
 
-        'use strict';
-
         var domDataKey, filterAndUnwrapProperties, subscribeToRefreshOn, BindingHandler;
 
         domDataKey = '__kojqui_options';

diff --git a/dist/amd/button.js b/dist/amd/button.js
@@ -1,3 +1,4 @@
+/*jshint strict: false */
 /*global define*/
 define(
 
@@ -9,15 +10,22 @@ define(
 
     function (BindingHandler, utils) {
 
-        'use strict';
-
         var Button = function () {
             /// <summary>Constructor.</summary>
 
             BindingHandler.call(this, 'button');
 
-            this.options = ['disabled', 'icons', 'label', 'text'];
+            this.options = ['disabled', 'label'];
             this.events = ['create'];
+            if (utils.uiVersion.major === 1 && (utils.uiVersion.minor >= 8 && utils.uiVersion.minor <= 11)) {
+                this.options.push('icons');
+                this.options.push('text');
+            } else {
+                this.options.push('classes');
+                this.options.push('icon');
+                this.options.push('iconPosition');
+                this.options.push('showLabel');
+            }
             this.hasRefresh = true;
         };
 

diff --git a/dist/amd/buttonset.js b/dist/amd/buttonset.js
@@ -1,3 +1,4 @@
+/*jshint strict: false */
 /*global define*/
 define(
 
@@ -9,8 +10,6 @@ define(
 
     function (BindingHandler, utils) {
 
-        'use strict';
-
         var Buttonset = function () {
             /// <summary>Constructor.</summary>
 

diff --git a/dist/amd/checkboxradio.js b/dist/amd/checkboxradio.js
@@ -0,0 +1,39 @@
+/*jshint strict: false */
+/*global define*/
+define(
+
+    [
+        './bindingHandler',
+        './utils',
+        'jquery-ui/checkboxradio'
+    ],
+
+    function (BindingHandler, utils) {
+
+        var Checkboxradio = function () {
+            /// <summary>Constructor.</summary>
+
+            BindingHandler.call(this, 'checkboxradio');
+
+            this.options = ['classes', 'disabled', 'icon', 'label'];
+            this.events = ['create'];
+            if (utils.uiVersion.major === 1 && (utils.uiVersion.minor >= 8 && utils.uiVersion.minor <= 11)) {
+                this.options.push('icons');
+                this.options.push('text');
+            } else {
+                this.options.push('classes');
+                this.options.push('icon');
+                this.options.push('iconPosition');
+                this.options.push('showLabel');
+            }
+            this.hasRefresh = true;
+        };
+
+        Checkboxradio.prototype = utils.createObject(BindingHandler.prototype);
+        Checkboxradio.prototype.constructor = Checkboxradio;
+
+        utils.register(Checkboxradio);
+
+        return Checkboxradio;
+    }
+);
diff --git a/dist/amd/controlgroup.js b/dist/amd/controlgroup.js
@@ -0,0 +1,30 @@
+/*jshint strict: false */
+/*global define*/
+define(
+
+    [
+        './bindingHandler',
+        './utils',
+        'jquery-ui/controlgroup'
+    ],
+
+    function (BindingHandler, utils) {
+
+        var Controlgroup = function () {
+            /// <summary>Constructor.</summary>
+
+            BindingHandler.call(this, 'controlgroup');
+
+            this.options = ['classes', 'direction', 'disabled', 'items', 'onlyVisible'];
+            this.events = ['create'];
+            this.hasRefresh = true;
+        };
+
+        Controlgroup.prototype = utils.createObject(BindingHandler.prototype);
+        Controlgroup.prototype.constructor = Controlgroup;
+
+        utils.register(Controlgroup);
+
+        return Controlgroup;
+    }
+);
diff --git a/dist/amd/custom.combobox.js b/dist/amd/custom.combobox.js
@@ -0,0 +1,31 @@
+/*jshint strict: false */
+/*global define*/
+define(
+
+    [
+        './bindingHandler',
+        './utils',
+        'jquery-ui/autocomplete',
+		'jquery-ui/button',
+		'jquery-ui/tooltip'
+    ],
+
+    function (BindingHandler, utils) {
+
+        var CustomCombobox = function () {
+            /// <summary>Constructor.</summary>
+
+            BindingHandler.call(this, 'combobox');
+
+            this.options = ['removeIfInvalid', 'buttonTooltip'];
+            this.events = [];
+        };
+
+        CustomCombobox.prototype = utils.createObject(BindingHandler.prototype);
+        CustomCombobox.prototype.constructor = CustomCombobox;
+
+        utils.register(CustomCombobox);
+
+        return CustomCombobox;
+    }
+);
diff --git a/dist/amd/datepicker.js b/dist/amd/datepicker.js
@@ -1,3 +1,4 @@
+/*jshint strict: false */
 /*global define*/
 define(
 
@@ -11,8 +12,6 @@ define(
 
     function ($, ko, BindingHandler, utils) {
 
-        'use strict';
-
         var Datepicker = function () {
             /// <summary>Constructor.</summary>
 

diff --git a/dist/amd/dialog.js b/dist/amd/dialog.js
@@ -1,3 +1,4 @@
+/*jshint strict: false */
 /*global define*/
 /*jslint browser:true*/
 define(
@@ -12,34 +13,33 @@ define(
 
     function ($, ko, BindingHandler, utils) {
 
-        'use strict';
-
         var Dialog = function () {
             /// <summary>Constructor.</summary>
 
             BindingHandler.call(this, 'dialog');
 
+            this.events = ['beforeClose', 'create', 'open', 'focus', 'dragStart',
+                'drag', 'dragStop', 'resizeStart', 'resize', 'resizeStop', 'close'];
+            this.options = ['autoOpen', 'buttons', 'closeOnEscape',
+                'closeText', 'dialogClass', 'draggable', 'height',
+                'maxHeight', 'maxWidth', 'minHeight', 'minWidth', 'modal', 'position',
+                'resizable', 'show', 'title', 'width'];
+
             if (utils.uiVersion.major === 1 && utils.uiVersion.minor === 8) {
-                this.options = ['autoOpen', 'buttons', 'closeOnEscape', 'closeText',
-                    'dialogClass', 'disabled', 'draggable', 'height', 'maxHeight',
-                    'maxWidth', 'minHeight', 'minWidth', 'modal', 'position', 'resizable',
-                    'show', 'stack', 'title', 'width', 'zIndex'];
-                this.events = ['beforeClose', 'create', 'open', 'focus', 'dragStart',
-                    'drag', 'dragStop', 'resizeStart', 'resize', 'resizeStop', 'close'];
+                this.options.push('disabled');
+                this.options.push('stack');
+                this.options.push('zIndex');
             } else if (utils.uiVersion.major === 1 && utils.uiVersion.minor === 9) {
-                this.options = ['autoOpen', 'buttons', 'closeOnEscape', 'closeText',
-                    'dialogClass', 'draggable', 'height', 'hide', 'maxHeight', 'maxWidth',
-                    'minHeight', 'minWidth', 'modal', 'position', 'resizable', 'show',
-                    'stack', 'title', 'width', 'zIndex'];
-                this.events = ['beforeClose', 'create', 'open', 'focus', 'dragStart',
-                    'drag', 'dragStop', 'resizeStart', 'resize', 'resizeStop', 'close'];
+                this.options.push('stack');
+                this.options.push('zIndex');
+                this.options.push('hide');
+            } else if (utils.uiVersion.major === 1 && (utils.uiVersion.minor === 10 || utils.uiVersion.minor === 11)) {
+                this.options.push('appendTo');
+                this.options.push('hide');
             } else {
-                this.options = ['appendTo', 'autoOpen', 'buttons', 'closeOnEscape',
-                    'closeText', 'dialogClass', 'draggable', 'height', 'hide',
-                    'maxHeight', 'maxWidth', 'minHeight', 'minWidth', 'modal', 'position',
-                    'resizable', 'show', 'title', 'width'];
-                this.events = ['beforeClose', 'create', 'open', 'focus', 'dragStart',
-                    'drag', 'dragStop', 'resizeStart', 'resize', 'resizeStop', 'close'];
+                this.options.push('appendTo');
+                this.options.push('hide');
+                this.options.push('classes');
             }
         };
 

diff --git a/dist/amd/menu.js b/dist/amd/menu.js
@@ -1,3 +1,4 @@
+/*jshint strict: false */
 /*global define*/
 define(
 
@@ -9,18 +10,17 @@ define(
 
     function (BindingHandler, utils) {
 
-        'use strict';
-
         var Menu = function () {
             /// <summary>Constructor.</summary>
 
             BindingHandler.call(this, 'menu');
 
-            if (utils.uiVersion.major === 1 && utils.uiVersion.minor < 11) {
-                this.options = ['disabled', 'icons', 'menus', 'position', 'role'];
+            this.options = ['disabled', 'icons', 'menus', 'position', 'role'];
+            if (utils.uiVersion.major === 1 && utils.uiVersion.minor === 11) {
+                this.options.push('items');
             } else {
-                this.options = ['disabled', 'icons', 'items', 'menus', 'position',
-                    'role'];
+                this.options.push('items');
+                this.options.push('classes');
             }
 
             this.events = ['blur', 'create', 'focus', 'select'];

diff --git a/dist/amd/progressbar.js b/dist/amd/progressbar.js
@@ -1,3 +1,4 @@
+/*jshint strict: false */
 /*global define*/
 define(
 
@@ -9,20 +10,20 @@ define(
 
     function (BindingHandler, utils) {
 
-        'use strict';
-
         var Progressbar = function () {
             /// <summary>Constructor.</summary>
 
             BindingHandler.call(this, 'progressbar');
 
+            this.options = ['disabled', 'value'];
             this.events = ['change', 'create', 'complete'];
             this.hasRefresh = true;
 
-            if (utils.uiVersion.major === 1 && utils.uiVersion.minor === 8) {
-                this.options = ['disabled', 'value'];
+            if (utils.uiVersion.major === 1 && (utils.uiVersion.minor >= 9 && utils.uiVersion.minor <= 11)) {
+                this.options.push('max');
             } else {
-                this.options = ['disabled', 'max', 'value'];
+                this.options.push('max');
+                this.options.push('classes');
             }
         };