Show Open Seats for DF12 Sessions Scriptlet

DF12SessionOpenSeats.js

/*
Curious about how many people are attending your session?
Use this JS scriptlet to find out how many people will be attending your session!

Open the DF12 Agenda Builder web app. Open the developer tools for your browser,
copy this entire gist into the JS command line, and run it.

A list of all sessions for which you are registered will be shown with
the number of open seats remaining next to them.
*/



window.showTextInCloudPanel = function(contentToShow) {

	//Pre-render
	$Cloud.destroyPanel();

	var htmlToShow = contentToShow.replace(/\r\n/g, "<br>");


	//Render panel
	$('#loadingMask').show().one('click', $Cloud.destroyPanel);

	//Add header to templ.
	//Header and scroller are siblings
	var panelHeaderbarHtml = '<div class="panelHeaderBar fixedBar"><div class="bLeft"></div><div class="bRight"><span class="uiButton submit back">Close</span></div><div class="bBody"><h3 class="flush truncate"> Open Capacity for DF12 Sessions </h3></div></div>';
	var panelScrollerHtml = '<div id="panelScroller2" class="forceScroller"><div id="contentSections" class="padGrid fontSizeSmall"><div class="detailsSection detailsSection0"></div><div class="detailsSection detailsSection0"><div class="detailsAccordionSection padGrid"><div id="activityDescription" class="alternate fontSizeSmall">DISPLAY_CONTENT_HERE</div></div></div></div></div>';
	//These wrap the header and content
	var detailViewWrapperHtml = '<div id="detailView" style="overflow-y: auto;><div id="detailViewContent" style="opacity: 1;">WRAPPED_ELEMENTS</div></div>';

	//Build template from its elements.
	var detailView = detailViewWrapperHtml.replace('WRAPPED_ELEMENTS', panelHeaderbarHtml + panelScrollerHtml);
	var detailViewComplete = detailView.replace('DISPLAY_CONTENT_HERE', htmlToShow);

	var htmlForPanel = detailViewComplete;
	//$('#panels').append(contentToShow);
	$('#panels').append(htmlForPanel);

	//$('#contentSections').hide().html(htmlForPanel).fadeIn();
	if (!$('#panelScroller2').hasClass('uiScroller')) {
		$Cloud.fixDetailsHeight();
	} else {
		$Cloud.refreshScrollers('panelScroller2');
	}

	//Post-render
	//$Cloud.handlePanelScroll();

}


window.showSessionCapacityList = function() {

	var sessionCapacityList = '';
	sessionCapacityList += '<h3>Most developer breakout session rooms have 250, I think. ';
	sessionCapacityList += 'If you know better, let me know.</h3>';
	sessionCapacityList += '<h3>Note: "Est Capacity" = 250 - Capacity</h3>';
	sessionCapacityList += '<style>';
	sessionCapacityList += '#openCapacityTable tr:nth-child(even) {background: whiteSmoke}';
	sessionCapacityList += '#openCapacityTable tr:nth-child(odd) {background: #FFF}';
	sessionCapacityList += '#openCapacityTable thead th {vertical-align: bottom;}';
	sessionCapacityList += '#openCapacityTable th, td { padding: 2px; text-align: left; vertical-align: top; border-top: 1px solid lightgray;}';
	sessionCapacityList += '</style>';
	sessionCapacityList += '<table id="openCapacityTable" rules="horizontal">';
	sessionCapacityList += '<tr><th>Session Name</th><th>Open Capacity</th><th><div style="width:50px;"></div></th><th>Est Attendees</th></tr>\r\n';

	$Cloud.getData({
		type: 'get',
		method: 'getAllEnrollmentsForAllDays',
		viewHandler: function(response, opts) {
			var agendaDayArray = response;
			var sessionVeventArray = [];
			//response should be an array, like this:
			//[Object { dateOfDay="09/18/2012", timeslots=[24]}, Object { dateOfDay="09/19/2012", timeslots=[24]}...]
			for (var i = 0; i < agendaDayArray.length; i++) {
				var agendaDay = agendaDayArray[i];
				var timeSlotArray = agendaDay.timeslots;
				//timeSlotArray looks like this:
				//[Object { items=[0], timeOfDay="0:00"}, Object { items=[0], timeOfDay="1:00"}...]
				for (var j = 0; j < timeSlotArray.length; j++) {
					var timeSlot = timeSlotArray[j]
					var hasSessionInTimeSlot = (timeSlot.items.length > 0);
					if (hasSessionInTimeSlot == true) {
						var sessionDetailObj = timeSlot.items[0];
						//console.log('sessionDetailObj: ', sessionDetailObj);
						console.log(sessionDetailObj.name, ':', sessionDetailObj.openCapacity);
						var estCapacity = (250 - parseInt(sessionDetailObj.openCapacity));
						if (estCapacity < 0)
							estCapacity = '';
						sessionCapacityList += '<tr><td>' + sessionDetailObj.name + '</td><td> ' + sessionDetailObj.openCapacity + '</td><td></td><td>' + estCapacity + '</td></tr>';
					}
				}
			}
			
			sessionCapacityList += '</table>';
			
			window.showTextInCloudPanel(sessionCapacityList);

		}
	});

}

window.showSessionCapacityList();