rsence-pre 3.0.0.8 → 3.0.0.9

data/client/js/datetime/calendar/calendar.coffee

@@ -5,7 +5,7 @@
   ## since or before epoch (1970-01-01 00:00:00 UTC).
   ####
 HCalendar = HControl.extend
-  
+
   componentName: 'calendar'
   markupElemNames: [ 'control', 'state', 'label', 'value', 'prevMonth', 'nextMonth' ]
 
@@ -17,7 +17,11 @@ HCalendar = HControl.extend
 
   controlDefaults: HControlDefaults.extend
     preserveTime: true
-  
+    useUTC: null
+    legacyCompatible: false
+  customOptons: (_options)->
+    _options.useUTC = HLocale.dateTime.defaultOptions.useUTC if _options.useUTC == null
+
   ## Calls HCalendar#nextMonth or HCalendar#prevMonth based on delta change
   ## of the mouseWheel event
   mouseWheel: (_delta)->
@@ -28,44 +32,32 @@ HCalendar = HControl.extend
 
   ## Draws the next month
   nextMonth: (_set)->
-    _dateNext = new Date( @viewMonth[0], @viewMonth[1]+1, 1 )
-    _dateMs = _dateNext.getTime() - @tzMs(_dateNext)
-    if _set
-      @setValue( _dateMs/1000 )
-    else
-      @drawCalendar( new Date(_dateMs) )
-  
+    _date = @moment(@viewMonth).endOf('month').add(1,'ms')
+    @setValue( _date.unix() ) if _set
+    @drawCalendar( _date )
+
   ## Draws the prev month
   prevMonth: (_set)->
-    _datePrev = new Date( @viewMonth[0], @viewMonth[1]-1, 1 )
-    _dateMs = _datePrev.getTime() - @tzMs(_datePrev)
-    if _set
-      @setValue( _dateMs/1000 )
-    else
-      @drawCalendar( new Date(_dateMs) )
-  
+    _date = @moment(@viewMonth).startOf('month').subtract(1,'ms')
+    @setValue( _date.unix() ) if _set
+    @drawCalendar( _date )
+
   ## Draws the next year
   nextYear: (_set)->
-    _dateNext = new Date( @viewMonth[0]+1, @viewMonth[1], 1 )
-    _dateMs = _dateNext.getTime() - @tzMs(_dateNext)
-    if _set
-      @setValue( _dateMs/1000 )
-    else
-      @drawCalendar( new Date(_dateMs) )
-  
+    _date = @moment(@viewMonth).endOf('year').add(1,'ms')
+    @setValue( _date.unix() ) if _set
+    @drawCalendar( _date )
+
   ## Draws the prev year
   prevYear: (_set)->
-    _datePrev = new Date( @viewMonth[0]-1, @viewMonth[1], 1 )
-    _dateMs = _datePrev.getTime() - @tzMs(_datePrev)
-    if _set
-      @setValue( _dateMs/1000 )
-    else
-      @drawCalendar( new Date(_dateMs) )
-  
-  nextDay: -> @setValue( @value + 24*60*60 )
-  prevDay: -> @setValue( @value - 24*60*60 )
-  nextWeek: -> @setValue( @value + 7*24*60*60 )
-  prevWeek: -> @setValue( @value - 7*24*60*60 )
+    _date = @moment(@viewMonth).startOf('year').subtract(1,'ms')
+    @setValue( _date.unix() ) if _set
+    @drawCalendar( _date )
+
+  nextDay: -> @setValue( @moment(@value*1000).add(1,'day').unix() )
+  prevDay: -> @setValue( @moment(@value*1000).subtract(1,'day').unix() )
+  nextWeek: -> @setValue( @moment(@value*1000).add(1,'week').unix() )
+  prevWeek: -> @setValue( @moment(@value*1000).subtract(1,'week').unix() )
 
   ## Keyboard control
   keyDown: (_key)->
@@ -84,30 +76,24 @@ HCalendar = HControl.extend
       @prevYear(true) if _key == Event.KEY_HOME
       @nextYear(true) if _key == Event.KEY_END
     true
-  
+
   drawSubviews: ->
-    _this = @
-    Event.observe( @elemOfPart( 'prevMonth' ), 'click', ->
-      _this.prevMonth()
-    )
-    Event.observe( @elemOfPart( 'nextMonth' ), 'click', ->
-      _this.nextMonth()
-    )
+    Event.observe( @elemOfPart( 'prevMonth' ), 'click', => @prevMonth() )
+    Event.observe( @elemOfPart( 'nextMonth' ), 'click', => @nextMonth() )
 
   ## Returns an array of week day names starting with the short name of the word "week".
   ## The default locale returns: ['Wk','Mon','Tue','Wed','Thu','Fri','Sat','Sun']
   ## See HLocale for more details
   localizedDays: ->
-    _str = HLocale.dateTime.strings
+    _str = @localeStrings
     _arr = @cloneObject( _str.weekDaysShort )
     _arr.push( _arr.shift() )
     _arr.unshift( _str.weekShort )
     _arr
-  
+
   _destroyWeekDayElems: ->
     if @_weekDayElems?
-      for _elemId in @_weekDayElems
-        ELEM.del( _elemId )
+      ELEM.del( _elemId ) for _elemId in @_weekDayElems
       @_weekDayElems = null
 
   ## Refreshes the week days header
@@ -122,15 +108,16 @@ HCalendar = HControl.extend
     for _dayName, i in _dayNames
       _dayElem = ELEM.make( _parentElem )
       ELEM.setHTML( _dayElem, _dayName )
-      ELEM.setStyle( _dayElem, 'width', _dayWidth+'px' )
-      _left = i * _dayWidth + _leftOffset
-      ELEM.setStyle( _dayElem, 'left', _left+'px' )
+      ELEM.setStyles( _dayElem,
+        width: _dayWidth+'px'
+        left: (i * _dayWidth + _leftOffset)+'px'
+      )
     @_weekDayElems = _dayElems
-  
+
   ## Calls #refreshWeekDays when theme is applied
   refreshLabel: ->
     @refreshWeekDays() if @markupElemIds? and not @_weekDayElems?
-  
+
   ## Calculates the first and last week of the month of the _date
   ##
   ## Params:
@@ -151,112 +138,101 @@ HCalendar = HControl.extend
   ##   }
   ## }
   calendarDateRange: (_date)->
-    _monthFirst = @firstDateOfMonth( _date )
-    _monthLast  = @lastDateOfMonth( _date )
-    _weekFirst  = @firstDateOfWeek( _monthFirst )
-    _weekLast   = @lastDateOfWeek( _monthLast )
-    _firstWeekNum = @week( _weekFirst )
-    _lastWeekNum  = @week( _weekLast )
-    _weeks = _firstWeekNum - _lastWeekNum
-    if _weeks == 5 
-      if _weekFirst.getDate() == 1
-        _weekFirst = new Date( _weekFirst.getTime() - @msWeek )
-      else
-        _weekLast = new Date( _weekLast.getTime() + @msWeek )
-    else if _weeks == 4
-      _weekFirst = new Date( _weekFirst.getTime() - @msWeek )
-    return {
-      week: {
-        firstDate: _weekFirst
-        lastDate:  _weekLast
-        firstNum: _firstWeekNum
-        lastNum: _lastWeekNum
-        count: _weeks
-      }
-      month: {
-        firstDate: _monthFirst
-        lastDate:  _monthLast
-      }
-    }
+    _date = @moment( @_dateSel(_date) )
+    _ranges =
+      week:
+        firstDate: _date.clone().startOf('month').startOf('week')
+        lastDate:  _date.clone().endOf('month').endOf('week')
+      month:
+        firstDate: _date.clone().startOf('month')
+        lastDate:  _date.clone().endOf('month')
+    _ranges.week.firstNum = _ranges.week.firstDate.week()
+    _ranges.week.lastNum = _ranges.week.lastDate.week()
+    _ranges.week.count = _ranges.week.lastNum - _ranges.week.firstNum
+    if _ranges.month.firstDate.weekday() < 3
+      _ranges.week.firstDate.subtract(1,'week')
+    _ranges
 
   lostActiveStatus: (_obj)->
-    if (_obj and @menu and !@menu._killed and !_obj.isChildOf(@menu) and !_obj.isChildOf(@menu.menuItemView))
-      @menu.die()
+    if (_obj and _obj.isChildOf(@) and not _obj.isChildOf(@menu) and not ( @menu? and _obj.isChildOf(@menu.menuItemView)) )
+      @destroyMenus()
     @base(_obj)
 
   ## Calls #drawCalendar when the value is changed
-  refreshValue: ->
-    @drawCalendar( @date() )
-  
+  refreshValue: -> @drawCalendar( @date() )
+
   ## Stores the currently viewed year and month
-  viewMonth: [ 1970, 0 ]
+  viewMonth: [ 1970, 0, 1 ]
+
+  destroyMenus: ->
+    if @yearMenu
+      @yearMenu.dieSoon() if ( @yearMenu? and @yearMenu.die? and not @yearMenu.isDead )
+      @yearMenu = null
+      delete @yearMenu
+    if @menu
+      @menu.dieSoon() if ( @menu? and @menu.die? and not @menu.isDead )
+      @menu = null
+      delete @menu
 
   ## Shows a pulldown menu for month selection
   monthMenu: ->
-    return unless HMiniMenu?
+    return unless HPopupMenu?
     _calendar = @
     _monthValues = []
-    for _monthName, i in HLocale.dateTime.strings.monthsLong
-      _monthValues.push( [ i, _monthName ] )
+    _monthValues.push( [ i, _monthName ] ) for _monthName, i in @localeStrings.monthsLong
     _rect = ELEM.getBoxCoords( @_monthMenu )
-    _rect[0] += 20
-    _rect[2] = 80 if _rect[2] < 80
-    @menu = HMiniMenu.extend(
-      click: ->
-        console.log('click')
-      menuHide: ->
-        return if @_killed?
-        @_killed = true
+    _rect[1] -= @rect.top
+    _rect[2] = 100 if _rect[2] < 100
+    @destroyMenus()
+    @menu = HPopupMenu.extend(
+      menuShow: ->
+        if @base()
+          @_shouldSetValue = true
+      lostActiveStatus: (_obj)->
+        if (_obj and _obj.isChildOf(@parent) and not _obj.isChildOf(@) and _obj.isChildOf(@menuItemView) and not _obj == @)
+          @parent.destroyMenus()
+          EVENT.changeActiveControl(@parent)
+        else
+          @base(_obj)
+      refreshValue: ->
         @base()
-        _calendar.setValue( _calendar.setMonth( @value ) )
-        if _calendar.month() != @value
-          _calendar.setValue( _calendar.setMday( 30 ) )
-          _calendar.setValue( _calendar.setMonth( @value ) )
-        if _calendar.month() != @value
-          _calendar.setValue( _calendar.setMday( 29 ) )
-          _calendar.setValue( _calendar.setMonth( @value ) )
-        if _calendar.month() != @value
-          _calendar.setValue( _calendar.setMday( 28 ) )
-          _calendar.setValue( _calendar.setMonth( @value ) )
-        _menu = @
-        COMM.Queue.push( ->
-          EVENT.changeActiveControl(_calendar)
-          _calendar.menu = null
-          _menu.die()
-        )
+        return unless @_shouldSetValue
+        if @_shouldSetValue and not @isDead
+          @parent.viewMonth[1] = @value
+          @parent.drawCalendar( @parent.moment( @parent.viewMonth ) )
+          @_shouldSetValue = false
+        @hide()
     ).new( _rect, @,
-      value: @month()
-      initialVisibility: true
+      value: @viewMonth[1]
       listItems: _monthValues
     )
-  
+    @menu.menuShow()
+
   ## Shows a text field for year selection
   yearMenu: ->
     _calendar = @
     _calendarEnable = @enabled
     _rect = ELEM.getBoxCoords( @_yearMenu )
-    _rect[0] += 20
+    _rect[0] += 12
     _rect[2] = 40 if _rect[2] < 40
-    _rect[3] = 16
-    EVENT.changeActiveControl(null)
-    @setEnabled(false)
-    HNumericTextControl.extend(
+    @destroyMenus()
+    @yearMenu = HNumericTextControl.extend(
       refreshValue: ->
         @base()
-        _calendar.setValue( _calendar.setYear( @value ) )
+        @parent.viewMonth[0] = @value
+        @parent.drawCalendar( @parent.moment( @parent.viewMonth ) )
+      lostActiveStatus: (_obj)->
+        @base(_obj)
+        EVENT.changeActiveControl( @parent )
       gainedActiveStatus: (_obj)->
         @base(_obj)
-        _calendar.setEnabled(_calendarEnable)
-      textBlur: ->
+      die: ->
+        return if @isDead
+        EVENT.changeActiveControl( @parent )
         @base()
-        _year = @
-        COMM.Queue.push( ->
-          if _year.markupElemIds?
-            _year.die()
-        )
-      keyDown: (_key)->
-        if _key == Event.KEY_RETURN
-          ELEM.get( @markupElemIds.value ).blur()
+      defaultKey: ->
+        @base()
+        true
     ).new( _rect, @,
       value: @year()
       minValue: -38399
@@ -264,99 +240,121 @@ HCalendar = HControl.extend
       focusOnCreate: true
       refreshOnInput: false
       refreshOnIdle: false
-      events:
-        keyDown: true
       style:
-        fontSize: '11px'
+        textAlign: 'left'
+        fontSize: '12px'
+        padding: 0
+        margin: 0
     )
-  
+    EVENT.changeActiveControl(@yearMenu)
+
   _destroyCalendarElems: ->
     if @_drawCalendarElems?
-      for _elemId in @_drawCalendarElems
-        ELEM.del( _elemId )
+      ELEM.del( _elemId ) for _elemId in @_drawCalendarElems
       @_drawCalendarElems = null
-  
+
   die: ->
+    @destroyMenus()
     @_destroyWeekDayElems()
     @_destroyCalendarElems()
     @base()
 
+  _createGridElem: (_elems,_parent,_tag,_classNames,_styles)->
+    _elemId = ELEM.make( _parent, _tag )
+    _elems.push( _elemId )
+    ELEM.addClassName( _elemId, _className ) for _className in _classNames
+    ELEM.setStyles( _elemId, _styles )
+    _elemId
+
   ## Draws the calendar with the date open given as input.
   ##
   ## Params:
   ## - _date: The date on which calendar UI is opened at.
   drawCalendar: (_date)->
-    _date = @date() unless ( _date instanceof Date )
+    @destroyMenus()
+    _date = @moment(@_dateSel(_date).getTime())
+    _this = @
     _calendarDateRange = @calendarDateRange( _date )
-    _monthFirst = _calendarDateRange.month.firstDate
-    _monthLast  = _calendarDateRange.month.lastDate
-    _firstDate  = _calendarDateRange.week.firstDate
-    _lastDate   = _calendarDateRange.week.lastDate
-    _availWidth = @rect.width - 2
+    [ _monthFirst, _monthLast, _firstDate, _lastDate ] = [
+      _calendarDateRange.month.firstDate
+      _calendarDateRange.month.lastDate
+      _calendarDateRange.week.firstDate
+      _calendarDateRange.week.lastDate
+    ]
+    _valueDate = @moment(@value*1000)
+    # console.log('monthFirst:',_monthFirst.toString())
+    # console.log('monthLast:',_monthLast.toString())
+    # console.log('firstDate:',_firstDate.toString())
+    # console.log('lastDate:',_lastDate.toString())
+    _colDate = _firstDate.clone()
+    if @options.todayStart?
+      _today  = @moment(@options.todayStart*1000)
+    else if @options.todayStart == false
+      _today  = false
+    else
+      _today  = @moment()
+    _availWidth  = @rect.width - 2
     _availHeight = @rect.height - 36
-    _leftPlus = ( _availWidth % 8 ) - 2
-    _topPlus  = ( _availHeight % 6 )
-    _colWidth = Math.floor( _availWidth / 8 )
-    _rowHeight = Math.floor( _availHeight / 6 )
-    _parentElem = @markupElemIds.value
-    # ELEM.setStyle( _parentElem, 'visibility', 'hidden', true )
+    _leftPlus    = ( _availWidth % 8 ) - 2
+    _topPlus     = ( _availHeight % 6 )
+    _colWidth    = Math.floor( _availWidth / 8 )
+    _rowHeight   = Math.floor( _availHeight / 6 )
+    _parentElem  = @markupElemIds.value
     _elems = []
-    _this = @
     for _row in [0..5]
-      _weekElem = ELEM.make( _parentElem )
-      _elems.push( _weekElem )
-      ELEM.addClassName( _weekElem, 'calendar_weeks_week_row' )
-      ELEM.setStyle( _weekElem, 'width', _availWidth+'px' )
-      ELEM.setStyle( _weekElem, 'height', _availHeight+'px' )
       _top = (_row*_rowHeight)+_topPlus
-      ELEM.setStyle( _weekElem, 'top', _top+'px' )
+      _weekElem = @_createGridElem( _elems, _parentElem, 'div', [ 'week_row' ],
+        width: _availWidth+'px'
+        height: _rowHeight+'px'
+        top:          _top+'px'
+      )
       for _col in [0..7]
-        if _col == 0
-          _colDate = new Date( _firstDate.getTime() + (_row*@msWeek) + (_col*@msDay) )
-          _colMs   = _colDate.getTime()
-          _colElem = ELEM.make( _weekElem )
-          _elems.push( _colElem )
-          ELEM.addClassName( _colElem, 'calendar_weeks_week_col_wk' )
-          ELEM.setStyle( _colElem, 'left', '0px' )
-          ELEM.setStyle( _colElem, 'width', _colWidth+'px' )
-          ELEM.setStyle( _colElem, 'height', _rowHeight+'px' )
-          ELEM.setStyle( _colElem, 'line-height', _rowHeight+'px' )
-          ELEM.setHTML( _colElem, @week( _colDate ) )
-        else
-          _colDate = new Date( _firstDate.getTime() + (_row*@msWeek) + ((_col-1)*@msDay) )
-          _colMs   = _colDate.getTime()
-          _colSecs = Math.round( _colMs/1000 )
-          _colElem = ELEM.make( _weekElem, 'a' )
-          _elems.push( _colElem )
-          if @value >= _colSecs and @value < _colSecs+86400
-            ELEM.addClassName( _colElem, 'calendar_weeks_week_col_sel' )
-          else if _colDate < _monthFirst or _colDate > _monthLast
-            ELEM.addClassName( _colElem, 'calendar_weeks_week_col_no' )
+        if _col == 0 # week number columns
+          # _colDate = @moment( _firstDate ).add(_row,'weeks').add(_col,'days')
+          _colElem = @_createGridElem( _elems, _weekElem, 'div', ['col_wk'],
+            width:       _colWidth+'px'
+            height:     _rowHeight+'px'
+            lineHeight: _rowHeight+'px'
+          )
+          ELEM.setHTML( _colElem, _colDate.week() )
+          # _colDate = _colDate.add(1,'days')
+        else # week day columns
+          # _colDate = @moment( _firstDate ).add(_row,'weeks').add(_col-1,'days')
+          _colDate = _colDate.add(1,'days')
+          _colSecs = _colDate.unix()
+          _colClasses = []
+          _prevDayLast = _colDate.clone().startOf('day').subtract(1,'ms')
+          _nextDayFirst = _colDate.clone().endOf('day').add(1,'ms')
+          # if _colDate.date() == 10
+          #   console.log('prev:',_prevDayLast.toString(),
+          #              ' date:',_date.toString(),
+          #              ' next:',_nextDayFirst.toString(),
+          #              ' value:',@moment(@value*1000).toString())
+          if _valueDate.isAfter(_prevDayLast) and _valueDate.isBefore(_nextDayFirst)
+            _colClasses.push( 'col_selected' )
+          else if _colDate.isBefore(_monthFirst) or _colDate.isAfter(_monthLast)
+            _colClasses.push( 'col_inactive' )
           else
-            ELEM.addClassName( _colElem, 'calendar_weeks_week_col_yes' )
-          if @options.todayStart? and @options.todayStart >= _colSecs and @options.todayStart < _colSecs + 86400
-            ELEM.addClassName( _colElem, 'calendar_weeks_week_col_today' )
-          ELEM.setAttr( _colElem, '_colSecs', _colSecs )
-          if @enabled
-            Event.observe( ELEM.get( _colElem ), 'click', ->
-              _this.setValue( @_colSecs )
-            )
-          # ELEM.setAttr( _colElem, 'href', "javascript:HSystem.views[#{@viewId}].setValue(#{_colSecs})" )
+            _colClasses.push( 'col_active' )
+          if _today and _today.isAfter(_prevDayLast) and _today.isBefore(_nextDayFirst)
+            _colClasses.push( 'col_today' )
           _left = (_col*_colWidth+_leftPlus)
-          ELEM.setStyle( _colElem, 'left', _left+'px' )
-          ELEM.setStyle( _colElem, 'width', (_colWidth-1)+'px' )
-          ELEM.setStyle( _colElem, 'height', (_rowHeight-1)+'px' )
-          ELEM.setStyle( _colElem, 'line-height', _rowHeight+'px' )
-          ELEM.setHTML( _colElem, @mday( _colDate ) )
-    # ELEM.setStyle( _parentElem, 'visibility', 'inherit' )
-    ELEM.flush()
+          _colElem = @_createGridElem( _elems, _weekElem, 'a', _colClasses,
+            left:            _left+'px'
+            width:   (_colWidth-1)+'px'
+            height: (_rowHeight-1)+'px'
+            lineHeight: _rowHeight+'px'
+          )
+          ELEM.setAttr( _colElem, '_colSecs', _colSecs )
+          Event.observe( ELEM.get( _colElem ), 'click', -> _this.setValue( @_colSecs ) ) if @enabled
+          ELEM.setHTML( _colElem, _colDate.date() )
+
     _stateElem = @markupElemIds.state
 
-    @_monthMenu = ELEM.make( _stateElem, 'span' )#, 'a' )
+    @_monthMenu = ELEM.make( _stateElem, 'span' )
     _elems.push( @_monthMenu )
-    # ELEM.setAttr( @_monthMenu, 'href', "javascript:HSystem.views[#{@viewId}].monthMenu()" )
-    if @enabled
-      Event.observe( ELEM.get( @_monthMenu ), 'click', ( -> _this.monthMenu() ), false )
+
+    Event.observe( ELEM.get( @_monthMenu ), 'click', ( -> _this.monthMenu() ), false ) if @enabled
     ELEM.setHTML( @_monthMenu, @monthName( _date ) )
 
     _spacer = ELEM.make( _stateElem, 'span' )
@@ -367,10 +365,9 @@ HCalendar = HControl.extend
     _elems.push( @_yearMenu )
     if @enabled
       Event.observe( ELEM.get( @_yearMenu ), 'click', ( -> _this.yearMenu() ), false )
-    # ELEM.setAttr( @_yearMenu, 'href', "javascript:HSystem.views[#{@viewId}].yearMenu()" )
     ELEM.setHTML( @_yearMenu, @year( _date ) )
 
-    @viewMonth = [ _monthFirst.getUTCFullYear(), _monthFirst.getUTCMonth() ]
+    @viewMonth = [ _monthFirst.year(), _monthFirst.month(), _monthFirst.date() ]
     @_destroyCalendarElems()
     @_drawCalendarElems = _elems