Changeset 2705


Ignore:
Timestamp:
Oct 10, 2008, 11:52:00 PM (16 years ago)
Author:
rub
Message:

jQuery Datepicker:
Move code source to template-common in order to use datepicker on version after butterfly

Merge trunk 2703:2704 into branch 2.0

Location:
branches/2.0
Files:
3 edited
4 copied

Legend:

Unmodified
Added
Removed

  • branches/2.0/admin/template/goto/include/datepicker.inc.tpl

    r2684 r2705  
    44{known_script id="jquery.ui.datepicker" src=$ROOT_URL|@cat:"template-common/lib/ui/ui.datepicker.packed.js"}
    55{known_script id="jquery.ui.datepicker-$lang_info.code" src=$ROOT_URL|@cat:"template-common/lib/ui/i18n/ui.datepicker-"|@cat:$lang_info.code|@cat:".js"}
     6{known_script id="datepicker.js" src=$ROOT_URL|@cat:"template-common/datepicker.js"}
    67
    78{html_head}
    … …  
    910{/html_head}
    1011
    11 {literal}
    1212<script type="text/javascript">
    13 // return formated date with control values
    14 // day, month, year: selectors of visible date controls
    15 function pwg_get_fmt_datepicker(day, month, year)
    16 {
    17   return $(year).val() + "-" + $(month).val() + "-" + $(day).val();
    18 }
    19 
    20 // initialize controls
    21 // day, month, year: selectors of visible date controls
    22 // linked_date: selector of hidden linked dates control
    23 // checked_on_change: selector of control to change "checked" attribut
    24 // min_linked_date: selector of hidden linked date control witch give min value
    25 // max_linked_date: selector of hidden linked date control witch give max value
    2613function pwg_initialization_datepicker(day, month, year, linked_date, checked_on_change, min_linked_date, max_linked_date)
    27 {
    28   // Action on change date value
    29   function pwg_on_date_change()
    30   {
    31     pwg_check_date();
    32     if (checked_on_change != null)
    33     {
    34       $(checked_on_change).attr("checked", "true");
    35     }
    36   }
    37 
    38   // In order to desable element of list
    39   function pwg_disabled_selection()
    40   {
    41     array_date = $(linked_date).val().split('-');
    42     y = array_date[0];
    43     m = array_date[1];
    44 
    45     // Init list
    46     $(day + " option").attr("disabled", "");
    47     $(month + " option").attr("disabled", "");
    48 
    49     var daysInMonth = 32 - new Date(y, m - 1, 32).getDate();
    50     $(day + " option:gt(" + (daysInMonth) +")").attr("disabled", "disabled");
    51 
    52     if ((min_linked_date != null) && ($(min_linked_date).datepicker("getDate") != null))
    53     {
    54       date_cmp = min_linked_date;
    55       op_cmp = "lt";
    56     }
    57     else if ((max_linked_date != null) && ($(max_linked_date).datepicker("getDate") != null))
    58     {
    59       date_cmp = max_linked_date;
    60       op_cmp = "gt";
    61     }
    62     else
    63     {
    64       date_cmp = null;
    65       op_cmp = null;
    66     }
    67 
    68     if (op_cmp != null)
    69     {
    70       array_date = $(date_cmp).val().split('-');
    71       y_cmp = array_date[0];
    72       m_cmp = array_date[1];
    73       d_cmp = array_date[2];
    74      
    75       if (y == y_cmp)
    76       {
    77         $(month + " option:" + op_cmp + "(" + (m_cmp) +")").attr("disabled", "disabled");
    78         if (op_cmp ==  "lt")
    79         {
    80             $(month + " option:eq(" + (0) +")").attr("disabled", "");
    81         }
    82 
    83         if (m == m_cmp)
    84         {
    85           $(day + " option:" + op_cmp + "(" + (d_cmp) +")").attr("disabled", "disabled");
    86           if (op_cmp ==  "lt")
    87           {
    88             $(day + " option:eq(" + (0) +")").attr("disabled", "");
    89           }
    90         }
    91       }
    92     }
    93   }
    94 
    95   // Prevent selection of invalid dates through the select controls
    96   function pwg_check_date()
    97   {
    98     last_date = $(linked_date).val();
    99 
    100     $(linked_date).val(pwg_get_fmt_datepicker(day, month, year));
    101 
    102     if ((min_linked_date != null) && ($(min_linked_date).datepicker("getDate") != null))
    103     {
    104       cancel = ($(min_linked_date).datepicker("getDate") > $(linked_date).datepicker("getDate"));
    105     }
    106     else if ((max_linked_date != null) && ($(max_linked_date).datepicker("getDate") != null))
    107     {
    108       cancel = ($(max_linked_date).datepicker("getDate") < $(linked_date).datepicker("getDate"));
    109     }
    110     else
    111     {
    112       cancel = false;
    113     }
    114 
    115     if (cancel)
    116     {
    117       array_date = last_date.split('-');
    118       $(year).val(array_date[0]);
    119       $(month).val(array_date[1]);
    120       $(day).val(array_date[2]);
    121       // check again
    122       pwg_check_date();
    123     }
    124   }
    125 
    126   jQuery().ready(function(){
    127     // Init hidden value
    128     $(linked_date).val(pwg_get_fmt_datepicker(day, month, year));
    129 
    130     // Init Datepicker
    131     jQuery(linked_date).datepicker({
    132       dateFormat:'yy-m-d',
    133       beforeShow:
    134         // Prepare to show a date picker linked to three select controls
    135         function readLinked(input) {
    136             //$(linked_date).val(pwg_get_fmt_datepicker(day, month, year));
    137             if (min_linked_date != null)
    138             {
    139               return {minDate: $(min_linked_date).datepicker("getDate")};
    140             }
    141             else if (max_linked_date != null)
    142             {
    143               return {maxDate: $(max_linked_date).datepicker("getDate")};
    144             }
    145             else
    146             {
    147               return {};
    148             }
    149         },
    150       onSelect:
    151         // Update three select controls to match a date picker selection
    152         function updateLinked(date) {
    153             if (date.length == 0)
    154             {
    155               $(year).val("");
    156               $(month).val("0");
    157               $(day).val("0");
    158             }
    159             else
    160             {
    161               array_date = date.split('-');
    162               $(year).val(array_date[0]);
    163               $(month).val(array_date[1]);
    164               $(day).val(array_date[2]);
    165             }
    166             pwg_on_date_change();
    167         },
    168       showOn: "both",
    169 {/literal}
    170       buttonImage: "{$ROOT_URL}admin/template/{$themeconf.template}/icon/datepicker.png",
    171 {literal}
    172       buttonImageOnly: true,
    173       buttonText: ""
    174       });
    175 
    176     // Check showed controls
    177     jQuery(day + ", " + month + ", " + year).change(
    178       function ()
    179       {
    180         pwg_on_date_change();
    181       });
    182 
    183     // Check showed controls
    184     jQuery(day + ", " + month + ", " + year).focus(
    185       function ()
    186       {
    187         pwg_disabled_selection();
    188       });
    189 
    190     // In order to init linked input
    191     pwg_check_date();
    192    });
    193 
     14{ldelim}
     15  return pwg_common_initialization_datepicker(
     16    "{$ROOT_URL}admin/template/{$themeconf.template}/icon/datepicker.png",
     17    day, month, year, linked_date, checked_on_change, min_linked_date, max_linked_date);
    19418}
    19519</script>
    196 {/literal}

  • branches/2.0/template/yoga/default-layout.css

    r2677 r2705  
    277277#theNotificationPage dl,
    278278#thePopuphelpPage dl { margin: 0 25px 25px; }
     279
     280/* jQuery datepicker */
     281img.ui-datepicker-trigger {
     282        cursor : pointer;
     283}

  • branches/2.0/template/yoga/search.tpl

    r2690 r2705  
    11{* $Id$ *}
     2
     3{* Example of datepicker
     4{include file='include/datepicker.inc.tpl'}
     5
     6{literal}
     7<script type="text/javascript">
     8  pwg_initialization_datepicker("#start_day", "#start_month", "#start_year", "#start_linked_date", null, null, "#end_linked_date");
     9  pwg_initialization_datepicker("#end_day", "#end_month", "#end_year", "#end_linked_date", null, "#start_linked_date", null);
     10 jQuery().ready(function(){ $(".date_today").hide(); });
     11</script>
     12{/literal}
     13*}
     14
    215<div id="content" class="content">
    316
    … …  
    7588    </li>
    7689    <li>
    77       <a href="#" onClick="document.search.start_day.value={$smarty.now|date_format:"%d"};document.search.start_month.value={$smarty.now|date_format:"%m"};document.search.start_year.value={$smarty.now|date_format:"%Y"};return false;">{'today'|@translate}</a>
     90      <a class="date_today" href="#" onClick="document.search.start_day.value={$smarty.now|date_format:"%d"};document.search.start_month.value={$smarty.now|date_format:"%m"};document.search.start_year.value={$smarty.now|date_format:"%Y"};return false;">{'today'|@translate}</a>
    7891    </li>
    7992  </ul>
    … …  
    94107    </li>
    95108    <li>
    96       <a href="#" onClick="document.search.end_day.value={$smarty.now|date_format:"%d"};document.search.end_month.value={$smarty.now|date_format:"%m"};document.search.end_year.value={$smarty.now|date_format:"%Y"};return false;">{'today'|@translate}</a>
     109      <a class="date_today" href="#" onClick="document.search.end_day.value={$smarty.now|date_format:"%d"};document.search.end_month.value={$smarty.now|date_format:"%m"};document.search.end_year.value={$smarty.now|date_format:"%Y"};return false;">{'today'|@translate}</a>
    97110    </li>
    98111  </ul>
Note: See TracChangeset for help on using the changeset viewer.