tweaks to ms-doodle-com's pull request for finer event selection granularity:

- identifiers in code renamed to "granularity", because not specific to selection (also event redragging)
- granularityMinutes automatically defaults to the slotMinutes option
- very minor code rearchitecting

src/agenda/AgendaEventRenderer.js

@@ -36,6 +36,8 @@ function AgendaEventRenderer() {
 	var getColCnt = t.getColCnt;
 	var getColWidth = t.getColWidth;
 	var getSlotHeight = t.getSlotHeight;
+	var getGranularityHeight = t.getGranularityHeight;
+	var getGranularityMinutes = t.getGranularityMinutes;
 	var getBodyContent = t.getBodyContent;
 	var reportEventElement = t.reportEventElement;
 	var showEvents = t.showEvents;
@@ -47,7 +49,6 @@ function AgendaEventRenderer() {
 	var calendar = t.calendar;
 	var formatDate = calendar.formatDate;
 	var formatDates = calendar.formatDates;
-	var getSelectionSlotRatio = t.getSelectionSlotRatio; // read selection slot ratio
 	
 	
 	
@@ -397,8 +398,8 @@ function AgendaEventRenderer() {
 									setOuterHeight(
 										eventElement,
 										slotHeight * Math.round(
-											(event.end ? ((event.end - event.start) / MINUTE_MS) : opt('defaultEventMinutes'))
-											/ opt('slotMinutes')
+											(event.end ? ((event.end - event.start) / MINUTE_MS) : opt('defaultEventMinutes')) /
+												opt('slotMinutes')
 										)
 									);
 									eventElement.draggable('option', 'grid', [colWidth, 1]);
@@ -464,11 +465,12 @@ function AgendaEventRenderer() {
 		var hoverListener = getHoverListener();
 		var colCnt = getColCnt();
 		var colWidth = getColWidth();
-		var slotHeight = getSlotHeight() / getSelectionSlotRatio();		// calculate height depending on selection slot ratio
+		var granularityHeight = getGranularityHeight();
+		var granularityMinutes = getGranularityMinutes();
 		eventElement.draggable({
 			zIndex: 9,
 			scroll: false,
-			grid: [colWidth, slotHeight],
+			grid: [colWidth, granularityHeight],
 			axis: colCnt==1 ? 'y' : false,
 			opacity: opt('dragOpacity'),
 			revertDuration: opt('dragRevertDuration'),
@@ -502,7 +504,7 @@ function AgendaEventRenderer() {
 				}, ev, 'drag');
 			},
 			drag: function(ev, ui) {
-				minuteDelta = Math.round((ui.position.top - origPosition.top) / slotHeight) * opt('selectionSlotMinutes');
+				minuteDelta = Math.round((ui.position.top - origPosition.top) / granularityHeight) * granularityMinutes;
 				if (minuteDelta != prevMinuteDelta) {
 					if (!allDay) {
 						updateTimeText(minuteDelta);
@@ -539,7 +541,7 @@ function AgendaEventRenderer() {
 			// convert back to original slot-event
 			if (allDay) {
 				timeElement.css('display', ''); // show() was causing display=inline
-				eventElement.draggable('option', 'grid', [colWidth, slotHeight]);
+				eventElement.draggable('option', 'grid', [colWidth, granularityHeight]);
 				allDay = false;
 			}
 		}
@@ -552,38 +554,39 @@ function AgendaEventRenderer() {
 	
 	
 	function resizableSlotEvent(event, eventElement, timeElement) {
-		var slotDelta, prevSlotDelta;
-		var slotHeight = getSlotHeight() / getSelectionSlotRatio();		// calculate height depending on selection slot ratio
+		var granularityDelta, prevGranularityDelta;
+		var granularityHeight = getGranularityHeight();
+		var granularityMinutes = getGranularityMinutes();
 		eventElement.resizable({
 			handles: {
 				s: 'div.ui-resizable-s'
 			},
-			grid: slotHeight,
+			grid: granularityHeight,
 			start: function(ev, ui) {
-				slotDelta = prevSlotDelta = 0;
+				granularityDelta = prevGranularityDelta = 0;
 				hideEvents(event, eventElement);
-				eventElement.css('z-index', 10);
+				eventElement.css('z-index', 9);
 				trigger('eventResizeStart', this, event, ev, ui);
 			},
 			resize: function(ev, ui) {
 				// don't rely on ui.size.height, doesn't take grid into account
-				slotDelta = Math.round((Math.max(slotHeight, eventElement.height()) - ui.originalSize.height) / slotHeight);
-				if (slotDelta != prevSlotDelta) {
+				granularityDelta = Math.round((Math.max(granularityHeight, eventElement.height()) - ui.originalSize.height) / granularityHeight);
+				if (granularityDelta != prevGranularityDelta) {
 					timeElement.text(
 						formatDates(
 							event.start,
-							(!slotDelta && !event.end) ? null : // no change, so don't display time range
-								addMinutes(eventEnd(event), opt('selectionSlotMinutes')*slotDelta),
+							(!granularityDelta && !event.end) ? null : // no change, so don't display time range
+								addMinutes(eventEnd(event), granularityMinutes*granularityDelta),
 							opt('timeFormat')
 						)
 					);
-					prevSlotDelta = slotDelta;
+					prevGranularityDelta = granularityDelta;
 				}
 			},
 			stop: function(ev, ui) {
 				trigger('eventResizeStop', this, event, ev, ui);
-				if (slotDelta) {
-					eventResize(this, event, 0, opt('selectionSlotMinutes')*slotDelta, ev, ui);
+				if (granularityDelta) {
+					eventResize(this, event, 0, granularityMinutes*granularityDelta, ev, ui);
 				}else{
 					eventElement.css('z-index', 8);
 					showEvents(event, eventElement);

src/agenda/AgendaView.js

@@ -4,7 +4,6 @@ setDefaults({
 	allDayText: 'all-day',
 	firstHour: 6,
 	slotMinutes: 30,
-	selectionSlotMinutes: 30, // Set default selection slot size to default slot size
 	defaultEventMinutes: 120,
 	axisFormat: 'h(:mm)tt',
 	timeFormat: {
@@ -52,6 +51,8 @@ function AgendaView(element, calendar, viewName) {
 	t.getColCnt = function() { return colCnt };
 	t.getColWidth = function() { return colWidth };
 	t.getSlotHeight = function() { return slotHeight };
+	t.getGranularityHeight = function() { return granularityHeight };
+	t.getGranularityMinutes = function() { return granularityMinutes };
 	t.defaultSelectionEnd = defaultSelectionEnd;
 	t.renderDayOverlay = renderDayOverlay;
 	t.renderSelection = renderSelection;
@@ -59,7 +60,6 @@ function AgendaView(element, calendar, viewName) {
 	t.reportDayClick = reportDayClick; // selection mousedown hack
 	t.dragStart = dragStart;
 	t.dragStop = dragStop;
-	t.getSelectionSlotRatio = function() { return selectionSlotRatio }; // make selectionSlotRatio readable
 	
 	
 	// imports
@@ -108,9 +108,10 @@ function AgendaView(element, calendar, viewName) {
 	var colWidth;
 	var gutterWidth;
 	var slotHeight; // TODO: what if slotHeight changes? (see issue 650)
-	var selectionSlotHeight;	// holds the hight of a selection slot in px
-	var selectionSlotRatio;		// holds the relationship between standard slot size and selection slot size
-	var savedScrollTop;
+
+	var granularityMinutes;
+	var granularityRatio; // ratio of number of "selection" slots to normal slots. (ex: 1, 2, 4)
+	var granularityHeight; // holds the pixel hight of a "selection" slot
 	
 	var colCnt;
 	var slotCnt;
@@ -118,6 +119,7 @@ function AgendaView(element, calendar, viewName) {
 	var hoverListener;
 	var colContentPositions;
 	var slotTopCache = {};
+	var savedScrollTop;
 	
 	var tm;
 	var firstDay;
@@ -175,6 +177,8 @@ function AgendaView(element, calendar, viewName) {
 		else {
 			weekNumberFormat = "W";
 		}
+
+		granularityMinutes = opt('granularityMinutes') || opt('slotMinutes');
 	}
 	
 	
@@ -385,8 +389,8 @@ function AgendaView(element, calendar, viewName) {
 		
 		slotHeight = slotTableFirstInner.height() + 1; // +1 for border
 
-		selectionSlotRatio = opt('slotMinutes') / opt('selectionSlotMinutes');
-		selectionSlotHeight = slotHeight / selectionSlotRatio;
+		granularityRatio = opt('slotMinutes') / granularityMinutes;
+		granularityHeight = slotHeight / granularityRatio;
 		
 		if (dateChanged) {
 			resetScroll();
@@ -575,10 +579,10 @@ function AgendaView(element, calendar, viewName) {
 		function constrain(n) {
 			return Math.max(slotScrollerTop, Math.min(slotScrollerBottom, n));
 		}
-		for (var i=0; i<slotCnt*selectionSlotRatio; i++) { // adapt slot count to increased/decreased selection slot count
+		for (var i=0; i<slotCnt*granularityRatio; i++) { // adapt slot count to increased/decreased selection slot count
 			rows.push([
-				constrain(slotTableTop + selectionSlotHeight*i),
-				constrain(slotTableTop + selectionSlotHeight*(i+1))
+				constrain(slotTableTop + granularityHeight*i),
+				constrain(slotTableTop + granularityHeight*(i+1))
 			]);
 		}
 	});
@@ -619,7 +623,7 @@ function AgendaView(element, calendar, viewName) {
 			slotIndex--;
 		}
 		if (slotIndex >= 0) {
-			addMinutes(d, minMinute + slotIndex * opt('selectionSlotMinutes'));
+			addMinutes(d, minMinute + slotIndex * granularityMinutes);
 		}
 		return d;
 	}
@@ -782,9 +786,9 @@ function AgendaView(element, calendar, viewName) {
 					var d2 = cellDate(cell);
 					dates = [
 						d1,
-						addMinutes(cloneDate(d1), opt('selectionSlotMinutes')), // calculate minutes depending on selection slot minutes 
+						addMinutes(cloneDate(d1), granularityMinutes), // calculate minutes depending on selection slot minutes 
 						d2,
-						addMinutes(cloneDate(d2), opt('selectionSlotMinutes'))
+						addMinutes(cloneDate(d2), granularityMinutes)
 					].sort(cmp);
 					renderSlotSelection(dates[0], dates[3]);
 				}else{