fix(calendar): fix the popup show function getting called twice

This PR fixes an issue where the popup would be called to be shown twice because the two modules are listening to the events to show the popup when only one should be. I've thus removed the calendar's listeners since the popup ones that should be expected.

This PR also fixes the end calendars' popup which were also getting called to be shown twice when using the default settings for input calendars. The calendar module was focusing the input which is triggering the focus event that is also listened by the popup module. With this PR, the popup's show method is called only if the listener is not on focus, so that the input can still be focused.

This can be a big performance issue on heavy DOM trees as the popup position calculation is very heavy.

Author: Lutonite

src/definitions/modules/calendar.js

@@ -116,6 +116,7 @@ $.fn.calendar = function(parameters) {
               module.set.maxDate($module.data(metadata.maxDate));
             }
             module.setting('type', module.get.type());
+            module.setting('on', settings.on || ($input.length ? 'focus' : 'click'));
           },
           popup: function () {
             if (settings.inline) {
@@ -159,7 +160,7 @@ $.fn.calendar = function(parameters) {
               module.set.mode(settings.startMode);
               return settings.onShow.apply($container, arguments);
             };
-            var on = settings.on || ($input.length ? 'focus' : 'click');
+            var on = module.setting('on');
             var options = $.extend({}, settings.popupOptions, {
               popup: $container,
               on: on,
@@ -446,7 +447,6 @@ $.fn.calendar = function(parameters) {
               $input.on('input' + eventNamespace, module.event.inputChange);
               $input.on('focus' + eventNamespace, module.event.inputFocus);
               $input.on('blur' + eventNamespace, module.event.inputBlur);
-              $input.on('click' + eventNamespace, module.event.inputClick);
               $input.on('keydown' + eventNamespace, module.event.keydown);
             } else {
               $container.on('keydown' + eventNamespace, module.event.keydown);
@@ -575,9 +575,6 @@ $.fn.calendar = function(parameters) {
               var text = formatter.datetime(date, settings);
               $input.val(text);
             }
-          },
-          inputClick: function () {
-            module.popup('show');
           }
         },
 
@@ -802,10 +799,12 @@ $.fn.calendar = function(parameters) {
             var canceled = module.set.date(date) === false;
             if (!canceled && settings.closable) {
               module.popup('hide');
-              //if this is a range calendar, show the end date calendar popup and focus the input
+              //if this is a range calendar, focus the container or input. This will open the popup from its event listeners.
               var endModule = module.get.calendarModule(settings.endCalendar);
               if (endModule) {
-                endModule.popup('show');
+                if (endModule.setting('on') !== 'focus') {
+                  endModule.popup('show');
+                }
                 endModule.focus();
               }
             }