// Wrap code with module pattern.
(function() {
  var global = this;

  // widget constructor function
  global.HFE_TravelFinds_300_250_2 = function(dealData) {
	
	var widget_style = '300_250_2';
	var widget_id=Math.floor(Math.random()*10000);
	
	var styleHTML = '<style> \
	#hfe-widget {width:296px; height:245px; overflow:hidden; padding:1px; background:#ededed; border:1px solid #000; font:12px/21px Helvetica,Arial,sans-serif; color:#333; text-align: left;} \
	#hfe-widget td, #hfe-widget p {font:12px Helvetica,Arial,sans-serif; color:#333;} \
	#hfe-widget img{border:none} \
	#hfe-widget label{display:inline; margin-left: 3px; padding:0px;} \
	#hfe-widget .cities td { font-size: 13px; line-height: 13px; padding: 4px; } \
	#hfe-widget .greyed-out { color: #999; text-align: center; } \
	#hfe-widget .header{width:100%; position:relative; overflow:hidden; background:#36c} \
	#hfe-widget .header div{float:left; left:50%; position:relative; text-align:center; padding:5px 0} \
	#hfe-widget .header a{float:left; left:-50%; position:relative; margin:0; font-size:18px; line-height:22px; text-decoration:none; color:#fff; } \
	#hfe-widget ul{list-style:none; margin:0 4px 9px; padding:0} \
	#hfe-widget ul a{font-weight:bold; color:#06c; text-decoration:underline} \
	#hfe-widget ul a.found {font-weight:normal; color:#333; text-decoration:none;} \
	#hfe-widget ul a:hover{text-decoration:none; color:#2b57ae} \
	#hfe-widget .cities {height:105px; overflow:hidden; background:#f1cb00; padding:4px 6px 6px 2px} \
	#hfe-widget .make{height:100px; overflow:hidden; background:#ededed; padding:7px 6px 6px 2px} \
	#hfe-widget .make .title{margin:2px 0 2px; font-size:14px; line-height:18px; text-align:center} \
	#hfe-widget form{margin:0; padding:0; border-style:none} \
	#hfe-widget input.date{font:12px/14px Helvetica,Arial,sans-serif; margin:0; padding:2px} \
	#hfe-widget .cities input{padding: 0px; margin:0px;} \
	#hfe-widget input#hfe-widget-city-text { width:270px; margin: 0 auto; padding:2px;} \
	#hfe-widget input.date{width:92px; } \
	#hfe-widget .submit {width:100px; height:22px; color: white; float:right; font:12px Helvetica,Arial,sans-serif; border:none; background: url(http://'+dealData.img_domain+'/design-images/green-button-wide.png); padding:0; margin:0; } \
	#hfe-widget .calendar{margin:0px; padding-left:2px} \
	#hfe-widget .f-phone{color:#F03300; font-size:16px; line-height:18px; padding-top:10px; padding-left:6px} \
	#hfe-widget .date_picker td { font-size: 8pt;}';

	// Partner-specific styling
	if (dealData.partner_id == "515") { // Fodor's
		styleHTML += '#hfe-widget .header a{padding:0 0 0 23px; background:url(http://'+dealData.img_domain+'/widgets/images/ico-fodors-300-250.gif) no-repeat 0 2px}';
	}
	else if (dealData.partner_id == "501") { // Go Visit Hawaii
		styleHTML += '#hfe-widget .header {background: #FF7800; } #hfe-widget .header a{padding:0px; } #hfe-widget .make .title{font-size:13px;}';
	}
	else {
		styleHTML += '#hfe-widget .header a{padding:0px; } #hfe-widget .make .title{font-size:13px;}';
	}
	
	// If we have longer city names, decrease the city td font size
	var tmpCities = dealData.destination.split("//");
	var cities = new Array();
	
	var maxCityNameLength = 0;
	var showFreeForm = false;
	
	for(var i=0; i < tmpCities.length; i++) {
		if (tmpCities[i].length > maxCityNameLength) {
			maxCityNameLength = tmpCities[i].length;
		}
	
		if (tmpCities[i] == "free-form") {
			showFreeForm = true;
		}
		else {
			cities.push(tmpCities[i]);
		}		
	}
	
	if (showFreeForm) {
		styleHTML += '#hfe-widget .cities td { padding: 2px 4px; }';
	}
	
	if (maxCityNameLength > 22) {
	 styleHTML += '#hfe-widget .cities td { font-size: 11px; line-height: 11px}';
	}
	
	styleHTML += '</style>';
		
	// Drop in the widget's id
	styleHTML = styleHTML.replace(/#hfe-widget/g,"#hfe-widget-"+widget_id);

	document.write(styleHTML);
	document.write('<div id="hfe-widget-'+widget_id+'"></div>');

	
	// Create header widget DOM fragment
	var header = document.createElement('div');
	var content = document.createElement('div'); 
	var widget = document.getElementById('hfe-widget-'+widget_id);

	header.className = "header";
	header.innerHTML = '<div><a '+dealData.click_tracking_code+' href="'+dealData.default_url+'" target="_blank">'+dealData.tagline_1+' Hotel Deals</a></div>';
	
	content.className = "content";

	var contentHTML = '<form action="http://'+dealData.domain+'/destination/search" method="GET" target="_blank"> \
		<div class="cities"> \
			<table border="0"> \
';

			if (showFreeForm) {
				contentHTML += '<tr><td colspan="2"><input type="text" id="hfe-widget-'+widget_id+'-city-text" name="cityText" class="greyed-out" value="Enter a city to start" onfocus="FreeFormCityHelper.prepareForEntry(this, \'widget-free-form\');" onkeydown="FreeFormCityHelper.handleFreeFormTextEntry()"></td></tr>';
			}
				
			var colCount=0;
			var k=0;
			var maxColCount = 2;
			var widgetDestArray = new Array();
			
			for(var i=0; i < cities.length; i++) {

				colCount++;
				
				if (!widgetDestArray[k]) {
					widgetDestArray[k] = new Array();
				}
				
				widgetDestArray[k][colCount -1] = cities[i];
				
				// Reached the bottom, reset the figures
				if (colCount == maxColCount) {
					k++;
					colCount = 0;
				}
				
			}

			// Build the City Table
			for(var i=0; i < widgetDestArray.length; i++) {
					
				contentHTML += '<tr>';
				for(var j=0; j < widgetDestArray[i].length; j++) {
						contentHTML += '<td valign="middle" width="50%" nowrap="nowrap">';
						var destParts = widgetDestArray[i][j].split(',');
						var cityId = (i+10)*(j+1);
						
						contentHTML += '<input id="city-'+cityId+'-'+widget_id+'" type="radio" name="cityRadio" value="'+widgetDestArray[i][j]+'" onclick="FreeFormCityHelper.parseCityStateCountry(this, \''+widget_id+'\');" /><label for="city-'+cityId+'-'+widget_id+'">'+destParts[0]+'</label><br/>';
						contentHTML += '</td>';
				}
				contentHTML += '</tr>';
	}

	contentHTML += '	 \
		</table> \
		</div> \
		<div class="make"> \
			<table width="290"> \
				</tr> \
				<tr> \
					<td width="50%"> \
					  <input name="s" value="9" type="hidden"/> \
						<input id="'+widget_id+'-checkIn" name="checkInOld" value="Check in Date" type="hidden"/> \
						<input value="Check in Date" class="date" name="checkIn" id="'+widget_id+'-checkInDateField" type="text" onfocus="DatePicker.toggleDatePicker(\''+widget_id+'-checkIn\', \'Check In\', \''+dealData.min_date+'\', \''+dealData.max_date+'\', \'eng\')" /> \
						<div id="_'+widget_id+'-checkIn_calendar" class="date_picker" style="display:none"></div> \
						<a class="calendar" href="javascript:void(0);" onclick="DatePicker.toggleDatePicker(\''+widget_id+'-checkIn\', \'Check In\', \''+dealData.min_date+'\', \''+dealData.max_date+'\', \'eng\')"><img src="http://'+dealData.img_domain+'/widgets/images/ico-calendar.gif" align="top"></a> \
					</td> \
					<td width="50%" align="right"> \
						<input id="'+widget_id+'-checkOut" name="checkOutOld" value="Check out Date" type="hidden"/> \
						<input value="Check out Date" class="date" name="checkOut" id="'+widget_id+'-checkOutDateField" type="text" onfocus="DatePicker.toggleDatePicker(\''+widget_id+'-checkOut\', \'Check Out\', \''+dealData.min_date+'\', \''+dealData.max_date+'\', \'eng\')" /> \
						<div id="_'+widget_id+'-checkOut_calendar" class="date_picker" style="display:none"></div> \
						<a class="calendar" href="javascript:void(0);" onclick="DatePicker.toggleDatePicker(\''+widget_id+'-checkOut\', \'Check Out\', \''+dealData.min_date+'\', \''+dealData.max_date+'\', \'eng\')"><img src="http://'+dealData.img_domain+'/widgets/images/ico-calendar.gif" align="top"></a> \
					</td> \
				</tr> \
				<tr> \
					<td class="f-phone" align="center"> \
							'+dealData.phone+'<br> \
							<a '+dealData.click_tracking_code+' href="http://'+dealData.domain+'" target="_blank"><img src="http://'+dealData.img_domain+'/widgets/images/f-hotels-gvh-logo-300-250.png" width="134" height="24"></a> \
					</td> \
					<td class="f-phone" valign="top"> \
						<input type="hidden" name="pid" value="'+dealData.partner_id+'" /> \
						<input class="submit" type="submit" value="Search Now!" /> \
					</td> \
					</tr> \
				</table> \
		</form> \
	</div>';

	// Analytics call
	contentHTML += '<iframe src="http://'+dealData.widget_domain+'/widget-load/'+widget_style+'/'+dealData.type+'/'+dealData.name_slug+'.html" style="display: none;" border="0" scrolling="no"></iframe>';

	content.innerHTML = contentHTML;
	
	widget.appendChild(header);
	widget.appendChild(content);

	document.write('<script type="text/javascript" src="http://'+dealData.domain+'/js/date-picker-widget.js"></script>')
	document.write('<link rel="stylesheet" type="text/css" href="http://'+dealData.domain+'/css/date-picker-widget.css" />')
	

  };
})();

var dealData = {"default_url" : "http://govisithawaii.hotels-for-everyone.com/", "tagline_1" : "Go Visit Hawaii Finds", "tagline_2" : "Go Visit Hawaii Find", "title_1" : "", "title_2" : "", "title_3" : "", "title_4" : "", "title_5" : "", "domain" : "govisithawaii.hotels-for-everyone.com", "widget_domain" : "govisithawaii.hotels-for-everyone.com", "type" : "booking", "img_domain" : "img1.hotels-for-everyone.com", "phone" : "800-570-7461", "partner_id" : "501", "destination" : "free-form//Waikiki/Honolulu (Oahu),HI,US//Kaanapali (Maui),HI,US//Wailea (Maui),HI,US//Kona (Big Island),HI,US//Kohala Coast (Big Is.),HI,US//Poipu (Kauai),HI,US", "name_slug" : "go-visit-hawaii---general", "city_state_country" : "free-form//Waikiki/Honolulu (Oahu),HI,US//Kaanapali (Maui),HI,US//Wailea (Maui),HI,US//Kona (Big Island),HI,US//Kohala Coast (Big Is.),HI,US//Poipu (Kauai),HI,US, Hawaii, USA", "min_date" : "01/27/2012", "max_date" : "12/22/2012", "click_tracking_code" : "", "category" : "", "hotel_id" : "", "hotel_name" : "", "deals" : [ ]};
HFE_TravelFinds_300_250_2(dealData);