/**
 * Enrollment widget for rendering the number of openings for a class and an enrollment button. 
 * @extends HD.Widget
 * 
 * @param {Object} config configuration object containing configurable properties 
 * @param {HD.REO.Model} model the model object, signals model events
 * @param {HD.REO.View} view the view object, facilitates the communication of events between widgets 
 */
HD.REO.View.Enroll = function(config, model, view) {
	this.observers = [];
	this.config = config || {};
    
	if(model != null) {
		this.model = model;
		this.model.addObserver(this);
	}
	
	if(view != null) {
		this.view = view; 
	    this.view.addObserver(this);
	}
};

/**
 * Template object containing overrideable methods and properties.
 * @static
 */
HD.REO.View.Enroll.template = {
	openStatus : 	'<span><em>_SEATS</em> of <em>_TOTAL_SEATS</em> seats are open for this class.</span>',
	waitlistStatus : '<span><em>_SEATS</em> of <em>_TOTAL_SEATS</em> seats are open on the waitlist.</span>',
	fullStatus : 	'<em>This class is completely full.</em>',
	openFee : 		'<span>The class fee is <em>$_FEE</em></span>',
	waitlistFee : 	'<span>The class fee is <em>$_FEE</em></span>',
	disclaimer : 	'<dis class="hdDisclaimer">'+
						'<h2>PLEASE NOTE</h2>'+
						'<div class="hdDisclaimerText">_DISCLAIMER</div>'+
						'<div class="hdDisclaimerControl">'+
							'<div class="btnOrange hdButtonYes">Yes</div><div class="btnDarkGrey hdButtonNo">No</div>'+ 
						'</div>'+
					'</div>',
	
	getOpenStatus : function(seats, totalSeats) {
		var string = HD.REO.View.Enroll.template.openStatus;
		string = string.replace(/_SEATS/, seats);
		string = string.replace(/_TOTAL_SEATS/, totalSeats);
		return string;
	},
	
	getWaitlistStatus : function(seats, totalSeats) {
		var string = HD.REO.View.Enroll.template.waitlistStatus;
		string = string.replace(/_SEATS/, seats);
		string = string.replace(/_TOTAL_SEATS/, totalSeats);
		return string;
	},
	
	getFullStatus : function() {
		return HD.REO.View.Enroll.template.fullStatus;
	},
	
	getOpenFee : function(fee) {
		return HD.REO.View.Enroll.template.openFee.replace(/_FEE/, fee);
	},
	
	getWaitlistFee : function(fee) {
		return HD.REO.View.Enroll.template.waitlistFee.replace(/_FEE/, fee);
	},
	
	getDisclaimerText : function(disclaimer) {
		return HD.REO.View.Enroll.template.disclaimer.replace(/_DISCLAIMER/, disclaimer);
	}
};

HD.REO.View.Enroll.prototype = {
	/**
	 * @see HD.Widget#update 
	 */
	update : function(eventName, eventData) {
	if(eventData != null && eventData.id == this.config.courseId 
			&& eventData.dealer != null && eventData.dealer.id == this.config.dealerId) {
			if(eventName == "model_GetCourseDetails_Start") {
				this.loading(true);
			} else if(eventName == "model_GetCourseDetails_Finish") {
				this.loading(false);
				this.render(eventData);
			}
		}
	},
	
	/**
	 * @see HD.Widget#setListeners 
	 */
	setListeners : function(data) {
		var reoClasses = HD.REO.View.CSS_CLASSES;
		var parentEl = this.getParent();
		var dom = HD.util.Dom;
		var enrollButtonEl = dom.getByClass("hdButton", "div", parentEl)[0];
		
		var modelCb = this.model;
		var cb = this;
		enrollButtonEl.onclick = function() {			
			if(cb.openingType == reoClasses.FULL) {
				return false;
			} else if(cb.openingType == reoClasses.OPEN || cb.openingType == reoClasses.WAITLIST) {
				var common = HD.util.Common;
				if(common.hasValue(data.disclaimer) && data.type == 1) {
					var disclaimer = data.disclaimer.replace(/&apos;/g, "'");
					HD.util.Analytics.track(HD.REO.analytics.getStandardProgramNotice(HD.REO.experienceLevel));
					common.showOverlay(HD.REO.View.Enroll.template.getDisclaimerText(disclaimer), null, "500px", "300px");
					var buttonYesEl = HD.util.Dom.getByClass("hdButtonYes", "div")[0];
					var buttonNoEl = HD.util.Dom.getByClass("hdButtonNo", "div")[0];
					buttonYesEl.onclick = function() {
						HD.util.Analytics.track(HD.REO.analytics.getStandardProgramNoticeContinueAction(HD.REO.experienceLevel, "Yes"));
						modelCb.setSelectedCourse.call(modelCb, data);
					};
					buttonNoEl.onclick = function() {
						HD.util.Analytics.track(HD.REO.analytics.getStandardProgramNoticeContinueAction(HD.REO.experienceLevel, "No"));
						common.hideOverlay();
					};
					return false;
				}
				modelCb.setSelectedCourse.call(modelCb, data);
			}
		};
	},
	
	/**
	 * @see HD.Widget#getHtml 
	 */
	getHtml : function(data) {
    	var classes = HD.CSS_CLASSES;
    	var reoClasses = HD.REO.View.CSS_CLASSES;
    	var template = HD.REO.View.Enroll.template;
    	
    	if(data == null || data.length < 1) {
    		alert ("ERROR: no course detail data returned");
    		return "";
    	}
    	
		var openingClass = reoClasses.FULL;
		var openingsContent = template.getFullStatus();
		var feeContent = '';
		if(data.openSeats > 0) {
			openingClass = reoClasses.OPEN;
			openingsContent = template.getOpenStatus(data.openSeats, data.totalSeats);
			feeContent = template.getOpenFee(data.fee);
		} else if(data.waitlistSeats > 0) {
			openingClass = reoClasses.WAITLIST;
			openingsContent = template.getWaitlistStatus(data.waitlistSeats, data.totalWaitlistSeats);
			feeContent = template.getWaitlistFee(data.fee);
		}
		
		this.openingType = openingClass;
    	
		var html = ['<div class="', classes.WIDGET, ' ', reoClasses.ENROLL , ' ', openingClass, '">',
		            	'<div class="seatsAvail">', openingsContent ,'</div>',
		            	'<div class="fees">', feeContent ,'</div>',
		            	'<div class="hdButton">&nbsp;</div>',
		            '</div>'];
		
		return html.join('');
	}
};

HD.util.Common.extend(HD.REO.View.Enroll, [HD.Widget]);
