require({cache:{ 'url:dojox/calendar/templates/MonthColumnView.html':"
gridCellDatePattern
// property can be used to set a custom date pattern to the formatter.
// d: Date
// The date to format.
// row: Integer
// The row that displays the current date.
// col: Integer
// The column that displays the current date.
// tags:
// protected
var format, rb;
if(d == null){
return "";
}
if(this.gridCellPattern){
return this.renderData.dateLocaleModule.format(d, {
selector: 'date',
datePattern: this.gridCellDatePattern
});
}else{
rb = i18n.getLocalization("dojo.cldr", this._calendar);
format = rb["dateFormatItem-d"];
var days = this.renderData.dateLocaleModule.getNames("days", "abbr", "standAlone");
return days[d.getDay()].substring(0, 1) + " " + this.renderData.dateLocaleModule.format(d, {
selector: 'date',
datePattern: format
});
}
},
//////////////////////////////////////////
//
// Time of day management
//
//////////////////////////////////////////
// scrollPosition: Integer
// The scroll position of the view.
scrollPosition: null,
// scrollBarRTLPosition: String
// Position of the scroll bar in right-to-left display.
// Valid values are "left" and "right", default value is "left".
scrollBarRTLPosition: "left",
_setScrollPositionAttr: function(value){
this._setScrollPosition(value.date, value.duration, value.easing);
},
_getScrollPositionAttr: function(){
return {date: (this.scrollContainer.scrollTop / this.daySize) + 1};
},
_setScrollPosition: function(date, maxDuration, easing){
// tags:
// private
if(date < 1){
date = 1
}else if(date>31){
date = 31;
}
var position = (date-1) * this.daySize;
if(maxDuration) {
if(this._scrollAnimation){
this._scrollAnimation.stop();
}
var duration = Math.abs(((position - this.scrollContainer.scrollTop) * maxDuration) / this.renderData.sheetHeight);
this._scrollAnimation = new fx.Animation({
curve: [this.scrollContainer.scrollTop, position],
duration: duration,
easing: easing,
onAnimate: lang.hitch(this, function(position) {
this._setScrollImpl(position);
})
});
this._scrollAnimation.play();
}else{
this._setScrollImpl(position);
}
},
_setScrollImpl: function(v){
// tags:
// private
this.scrollContainer.scrollTop = v;
if(this.scrollBar){
this.scrollBar.set("value", v);
}
},
ensureVisibility: function(start, end, visibilityTarget, margin, duration){
// summary:
// Scrolls the view if the [start, end] time range is not visible or only partially visible.
// start: Date
// Start time of the range of interest.
// end: Date
// End time of the range of interest.
// margin: Integer
// Margin in minutes around the time range.
// visibilityTarget: String
// The end(s) of the time range to make visible.
// Valid values are: "start", "end", "both".
// duration: Number
// Optional, the maximum duration of the scroll animation.
margin = margin == undefined ? 1 : margin;
if(this.scrollable && this.autoScroll){
var s = start.getDate() - margin; // -1 because day of months starts at 1 and not 0
if(this.isStartOfDay(end)){
end = this._waDojoxAddIssue(end, "day", -1);
}
var e = end.getDate() + margin;
var viewStart = this.get("scrollPosition").date;
var r = domGeometry.getContentBox(this.scrollContainer);
var viewEnd = (this.get("scrollPosition").date + (r.h/this.daySize));
var visible = false;
var target = null;
switch(visibilityTarget){
case "start":
visible = s >= viewStart && s <= viewEnd;
target = s ;
break;
case "end":
visible = e >= viewStart && e <= viewEnd;
target = e - (viewEnd - viewStart);
break;
case "both":
visible = s >= viewStart && e <= viewEnd;
target = s;
break;
}
if(!visible){
this._setScrollPosition(target, duration);
}
}
},
scrollView: function(dir){
// summary:
// Scrolls the view to the specified direction of one time slot duration.
// dir: Integer
// Direction of the scroll. Valid values are -1 and 1.
//
var pos = this.get("scrollPosition").date + dir;
this._setScrollPosition(pos);
},
_mouseWheelScrollHander: function(e){
// summary:
// Mouse wheel handler.
// tags:
// protected
this.scrollView(e.wheelDelta > 0 ? -1 : 1);
},
//////////////////////////////////////////
//
// HTML structure management
//
//////////////////////////////////////////
refreshRendering: function(){
if(!this._initialized){
return;
}
this._validateProperties();
var oldRd = this.renderData;
var rd = this._createRenderData();
this.renderData = rd;
this._createRendering(rd, oldRd);
this._layoutRenderers(rd);
},
_createRendering: function(/*Object*/renderData, /*Object*/oldRenderData){
// tags:
// private
domStyle.set(this.sheetContainer, "height", renderData.sheetHeight + "px");
// padding for the scroll bar.
this._configureScrollBar(renderData);
this._buildColumnHeader(renderData, oldRenderData);
this._buildGrid(renderData, oldRenderData);
this._buildItemContainer(renderData, oldRenderData);
},
_configureScrollBar: function(renderData){
if(has("ie") && this.scrollBar){
domStyle.set(this.scrollBar.domNode, "width", (renderData.scrollbarWidth + 1) + "px");
}
var atRight = this.isLeftToRight() ? true : this.scrollBarRTLPosition == "right";
var rPos = atRight ? "right" : "left";
var lPos = atRight? "left" : "right";
if(this.scrollBar){
this.scrollBar.set("maximum", renderData.sheetHeight);
domStyle.set(this.scrollBar.domNode, rPos, 0);
domStyle.set(this.scrollBar.domNode, lPos, "auto");
}
domStyle.set(this.scrollContainer, rPos, renderData.scrollbarWidth + "px");
domStyle.set(this.scrollContainer, lPos, "0");
domStyle.set(this.columnHeader, rPos, renderData.scrollbarWidth + "px");
domStyle.set(this.columnHeader, lPos, "0");
if(this.buttonContainer && this.owner != null && this.owner.currentView == this){
domStyle.set(this.buttonContainer, rPos, renderData.scrollbarWidth + "px");
domStyle.set(this.buttonContainer, lPos, "0");
}
},
_columnHeaderClick: function(e){
// tags:
// private
event.stop(e);
var index = query("td", this.columnHeaderTable).indexOf(e.currentTarget);
this._onColumnHeaderClick({
index: index,
date: this.renderData.dates[index][0],
triggerEvent: e
});
},
_buildColumnHeader: function(renderData, oldRenderData){
// summary:
// Creates incrementally the HTML structure of the column header and configures its content.
//
// renderData:
// The render data to display.
//
// oldRenderData:
// The previously render data displayed, if any.
// tags:
// private
var table = this.columnHeaderTable;
if (!table){
return;
}
var count = renderData.columnCount - (oldRenderData ? oldRenderData.columnCount : 0);
if(has("ie") == 8){
// workaround Internet Explorer 8 bug.
// if on the table, width: 100% and table-layout: fixed are set
// and columns are removed, width of remaining columns is not
// recomputed: must rebuild all.
if(this._colTableSave == null){
this._colTableSave = lang.clone(table);
}else if(count < 0){
this._cleanupColumnHeader();
this.columnHeader.removeChild(table);
domConstruct.destroy(table);
table = lang.clone(this._colTableSave);
this.columnHeaderTable = table;
this.columnHeader.appendChild(table);
count = renderData.columnCount;
}
} // else incremental dom add/remove for real browsers.
var tbodies = query("tbody", table);
var trs = query("tr", table);
var tbody, tr, td;
if (tbodies.length == 1){
tbody = tbodies[0];
}else{
tbody = html.create("tbody", null, table);
}
if (trs.length == 1){
tr = trs[0];
}else{
tr = domConstruct.create("tr", null, tbody);
}
// Build HTML structure (incremental)
if(count > 0){ // creation
for(var i=0; i < count; i++){
td = domConstruct.create("td", null, tr);
var h = [];
h.push(on(td, "click", lang.hitch(this, this._columnHeaderClick)));
if(has("touch")){
h.push(on(td, "touchstart", function(e){
event.stop(e);
domClass.add(e.currentTarget, "Active");
}));
h.push(on(td, "touchend", function(e){
event.stop(e);
domClass.remove(e.currentTarget, "Active");
}));
}else{
h.push(on(td, "mousedown", function(e){
event.stop(e);
domClass.add(e.currentTarget, "Active");
}));
h.push(on(td, "mouseup", function(e){
event.stop(e);
domClass.remove(e.currentTarget, "Active");
}));
h.push(on(td, "mouseover", function(e){
event.stop(e);
domClass.add(e.currentTarget, "Hover");
}));
h.push(on(td, "mouseout", function(e){
event.stop(e);
domClass.remove(e.currentTarget, "Hover");
}));
}
this._columnHeaderHandlers.push(h);
}
}else{ // deletion
count = -count;
for(var i=0; i < count; i++){
td = tr.lastChild;
tr.removeChild(td);
domConstruct.destroy(td);
var list = this._columnHeaderHandlers.pop();
while(list.length>0){
list.pop().remove();
}
}
}
// fill & configure
query("td", table).forEach(function(td, i){
td.className = "";
if(i == 0){
domClass.add(td, "first-child");
}else if(i == this.renderData.columnCount-1){
domClass.add(td, "last-child");
}
var d = renderData.dates[i][0];
this._setText(td, this._formatColumnHeaderLabel(d));
this.styleColumnHeaderCell(td, d, renderData);
}, this);
},
_cleanupColumnHeader: function(){
// tags:
// private
while(this._columnHeaderHandlers.length > 0){
var list = this._columnHeaderHandlers.pop();
while(list.length > 0){
list.pop().remove();
}
}
},
styleColumnHeaderCell: function(node, date, renderData){
// summary:
// Styles the CSS classes to the node that displays a column header cell.
// By default this method is does nothing and is designed to be overridden.
// node: Node
// The DOM node that displays the column in the grid.
// date: Date
// The date displayed by this column
// renderData: Object
// The render data.
// tags:
// protected
},
_buildGrid: function (renderData, oldRenderData){
// summary:
// Creates incrementally the HTML structure of the grid and configures its content.
//
// renderData:
// The render data to display.
//
// oldRenderData:
// The previously render data displayed, if any.
// tags:
// private
var table = this.gridTable;
if(!table){
return;
}
domStyle.set(table, "height", renderData.sheetHeight + "px");
var rowDiff = renderData.maxDayCount - (oldRenderData ? oldRenderData.maxDayCount : 0);
var addRows = rowDiff > 0;
var colDiff = renderData.columnCount - (oldRenderData ? oldRenderData.columnCount : 0);
if(has("ie") == 8){
// workaround Internet Explorer 8 bug.
// if on the table, width: 100% and table-layout: fixed are set
// and columns are removed, width of remaining columns is not
// recomputed: must rebuild all.
if(this._gridTableSave == null){
this._gridTableSave = lang.clone(table);
}else if(colDiff < 0){
this.grid.removeChild(table);
domConstruct.destroy(table);
table = lang.clone(this._gridTableSave);
this.gridTable = table;
this.grid.appendChild(table);
colDiff = renderData.columnCount;
rowDiff = renderData.maxDayCount;
addRows = true;
}
}
var tbodies = query("tbody", table);
var tbody;
if(tbodies.length == 1){
tbody = tbodies[0];
}else{
tbody = domConstruct.create("tbody", null, table);
}
// Build rows HTML structure (incremental)
if(addRows){ // creation
for(var i=0; i