web/data/cubicweb.calendar.js
changeset 5699 f4f6ee3af50b
parent 5658 7b9553a9db65
child 5727 29afb9e715bb
equal deleted inserted replaced
5698:5c8fa1650299 5699:f4f6ee3af50b
     2  *  This file contains Calendar utilities
     2  *  This file contains Calendar utilities
     3  *  :organization: Logilab
     3  *  :organization: Logilab
     4  *  :copyright: 2003-2010 LOGILAB S.A. (Paris, FRANCE), all rights reserved.
     4  *  :copyright: 2003-2010 LOGILAB S.A. (Paris, FRANCE), all rights reserved.
     5  *  :contact: http://www.logilab.fr/ -- mailto:contact@logilab.fr
     5  *  :contact: http://www.logilab.fr/ -- mailto:contact@logilab.fr
     6  */
     6  */
     7 
       
     8 CubicWeb.require('python.js');
       
     9 CubicWeb.require('ajax.js');
       
    10 
     7 
    11 // IMPORTANT NOTE: the variables DAYNAMES AND MONTHNAMES will be added
     8 // IMPORTANT NOTE: the variables DAYNAMES AND MONTHNAMES will be added
    12 //                 by cubicweb automatically
     9 //                 by cubicweb automatically
    13 // dynamically computed (and cached)
    10 // dynamically computed (and cached)
    14 var _CAL_HEADER = null;
    11 var _CAL_HEADER = null;
    52             this.style.fontWeight = 'bold';
    49             this.style.fontWeight = 'bold';
    53         },
    50         },
    54         'onmouseout': function() {
    51         'onmouseout': function() {
    55             this.style.fontWeight = 'normal';
    52             this.style.fontWeight = 'normal';
    56         }
    53         }
    57     }
    54     };
    58 
    55 
    59     this.todayprops = jQuery.extend({},
    56     this.todayprops = jQuery.extend({},
    60     this.cellprops, {
    57     this.cellprops, {
    61         'class': 'today'
    58         'class': 'today'
    62     });
    59     });
    77      *
    74      *
    78      * utility function (the only use for now is inside the calendar)
    75      * utility function (the only use for now is inside the calendar)
    79      */
    76      */
    80     this._uppercaseFirst = function(s) {
    77     this._uppercaseFirst = function(s) {
    81         return s.charAt(0).toUpperCase();
    78         return s.charAt(0).toUpperCase();
    82     }
    79     };
    83 
    80 
    84     /**
    81     /**
    85      * .. function:: Calendar._domForRows(rows)
    82      * .. function:: Calendar._domForRows(rows)
    86      *
    83      *
    87      * accepts the cells data and builds the corresponding TR nodes
    84      * accepts the cells data and builds the corresponding TR nodes
   116         var rows = [];
   113         var rows = [];
   117         var firstday = new Date(this.year, this.month, 1);
   114         var firstday = new Date(this.year, this.month, 1);
   118         var stopdate = firstday.nextMonth();
   115         var stopdate = firstday.nextMonth();
   119         var curdate = firstday.sub(firstday.getRealDay());
   116         var curdate = firstday.sub(firstday.getRealDay());
   120         while (curdate.getTime() < stopdate) {
   117         while (curdate.getTime() < stopdate) {
   121             var row = []
   118             var row = [];
   122             for (var i = 0; i < 7; i++) {
   119             for (var i = 0; i < 7; i++) {
   123                 if (curdate.getMonth() == this.month) {
   120                 if (curdate.getMonth() == this.month) {
   124                     props = curdate.equals(TODAY) ? this.todayprops: this.cellprops;
   121                     props = curdate.equals(TODAY) ? this.todayprops: this.cellprops;
   125                     row.push([props, curdate.getDate()]);
   122                     row.push([props, curdate.getDate()]);
   126                 } else {
   123                 } else {
   129                 curdate.iadd(1);
   126                 curdate.iadd(1);
   130             }
   127             }
   131             rows.push(row);
   128             rows.push(row);
   132         }
   129         }
   133         return rows;
   130         return rows;
   134     }
   131     };
   135 
   132 
   136     this._makecal = function() {
   133     this._makecal = function() {
   137         var rows = this._getrows();
   134         var rows = this._getrows();
   138         var monthname = MONTHNAMES[this.month] + " " + this.year;
   135         var monthname = MONTHNAMES[this.month] + " " + this.year;
   139         var prevlink = "javascript: togglePreviousMonth('" + this.containerId + "');";
   136         var prevlink = "javascript: togglePreviousMonth('" + this.containerId + "');";
   154         monthname), TH(null, A({
   151         monthname), TH(null, A({
   155             'href': nextlink
   152             'href': nextlink
   156         },
   153         },
   157         ">>")))), TBODY(null, this._headdisplay(), this._domForRows(rows)));
   154         ">>")))), TBODY(null, this._headdisplay(), this._domForRows(rows)));
   158         return this.domtable;
   155         return this.domtable;
   159     }
   156     };
   160 
   157 
   161     this._updateDiv = function() {
   158     this._updateDiv = function() {
   162         if (!this.domtable) {
   159         if (!this.domtable) {
   163             this._makecal();
   160             this._makecal();
   164         }
   161         }
   165         cw.jqNode(this.containerId).empty().append(this.domtable);
   162         cw.jqNode(this.containerId).empty().append(this.domtable);
   166         // replaceChildNodes($(this.containerId), this.domtable);
   163         // replaceChildNodes($(this.containerId), this.domtable);
   167     }
   164     };
   168 
   165 
   169     this.displayNextMonth = function() {
   166     this.displayNextMonth = function() {
   170         this.domtable = null;
   167         this.domtable = null;
   171         if (this.month == 11) {
   168         if (this.month == 11) {
   172             this.year++;
   169             this.year++;
   173         }
   170         }
   174         this.month = (this.month + 1) % 12;
   171         this.month = (this.month + 1) % 12;
   175         this._updateDiv();
   172         this._updateDiv();
   176     }
   173     };
   177 
   174 
   178     this.displayPreviousMonth = function() {
   175     this.displayPreviousMonth = function() {
   179         this.domtable = null;
   176         this.domtable = null;
   180         if (this.month == 0) {
   177         if (this.month == 0) {
   181             this.year--;
   178             this.year--;
   182         }
   179         }
   183         this.month = (this.month + 11) % 12;
   180         this.month = (this.month + 11) % 12;
   184         this._updateDiv();
   181         this._updateDiv();
   185     }
   182     };
   186 
   183 
   187     this.show = function() {
   184     this.show = function() {
   188         if (!this.visible) {
   185         if (!this.visible) {
   189             container = cw.jqNode(this.containerId);
   186             var container = cw.jqNode(this.containerId);
   190             if (!this.domtable) {
   187             if (!this.domtable) {
   191                 this._makecal();
   188                 this._makecal();
   192             }
   189             }
   193             container.empty().append(this.domtable);
   190             container.empty().append(this.domtable);
   194             toggleVisibility(container);
   191             toggleVisibility(container);
   195             this.visible = true;
   192             this.visible = true;
   196         }
   193         }
   197     }
   194     };
   198 
   195 
   199     this.hide = function(event) {
   196     this.hide = function(event) {
   200         var self;
   197         var self;
   201         if (event) {
   198         if (event) {
   202             self = event.data.self;
   199             self = event.data.self;
   205         }
   202         }
   206         if (self.visible) {
   203         if (self.visible) {
   207             toggleVisibility(self.containerId);
   204             toggleVisibility(self.containerId);
   208             self.visible = false;
   205             self.visible = false;
   209         }
   206         }
   210     }
   207     };
   211 
   208 
   212     this.toggle = function() {
   209     this.toggle = function() {
   213         if (this.visible) {
   210         if (this.visible) {
   214             this.hide();
   211             this.hide();
   215         }
   212         }
   216         else {
   213         else {
   217             this.show();
   214             this.show();
   218         }
   215         }
   219     }
   216     };
   220 
   217 
   221     // call hide() when the user explicitly sets the focus on the matching input
   218     // call hide() when the user explicitly sets the focus on the matching input
   222     cw.jqNode(inputId).bind('focus', {
   219     cw.jqNode(inputId).bind('focus', {
   223         'self': this
   220         'self': this
   224     },
   221     },
   279     var input = getNode(cal.inputId);
   276     var input = getNode(cal.inputId);
   280     // XXX: the use of innerHTML might cause problems, but it seems to be
   277     // XXX: the use of innerHTML might cause problems, but it seems to be
   281     //      the only way understood by both IE and Mozilla. Otherwise,
   278     //      the only way understood by both IE and Mozilla. Otherwise,
   282     //      IE accepts innerText and mozilla accepts textContent
   279     //      IE accepts innerText and mozilla accepts textContent
   283     var selectedDate = new Date(cal.year, cal.month, cell.innerHTML, 12);
   280     var selectedDate = new Date(cal.year, cal.month, cell.innerHTML, 12);
   284     var xxx = remoteExec("format_date", cw.utils.toISOTimestamp(selectedDate));
   281     input.value = remoteExec("format_date", cw.utils.toISOTimestamp(selectedDate));
   285     input.value = xxx;
       
   286     cal.hide();
   282     cal.hide();
   287 }
   283 }
   288 
   284 
   289 function whichElement(e) {
   285 function whichElement(e) {
   290     var targ;
   286     var targ;
   291     if (!e) {
   287     if (!e) {
   292         var e = window.event;
   288         e = window.event;
   293     }
   289     }
   294     if (e.target) {
   290     if (e.target) {
   295         targ = e.target;
   291         targ = e.target;
   296     }
   292     }
   297     else if (e.srcElement) {
   293     else if (e.srcElement) {
   355 
   351 
   356 function stopPropagation(event) {
   352 function stopPropagation(event) {
   357     event.cancelBubble = true;
   353     event.cancelBubble = true;
   358     if (event.stopPropagation) event.stopPropagation();
   354     if (event.stopPropagation) event.stopPropagation();
   359 }
   355 }
   360 
       
   361 CubicWeb.provide('calendar.js');
       
   362