Fixed issue #11888: date question type on small screen

Dev: remove glyphicons from default template Dev: use fa in date
LimeSurvey · Nov 9, 2016 · 6bbe826 · 6bbe826
1 parent 6a520ea
commit 6bbe826
Show file tree

Hide file tree

Showing 11 changed files with 83 additions and 1,195 deletions.
diff --git a/application/helpers/qanda_helper.php b/application/helpers/qanda_helper.php
@@ -1215,6 +1215,7 @@ function do_date($ia)
             'qid'                    => $ia[0],
             'hideCalendar'           => $hideCalendar
         ), true);
+        App()->getClientScript()->registerScript("doPopupDate{$ia[0]}","doPopupDate({$ia[0]});",CClientScript::POS_END);
     }
     $inputnames[]=$ia[1];
 

diff --git a/application/views/survey/questions/date/selector/answer.php b/application/views/survey/questions/date/selector/answer.php
@@ -46,29 +46,29 @@ class='form-control'
                     'format' => $dateformatdetailsjs,
                     'allowInputToggle' =>true,
                     'showClear' => true,
-                            'tooltips' => array(
-                                'clear'=> gT('Clear selection'),
-                                'prevMonth'=> gT('Previous month'),
-                                'nextMonth'=> gT('Next month'),
-                                'selectYear'=> gT('Select year'),
-                                'prevYear'=> gT('Previous year'),
-                                'nextYear'=> gT('Next year'),
-                                'selectDecade'=> gT('Select decade'),
-                                'prevDecade'=> gT('Previous decade'),
-                                'nextDecade'=> gT('Next decade'),
-                                'prevCentury'=> gT('Previous century'),
-                                'nextCentury'=> gT('Next century'),
-                                'selectTime'=> gT('Select time')
-                            ),
+                    'tooltips' => array(
+                        'clear'=> gT('Clear selection'),
+                        'prevMonth'=> gT('Previous month'),
+                        'nextMonth'=> gT('Next month'),
+                        'selectYear'=> gT('Select year'),
+                        'prevYear'=> gT('Previous year'),
+                        'nextYear'=> gT('Next year'),
+                        'selectDecade'=> gT('Select decade'),
+                        'prevDecade'=> gT('Previous decade'),
+                        'nextDecade'=> gT('Next decade'),
+                        'prevCentury'=> gT('Previous century'),
+                        'nextCentury'=> gT('Next century'),
+                        'selectTime'=> gT('Select time')
+                    ),
                     'locale' => convertLStoDateTimePickerLocale($language),
-
                     /**
                      * $maxdate and $mindate can be expressions from EM. In that case, set them to 1900.
                      * The expressions will be evaluated dynamically later (see divs at bottom of this page).
                      */
                     'maxDate' => $maxdate[0] == '{' ? '1900' : $maxdate,
                     'minDate' => $mindate[0] == '{' ? '1900' : $mindate,
-                    'sideBySide' => true
+                    'sideBySide' => true,
+                    'keepOpen'=> true,
                 ),
                 'htmlOptions' => array(
                     'onkeypress' => $goodchars,
@@ -113,11 +113,3 @@ class='form-control'
 <input type='hidden' class="namecontainer" data-name="<?php echo $qid; ?>" />
 
 <!-- end of answer -->
-
-<script>
-$(document).ready(function() {
-    $('#answer' + '<?php echo $name; ?>' + '_datetimepicker').on('dp.show', function(ev) {
-        setPickerOptions('<?php echo $name; ?>');
-    });
-});
-</script>
diff --git a/scripts/date.js b/scripts/date.js
@@ -1,31 +1,25 @@
-$(document).ready(function(){
-    // dropdown dates
-    $('.namecontainer').each(function(){
-        var name = $(this).data('name');
-        doPopupDate(name);
-    });
-});
-
 /**
  * Function to launch timepicker in question id
  */
 function doPopupDate(qId) {
 
-    if($("#question"+qId+" .popupdate").length){
-        var basename = $("#question"+qId+" .popupdate").attr("id").substr(6);
+    if($("#question"+qId+" .date-item").length){
+        $("#question"+qId+" .glyphicon-calendar").removeClass("glyphicon glyphicon-calendar").addClass("fa fa-calendar");
+        var basename = $("#question"+qId+" .date-item .form-control").attr("id").substr(6);
         format=$('#dateformat'+basename).val();
         language=$('#datelanguage'+basename).val();
-        var $dp = $("#question"+qId+" .popupdate").datetimepicker({
-            changeYear: true,
-            changeMonth: true,
-            defaultDate: +0,
-            // TODO: add support for minute interval, different month identifiers and times without minutes
-            firstDay: "1",
-            duration: 'fast',
-            // set more options at "runtime"
-            show: setPickerOptions,
-            onShow: setPickerOptions,
-        }, $.datepicker.regional[language]);
+        /* We can set options after */
+        $('#answer'+basename+'_datetimepicker').data("DateTimePicker").icons({
+            time: 'fa fa-clock-o',
+            date: 'fa fa-calendar',
+            up: 'fa fa-chevron-up',
+            down: 'fa fa-chevron-down',
+            previous: 'fa fa-chevron-left',
+            next: 'fa fa-chevron-right',
+            today: 'fa fa-calendar-check-o',
+            clear: 'fa fa-trash-o',
+            close: 'fa fa-closee'
+        });
     }
 
     $("#question"+qId).find('div.input-group.date').on('dp.change', function(){