put event z-index's into stylesheet

src/agenda/AgendaEventRenderer.js

@@ -333,7 +333,13 @@ function AgendaEventRenderer() {
 		}
 		html +=
 			" class='" + classes.join(' ') + "'" +
-			" style='position:absolute;z-index:8;top:" + seg.top + "px;left:" + seg.left + "px;" + skinCss + "'" +
+			" style=" +
+				"'" +
+				"position:absolute;" +
+				"top:" + seg.top + "px;" +
+				"left:" + seg.left + "px;" +
+				skinCss +
+				"'" +
 			">" +
 			"<div class='fc-event-inner'>" +
 			"<div class='fc-event-time'>" +
@@ -387,7 +393,6 @@ function AgendaEventRenderer() {
 		var snapMinutes = getSnapMinutes();
 		var minMinute = getMinMinute();
 		eventElement.draggable({
-			zIndex: 9,
 			opacity: opt('dragOpacity', 'month'), // use whatever the month view was using
 			revertDuration: opt('dragRevertDuration'),
 			start: function(ev, ui) {
@@ -489,7 +494,6 @@ function AgendaEventRenderer() {
 		var minuteDelta, prevMinuteDelta;
 
 		eventElement.draggable({
-			zIndex: 9,
 			scroll: false,
 			grid: [ colWidth, snapHeight ],
 			axis: colCnt==1 ? 'y' : false,
@@ -644,7 +648,6 @@ function AgendaEventRenderer() {
 			start: function(ev, ui) {
 				snapDelta = prevSnapDelta = 0;
 				hideEvents(event, eventElement);
-				eventElement.css('z-index', 9);
 				trigger('eventResizeStart', this, event, ev, ui);
 			},
 			resize: function(ev, ui) {
@@ -667,7 +670,6 @@ function AgendaEventRenderer() {
 				if (snapDelta) {
 					eventResize(this, event, 0, snapMinutes*snapDelta, ev, ui);
 				}else{
-					eventElement.css('z-index', 8);
 					showEvents(event, eventElement);
 					// BUG: if event was really short, need to put title back in span
 				}

src/agenda/AgendaView.js

@@ -197,7 +197,7 @@ function AgendaView(element, calendar, viewName) {
 		if (opt('allDaySlot')) {
 		
 			daySegmentContainer =
-				$("<div style='position:absolute;z-index:8;top:0;left:0'/>")
+				$("<div class='fc-event-container' style='position:absolute;z-index:8;top:0;left:0'/>")
 					.appendTo(slotLayer);
 		
 			s =
@@ -236,7 +236,7 @@ function AgendaView(element, calendar, viewName) {
 				.appendTo(slotScroller);
 				
 		slotSegmentContainer =
-			$("<div style='position:absolute;z-index:8;top:0;left:0'/>")
+			$("<div class='fc-event-container' style='position:absolute;z-index:8;top:0;left:0'/>")
 				.appendTo(slotContainer);
 		
 		s =
@@ -786,7 +786,6 @@ function AgendaView(element, calendar, viewName) {
 						var helperRes = helperOption(startDate, endDate);
 						if (helperRes) {
 							rect.position = 'absolute';
-							rect.zIndex = 8;
 							selectionHelper = $(helperRes)
 								.css(rect)
 								.appendTo(slotContainer);

src/basic/BasicView.js

@@ -123,7 +123,7 @@ function BasicView(element, calendar, viewName) {
 	
 	function buildEventContainer() {
 		daySegmentContainer =
-			$("<div style='position:absolute;z-index:8;top:0;left:0'/>")
+			$("<div class='fc-event-container' style='position:absolute;z-index:8;top:0;left:0'/>")
 				.appendTo(element);
 	}
 	

src/common/DayEventRenderer.js

@@ -268,7 +268,6 @@ function DayEventRenderer() {
 			" style=" +
 				"'" +
 				"position:absolute;" +
-				"z-index:8;" + // TODO: move this into a constant or put it in the stylesheet
 				"left:" + segment.left + "px;" +
 				skinCss +
 				"'" +
@@ -329,7 +328,6 @@ function DayEventRenderer() {
 					triggerRes = $(triggerRes)
 						.css({
 							position: 'absolute',
-							zIndex: 8, // TODO: move this into a constant or put it in the stylesheet
 							left: segment.left
 						});
 
@@ -573,7 +571,6 @@ function DayEventRenderer() {
 		var hoverListener = getHoverListener();
 		var dayDelta;
 		eventElement.draggable({
-			zIndex: 9,
 			delay: 50,
 			opacity: opt('dragOpacity'),
 			revertDuration: opt('dragRevertDuration'),

src/common/common.css

@@ -138,6 +138,15 @@
 
 /* Global Event Styles
 ------------------------------------------------------------------------*/
+
+.fc-event-container > * {
+	z-index: 8;
+	}
+
+.fc-event-container > .ui-draggable-dragging,
+.fc-event-container > .ui-resizable-resizing {
+	z-index: 9;
+	}
 	 
 .fc-event {
 	border: 1px solid #3a87ad; /* default BORDER color */