/*
 * ASC.Chrysler.VSMC.CompareGrid
 * */
ASC.namespace('ASC.Chrysler.VSMC.CompareGrid');
ASC.Chrysler.VSMC.CompareGrid= ASC.extend(Ext.util.Observable,{
	renderTo:'',
	compareData:null,
	store:null,
	filterSection:'',
	window: null,
	
	constructor: function (compareData,cfg)
	{
		ASC.Chrysler.VSMC.CompareGrid.superclass.constructor.apply(this);
		Ext.apply(this, cfg);
		
		/*//var recordMeta = Ext.data.Record.create();
	    var reader = new Ext.data.JsonReader({
	    	root: 'compareGroups'
	    }, recordMeta);
		store = new Ext.data.Store({
	        reader: reader,	
	        data: compareData
	    });
		var me = this;
		store.on('datachanged', function (){
			me.render(); 
		});	*/
		this.compareData = compareData;
		this.addEvents({"render":true});
		this.initTemplates();
		
		this.loadData(compareData);
	},
	loadData:function(compareData)
	{
		this.compareData = compareData;
		//this.compareData = Page.restructureData();
		this.render();
	},
	render:function()
	{
		this.compareGridTemplate.overwrite(this.renderTo,{model:this.compareData,toggleSection:this.toggleSection});
		ASC.getEl('compareDataTable').select('span[clickTip]').on('click',function(evt,t,options){
			if(!t.clickTipLayer){
				t.clickTipLayer = new Ext.ToolTip({
					 target: t,
			         html: t.getAttribute("clickTip"),
					 autoHide :false,
				     closable :true,
				     draggable:true
				});
			
				t.clickTipLayer.target.un('mouseover', t.clickTipLayer.onTargetOver, t.clickTipLayer);
				t.clickTipLayer.target.un('mouseout', t.clickTipLayer.onTargetOut, t.clickTipLayer);
			}
			t.clickTipLayer.onTargetOver(evt);
			if(Page.showedToolTipTarget)
			{
				Page.showedToolTipTarget.clickTipLayer.hide();
			}
			Page.showedToolTipTarget = t;
			Page.selGroupXindex = t.getAttribute("selGroupXindex");
		});
		this.fireEvent("render");
		//tooltip in interior section
		/*var imgCollection = ASC.getEl('compareDataTable').dom.getElementsByTagName('img');
		for(var i = 0;i<imgCollection.length ; i++)
		{
			if(imgCollection[i].getAttribute('needToolTip_S'))
			{
				var tt1 = new Ext.ToolTip({
				    target: imgCollection[i],
				    title: 'Standard<div>'+ imgCollection[i].getAttribute('description') + '</div>',
				    dismissDelay : 0,
				    autoHeight: true,
				    floating: true
				});
			}
			if(imgCollection[i].getAttribute('needToolTip_A'))
			{
				var tt1 = new Ext.ToolTip({
				    target: imgCollection[i],
				    title: 'Available<div>'+ imgCollection[i].getAttribute('description') + '</div>',
				    dismissDelay : 0,
				    //autoHeight: true,
				    floating: true
				});
			}
		}*/
	},
	initTemplates: function ()
	{
			Ext.QuickTips.init();
			Ext.apply(Ext.QuickTips.getQuickTip(), {
				floating: true,
				width: 200,
				dismissDelay : 0
			});
			this.compareGridTemplate = new Ext.XTemplate('<table cellpadding="0" cellspacing="0" class="content_body_ram_table" id="compareDataTable">', 
			  '<tpl for="model"><tpl for="compareGroups"><tpl if="this.shouldDisplayGrid(values.pageId)"><tpl for="groups">',
			  '<thead>',
				  '<tpl "{[if="xindex==1"]}"><tr>{[this.generateNetPriceHtml()]}</tr></tpl>',
				  '<tpl "{[if="xindex==1"]}">{[this.generateEpaHtml(parent.groups)]}</tpl>',
				  '<tpl if="values.sectionId!=\'22\'">',
					  '<tr class="open" onclick="Page.toggleSection(null, this, \'{name}_body\', {[xindex]});"> ',
					      '<td class="content_body_ram_td_border_r content_body_ram_td_splittd content_body_ram_td_width_1" fontflag="no"><div style="float:left;">{name}&nbsp;</div><div id={["imgDiv"+xindex]} class="imgOpen">&nbsp;</div></td>', 
					      '<td id="td_groups_{[xindex]}_1" onmouseover="javascript:Page.onMouseOver(1);" onmouseout="javascript:Page.onMouseOut(1);" class="content_body_ram_td_border_r content_body_ram_td_splittd content_body_ram_td_width_2">&nbsp;</td>',
					      '<td id="td_groups_{[xindex]}_2" onmouseover="javascript:Page.onMouseOver(2);" onmouseout="javascript:Page.onMouseOut(2);" class="content_body_ram_td_border_r content_body_ram_td_splittd content_body_ram_td_width_2">&nbsp;</td>',
					      '<td id="td_groups_{[xindex]}_3" onmouseover="javascript:Page.onMouseOver(3);" onmouseout="javascript:Page.onMouseOut(3);" class="content_body_ram_td_border_r content_body_ram_td_splittd content_body_ram_td_width_2">&nbsp;</td>',
					      '<td id="td_groups_{[xindex]}_4" onmouseover="javascript:Page.onMouseOver(4);" onmouseout="javascript:Page.onMouseOut(4);" class="content_body_ram_td_splittd content_body_ram_td_width_2">&nbsp;</td>',
					  '</tr>',
				  '</tpl>',
			  '</thead> ',
			  '<tpl if="values.sectionId!=\'22\'">',
			  '<tbody id="{name}_body">  ',
			  	  '<tpl if="parent.pageId==\'2\' || parent.pageId==\'3\' || parent.pageId==\'4\'"><tpl for="rows">',
			  	  '<tpl if="this.isDisplayItem(values.vehicleFeatures)">',
				  	  '<tr id="tr_{[parent.name]}_{[xindex]}">',
				      '<td class="content_body_ram_td_border_rb" id="td_{lineId}_0" fontflag="no">',
				      		'<span class="content_body_ram_lefttitle">{name}',
				      		'<tpl if="this.whetherShowIcon(values.vehicleFeatures)">',
				      		'<img src="{[this.getImgLocalePath()]}/vsmc/vsmc_icon_21.gif" id="img_{[this.escapeCharacters(parent.name)]}_{[xindex]}" onclick="ASC.Chrysler.trackLinkMetrics(\'content\',\'{[this.escapeCharacters(values.name)]}\');Page.showDimensionsInfo(\'{[this.escapeCharacters(parent.name)]}\', {[xindex]});"/><a id="a_{[parent.name]}_{[xindex]}" class="closeHidden" href="javascript:void(0)" onclick="Page.closeDimensionsInfo(\'{[this.escapeCharacters(parent.name)]}\', {[xindex]});">&nbsp;Close</a>',
				      		'</tpl>',
				      		'</span>',
				      '</td>', 
					  '<tpl for="vehicleFeatures"><tpl {[if="xindex<=4"]}>',
					      	'<td id="td_{[parent.lineId]}_{[xindex]}" onmouseover="javascript:Page.onMouseOver({[xindex]});" onmouseout="javascript:Page.onMouseOut({[xindex]});" class="content_body_ram_td_border_rb">',
					      		'<span class="content_body_ram_itemcommon_center">',
							      '<tpl for="features"><tpl if="availability==\'S\'"><img src="{[this.getImgLocalePath()]}/vsmc/vsmc_icon_31.gif" needTooltip_S="true" description=""         ext:qtip="<div>{[ASC.message(\"vsmc_vehicleSpecModels_features_tip_standard_title\") ]}<p>{[ASC.message(\"vsmc_vehicleSpecModels_features_tip_standard\")  ]}</p></div>"/></tpl></tpl>',
							      '<tpl for="features"><tpl if="availability==\'O\'"><span ><img src="{[this.getImgLocalePath()]}/vsmc/vsmc_icon_32.gif" needTooltip_A="true" description="" ext:qtip="<div>{[ASC.message(\"vsmc_vehicleSpecModels_features_tip_available_title\") ]}<p>{[ASC.message(\"vsmc_vehicleSpecModels_features_tip_available\") ]}</p></div>"/></span></tpl></tpl>',
					      		'</span>',
					      	'</td>',
					  '</tpl></tpl>',
				      '<tpl for="vehicleFeatures">',
					      '<tpl "{[if="xcount == 1 && xindex == 1"]}">',
						      '<td id="td_{[parent.lineId]}_2"></td> ',
						      '<td id="td_{[parent.lineId]}_3"></td> ',
						      '<td id="td_{[parent.lineId]}_4" class="content_body_ram_td_border_r"></td>',
					      '</tpl>',
					      '<tpl "{[if="xcount == 2 && xindex == 2"]}">',
						      '<td id="td_{[parent.lineId]}_3"></td> ',
						      '<td id="td_{[parent.lineId]}_4" class="content_body_ram_td_border_r"></td>',
					      '</tpl>',
					      '<tpl "{[if="xcount == 3 && xindex == 3"]}">',
						      '<td id="td_{[parent.lineId]}_4" class="content_body_ram_td_border_r"></td>',
					      '</tpl>',
				      '</tpl>',			  	
				  	  '</tr>',
				  	  '<tr><td colspan="5">',
					    '<div id="display_{[parent.name]}_{[xindex]}" style="display:none;">',
					    	'<div class="desc_car_body">',         
						    	'<div class="desc_car_body_left">',
						    	    '<div class="desc_car_body_name">{name}</div>',
									'<div class="desc_car_body_left_text">{this.longDescription}</div>',
								'</div>',
							'</div>',
						'</div>',
					'</td></tr>',
			  	'</tpl>',
			  	'</tpl></tpl>', 
			    '<tpl if="parent.pageId==\'5\'"><tpl for="rows">',
			    '<tpl if="this.isDisplayItem(values.vehicleFeatures)">',
				    '<tr id="tr_{[parent.name]}_{[xindex]}">',
					      '<td class="content_body_ram_td_border_rb" id="td_{lineId}_0" fontflag="no"><span class="content_body_ram_lefttitle">',
					      	'{name}',
					      	'<tpl if="this.hasExtDimImage(values)">',
					      		'<img src="{[this.getImgLocalePath()]}/vsmc/vsmc_icon_21.gif" id="img_{[parent.name]}_{[xindex]}" onclick="ASC.Chrysler.trackLinkMetrics(\'content\',\'{name}\');Page.showDimensionsInfo(\'{[parent.name]}\', {[xindex]});"/><a id="a_{[parent.name]}_{[xindex]}" class="closeHidden" href="javascript:void(0)" onclick="Page.closeDimensionsInfo(\'{[parent.name]}\', {[xindex]});">&nbsp;Close</a>',
					      	'</tpl>',
					      '</span></td>',
					      '<tpl for="vehicleFeatures"><tpl {[if="xindex<=4"]}>',
					      	'<td onmouseover="javascript:Page.onMouseOver({[xindex]});" onmouseout="javascript:Page.onMouseOut({[xindex]});" id="td_{[parent.lineId]}_{[xindex]}"  class="content_body_ram_td_border_rb" dispalyFlag="display">',
					      		'<span class="content_body_ram_itemcommon_center">',
					      			'<tpl for="features">{description}{[this.checkUnit(values.unit, values.description)]}</tpl>',
					      		'</span>',
					      	'</td>',
					      '</tpl></tpl>',
						  '<tpl for="vehicleFeatures">',
					        '<tpl "{[if="xcount == 1 && xindex == 1"]}">',
						        '<td id="td_{[parent.lineId]}_2"></td> ',
						        '<td id="td_{[parent.lineId]}_3"></td> ',
						        '<td id="td_{[parent.lineId]}_4" class="content_body_ram_td_border_r"></td>',
					        '</tpl>',
					        '<tpl "{[if="xcount == 2 && xindex == 2"]}">',
						        '<td id="td_{[parent.lineId]}_3"></td> ',
						        '<td id="td_{[parent.lineId]}_4" class="content_body_ram_td_border_r"></td>',
					        '</tpl>',
					        '<tpl "{[if="xcount == 3 && xindex == 3"]}">',
						        '<td id="td_{[parent.lineId]}_4" class="content_body_ram_td_border_r"></td>',
					        '</tpl>',
					      '</tpl>',
				    '</tr>',
				    '<tr><td colspan="5">',
					    '<div id="display_{[parent.name]}_{[xindex]}" style="display:none;">',
					    	'<div class="middle_car_body">',         
						    	'<div class="middle_car_body_left">',   	
									'<div class="middle_car_body_left_text">{[this.generateDimensionDescription(values.name,values.vehicleFeatures)]}</div>',
								'</div>',
								'<tpl if="this.hasExtDimImage(values)">',
									'<div class="middle_car_body_jeep"><img  src="{[this.getExtDimensionImage(values.extDimensionImage)]}"/></div>',
								'</tpl>',
							'</div>',
						'</div>',
					'</td></tr>',
			    '</tpl>',
			    '</tpl></tpl>', 		
			    '<tpl if="parent.pageId!=\'2\' && parent.pageId!=\'3\' && parent.pageId!=\'4\' && parent.pageId!=\'5\'">{[this.setGroupXindex(xindex)]}<tpl for="rows">',
			    '<tpl if="this.isDisplayItem(values.vehicleFeatures)">',
			    '<tr>',
				      '<td class="content_body_ram_td_border_rb" fontflag="no"><span class="content_body_ram_lefttitle">',
					      	'<tpl if="parent.sectionId!=\'22\' && parent.sectionId!=\'2\'">{name}</tpl>',
					      	'<tpl if="parent.sectionId==\'2\'">&nbsp;</tpl>',
				      '</span></td>',
				     '<tpl if="parent.sectionId!=\'22\'"><tpl for="vehicleFeatures"><tpl {[if="xindex<=4"]}>',
					      	'<td onmouseover="javascript:Page.onMouseOver({[xindex]});" onmouseout="javascript:Page.onMouseOut({[xindex]});" id="td_{[parent.lineId]}_{[xindex]}"  class="content_body_ram_td_border_rb">',
					      	'<tpl for="features">',
						      	'<tpl if="this.isExistsLongDescription(longDescription)"><span class="content_body_ram_itemred" style="height:30px;overflow-y:hidden;" selGroupXindex="{[this.groupXindex]}" clickTip="{[this.escapeCharacters(values.longDescription)]}" onclick="ASC.Chrysler.trackLinkMetrics(\'content\',\'{[this.cleanDescription(values.description)]}\');">{description}</span></tpl>',
						      	'<tpl if="! this.isExistsLongDescription(longDescription)"><tpl if="description != \'\'"><span class="content_body_ram_itemcommon"  style="height:30px;overflow-y:hidden;">{description}</span></tpl><tpl if="description == \'\'"><span class="content_body_ram_itemcommon_null" style="height:30px;overflow-y:hidden;">{description}</span></tpl></tpl>',
					      	'</tpl>',
					      	'</td>',
				      '</tpl></tpl></tpl>',
				      '<tpl for="vehicleFeatures">',
				      	'<tpl "{[if="xcount == 1 && xindex == 1"]}">',
					      	'<td id="td_{[parent.lineId]}_2" onmouseover="javascript:Page.onMouseOver(2);" onmouseout="javascript:Page.onMouseOut(2);"></td> ',
					        '<td id="td_{[parent.lineId]}_3" onmouseover="javascript:Page.onMouseOver(3);" onmouseout="javascript:Page.onMouseOut(3);"></td> ',
					        '<td id="td_{[parent.lineId]}_4" onmouseover="javascript:Page.onMouseOver(4);" onmouseout="javascript:Page.onMouseOut(4);" class="content_body_ram_td_border_r"></td>',
				        '</tpl>',
				        '<tpl "{[if="xcount == 2 && xindex == 2"]}">',
					        '<td onmouseover="javascript:Page.onMouseOver(3);" onmouseout="javascript:Page.onMouseOut(3);" id="td_{[parent.name]}_3"></td> ',
					        '<td onmouseover="javascript:Page.onMouseOver(4);" onmouseout="javascript:Page.onMouseOut(4);" id="td_{[parent.name]}_4" class="content_body_ram_td_border_r"></td>',
				        '</tpl>',
				        '<tpl "{[if="xcount == 3 && xindex == 3"]}">',
				        	'<td id="td_{[parent.lineId]}_4" onmouseover="javascript:Page.onMouseOver(4);" onmouseout="javascript:Page.onMouseOut(4);" class="content_body_ram_td_border_r"></td>',
				        '</tpl>',
				      '</tpl>',
			    '</tr>',
			    '</tpl>',
			    '</tpl></tpl>',	    
			 '</tbody>',
			 '</tpl>',
			 '</tpl></tpl></tpl></tpl>', 		 
			 '<tbody>',
			 	'<tr>',
			      '<td class="content_body_ram_td_width_1"></td>', 
			      '<td class="content_body_ram_td_width_2"></td>',
			      '<td class="content_body_ram_td_width_2"></td>',
			      '<td class="content_body_ram_td_width_2"></td>',
			      '<td class="content_body_ram_td_width_2"></td>',			 	
			 	'</tr>',
				'<tr>',
				'<td class="content_body_ram_td_border_r">&nbsp;</td>',
				'<tpl for="model"><tpl for="compareVehicles"><tpl {[if="xindex<=4"]}>',
						'<td id="td_vehicles_{[xindex]}" onmouseover="javascript:Page.onMouseOver({[xindex]});" onmouseout="javascript:Page.onMouseOut({[xindex]});" class="content_body_ram_td_border_r" fontflag="no">',
							'<tpl if="!this.isPopup()">',
							'<div class="content_body_ram_bottom_option_frame">',
								'<div class="content_body_ram_bottom_option_item"><a href="javascript:Page.redirectBuildMyOwn(\'{modelYearCode}\',\'{lowerLevelPackageCode}\',\'{ccode}\');" onclick="ASC.Chrysler.trackLinkMetrics(\'content\',\'{[this.cleanDescription(values.longDescription)]}_build_my_own\');">{[ASC.message("vsmc_vehicleSpecModels_buildMyOwn")]}</a></div>',
								'<div class="content_body_ram_bottom_option_item"><a href="javascript:Page.getAQuote(\'{ccode}\');" onclick="ASC.Chrysler.trackLinkMetrics(\'content\',\'{[this.cleanDescription(values.longDescription)]}_get_a_quote\');">{[ASC.message("vsmc_vehicleSpecModels_getAQuote")]}</a></div>',
								'<div class="content_body_ram_bottom_option_item"><a href="javascript:Page.compareToComp(\'{ccode}\');" onclick="ASC.Chrysler.trackLinkMetrics(\'content\',\'{[this.cleanDescription(values.longDescription)]}_compare_to_competition\');">{[ASC.message("vsmc_vehicleSpecModels_compareToCompetition")]}</a></div>',
								'<div class="content_body_ram_bottom_option_inven_frame" style="display:none;">',
									'<div class="content_body_ram_bottom_option_inven_toppic"><img src="{[this.getImgLocalePath()]}/vsmc/vsmc_icon_22.gif" /></div>',
									'<div class="content_body_ram_bottom_option_inven_leftpic"></div>',
									'<div class="content_body_ram_bottom_option_inven_body">',
										'<div class="content_body_ram_bottom_option_inven_buttonframe">',
											'<div class="content_body_ram_bottom_option_inven_font">{inventoryCount}</div>IN INVENTORY NOW',
										'</div>',
										'<div class="content_body_ram_bottom_option_inven_go"><a href="javascript:void(0);" name="&lpos=content&lid=300c_dealer_go">GO</a>&nbsp;<img src="{[this.getImgLocalePath()]}/vsmc/vsmc_icon_24.gif" /></div>',
										'<div class="content_body_ram_bottom_option_inven_bottomfont">Check out 2008 {description}.</div>',
									'</div>',
									'<div class="content_body_ram_bottom_option_inven_rightpic"></div>',
									'<div class="content_body_ram_bottom_option_inven_bottompic"><img src="{[this.getImgLocalePath()]}/vsmc/vsmc_icon_23.gif" /></div>',
								'</div>',
							'</div>',
							'</tpl>',
							'<tpl if="this.isPopup()">',
							'<div class="content_body_ram_bottom_option_frame">',
								'<div class="content_body_ram_bottom_option_item">',
								'<tpl if="!this.fromSNI()">',
							'<a href="javascript:Page.popupRedirectBuildMyOwn(\'{modelYearCode}\',\'{lowerLevelPackageCode}\',\'{ccode}\');" onclick="ASC.Chrysler.trackLinkMetrics(\'content\',\'{[this.cleanDescription(values.longDescription)]}_build_my_own\');">{[ASC.message("vsmc_vehicleSpecModels_buildThisModel")]}</a>',
								'</tpl>',
								'<tpl if="this.fromSNI()">',
								'<a href="javascript:Page.popupSelectThisModel(\'{modelYearCode}\',\'{lowerLevelPackageCode}\',\'{ccode}\',\'{description}\');" onclick="ASC.Chrysler.trackLinkMetrics(\'content\',\'{[this.cleanDescription(values.longDescription)]}_select_this_model\');">{[ASC.message("selectThisModel")]}</a>',
									'</tpl>',
								'</div>',
							'</div>',
							'</tpl>',													
						'</td>',
				'</tpl></tpl></tpl>',
				'</tr>',			 
			  '</tbody>',
			 ' </table>',
			 {
				groupXindex:0,
				shouldDisplayGrid:function(pageId){
					if(typeof pageId == 'undefined')
						return false;
					else{
					   if((Page.gMenuKey==null && pageId=='1') || (Page.gMenuKey!=null && pageId==Page.gMenuKey))
						  return true;
					   else
						  return false;
					}
				},
				setGroupXindex:function(xindex)
				{
				  this.groupXindex = xindex;
				  return "";
				},
			 	hasExtDimImage: function(values){
			 		if( typeof values.extDimensionImage == "undefined" || values.extDimensionImage == null || values.extDimensionImage.length == 0){
			 			return false;
			 		}
			 		return true;
			 	},
			 	fromSNI:function()
			 	{
			 		var b = Page.fromSNI == "true"?true:false;
			 		return b;
			 	},
			 	getExtDimensionImage: function( extDimensionImage ){
			 		var x = ASC.cfg.getIofUrl() + extDimensionImage + "&width=424&height=161&NOIMG=not_found_"+Page.brand+".gif";
					return ASC.cfg.getExtDimensionsIofUrl() + extDimensionImage + '&width=424&height=161&NOIMG=not_found_'+Page.brand+'.gif';
			 	},
			 	
			 	escapeCharacters: function(unEscChar)
			 	{
			 		return unEscChar.replace(/"/g,'&quot;').replace("'","\'");
			 	},
			 	longDescription:''
			 	,
			 	whetherShowIcon:function(vehicleFeatures)
			 	{
			 		this.longDescription = '';
			 		for(var i=0;i<vehicleFeatures.length;i++)
			 		{
			 			if(vehicleFeatures[i].features[0].availability == "S" && vehicleFeatures[i].features[0].longDescription != "")
			 			{
			 				this.longDescription = vehicleFeatures[i].features[0].longDescription;
			 				return true;
			 			}
			 		}
			 		return false;
			 	}
			 	,
			 	isPopup: function ()
			 	{
			 		return Page.isPopup;
			 	},
			 	
			 	cleanDescription: function(description)
			 	{
			 		return this.escapeCharacters(description.replace('\'','').replace('"',''));
			 	},
			 				 
				getImgLocalePath: function()
				{
					return ASC.cfg.getImgLocalePath();
				},
				generateNetPriceHtml: function()
				{
					var tmpCompareVehicles 
					if(Page.renewCompareData != null) {
						tmpCompareVehicles = Page.renewCompareData.compareVehicles;
					} else {
						//tmpCompareVehicles = Page.compareData.compareVehicles;
						tmpCompareVehicles = Page.gFourVehicles;
					}
					
					var tmp = '<td class="content_body_ram_td_border_rb" fontflag="no"><span class="content_body_ram_lefttitle">'+ASC.message("vsmc_vehicleSpecModels_msrp")+'</span></td>';
					var tmpValue;
					for(var i=0; i< tmpCompareVehicles.length; i++)
					{
						if(i < 4)
						{
							tmpValue = tmpCompareVehicles[i].msrp + tmpCompareVehicles[i].destination;
							if(tmpValue == '') {
								tmp += String.format('<td class="content_body_ram_td_border_rb"  id="td_netPrice_{0}" onmouseover="javascript:Page.onMouseOver({0});" onmouseout="javascript:Page.onMouseOut({0});" ><span class="content_body_ram_itemcommon_center">{1}</span></td>',(i+1), "");
							} else {
								tmp += String.format('<td class="content_body_ram_td_border_rb"  id="td_netPrice_{0}" onmouseover="javascript:Page.onMouseOver({0});" onmouseout="javascript:Page.onMouseOut({0});" ><span class="content_body_ram_itemcommon_center">{1}</span></td>',(i+1), Ext.util.Format.usMoney(tmpValue).replace(/\.0{2}$/,""));
							}
						}
					}
					return tmp;
				},
				sortVehicleFeatures:function(a,b)
				{
					var ac = a.optionCode;
					var bc = b.optionCode;
					return ac >bc ? 1 : ac<bc ? -1 : 0;
				},
				generateEpaHtml: function(groups)
				{
					var tmpCompareVehicles 
					if(Page.renewCompareData != null) {
						tmpCompareVehicles = Page.renewCompareData.compareVehicles;
					} else {
						//tmpCompareVehicles = Page.compareData.compareVehicles;
						tmpCompareVehicles = Page.gFourVehicles;
					}
					var tmp='';
					var lineId;
					for(var i=0;i<groups.length;i++)
					{
						if(groups[i].sectionId == '2')
						{
							for(var j=0;j<groups[i].rows.length;j++)
							{
								name = groups[i].rows[j].name; 
								if (name = 'Additional Key Features') {
									for(var k=0;k<groups[i].rows[j].vehicleFeatures.length;k++)
									{
										groups[i].rows[j].vehicleFeatures[k].features.sort(this.sortVehicleFeatures);
									}
								}
							}	
						}
						if(groups[i].sectionId == '22')
						{
							for(var j=0;j<groups[i].rows.length;j++)
							{
								lineId = groups[i].rows[j].lineId; 
								tmp += '<tr><td class="content_body_ram_td_border_rb" fontflag="no"><span class="content_body_ram_lefttitle">' + groups[i].rows[j].name + '</span></td>';
								for(var k=0;k<groups[i].rows[j].vehicleFeatures.length;k++)
								{
									if(k < 4)
									{
										//tmp += '<td class="content_body_ram_td_border_rb"  id="td_'+lineId+'_'+(k+1)+'" onmouseover="javascript:Page.onMouseOver({0});" onmouseout="javascript:Page.onMouseOut({0});" ><span class="content_body_ram_topitem">'+ groups[i].rows[j].vehicleFeatures[k].features[0].description + '</span></td>';
										if(tmpCompareVehicles[k].ccode != '') {
											if(groups[i].rows[j].vehicleFeatures[k].features[0].description != 'null' 
												&& groups[i].rows[j].vehicleFeatures[k].features[0].description != '' 
												&& groups[i].rows[j].vehicleFeatures[k].features[0].description != 'Not Available city/Not Available hwy' 
												&& groups[i].rows[j].vehicleFeatures[k].features[0].description != 'Not Applicable city/Not Applicable hwy'
												&& groups[i].rows[j].vehicleFeatures[k].features[0].description != '0 city/0 hwy') {
												tmp += String.format('<td class="content_body_ram_td_border_rb"  id="td_'+lineId+'_{0}" onmouseover="javascript:Page.onMouseOver({0});" onmouseout="javascript:Page.onMouseOut({0});" ><span class="content_body_ram_itemcommon_center">{1}</span></td>',(k+1), groups[i].rows[j].vehicleFeatures[k].features[0].description);
											} else {
												tmp += String.format('<td class="content_body_ram_td_border_rb"  id="td_'+lineId+'_{0}" onmouseover="javascript:Page.onMouseOver({0});" onmouseout="javascript:Page.onMouseOut({0});" ><span class="content_body_ram_itemcommon_center">{1}</span></td>',(k+1), 'Not Available');
											}
										} else {
											tmp += String.format('<td class="content_body_ram_td_border_rb"  id="td_'+lineId+'_{0}" onmouseover="javascript:Page.onMouseOver({0});" onmouseout="javascript:Page.onMouseOut({0});" ><span class="content_body_ram_itemcommon_center">{1}</span></td>',(k+1), '');
										}
									} 
								}
							}
							tmp += '</tr>';
						}
					}
					return tmp;
				},
				generateSpecName: function(name)
				{
					return name.replace(/(\")/g,'');
				},
				isExistsLongDescription: function(str)
				{
					if(str == 'null' || str == '') {
						return false;
					}
					return true;
				},
				checkNumeral:function(arg){
					return  (typeof(arg) == "number") || (/^\d+(\.\d{1,2})?$/).test(arg);
				},
				checkUnit: function(unit, argValue) 
				{
					if(this.checkNumeral(argValue)) {
						var upperUnit = unit.toUpperCase();
						if(upperUnit == 'IN') { return '"'; }
						if(upperUnit == 'FT') { return '\'';}
						if(upperUnit == 'FT3') { return 'ft<sup>3</sup>';}
						if(upperUnit == 'LB') { return ' lbs.';}
						if(upperUnit == 'GAL') { return ' gal.';}
						if(upperUnit == 'DEG') {return ' deg.';}
						return unit;
					}
					return '';
				},
				isDisplayItem: function(vehicleFeatures)
				{
					for(var i=0;i<vehicleFeatures.length && i<4;i++)
					{
						for(var j=0;j<vehicleFeatures[i].features.length;j++)
						{
							if(vehicleFeatures[i].features[j].availability != '' && vehicleFeatures[i].features[j].availability != 'null') {
								return true;
							}
						}
					}
					return false;
				},
				generateDimensionDescription: function(name,vehicleFeatures)
				{
					if(!vehicleFeatures[0].features[0].longDescription)
					{
						var mname = name.replace(/ /g,"").replace(/-/,"");
						return ASC.message(mname);
					}
					return vehicleFeatures[0].features[0].longDescription;
				}
			 }
			);
			this.compareGridTemplate.compile();//alert(this.toggleSection);
			
	},
	update:function(compareData)
	{
		if(compareData)
		{
			this.loadData(compareData);
			this.render();
		}
	},
	filterSection:function(sectionId)
	{
		
	},
	getStore:function()
	{
		return this.store;
	}
});

/*
 * ASC.Chrysler.VSMC.CompareGridHeader
 * */
ASC.namespace('ASC.Chrysler.VSMC.CompareGridHeader');
ASC.Chrysler.VSMC.CompareGridHeader= ASC.extend(Ext.util.Observable,{
	renderTo:'',
	compareData:null,
	store:null,
	filterSection:'',

	constructor: function (compareData,cfg)
	{
		ASC.Chrysler.VSMC.CompareGridHeader.superclass.constructor.apply(this);
		Ext.apply(this, cfg);
		
		this.compareData = compareData;
		//this.compareData = Page.restructureData();
		this.addEvents({"render":true});
		this.initTemplates();
		this.loadData(this.compareData);			
	},
	loadData:function(compareData)
	{
		this.compareData = compareData;
		this.render();
	},
	render:function()
	{
		this.compareGridHeaderTemplate.overwrite(this.renderTo,{model:this.compareData});
		this.fireEvent("render");
	},
	initTemplates: function ()
	{
			this.compareGridHeaderTemplate = new Ext.XTemplate('<table width="708" border="0" cellspacing="0" cellpadding="0">',					
				  '<tr>',
		          '<tpl for="model"><tpl for="compareVehicles">',
		           		'<tpl {[if="xindex<=4"]}>',
		           			'<td onmouseover="javascript:Page.onMouseOver({[xindex]});" onmouseout="javascript:Page.onMouseOut({[xindex]});" id="td_img_{[xindex]}" >',
		           				'<div class="right_car_body_middle_item_remove">&nbsp;<!--Remove&nbsp;<a href="javascript:void(0);" name="&lpos=model_nav&lid=remove"><img src="{[this.getImgLocalePath()]}/vsmc/vsmc_icon_13.gif" /></a>--></div>',
		           				'<div class="right_car_body_middle_item_car"><tpl if="defaultExtImage != \'null\'"><a href="javascript:void(0);" ><img src="{[ASC.cfg.getIofUrl()]}{values.defaultExtImage}&width=150&height=93&NOIMG=not_found_{Page.brand}.gif" width="150" height="93" onerror="ASC.Chrysler.imageOnError(this)"; /></a></tpl></div>',
		           				'<div class="right_car_body_middle_item_addpic"><tpl if="defaultExtImage != \'null\'"><a href="javascript:Page.showEnlargeImage(\'{[ASC.cfg.getIofUrlEscaped()]}{[this.escapeSlashes(values.defaultExtImage)]}\',\'{[this.escapeQuotes(values.longDescription)]}\');" onclick="javascript:ASC.Chrysler.trackLinkMetrics(\'content\',\'magnify_{[this.metricsCleaner(values.description)]}\');"><img src="{[this.getImgLocalePath()]}/vsmc/vsmc_icon_15.gif" /></a></tpl></div>',
		           				'<!--<div class="right_car_body_middle_item_change">&nbsp;<a href="javascript:void(0);" name="&lpos=model_nav&lid=change_order"><img src="{[this.getImgLocalePath()]}/vsmc/vsmc_icon_17.gif" /></a>&nbsp;Change Order&nbsp;<a href="javascript:void(0);" name="&lpos=model_nav&lid=change_order"><img src="' + ASC.cfg.getImgLocalePath() + '/vsmc/vsmc_icon_16.gif" /></a></div>-->',
		           				'<div class="right_car_body_middle_item_cartext"><table cellspacing="0" cellpadding="0" style="width:100%;height:100%;"><tr><td style="vertical-align:bottom;"><span>{[this.getSpecDescription(values.longDescription)]}</span></td></tr></table></div>',
				            '</td>',
				        '</tpl>',	        
				  '</tpl></tpl>',
	              '</tr>',
	              '<tr>',
		              '<tpl for="model"><tpl for="compareVehicles"><tpl {[if="xindex<=4"]}>',
			              	'<td onmouseover="javascript:Page.onMouseOver({[xindex]});" onmouseout="javascript:Page.onMouseOut({[xindex]});" id="td_drop_{[xindex]}" class="ram_td content_body_ram_td_width_2"><div style="width:90% !important; margin-left:auto; margin-right:auto;text-align:left;" id="{["selectVehicle"+xindex]}" ></div></td>',                
		              '</tpl></tpl></tpl>',
		              '<tpl for="model"><tpl for="compareVehicles">',
			              '<tpl "{[if="xcount == 1 && xindex == 1"]}">',
				              '<td class="ram_td content_body_ram_td_width_2">&nbsp;</td>',
				              '<td class="ram_td content_body_ram_td_width_2">&nbsp;</td>',
				              '<td class="ram_td content_body_ram_td_width_2">&nbsp;</td>',
			              '</tpl>',
			              '<tpl "{[if="xcount == 2 && xindex == 2"]}">',
				              '<td class="ram_td content_body_ram_td_width_2">&nbsp;</td>',
				              '<td class="ram_td content_body_ram_td_width_2">&nbsp;</td>',
			              '</tpl>',
			              '<tpl "{[if="xcount == 3 && xindex == 3"]}">',
				              '<td class="ram_td content_body_ram_td_width_2">&nbsp;</td>',
			              '</tpl>',
		              '</tpl></tpl>',
	              '</tr>',
	            '</table>',
				 {
					getImgLocalePath: function()
					{
						return ASC.cfg.getImgLocalePath();
					},
					escapeQuotes: function (v) 
					{
						if( !v )
							return "&nbsp;";
						return v.replace("'","\\'").replace("\"","_");
					},
					escapeSlashes: function (v) 
					{
						if(!v)
						{
							return '';
						}
						return v.replace(/\\/g, '\\\\');
					},
					getSpecDescription: function(desc)
					{
						return desc.replace(' Package', '&nbsp;Package');
					},
					
					metricsCleaner: function(str)
					{
						if (typeof str !== 'string') { str = str.toString(); }
						return str.replace(/\//g,"_")
								  .replace(/[^a-zA-Z0-9,\s,+,-,_]/g,'')
								  .replace(/[\s+]/g,"_")
								  .toLowerCase();	
					}
				 }  
			);
			
			this.compareGridHeaderTemplate.compile();//alert(this.toggleSection);
			
	},
	update:function(compareData)
	{
		if(compareData)
		{
			this.loadData(compareData);
		}
	},
	filterSection:function()
	{
		
	},
	getStore:function()
	{
		return this.store;
	}
});

/*
 * ASC.Chrysler.VSMC.FilterSection
 * */
ASC.namespace('ASC.Chrysler.VSMC.FilterTable');
ASC.Chrysler.VSMC.FilterTable= ASC.extend(Ext.util.Observable,{
	renderTo:'',
	compareData:null,
	store:null,
	filterSection:'',

	constructor: function (compareData,cfg)
	{
		ASC.Chrysler.VSMC.FilterTable.superclass.constructor.apply(this);
		Ext.apply(this, cfg);
		
		this.compareData = compareData;
		this.addEvents({"render":true});
		this.initTemplates();
		this.loadData(compareData);			
	},
	loadData:function(compareData)
	{
		this.compareData = compareData;
		this.render();
	},
	render:function()
	{
		this.filterTableTemplate.overwrite(this.renderTo,{model:this.compareData.trimSelector});
		this.fireEvent("render");
	},
	initTemplates: function ()
	{
			this.filterTableTemplate = new Ext.XTemplate('',
                	'<dl class="left_drive_frame">',
                	'<tpl for="model"><tpl for="filterGroups">',
                	'<tpl if="( variationTypeID==-1) || (variationTypeID==1) || (variationTypeID==2) || (variationTypeID==-2) || (variationTypeID==11) || (variationTypeID==-3)">',
                	'<tpl for="filters"><tpl {[if="xcount &gt; 1"]}><tpl {[if="xcount == xindex"]}>',
                	'<dt class="left_drive_header_white" onclick="Page.changeFilterSection(\'{parent.id}\');">{parent.variationType}:</dt>',                	
                    '</tpl></tpl></tpl>',
                	'<dd class="left_drive_types">',
                        '<table cellpadding="0" cellspacing="0" class="left_drive_table" id={id}>',
                        	'<tpl if="variationTypeID==1">',
	                    	'<tr>',
	                    	'<tpl for="filters"><tpl {[if="xcount &gt; 1"]}>',                    	
	                        	'<td class="left_drive_table_radio"><input type="radio" name={parent.variationType} onclick="ASC.Chrysler.trackLinkMetrics(\'drive\',\'{description}\');Page.filterVehicles(\'{parent.id}\',\'{id}\',\'{[xcount+1]}\',\'{[xindex]}\');" id="rad_{[parent.id]}{[xindex]}"/></td>',
	                            '<td class="left_drive_table_text"><span id={parent.id}{[xindex]}><label for="rad_{[parent.id]}{[xindex]}">{description}</label></span></td>',
	                            '<tpl {[if="xindex == xcount"]}>',
	                            '<td class="left_drive_table_radio"><input type="radio"  name={parent.variationType} onclick="ASC.Chrysler.trackLinkMetrics(\'drive\',\'show_all_drives\');Page.filterVehicles(\'{parent.id}\',\'{[xcount+1]}\',\'{[xcount+1]}\',\'{[xindex+1]}\');" id="rad_{[parent.id]}{[xcount+1]}" checked /></td>',
	                            '<td><span id={parent.id}{[xcount+1]} class="left_drive_font_seleced"><label for="rad_{[parent.id]}{[xcount+1]}">[All]</label></span></td>',
	                            '</tpl>',
	                        '</tpl></tpl>', 
                            '</tr>',
                            '</tpl>',
                        	'<tpl if="variationTypeID==-1">',
	                    	'<tpl for="filters"><tpl {[if="xcount &gt; 1"]}>',  
	                    	'<tr>',
	                        	'<td class="left_drive_table_radio"><input type="radio" name={parent.variationType} onclick="ASC.Chrysler.trackLinkMetrics(\'cabBox\',\'{[this.escapeQuotes(values.description)]}\');Page.filterVehicles(\'{parent.id}\',\'{id}\',\'{[xcount+1]}\',\'{[xindex]}\');" id="rad_{[parent.id]}{[xindex]}"/></td>',
	                            '<td class="left_drive_table_text"><span id={parent.id}{[xindex]}><label for="rad_{[parent.id]}{[xindex]}">{description}</label></span></td>',
	                            '<tpl if="xcount%2 !=0 &amp;&amp; xindex == xcount"]}>',
	                            '<td class="left_drive_table_radio"><input type="radio"  name={parent.variationType} onclick="ASC.Chrysler.trackLinkMetrics(\'cabBox\',\'show_all_cabBox\');Page.filterVehicles(\'{parent.id}\',\'{[xcount+1]}\',\'{[xcount+1]}\',\'{[xindex+1]}\');" id="rad_{[parent.id]}{[xcount+1]}" checked /></td>',
	                            '<td><span id={parent.id}{[xcount+1]} class="left_drive_font_seleced"><label for="rad_{[parent.id]}{[xcount+1]}">[All]</label></span></td>',	                        
	                            '</tpl>',
							'</tr>',
                            '<tpl if="xcount%2 ==0 &amp;&amp; xindex == xcount"]}>',
	                        '<tr>',
                            '<td class="left_drive_table_radio"><input type="radio"  name={parent.variationType} onclick="ASC.Chrysler.trackLinkMetrics(\'cabBox\',\'show_all_cabBox\');Page.filterVehicles(\'{parent.id}\',\'{[xcount+1]}\',\'{[xcount+1]}\',\'{[xindex+1]}\');" id="rad_{[parent.id]}{[xcount+1]}" checked /></td>',
                            '<td><span id={parent.id}{[xcount+1]} class="left_drive_font_seleced"><label for="rad_{[parent.id]}{[xcount+1]}">[All]</label></span></td>',	                        
	                        '</tr>',
                            '</tpl>',
	                        '</tpl></tpl>',
                            '</tpl>',
                        	'<tpl if="variationTypeID==-2 || variationTypeID==-3">',
	                    	'<tpl for="filters"><tpl {[if="xcount &gt; 1"]}>',  
	                    	'<tr>',
	                        	'<td class="left_drive_table_radio"><input type="radio" name={parent.variationType} onclick="ASC.Chrysler.trackLinkMetrics(\'cab\',\'{description}\');Page.filterVehicles(\'{parent.id}\',\'{id}\',\'{[xcount+1]}\',\'{[xindex]}\');" id="rad_{[parent.id]}{[xindex]}"/></td>',
	                            '<td class="left_drive_table_text"><span id={parent.id}{[xindex]}><label for="rad_{[parent.id]}{[xindex]}">{description}</label></span></td>',
	                            '<tpl if="xcount%2 !=0 &amp;&amp; xindex == xcount"]}>',
	                            '<td class="left_drive_table_radio"><input type="radio"  name={parent.variationType} onclick="ASC.Chrysler.trackLinkMetrics(\'cab\',\'show_all_cab\');Page.filterVehicles(\'{parent.id}\',\'{[xcount+1]}\',\'{[xcount+1]}\',\'{[xindex+1]}\');" id="rad_{[parent.id]}{[xcount+1]}" checked /></td>',
	                            '<td><span id={parent.id}{[xcount+1]} class="left_drive_font_seleced"><label for="rad_{[parent.id]}{[xcount+1]}">[All]</label></span></td>',	                        
	                            '</tpl>',
							'</tr>',
                            '<tpl if="xcount%2 ==0 &amp;&amp; xindex == xcount"]}>',
	                        '<tr>',
                            '<td class="left_drive_table_radio"><input type="radio"  name={parent.variationType} onclick="ASC.Chrysler.trackLinkMetrics(\'cabBox\',\'show_all_cabBox\');Page.filterVehicles(\'{parent.id}\',\'{[xcount+1]}\',\'{[xcount+1]}\',\'{[xindex+1]}\');" id="rad_{[parent.id]}{[xcount+1]}" checked /></td>',
                            '<td><span id={parent.id}{[xcount+1]} class="left_drive_font_seleced"><label for="rad_{[parent.id]}{[xcount+1]}">[All]</label></span></td>',	                        
	                        '</tr>',
                            '</tpl>',
	                        '</tpl></tpl>',
                            '</tpl>',                                                                                                                                          
                        	'<tpl if="variationTypeID==2  || variationTypeID==11">',
	                    	'<tpl for="filters"><tpl {[if="xcount &gt; 1"]}>',  
	                    	'<tr>',
	                        	'<td class="left_drive_table_radio"><input type="radio" name={parent.variationType} onclick="Page.filterVehicles(\'{parent.id}\',\'{id}\',\'{[xcount+1]}\',\'{[xindex]}\');" id="rad_{[parent.id]}{[xindex]}"/></td>',
	                            '<td class="left_drive_table_text"><span id={parent.id}{[xindex]}><label for="rad_{[parent.id]}{[xindex]}">{description}</label></span></td>',
	                        '</tr>',
                            '<tpl {[if="xindex == xcount"]}>',
	                        '<tr>',
                            '<td class="left_drive_table_radio"><input type="radio"  name={parent.variationType} onclick="Page.filterVehicles(\'{parent.id}\',\'{[xcount+1]}\',\'{[xcount+1]}\',\'{[xindex+1]}\');" id="rad_{[parent.id]}{[xcount+1]}" checked /></td>',
                            '<td><span id={parent.id}{[xcount+1]} class="left_drive_font_seleced"><label for="rad_{[parent.id]}{[xcount+1]}">[All]</label></span></td>',	                        
	                        '</tr>',
                            '</tpl>',
	                        '</tpl></tpl>',
                            '</tpl>',
                    	'</table>',
                    '</dd>',
                    '</tpl></tpl>',
                    '</tpl>',  
                    '<dt class="left_drive_header_common"  ><a href="javascript:void(0);" onclick="ASC.Chrysler.trackLinkMetrics(\'model_nav\',\'model_highlights\');Page.setPageMetrics(\'model_highlights\');" id="hightlight"><img onmouseover="javascript:Page.onMouseOverForMenu(1);" onmouseout="javascript:Page.onMouseOutForMenu(1);" id="leftmenu_1" src="{[this.getImgLocalePath()]}/vsmc/Highlights_Active.gif"/></a></dt>',
                    '<tpl if="! Page.hideTabs">',
						'<dt class="left_drive_header_common"  ><a href="javascript:void(0);" onclick="ASC.Chrysler.trackLinkMetrics(\'model_nav\',\'interior_and_exterior\');Page.setPageMetrics(\'interior_and_exterior\');" id="interior"><img  onmouseover="javascript:Page.onMouseOverForMenu(2);" onmouseout="javascript:Page.onMouseOutForMenu(2);" id="leftmenu_2" src="{[this.getImgLocalePath()]}/vsmc/InteriorExterior_dft.gif"/></a></dt>',
						'<dt class="left_drive_header_common"  ><a href="javascript:void(0);" onclick="ASC.Chrysler.trackLinkMetrics(\'model_nav\',\'performance\');Page.setPageMetrics(\'performance\');" id="performance"><img onmouseover="javascript:Page.onMouseOverForMenu(3);" onmouseout="javascript:Page.onMouseOutForMenu(3);" id="leftmenu_3" src="{[this.getImgLocalePath()]}/vsmc/Performance_dft.gif"/></a></dt>',
						'<dt class="left_drive_header_common"  ><a href="javascript:void(0);" onclick="ASC.Chrysler.trackLinkMetrics(\'model_nav\',\'safety_and_security\');Page.setPageMetrics(\'safety_and_security\');" id="safety"><img onmouseover="javascript:Page.onMouseOverForMenu(4);" onmouseout="javascript:Page.onMouseOutForMenu(4);" id="leftmenu_4" src="{[this.getImgLocalePath()]}/vsmc/SafetySecurity_dft.gif"/></a></dt>',
                     '</tpl>',
					'<dt class="left_drive_header_common"  ><a href="javascript:void(0);" onclick="ASC.Chrysler.trackLinkMetrics(\'model_nav\',\'dimensions_and_capacities\');Page.setPageMetrics(\'dimensions_and_capacities\');" id="dimensions"><img onmouseover="javascript:Page.onMouseOverForMenu(5);" onmouseout="javascript:Page.onMouseOutForMenu(5);" id="leftmenu_5" src="{[this.getImgLocalePath()]}/vsmc/DimensionsCapacities_dft.gif"/></a></dt>',
                    '<dt class="left_drive_header_common"  ><a href="javascript:void(0);" onclick="ASC.Chrysler.trackLinkMetrics(\'model_nav\',\'warranty\');Page.setPageMetrics(\'warranty\');" id="warranty"><img onmouseover="javascript:Page.onMouseOverForMenu(6);" onmouseout="javascript:Page.onMouseOutForMenu(6);" id="leftmenu_6" src="{[this.getImgLocalePath()]}/vsmc/Warranty_dft.gif"/></a></dt>',
                    '<dt class="left_drive_aaa"><span class="left_drive_font_small"><a href="javascript:void(0);" onclick="ASC.Chrysler.trackLinkMetrics(\'content\',\'text_small\');" id="smallFont">A</a></span> <span class="left_drive_font_middle"><a href="javascript:void(0);" onclick="ASC.Chrysler.trackLinkMetrics(\'content\',\'text_medium\');" id="middleFont">A</a></span> <span class="left_drive_font_big"><a href="javascript:void(0);" onclick="ASC.Chrysler.trackLinkMetrics(\'content\',\'text_large\');" id="largeFont">A</a></span></dt>',
                '</dl>',
				 {
				 
				 	escapeQuotes:function(nonEscaped)
				 	{
				 		return nonEscaped.replace('\'','\\\'').replace('"','');
				 	},
				 	
					getImgLocalePath: function()
					{
						return ASC.cfg.getImgLocalePath();
					},
					filterBoxStyle: function(groups){
						for(var i=0;i<groups.length;i++) {
							if(groups[i].variationTypeID==4) {
								return true;
							}
						}
						/*for(var i =0;i<groups.length;i++){
							if(groups[i].variationTypeID==10){
								for( var j = 1;j<groups[i].filters.length;j++){
									if(groups[i].filters[j].description == "No Box" && groups[i].filters[j].id == 1){
										return false;
									}
								}
							}
						}*/
						return false;
					}
				 }
			);
			
			this.filterTableTemplate.compile();//alert(this.toggleSection);
			
	},
	update:function(compareData)
	{
		if(compareData)
		{
			this.loadData(compareData);
			this.render();
		}
	},
	filterSection:function()
	{
		
	},
	getStore:function()
	{
		return this.store;
	}
});

ASC.namespace('ASC.Chrysler.VSMC.VehicleTable');
ASC.Chrysler.VSMC.VehicleTable= ASC.extend(Ext.util.Observable,{
	
	vehicleList:null,
	selectedModelYear:null,

	constructor: function (vehicleList, selectedModelYear,cfg)
	{
		ASC.Chrysler.VSMC.VehicleTable.superclass.constructor.apply(this);
		Ext.apply(this, cfg);
		
		this.addEvents({"render":true});
		this.initTemplates();
		this.loadData(vehicleList, selectedModelYear);			
	},
	loadData:function(vehicleList, selectedModelYear)
	{
		this.vehicleList = vehicleList;
		this.selectedModelYear = selectedModelYear;
		this.render();
	},
	render:function()
	{
		this.vehiclesTtpl.overwrite(this.renderTo,{vehicles:this.vehicleList, selModelYear:this.selectedModelYear});
		this.fireEvent("render");
	},
	initTemplates: function ()
	{
			this.vehiclesTtpl = new Ext.XTemplate('',
                '<table class="vehicles_table" border="0" cellpadding="0" cellspacing="0">',
					'<tr>',
						'<tpl for="vehicles">',
							'<td class="radio_filters">',
								'<input type="radio" name="radioGroupVehicles" {[values.modelYear === parent.selModelYear ? "checked":""]} id="{modelYear}" onClick="javascript:Page.setSelectedVehicle(\'{modelYear}\');"/>',
							'</td>',
							'<td>',
								'{values.description}',
							'</td>',
							'<td style="width:10px;"></td>',										
						'</tpl>',
					'</tr>',		
				'</table>'	
			);
			
			this.vehiclesTtpl.compile();
			
	}
});

ASC.apply(Page, { 
    compareCache: new Ext.util.MixedCollection(false, function (field) { 
    	return field.ccode1 + '_' + field.ccode2 + '_' + field.ccode3 + '_'  + field.ccode4;   
    }), 
    compareData:null,
    rcompareData:null,
    renewCompareData:null,
    compareGrid: null,
    compareGridHeader:null,
    //compareGridFooter:null,
    filterTable:null,

    printWindow : null,
    printForm : null,

    filterGroups:null,
    combinations:null,
    
    gFilterGroupsID:null,
    gFiltersID:null,
    gFiltersCount:null,
    //gMenuKey:null,
    gCombinations:null,
    gCompareVehicles:null,
    gFourVehicles:null,
    gCompareGroups:null,
    gArrayFilters:null,
    
    gCode1:null,
    gCode2:null,
    gCode3:null,
    gCode4:null,
    theme:null,
    
    gHighlightsKey:'1',
    gInteriorKey:'2',
    gPerformanceKey:'3',
    gSafetyKey:'4',
    gDimensionsKey:'5',
    gWarrantyKey:'6',
    gRestructFlag:false,
    gClearCcodeFlag:false,
    integrationVehMap:null,
    selectedIndex: -1,
    
    init: function () 
    {
	    this.initWidgets();
	    
		var aj = this.ajax;
		aj.registerRequest("COMPAREDATA", ASC.cfg.getContextPath() + '/vsmc/compareModels.ajax');
	    aj.registerAjaxObject('compareGroups', new ASC.Ajax.Response({ 
	       events: { 
	         success: { 
	           fn: function (response, ioArgs) {  
	    			
	    			//add compareCache
	    			var ccode1 = ioArgs.options.params.ccode1;
	    			var ccode2 = ioArgs.options.params.ccode2;
	    			var ccode3 = ioArgs.options.params.ccode3;
	    			var ccode4 = ioArgs.options.params.ccode4;
	    				    			
					this.compareCache.add({ccode1: ccode1, 
										   ccode2: ccode2, 
										   ccode3: ccode3, 
										   ccode4: ccode4, 
										   response: response, 
										   ioArgs: ioArgs});

					//update compareGrid
					Page.updateGrid(response.data);
					Page.changeSelected = false;
	    			/*this.compareGrid.update(response.data);
	    			this.compareGridHeader.update(response.data);
	    			Page.initVehiclesSelectSection();*/
	           }, 
	           scope: Page 
	         } 
	       }  
	    })); 
	    //print function	
		Ext.get('window_print_show').on('click', this.print, Page);//end function
		//bind email event function
		
		/* email button will be displayed post launch
		var emailThisPage  = new ASC.Fad.EmailThisPage(); 
		Ext.get('window_email_show').on('click',emailThisPage.showEmailWindow );
		*/
		//change font size
		ASC.getEl('smallFont').on('click', this.changeFontSize, Page, {className:'smallFont', objName1:'middleFont', objName2:'largeFont'});	
		ASC.getEl('middleFont').on('click', this.changeFontSize, Page, {className:'middleFont', objName1:'smallFont', objName2:'largeFont'});	
		ASC.getEl('largeFont').on('click', this.changeFontSize, Page, {className:'largeFont', objName1:'smallFont', objName2:'middleFont'});
		
		//left menu
		ASC.getEl('hightlight').on('click', this.navigateMenu, Page, {objNameId:'1', key:Page.gHighlightsKey});
		if( !Page.hideTabs ){
			ASC.getEl('interior').on('click', this.navigateMenu, Page, {objNameId:'2', key:Page.gInteriorKey});
			ASC.getEl('performance').on('click', this.navigateMenu, Page, {objNameId:'3', key:Page.gPerformanceKey});
			ASC.getEl('safety').on('click', this.navigateMenu, Page, {objNameId:'4', key:Page.gSafetyKey});
		}
		ASC.getEl('dimensions').on('click', this.navigateMenu, Page, {objNameId:'5', key:Page.gDimensionsKey});
		ASC.getEl('warranty').on('click', this.navigateMenu, Page, {objNameId:'6', key:Page.gWarrantyKey});

		Page.initVehiclesSelectSection();
		if(Page.gccode != null && Page.gccode != '') {
			Page.initHighlights();
		}
		if(this.isPopup)
		{
			if(ASC.getEl("disclaimer_msrp"))
			{
				ASC.getEl("disclaimer_msrp").setDisplayed('none');
			}
		}
		/************************************/
		//Ext.History.init();
		var funs = new Array();
		var fun = new Array();
		fun.push(this);/*caller object*/
		fun.push(this.navigateMenu);/*function reference*/
		fun.push([null,null,{objNameId:'1', key:Page.gHighlightsKey}]);/*arguments*/
		funs.push(fun);
		Page.pageInitFunctions = funs;
		/************************************/
    },
    initHighlights:function() {
		Page.onMouseOverForInit(1);
		window.setTimeout(function(){Page.onMouseOutForInit(1);}, 3000);
    },
    getMenuId:function(index) {
    	if(index == 1) return 'hightlight';
    	if(index == 2) return 'interior';
    	if(index == 3) return 'performance';
    	if(index == 4) return 'safety';
    	if(index == 5) return 'dimensions';
    	if(index == 6) return 'warranty';
    },
    onMouseOverForMenu:function(index) {
    	index =String(index);
    	if(index==Page.gMenuKey)
    		return;
    	var menuId = Page.getMenuId(index);
    	objName = 'leftmenu_'+ index;
    	//var tmpBrand = Page.brand.toUpperCase();
    	var imgLocalePath = ASC.cfg.getImgLocalePath();
    	//if(ASC.getEl(objName).dom.className == 'left_drive_header_common')
    	//{
        	//ASC.getEl(menuId).dom.style.color = "#fff";
	    	/*if(tmpBrand == 'CHRYSLER') {
	        	//ASC.getEl(objName).dom.style.backgroundColor = "#377AA5";
	        	ASC.getEl(objName).dom.style.backgroundImage = "url('"+imgLocalePath+"/vsmc/Highlights_Active.gif')";
	    	} else if(tmpBrand == 'DODGE') {
	    		ASC.getEl(objName).dom.style.backgroundColor = "#920201";
	    	} else {
	    		ASC.getEl(objName).dom.style.backgroundColor = "#E6981C";
	    	}*/
    		
	    	switch(index)
	    	{
	    	case "1":
	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/Highlights_Active.gif";
	    		break;
	    	case "2":
	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/InteriorExterior_Active.gif";
	    		break;
	    	case "3":
	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/Performance_Active.gif";
	    		break;
	    	case "4":
	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/SafetySecurity_Active.gif";
	    		break;
	    	case "5":
	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/DimensionsCapacities_Active.gif";
	    		break;
	    	case "6":
	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/Warranty_Active.gif";
	    		break;
	    	}
    	//}
    },
    onMouseOutForMenu:function(index) {
    	index =String(index);
    	if(index==Page.gMenuKey)
    		return;
    	var menuId = Page.getMenuId(index);
    	objName = 'leftmenu_'+ index;
    	//var tmpBrand = Page.brand.toUpperCase();
    	var imgLocalePath = ASC.cfg.getImgLocalePath();
    	//if(ASC.getEl(objName).dom.className == 'left_drive_header_common')
    	//{
    	
    		switch(index)
	    	{
	    	case "1":
	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/Highlights_dft.gif";
	    		break;
	    	case "2":
	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/InteriorExterior_dft.gif";
	    		break;
	    	case "3":
	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/Performance_dft.gif";
	    		break;
	    	case "4":
	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/SafetySecurity_dft.gif";
	    		break;
	    	case "5":
	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/DimensionsCapacities_dft.gif";
	    		break;
	    	case "6":
	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/Warranty_dft.gif";
	    		break;
	    	}
        	/*ASC.getEl(menuId).dom.style.color = "#3B3B3B";
        	if(tmpBrand == 'CHRYSLER') {
            	ASC.getEl(objName).dom.style.backgroundColor = "#E1E1E1";
        	} else if(tmpBrand == 'DODGE') {
        		ASC.getEl(objName).dom.style.backgroundColor = "#C9C9C9";
        	} else {
        		ASC.getEl(menuId).dom.style.color = "#fff";
        		ASC.getEl(objName).dom.style.backgroundColor = "#2E251E";
        	}  */  		
    	//}
    },
    onMouseOverForInit:function(index) {
    	if(this.mouseOverMapping == null){
    		this.mouseOverMapping = new Array();
    		for(var i =1;i<=4;i++){
    			this.mouseOverMapping[i] = 0;
    		}
    	}
    	if(this.currentOnMouseOutIndex == index && this.mouseOverMapping[index]==1 ){
    		this.onMouseOutTask.cancel();
    		return ;
    	}
    	this.onMouseOverImpl(index);
    },
    onMouseOutForInit:function(index) {
    	if(this.currentOnMouseOutIndex != index && this.currentOnMouseOutIndex){
    		this.onMouseOutImpl(this.currentOnMouseOutIndex);
    	}
    	this.currentOnMouseOutIndex = index;
    	
    	if(this.onMouseOutTask == null){
    		this.onMouseOutTask = new Ext.util.DelayedTask();
    	}
    	this.onMouseOutTask.delay(10,this.onMouseOutImpl,this,[index]);
    },
    onMouseOver:function(index){
    	/*if(this.mouseOverMapping == null){
    		this.mouseOverMapping = new Array();
    		for(var i =1;i<=4;i++){
    			this.mouseOverMapping[i] = 0;
    		}
    	}
    	if(this.currentOnMouseOutIndex == index && this.mouseOverMapping[index]==1 ){
    		this.onMouseOutTask.cancel();
    		return ;
    	}
    	this.onMouseOverImpl(index);*/
    },
    onMouseOverImpl:function(index)
    {
       	var td1 = ASC.getEl("td_img_"+index);
       	if(td1 != null) {
       		td1.dom.style.backgroundColor = "#cccccc";
	     	this.setGroupBackgroundColor("#cccccc", index);
	       	this.setVehiclesBackgroundColor("#cccccc", index);
       	}
       	var td2 = ASC.getEl("td_drop_"+index);
       	if(td2 != null) {
       		td2.dom.style.backgroundColor = "#cccccc";
       	}
     	var td4 = ASC.getEl("td_netPrice_"+index);
     	if(td4 != null) {
     		td4.dom.style.backgroundColor = "#cccccc";
     	}
     	this.mouseOverMapping[index]=1;
    }
    ,
    onMouseOut:function(index)
    {
    	/*if(this.currentOnMouseOutIndex != index && this.currentOnMouseOutIndex){
    		this.onMouseOutImpl(this.currentOnMouseOutIndex);
    	}
    	this.currentOnMouseOutIndex = index;
    	
    	if(this.onMouseOutTask == null){
    		this.onMouseOutTask = new Ext.util.DelayedTask();
    	}
    	this.onMouseOutTask.delay(10,this.onMouseOutImpl,this,[index]);*/
    },
    onMouseOutImpl:function(index){
    	var td1 = ASC.getEl("td_img_"+index);
    	if(td1 != null) {
    		td1.dom.style.backgroundColor = "";
    	}
    	var td2 = ASC.getEl("td_drop_"+index);
    	if(td2 != null) {
    		td2.dom.style.backgroundColor = "";
    	}
    	this.setGroupBackgroundColor("", index);
    	this.setVehiclesBackgroundColor("", index);
    	var td4 = ASC.getEl("td_netPrice_"+index);
    	if(td4 != null) {
    		td4.dom.style.backgroundColor = "";
    	}
    	this.mouseOverMapping[index] = 0;
    }
    ,
     setGroupBackgroundColor:function(color,xindex)
     {
    	var compareGroups =this.compareData.compareGroups;
    	var groups;
    	var rows;
    	var td;
    	var count =0;
    	var name;
    	var lineId;
    	
        if(Page.gMenuKey != null) 
        {
        	for(var i =0 ;i<compareGroups.length;i++){
        		if(Page.gMenuKey == compareGroups[i].pageId){
        			count = compareGroups[i].groups.length;
        			break;
        		}
        	}
        } 
        else
        {
        	count = compareGroups[0].groups.length;
        }
        for(var t=1;t<=count;t++)
        {
	    	var td3 = ASC.getEl("td_groups_" + t + "_" + xindex);
	    	if(td3 != null) {
	    		td3.dom.style.backgroundColor = color;
	    	}
        }
    	for(var i=0;i<compareGroups.length;i++)
    	{
    		groups = compareGroups[i].groups;
    		for(var j=0;j<groups.length;j++)
    		{
    			rows = groups[j].rows;
    			for(var z=0;z<rows.length;z++)
    			{
    				//name = rows[z].name.replace(/(\")/g,'');
    				lindId = rows[z].lineId;
    				td=ASC.getEl("td_"+lindId+"_"+xindex);
    				if(td) {
    					if(td.dom.getAttribute('dispalyflag') != 'none')
    						td.dom.style.backgroundColor =color;
    				}
    			}
    		}
    	}
     }
    ,
    setVehiclesBackgroundColor:function(color,xindex)
    {
    	var td = ASC.getEl("td_vehicles_"+xindex);
    	  if(td)
		  td.dom.style.backgroundColor =color;
    }
    ,
    getFilterGroupId:function(type)
    {
    	var filterGroups = this.compareData.trimSelector.filterGroups;
    	for(var i=0;i<filterGroups.length;i++)
    	{
    		if(filterGroups[i].variationType==type)
    			return filterGroups[i].id;
    	}

		return '';
    },
    getCombinations:function(arrayFilters)
    {
    	var combinations = this.compareData.trimSelector.combinations;
    	var rcombinations = new Array();
    	var combination;
    	var flag;
    	
    	for(var m=0;m<arrayFilters.length;m++)
    	{
    		rcombinations = new Array();
    		for(var i=0;i<combinations.length;i++)
    		{
    			flag = false;
    			combination = combinations[i];
    			for(var p in combination.cids)
    			{
    				if(p == arrayFilters[m].groupID && (combination.cids[p] == arrayFilters[m].itemID || arrayFilters[m].itemID == 0)) 
    				{
    					flag = true;
    					break;
    				}
    			}
    			if(flag)
    			{
    				rcombinations.push(combination);
    			}
    		}
    		combinations = rcombinations;
    	}
    	return rcombinations;
    },
    /*getCombinations:function(groupId,itemId)
    {
    	var combinations = this.compareData.trimSelector.combinations;
    	var rcombinations = new Array();
    	var combination;
    	for(var i=0;i<combinations.length;i++)
    	{
    		combination = combinations[i];
    		if(itemId == 0)
    		{
    			rcombinations.push(combination)
    		}
    		else
    		{
        		for(var p in combination.cids)
        		{
        			if(p == groupId && combination.cids[p] == itemId && itemId != 0)
        			{
        				rcombinations.push(combination);
        			}
        		}		
    		}
    	}
    	return rcombinations;
    },*/
    getCompareVehicles:function(combinations)
    {
    	var rcompareVehicles = new Array();
    	var compareVehicles = this.compareData.compareVehicles;
		for(var j=0;j<compareVehicles.length;j++)
		{
	    	for(var i=0;i<combinations.length;i++)
	    	{
	 		   if(combinations[i].ccode==compareVehicles[j].ccode && combinations[i].lowerLevelPackageCode == compareVehicles[j].lowerLevelPackageCode)
	 		   {
	 		   	   //alert(combinations[i].ccode+' - '+combinations[i].lowerLevelPackageCode);
	 			   rcompareVehicles.push(compareVehicles[j]);
	 			   break;
	 		   }
	    	}
		}
    	return rcompareVehicles;
    },
    getCompareGroups:function(combinations, menuKey)
    {
    	if(menuKey==null) {
    		menuKey = Page.gHighlightsKey;
    	}
    	var arrayCompareGroups = new Array();
    	var compareGroups = this.compareData.compareGroups;
    	var arrayGroups = new Array();
    	var objCompareGroups = new Object();
    	var flag = true;
    	
    	if(compareGroups.length == 0){
    		return null;
    	}
    	
    	for(var m=0;m<compareGroups.length;m++)
    	{
    		if(compareGroups[m].pageId == menuKey)
    		{
    	    	for(var i=0;i<compareGroups[m].groups.length;i++)
    	    	{
    	    		var rows = compareGroups[m].groups[i].rows;
    	    		var arrayRows = new Array();
    	    		var objGroups = new Object();
    	    		
    	    		for(var j=0;j<rows.length;j++)
    	    		{     	
    	    			//var vehicleFeatures = rows[j].vehicleFeatures;
    	    			var specVehicleFeatures;
    	            	var objRows = new Object();
    	    	    	var arrayVehicleFeatures = new Array();
    	    	    	for(var c=0;c<combinations.length;c++)
    	    	    	{	
    	    	    		var isExists = false;
    	    	    		var tmpccode = combinations[c].ccode;
    	    	    		var tmplowerLevelPackageCode = combinations[c].lowerLevelPackageCode;
    	    	    		var tmpName = tmpccode + "_" + tmplowerLevelPackageCode;
    	    	    		
    						for(var ex=0;ex<arrayVehicleFeatures.length;ex++)
    						{
    							if(arrayVehicleFeatures[ex].name == tmpName) {//if(arrayVehicleFeatures[ex].name == tmpccode) {
    								isExists = true;
    							}
    						}

    						var arrayTemp = new Array();
    						var objTemp = new Object();
    						if(! (isExists)) {
    							for(var k=0;k<rows[j].vehicleFeatures.length;k++)
    							{
    								if(rows[j].vehicleFeatures[k].name == tmpName) {
    									specVehicleFeatures = rows[j].vehicleFeatures[k];
    								}
    							}
    						
	    	    	    		
	    	    	    		if(specVehicleFeatures) {
	    							for(var t=0;t<specVehicleFeatures.features.length;t++)
	    							{
	    								arrayTemp.push(specVehicleFeatures.features[t]);
	    							}
	    							objTemp.features = arrayTemp;
	    							objTemp.name = tmpName;
	    						}
	    	    	    		
	    	    	    		if(objTemp.name !=null) {
	    							arrayVehicleFeatures.push(objTemp);
	    						} else {
	    							var t1 = new Object();
	    							t1.availability = 'null';
	    							t1.description = 'null';
	    							t1.longDescription = 'null';
	    							t1.optionCode = 'null';
	    							arrayTemp.push(t1);
	    							objTemp.features = arrayTemp;
	    							objTemp.name = tmpName;
	    							
	    							arrayVehicleFeatures.push(objTemp);
	    						}
    						}
    	    	    	}
    	    			
    	    			if(flag)
    	    			{
    		    			objRows.name = rows[j].name;
    		    			objRows.lineId = rows[j].lineId;
    		    			objRows.extDimensionImage = rows[j].extDimensionImage;
    		    			objRows.vehicleFeatures = arrayVehicleFeatures;
    		
    		        		arrayRows.push(objRows);
    	    			}
    	    		}
    	    		if(flag)
    	    		{
    		    		objGroups.groupsContent = compareGroups[m].groups[i].groupsContent;
    		    		objGroups.name = compareGroups[m].groups[i].name;
    		    		objGroups.sectionId = compareGroups[m].groups[i].sectionId;
    		    		objGroups.rows = arrayRows;
    		    		arrayGroups.push(objGroups);
    	    		}
    	    	}  
    	    	
    		    objCompareGroups.groups = arrayGroups;
    		    objCompareGroups.pageId = compareGroups[m].pageId;
    		    objCompareGroups.title = compareGroups[m].title;
    		}
    	}

	    arrayCompareGroups.push(objCompareGroups);    	
    	
    	return arrayCompareGroups;
    },
    changeFilterVehiclesStyle: function(fTypeID,fid,count,index) {
    	//change color
    	Page.gFilterGroupsID = fTypeID;
    	Page.gFiltersID = fid;
    	Page.gFiltersCount = count;
    	
    	var el = fTypeID + index; 
    	var el2;
    	var elRad = 'rad_' +  fTypeID + index;
    	var elRad2;
    	if(count > 2 ){
	    	for(var i=1;i<=count;i++)
	    	{
	    		if(i==index){
	    			ASC.getEl(el).dom.className = 'left_drive_font_seleced';
	    			ASC.getEl(elRad).dom.checked = true;
	    		}else{
	    			el2 = fTypeID + i;
	    			elRad2 = 'rad_' +  fTypeID + i;
	    			ASC.getEl(el2).dom.className = '';
	    			ASC.getEl(elRad2).dom.checked = false;
	    		}
	    	}
	    }
    },
    filterVehicles:function(fTypeID,fid,count,index)
    {
    	Page.driveTypeId = fid;
    	Page.selectedIndex = -1;//Page["gCode"+Page.selectedIndex] used in restructureData function. it means none comboBox has changed.
    	Page.changeFilterVehiclesStyle(fTypeID,fid,count,index);
    	//check
    	var flag = true;
    	var trimSelector = null;
    	if(this.compareData.trimSelector != null){
    		trimSelector = this.compareData.trimSelector;
    		if(trimSelector.filterGroups == null){ flag = false; }
    		if(trimSelector.combinations == null){ flag = false; }  			
    	}else{
    		flag = false;
    	}
    	//filter
    	if(flag){
	    	//var filterGroupId = this.getFilterGroupId(fTypeID);
    		var filterGroupId = fTypeID;
	    	if(fid == count){//is all
	    		fid = 0;}
	    	
	    	Page.getFilterList(fTypeID, fid);
	    	
	    	//var combinations = this.getCombinations(filterGroupId, fid);
	    	var combinations = this.getCombinations(Page.gArrayFilters);
	    	if (combinations==null || combinations.length==0 ) {
	    		//Reset the other filters to 'All'
	    		var tempFilters=Page.gArrayFilters;	    		
	    		Page.gArrayFilters=null;
	    		Page.getFilterList(fTypeID, fid);
	    		combinations = this.getCombinations(Page.gArrayFilters);
	    		//now we need to set the radio buttons to all
	    		if(tempFilters != null) { 
			    	for(var i=0;i<tempFilters.length;i++)
			    	{
			    		if(tempFilters[i].groupID != fTypeID) {
			    			var count=1;
			    			while ( true ) {
			    				var elRad="rad_" + tempFilters[i].groupID + count;
			    				var elText=tempFilters[i].groupID + count;
			    				var domElem=ASC.getEl(elRad);
			    				var textElem=ASC.getEl(elText);
			    				if (domElem) {
			    					domElem.dom.checked=false;
			    					if (textElem) {
			    						textElem.dom.className = '';
			    					}
			    				} else {
			    					elRad="rad_" + tempFilters[i].groupID + (count-1);
			    					elText=tempFilters[i].groupID + (count-1);
			    					domElem=ASC.getEl(elRad);
			    					textElem=ASC.getEl(elText);
			    					if (domElem) {
			    						domElem.dom.checked=true;
			    						if (textElem) {
			    							textElem.dom.className = 'left_drive_font_seleced';
			    						}
			    					}
			    					break;
			    				}
			    				count++;
			    			}
			    		}
			    	}
		    	}
	    	} 
	    	var compareVehicles = this.getCompareVehicles(combinations);
	    	var compareGroups = this.getCompareGroups(combinations, Page.gMenuKey);
	    	Page.gCombinations = combinations;
	    	Page.gCompareVehicles = compareVehicles;
	    	
	    	var objCompareDatas = new Object();
	    	objCompareDatas.compareVehicles = compareVehicles;
	    	objCompareDatas.compareGroups = compareGroups;

	    	Page.renewCompareData = objCompareDatas;
	    	Page.renewCompareData = this.restructureData();
	    	objCompareDatas = Page.renewCompareData;
	    	
	    	this.compareGridHeader.update(objCompareDatas);
	    	this.compareGrid.update(objCompareDatas);  
	    	Page.initVehiclesSelectSection();
    	}
    },
    changeMenuStyle:function(keyId) 
    {
    	if(keyId == null) { keyId = 1;}
		//title
		if(keyId==1) { window.document.title = ASC.message('vsmcVehicleSpecModelsTitle'); ASC.getEl('topTitle').dom.innerHTML = ASC.message('vsmcVehicleSpecModelsHighlightsTopTitle'); }
		if(keyId==2) { window.document.title = ASC.message('vsmcVehicleSpecModelsInteriorTitle'); ASC.getEl('topTitle').dom.innerHTML = ASC.message('vsmcVehicleSpecModelsInteriorTopTitle'); }
		if(keyId==3) { window.document.title = ASC.message('vsmcVehicleSpecModelsPerformanceTitle'); ASC.getEl('topTitle').dom.innerHTML = ASC.message('vsmcVehicleSpecModelsPerformanceTopTitle'); }
		if(keyId==4) { window.document.title = ASC.message('vsmcVehicleSpecModelsSafetyTitle'); ASC.getEl('topTitle').dom.innerHTML = ASC.message('vsmcVehicleSpecModelsSafetyTopTitle'); }
		if(keyId==5) { window.document.title = ASC.message('vsmcVehicleSpecModelsDimensionsTitle'); ASC.getEl('topTitle').dom.innerHTML = ASC.message('vsmcVehicleSpecModelsDimensionsTopTitle'); }
		if(keyId==6) { window.document.title = ASC.message('vsmcVehicleSpecModelsWarrantyTitle'); ASC.getEl('topTitle').dom.innerHTML = ASC.message('vsmcVehicleSpecModelsWarrantyTopTitle'); }
		
    	var objName;
    	var imgLocalePath = ASC.cfg.getImgLocalePath();
    	for(var i=1; i<=6; i++)
    	{
        	objName = 'leftmenu_'+ i;
        	var str = String(i);
        	var keyIdStr = String(keyId);
    		if(str==keyIdStr){
    	    	//ASC.getEl(objName).dom.className = 'left_drive_header_active';
    			switch(str)
    	    	{
    	    	case "1":
    	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/Highlights_Active.gif";
    	    		break;
    	    	case "2":
					if( !Page.hideTabs)
    	    			ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/InteriorExterior_Active.gif";
    	    		break;
    	    	case "3":
					if( !Page.hideTabs)
    	    			ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/Performance_Active.gif";
    	    		break;
    	    	case "4":
					if( !Page.hideTabs)
    	    			ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/SafetySecurity_Active.gif";
    	    		break;
    	    	case "5":
    	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/DimensionsCapacities_Active.gif";
    	    		break;
    	    	case "6":
    	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/Warranty_Active.gif";
    	    		break;
    	    	}
    		}else{
    			switch(str)
    	    	{
    	    	case "1":
    	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/Highlights_dft.gif";
    	    		break;
    	    	case "2":
					if( !Page.hideTabs)
    	    			ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/InteriorExterior_dft.gif";
    	    		break;
    	    	case "3":
					if( !Page.hideTabs)
    	    			ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/Performance_dft.gif";
    	    		break;
    	    	case "4":
					if( !Page.hideTabs)
    	    			ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/SafetySecurity_dft.gif";
    	    		break;
    	    	case "5":
    	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/DimensionsCapacities_dft.gif";
    	    		break;
    	    	case "6":
    	    		ASC.getEl(objName).dom.src = imgLocalePath+"/vsmc/Warranty_dft.gif";
    	    		break;
    	    	}
    			//ASC.getEl(objName).dom.className = 'left_drive_header_common';
    			
    	    	/*var menuId = Page.getMenuId(i);
    	    	objName = 'leftmenu_'+ i;
    	    	var tmpBrand = Page.brand.toUpperCase();
    	    	
	        	ASC.getEl(menuId).dom.style.color = "#3B3B3B";
	        	if(tmpBrand == 'CHRYSLER') {
	            	ASC.getEl(objName).dom.style.backgroundColor = "#E1E1E1";
	        	} else if(tmpBrand == 'DODGE') {
	        		ASC.getEl(objName).dom.style.backgroundColor = "#C9C9C9";
	        	} else {
	        		ASC.getEl(menuId).dom.style.color = "#fff";
	        		ASC.getEl(objName).dom.style.backgroundColor = "#2E251E";
	        	} */

    		}
    	}
    },
    navigateMenu:function(evt, el, options)
    {

    	var argObjNameId = options.objNameId;
    	Page.changeMenuStyle(argObjNameId);
    	
    	Page.gMenuKey = options.key;
    	var trimSelector;
    	var combinations;
    	var compareVehicles;
    	var compareGroups;
    	if(Page.gFilterGroupsID == null) 
    	{
    		trimSelector = this.compareData.trimSelector;
    		combinations = trimSelector.combinations;
    		compareVehicles = this.compareData.compareVehicles;
    		compareGroups = this.getCompareGroups(combinations, Page.gMenuKey);
    	}
    	else
    	{
    		combinations = Page.gCombinations;
    		compareVehicles = Page.gCompareVehicles;
    		//compareGroups = this.getCompareGroups(Page.gCompareVehicles, Page.gMenuKey);
    		compareGroups = this.getCompareGroups(combinations, Page.gMenuKey);
    	}
    	
    	var objCompareDatas = new Object();
    	objCompareDatas.compareVehicles = compareVehicles;
    	objCompareDatas.compareGroups = compareGroups;

    	Page.renewCompareData = objCompareDatas;
    	Page.renewCompareData = this.restructureData();
    	objCompareDatas = Page.renewCompareData;
    	
    	this.compareGridHeader.update(objCompareDatas);
    	this.compareGrid.update(objCompareDatas);  
    	Page.initVehiclesSelectSection();
    },
    changeFontSize: function(evt, el, options)
    {
		var argElement = el;
		var argClassName = options.className;
		var argObjName1 = options.objName1;
		var argObjName2 = options.objName2;
		ASC.getEl('content_body_bottom_bg_frame').dom.className = argClassName;
		ASC.getEl(argClassName).dom.style.color='#000';
		ASC.getEl(argObjName1).dom.style.color='#666666';
		ASC.getEl(argObjName2).dom.style.color='#666666';
		
		var tdCollection = ASC.getEl('compareDataTable').dom.getElementsByTagName('td');
		for(var i = 0;i<tdCollection.length ; i++)
		{
			if(tdCollection[i].getAttribute('fontflag'))
				tdCollection[i].style.fontSize='11px';
		}
    },
    
	showEnlargeImage:function (extImg , txtTitle)
	{	
		if(txtTitle)
    		txtTitle = txtTitle.replace('_','"');
    	this.enlargeImageWindow = new Ext.Window({
    		title: txtTitle,
    		closable: true,
    		modal: true,
    		resizable: true,
    		plain: true,
    		layout: 'fit',
    		constrainHeader: true,
    		draggable: true,
    		border: false,
    		hidden :true,
    		closeAction :'close',
    		width:520,
    		height:330,
    		html:'<div style="min-height:310px;min-width:500px; text-align:center;"><img style="width:500px;height:310px" id="extImgId" src="'+extImg+'&width=500&height=310&NOIMG=not_found_'+Page.brand+'.gif" alt="" onerror="ASC.Chrysler.imageOnError(this);" /></div>'
    	});
		this.enlargeImageWindow.on('hide',Page.destroyEnlargeImageWindow,Page);
    	this.enlargeImageWindow.show();
	},
	destroyEnlargeImageWindow:function(){
		this.enlargeImageWindow.suspendEvents();
		this.enlargeImageWindow.destroy();
		delete this.enlargeImageWindow;
	},
	showDimensionsInfo:function(name, index)
	{
		var closeEl = ASC.getEl("a_" + name + "_" + index);
		var extendEl = ASC.getEl("img_" + name + "_" + index);
		var displayEl = ASC.getEl("display_" + name + "_" + index);
		var trEl = ASC.getEl("tr_" + name + "_" + index);
		displayEl.dom.style.display = "block";
		closeEl.dom.style.display = "inline";
		//trEl.dom.style.display = "none";
		trEl.dom.className = 'content_body_ram_tr_bg';
	
		var compareGroups = this.compareData.compareGroups;
		for(var i=0;i<compareGroups.length;i++)
		{
			if(compareGroups[i].pageId == Page.gMenuKey) 
			{
				var groups = compareGroups[i].groups;
				for(var j = 0;j<groups.length;j++)
				{
					if(groups[j].name == name)
					{
						for(var m=0;m<=4;m++)
						{
							var tmp = groups[j].rows[index-1].lineId;
							var tdEl = ASC.getEl("td_" + tmp + "_" + m);
							if(m == 0) { tdEl.dom.className = 'content_body_ram_td_border_lt'; }
							if(m != 0 && m != 4) { tdEl.dom.className = 'content_body_ram_td_border_t'; tdEl.dom.setAttribute('dispalyflag','none');} 
							if(m == 4) { tdEl.dom.className = 'content_body_ram_td_border_rt'; tdEl.dom.setAttribute('dispalyflag','none');}
						}
					}
				}
			}
		}
	},
	closeDimensionsInfo:function(name, index)
	{
		var closeEl = ASC.getEl("a_" + name + "_" + index);
		var extendEl = ASC.getEl("img_" + name + "_" + index);
		var displayEl = ASC.getEl("display_" + name + "_" + index);
		var trEl = ASC.getEl("tr_" + name + "_" + index);
		displayEl.dom.style.display = "none";
		closeEl.dom.style.display = "none";
		//trEl.dom.style.display = "block";
		trEl.dom.className = '';
		
		var compareGroups = this.compareData.compareGroups;
		for(var i=0;i<compareGroups.length;i++)
		{
			if(compareGroups[i].pageId == Page.gMenuKey) 
			{
				var groups = compareGroups[i].groups;
				for(var j = 0;j<groups.length;j++)
				{
					if(groups[j].name == name)
					{
						var vehicleFeatures = groups[j].rows[index-1].vehicleFeatures;
						for(m=0;m<=4;m++)
						{
							var tmp = groups[j].rows[index-1].lineId;
							var tdEl = ASC.getEl("td_" + tmp + "_" + m);
							if(m > vehicleFeatures.length && m !=4 ) { tdEl.dom.className = ''; }
							if(m<=vehicleFeatures.length && m >= 0) { tdEl.dom.className = 'content_body_ram_td_border_rb'; }
							if(m == 4) {tdEl.dom.className = 'content_body_ram_td_border_r';}
							
							tdEl.dom.setAttribute('dispalyflag','display');
						}
					}
				}
			}
		}
	},
	
    toggleSection: function (evt, row, bodyId, index)
    { 
      var bodyEl = ASC.getEl(bodyId); 
      var tmp = 'imgDiv' + index;
      var imgDiv = ASC.getEl(tmp);
      imgDiv.switchClass('imgClose', bodyEl.isVisible());
      bodyEl.switchClass('display_none', bodyEl.isVisible());
      if(Page.showedToolTipTarget&&Page.showedToolTipTarget.clickTipLayer.isVisible())
      {
    	  if(index == Page.selGroupXindex)
    	  {
    		  Page.showedToolTipTarget.clickTipLayer.hide();
    	  }
    	  else
    	  {
    		 // Page.showedToolTip.hide();
    		  var el = ASC.getEl(Page.showedToolTipTarget.id);
    		  var h = el.getHeight();
    		  var w = el.getWidth()*0.5;
    		  var x = el.getX();
    		  var y = el.getY();
    		  Page.showedToolTipTarget.clickTipLayer.setPosition(x+w,h+y);
    		  //Page.showedToolTipTarget.clickTipLayer.showBy(Page.showedToolTipTarget);
    	  }
      }
    },  
    changeFilterSection:function(fid)
    {
    	var tmp = fid;
    	var el = ASC.getEl(tmp);
    	el.switchClass('left_drive_table_display_none', el.isVisible());
    	/*el.enableDisplayMode();
    	el.toggle();*/
    },
    redirectBuildMyOwn:function(modelYearCode, lowerLevelPackage, ccode)
    {
    	window.location.href=ASC.cfg.getContextPath() + '/bmo/models.do?modelYearCode='+modelYearCode+'&llp='+lowerLevelPackage+'&ccode='+ccode;
    },
    
    popupRedirectBuildMyOwn:function(modelYearCode, lowerLevelPackage, ccode)
    {
    	parent.location.href=ASC.cfg.getContextPath() + '/bmo/models.do?modelYearCode='+modelYearCode+'&llp='+lowerLevelPackage+'&ccode='+ccode;
    },
    popupSelectThisModel:function(modelYearCode, lowerLevelPackage, ccode,description)
    {
    	parent.location.href=ASC.cfg.getContextPath() + '/sni/inventorySearch.do?modelYearCode='+modelYearCode+'&lowLevelPackageCode='+lowerLevelPackage+'&ccode='+ccode+'&viewType='+Page.SNIViewType+"&fromSNI=true";
    },
	eventCB: {
		vehicleSelected: function (ccode1, ccode2, ccode3, ccode4)
		{
    		Page.ajax.sendRequest('COMPAREDATA', {
				params: {
    			    modelYearCode:Page.modelYearCode,
					CCodes:ccode1+((ccode2!=null&&ccode2.length>0)?","+ccode2:"")+((ccode3!=null&&ccode3.length>0)?","+ccode3:"")+((ccode4!=null&&ccode4.length>0)?","+ccode4:""),
    			    ccode1: ccode1,
					ccode2: ccode2,
					ccode3: ccode3,
					ccode4: ccode4
				}
			});
    		return;
		},
		scope: Page
	},
	initVehiclesSelectSection:function()
	{
		if(this.vehicleSelectComboBox ==null){
			this.vehicleSelectStore = new Ext.data.SimpleStore({
		        fields: ['value', 'text', 'tip'],
		        data: []
			});
			this.vehicleSelectComboBox = new Array();
			var count =4;
			for(var i =1;i<=count;i++){
				this.vehicleSelectComboBox[i] = new Ext.form.ComboBox({
					listClass:'x-combo-list-small',
			        store: this.vehicleSelectStore,
			        displayField:'text',
			        valueField  :'value',
			        typeAhead: true,
			        forceSelection: true,
			        mode: 'local',
			        triggerAction: 'all',
			        emptyText:'Change Vehicle',
			        autoCreate:{tag: "input", type: "text", style: "height:17px;width:135px;", autocomplete: "on"},
			        listAlign :"tr-br",
			        lazyInit: false,
			        //resizable: true,
			        selectOnFocus:true,
			        listWidth: 340,
			        emptyClass :'select-combo'
				});
				this.vehicleSelectComboBox[i].index = i;
				this.vehicleSelectComboBox[i].on('select',Page.vehicleSelectComboBoxHandle,Page); 
			}
		}
		var vehicleSelectData = new Array();
		var compareVehicles = Page.gCompareVehicles ? Page.gCompareVehicles: this.compareData.compareVehicles ;
		for(var j=0;j<compareVehicles.length;j++){
			vehicleSelectData[j]=[compareVehicles[j].ccode + '_' + compareVehicles[j].lowerLevelPackageCode, compareVehicles[j].description,compareVehicles[j].description ];
		}
		
		for(var i =1;i<=4;i++){
			var el = Ext.fly("selectVehicle"+i);
			if(el){
				this.vehicleSelectComboBox[i].rendered =false;
				this.vehicleSelectComboBox[i].render( el );
			}
		}
		this.vehicleSelectStore.loadData(vehicleSelectData,false);
		for(var i =1;i<=4;i++){
			var el = Ext.fly("selectVehicle"+i);
			if(el){
				this.vehicleSelectComboBox[i].collapse();
				this.vehicleSelectComboBox[i].setValue("");
			}
		}
	},
	
	vehicleSelectComboBoxHandle: function( combo, record, index ) {
		//Page.gFilterGroupsID = null;
		Page.changeSelected = true;
		Page.selectedIndex = combo.index;
		combo.selectedCCode = record.get("value");
		var ccodes = new Array(5);
		var count = 4;
		for(var i=1;i<=count;i++){
			Page["gCode"+i] = ccodes[i]= Page.selectedIndex == i ? this.vehicleSelectComboBox[i].selectedCCode:Page["gCode"+i];
		}
		this.getCompareData(ccodes[1],ccodes[2],ccodes[3],ccodes[4]);
		ASC.Chrysler.trackLinkMetrics("change_vehicle",record.data.text);
	},
	getFilterList: function(fTypeID, fid) {

    	var tmpArray = new Array();
    	var tmpObj = new Object();
    	
    	tmpObj.groupID = fTypeID;
    	tmpObj.itemID = fid;
    	tmpArray.push(tmpObj);
    	var arrayFilters;
    	
    	if(Page.gArrayFilters != null) { 
    		arrayFilters = Page.gArrayFilters; 

	    	for(var i=0;i<Page.gArrayFilters.length;i++)
	    	{
	    		if(arrayFilters[i].groupID == fTypeID) {
	    			arrayFilters[i].itemID = fid;
	    			break;
	    		} else {
	    			if(i==(arrayFilters.length - 1)) {
	    				arrayFilters.push(tmpObj);
	    				break;
	    			}
	    		}
	    	}
	    	
	    	Page.gArrayFilters = arrayFilters;
    	} else {
	    	Page.gArrayFilters = tmpArray;
    	}
	},
	initData: function() {
		
		var compareVehicles;
		var compareGroups;
		
		compareVehicles = this.compareData.compareVehicles;
		compareGroups = this.compareData.compareGroups;
		
		compareGroups = Page.restructureCompareGroups(compareGroups, compareVehicles);
		Page.gRestructFlag = true;
		
		this.compareData.compareVehicles = compareVehicles;
		this.compareData.compareGroups = compareGroups;
	},
	restructureCompareGroups: function(compareGroups, compareVehicles) {
		
		for(var i=0; i<compareGroups.length; i++)
		{
			var tmpCompareGroups = compareGroups[i];
			if(!(tmpCompareGroups && tmpCompareGroups.groups))
				continue;
			for(var j=0; j<tmpCompareGroups.groups.length; j++)
			{
				var tmpGroups = tmpCompareGroups.groups[j];
				for(var k=0; k<tmpGroups.rows.length; k++)
				{
					var tmpRows = tmpGroups.rows[k];
					var arrayVehicleFeatures = new Array();
					
					for(var n=0; n<compareVehicles.length; n++)
					{
						var tmpccode = compareVehicles[n].ccode;
						//var tmpbaseLLP = compareVehicles[n].baseLLP;
						var tmpLowerLevelPackageCode = compareVehicles[n].lowerLevelPackageCode;
						//var tmpName = tmpccode + "_" + tmpbaseLLP;
						var tmpName = tmpccode + "_" + tmpLowerLevelPackageCode;
						
						var arrayTemp = new Array();
						var objTemp = new Object();
						var specVehicleFeatures = '';
						if(Page.gRestructFlag)
						{
							for(var m=0;m<tmpRows.vehicleFeatures.length;m++)
							{
								if(tmpRows.vehicleFeatures[m].name == tmpName)//if(tmpRows.vehicleFeatures[m].name == tmpccode)
								{
									specVehicleFeatures = tmpRows.vehicleFeatures[m];
								}
							}
							if(specVehicleFeatures != '') {
								for(var t=0;t<specVehicleFeatures.features.length;t++)
								{
									arrayTemp.push(specVehicleFeatures.features[t]);
								}
								objTemp.features = arrayTemp;
								objTemp.name = tmpName;
							}
						}
						else
						{
							specVehicleFeatures = tmpRows.vehicleFeatures[tmpName];//specVehicleFeatures = tmpRows.vehicleFeatures[tmpccode];
							if(specVehicleFeatures) {
								for(var t=0;t<specVehicleFeatures.length;t++)
								{
									arrayTemp.push(specVehicleFeatures[t]);
								}
								objTemp.features = arrayTemp;
								objTemp.name = tmpName;
							}
						}
						
						if(objTemp.name !=null) {
							arrayVehicleFeatures.push(objTemp);
						} else {
							var t1 = new Object();
							t1.availability = '';
							t1.description = '';
							t1.longDescription = '';
							t1.optionCode = '';
							arrayTemp.push(t1);
							objTemp.features = arrayTemp;
							objTemp.name = tmpName;
							
							arrayVehicleFeatures.push(objTemp);
						}
					}
					
					//update
					compareGroups[i].groups[j].rows[k].vehicleFeatures = arrayVehicleFeatures;
				}
			}
		}

		return compareGroups;
	},
	restructureData: function() {
		//sort by compareVehicles.msrp
		if(Page.gCompareVehicles == null) {
			Page.initData(compareVehicles, compareGroups);
		}
		
		var compareVehicles;
		var compareGroups;
		if(Page.gCompareVehicles != null) {
			compareVehicles = Page.gCompareVehicles;
		} else {

			var filterGroups;
			var count;
			
			if(Page.gMenuKey == null || Page.gMenuKey == '') { 
				Page.gMenuKey = Page.gHighlightsKey;
			} else {
				if(Page.gMenuKey > 6 || Page.gMenuKey <=0) { Page.gMenuKey = Page.gHighlightsKey; }
			}
			
	    	Page.changeMenuStyle(Page.gMenuKey);
	    	
			filterGroups = this.compareData.trimSelector.filterGroups;
			for(var m=0;m<filterGroups.length;m++)
			{
				if( 
						filterGroups[m].variationTypeID == 2 
						|| filterGroups[m].variationTypeID == -2 
						|| filterGroups[m].variationTypeID == 11 
						|| filterGroups[m].variationTypeID == -1
						|| filterGroups[m].variationTypeID == -3)
				{
					var length =  filterGroups[m].filters.length + 1;
					if(Page.gccode) {
						Page.getFilterList(filterGroups[m].id, 0);
						Page.changeFilterVehiclesStyle(filterGroups[m].id, filterGroups[m].filters[0].id, length, length);
					} else {	
						Page.getFilterList(filterGroups[m].id, filterGroups[m].filters[0].id);
						Page.changeFilterVehiclesStyle(filterGroups[m].id, filterGroups[m].filters[0].id, length, 1);
					}
				}
				if(filterGroups[m].variationTypeID == 1) //default to All for Drive filter
				{
					var length =  filterGroups[m].filters.length + 1;
					Page.getFilterList(filterGroups[m].id, 0);
					Page.changeFilterVehiclesStyle(filterGroups[m].id, filterGroups[m].filters[0].id, length, length);
				}
			}

	    	var combinations = this.getCombinations(Page.gArrayFilters);
	    	compareVehicles = this.getCompareVehicles(combinations);

	    	compareGroups = this.getCompareGroups(combinations, Page.gMenuKey);
	    	Page.gCombinations = combinations;
	    	Page.gCompareVehicles = compareVehicles;
		}
		
		//sort
		var sortModels = new Ext.util.MixedCollection(false, function (field) {
			return field.ccode + "_" + field.lowerLevelPackageCode;	
		});
		
		for( i=0; i<compareVehicles.length; i++ ){
			sortModels.add(compareVehicles[i]);
		}
		
		var sort = function (lhs, rhs) {
			var lhsMsrp = parseFloat(lhs.msrp);
			var rhsMstp = parseFloat(rhs.msrp);
			return lhs.msrp>rhs.msrp ? 1 : lhs.msrp<rhs.msrp ? -1 : 0; 
		};
		
		sortModels.sort('ASC',sort);
		
		compareVehicles = sortModels.items;

		if(Page.renewCompareData != null) {
			compareGroups = Page.renewCompareData.compareGroups;
		}
		var tmpVehicles = new Array();
		var tmpObj = new Object();

		
			var index = 0;

			if( Page.selectedIndex >=0 ){
				//in this case we try to match the previous displayed vehicle list, so we don't rewrite vehicles order if previous selections were made
					for( i=0; i<4; i++ ){
						for( j=0; j<compareVehicles.length;j++ ){
							if(compareVehicles[j].ccode+'_'+compareVehicles[j].lowerLevelPackageCode == Page['gCode'+(i+1)]){
									tmpVehicles.push(compareVehicles[j]);
									break;
							}
						}
					}
					if( tmpVehicles.length < 4 ){
						index = tmpVehicles.length;
					}
			}else{
				for( i=0; i<compareVehicles.length; i++ ){
					tmpVehicles.push(compareVehicles[i]);
					Page["gCode"+(i+1)] = compareVehicles[i].ccode + '_' + compareVehicles[i].lowerLevelPackageCode;
					
					if( index==3 ){ //this means that we added all 4 models to the tmpVehicles list
						index+=1;
						break;
					}
					index+=1;
				}
			}

			if( index <= 3 ){
				for( i=0; i<4-index; i++ ){
					tmpObj.ccode = '';
					tmpObj.baseLLP = '';
					tmpObj.lowerLevelPackageCode = '';
					tmpObj.defaultExtImage = 'null';
					tmpObj.defaultIntImage = 'null';
					tmpObj.longDescription = '';
					tmpObj.msrp = '';
					tmpObj.destination = '';
					tmpVehicles.push(tmpObj);
					
				}
			}
			
		Page.gFourVehicles = tmpVehicles;
		
		
		compareGroups = Page.restructureCompareGroups(compareGroups, tmpVehicles);
		
		if(Page.renewCompareData != null) {
			Page.renewCompareData.compareVehicles = tmpVehicles;
			Page.renewCompareData.compareGroups = compareGroups;
			return Page.renewCompareData;
		}
		
	   	var objCompareDatas = new Object();
	   	objCompareDatas.compareVehicles = tmpVehicles;
    	objCompareDatas.compareGroups = compareGroups;
		return objCompareDatas;
	},
	bubbleSort: function(compareVehicles) {
	
		var tmp;
		var count = compareVehicles.length;
		for(var i=0;i<count;i++)
		{
			for(var m=count-1;m>i;m--)
			{
				if(compareVehicles[m].msrp > compareVehicles[m-1].msrp)
				{
					tmp = compareVehicles[m-1];
					compareVehicles[m-1] = compareVehicles[m];
					compareVehicles[m] = tmp;
				}
			}
		}
		
		var ccode_p;
		var lowLevelPackageCode_p;
		if(! Page.gClearCcodeFlag) {
			Page.gClearCcodeFlag = true;
			ccode_p = Page.gccode;
			lowLevelPackageCode_p = Page.lowLevelPackageCode;
			
			if(Page.gccode == null || Page.gccode == '')
			{
				for(var i=0;i<compareVehicles.length;i++)
				{	
					if(i <=3 ) {
						//Page["gCode"+(i+1)] = compareVehicles[i].ccode + '_' + compareVehicles[i].baseLLP;
						Page["gCode"+(i+1)] = compareVehicles[i].ccode + '_' + compareVehicles[i].lowerLevelPackageCode;
					} else { 
						break; 
					}
				}
			}
		}
		
		var index = 0;
		if(ccode_p != null && ccode_p != '')
		{
			for(var i=0;i<count;i++)
			{
				if(Page.rtrim(compareVehicles[i].ccode) == Page.rtrim(ccode_p))
				{
					index = i;
					break;
				}
			}
			
			var m = index;
			tmp = compareVehicles[m];
			for(var m=index;m>0;m--)
			{
				compareVehicles[m] = compareVehicles[m-1];
			}
			compareVehicles[0] = tmp;
			Page.gCode1 = ccode_p + '_' + lowLevelPackageCode_p;
		}
		//base on ccode
		var tCount = 0;
		var isExistsFlag1 = false;
		var isExistsFlag2 = false;
		var isExistsFlag3 = false;
		var isExistsFlag4 = false;
		if(Page.gCode1 != null) { tCount = 1; }
		if(Page.gCode2 != null) { tCount = 2; }
		if(Page.gCode3 != null) { tCount = 3; }
		if(Page.gCode4 != null) { tCount = 4; }
		
		var tmpVehicles = new Array();
		for(var x=1; x<=tCount; x++)
		{
			for(var y=0; y<compareVehicles.length; y++)
			{
				if(x==1 && (Page.rtrim(compareVehicles[y].ccode+'_'+compareVehicles[y].lowerLevelPackageCode)) == Page.rtrim(Page.gCode1)) {
					tmpVehicles.push(compareVehicles[y]);
					isExistsFlag1 = true;
				}
				if(x==2 && (Page.rtrim(compareVehicles[y].ccode+'_'+compareVehicles[y].lowerLevelPackageCode)) == Page.rtrim(Page.gCode2)) {
					tmpVehicles.push(compareVehicles[y]);
					isExistsFlag2 = true;
				}
				if(x==3 && (Page.rtrim(compareVehicles[y].ccode+'_'+compareVehicles[y].lowerLevelPackageCode)) == Page.rtrim(Page.gCode3)) {
					tmpVehicles.push(compareVehicles[y]);
					isExistsFlag3 = true;
				}
				if(x==4 && (Page.rtrim(compareVehicles[y].ccode+'_'+compareVehicles[y].lowerLevelPackageCode)) == Page.rtrim(Page.gCode4)) {
					tmpVehicles.push(compareVehicles[y]);
					isExistsFlag4 = true;
				}
			}

			if(!(isExistsFlag1) && x==1 && compareVehicles.length >0) { tmpVehicles.push(compareVehicles[0]);}
			if(!(isExistsFlag2) && x==2 && compareVehicles.length >1) { tmpVehicles.push(compareVehicles[1]);}
			if(!(isExistsFlag3) && x==3 && compareVehicles.length >2) { tmpVehicles.push(compareVehicles[2]);}
			if(!(isExistsFlag4) && x==4 && compareVehicles.length >3) { tmpVehicles.push(compareVehicles[3]);}
		}
		var tmpCount;
		if(compareVehicles.length > tCount)
		{
			if(compareVehicles.length < 4) { 
				tmpCount = compareVehicles.length;
			} else {
				tmpCount = 4;
			}
			
			for(var y=1; y<=(tmpCount-tCount); y++)
			{
				tmpVehicles.push(compareVehicles[tCount+y-1]);
			}
		}
		if(tCount >0) {compareVehicles = tmpVehicles;}

		return compareVehicles;
	},
	checkFilterGroup:function(filterGroups)
	{
		for(var m=0;m<filterGroups.length;m++)
		{
			if(filterGroups[m].variationTypeID == 4) { return true; }
		}
		return false;
	},
    updateGrid:function(newCompareData)
    {
		//Page.selectedNewCompareData = newCompareData;
    	if(Page.gMenuKey != null) {
    		Page.gMenuKdy = Page.gHighlightsKey;
    	}
    	var trimSelector;
    	var combinations;
    	var compareVehicles;
    	var compareGroups;
    	if(Page.gFilterGroupsID == null || Page.changeSelected) 
    	{
    		trimSelector = newCompareData.trimSelector;
    		combinations = trimSelector.combinations;
    		compareVehicles = newCompareData.compareVehicles;
    		compareGroups = this.getCompareGroups(combinations, Page.gMenuKey);
    	}
    	else
    	{
    		combinations = Page.gCombinations;
    		compareVehicles = Page.gCompareVehicles;
    		//compareGroups = this.getCompareGroups(Page.gCompareVehicles, Page.gMenuKey);
    		compareGroups = this.getCompareGroups(combinations, Page.gMenuKey);
    	}
    	
    	var objCompareDatas = new Object();
    	objCompareDatas.compareVehicles = compareVehicles;
    	objCompareDatas.compareGroups = compareGroups;

    	Page.renewCompareData = objCompareDatas;
    	Page.renewCompareData = this.restructureData();
    	objCompareDatas = Page.renewCompareData;
    	
    	this.compareGridHeader.update(objCompareDatas);
    	this.compareGrid.update(objCompareDatas);  
    	Page.initVehiclesSelectSection();
    },
	getCompareData: function (ccode1, ccode2, ccode3, ccode4){
		
		//get cache
		var cache = this.compareCache.get(this.getCacheKey(ccode1, ccode2, ccode3, ccode4));
		
		if(cache) {
			this.updateGrid(cache.response.data);
			Page.changeSelected = false;
			/*this.compareGrid.update(cache.response.data);
			this.compareGridHeader.update(cache.response.data);
			Page.initVehiclesSelectSection();*/
		}
		else{
			this.eventCB.vehicleSelected(ccode1, ccode2, ccode3, ccode4);
			//this.compareGrid.update(this.compareData);
			//this.compareGridHeader.update(this.compareData);
			//Page.initVehiclesSelectSection();
		}
	},
	getCacheKey: function (ccode1, ccode2, ccode3, ccode4)
	{
		return ccode1 + '_' + ccode2 + '_' + ccode3 + '_' + ccode4;
	},
	ltrim: function(str)
	{
		if(str)
		return str.replace( /^\s*/, '');
	},
	rtrim: function(str)
	{
		if(str)
		return str.replace(/\s+$/g,'');
	},
	print : function ()
	{
		window.print();
		return;
		if(!Page.printForm)
		{
			Page.printForm=new Ext.FormPanel({
			       labelAlign: 'left',
			       border:true,
			       
			       frame:true,
			       //title: 'Radio Group',
			       bodyStyle:'padding:0px 0px 0',
			       //width: 300,
			       //height:250,
			       items: [{
			            	 html: '<select><option value="">--All Shown--</option><option value="">Print All Pages</option><option value="">Model Highlights</option><option value="">Interior & Exterior</option><option value="">Performance</option><option value="">Safety & Security</option><option value="">Dimensions & Capacities</option></select>',
			            	 border:false
					       },
					       {
					    	  
			            	layout: 'form',
			            	style:'margin-left:0px',
			            	defaults: {
			            		        // applied to each contained panel
			            		        bodyStyle:'padding:5px;text-align:left;align:left'
			            		    },
			                 items: [
			                         {	
			                        	 items:new Ext.form.Checkbox({boxLabel:ASC.message('vsmc_vehicleSpecModels_printAllPage'),labelSeparator:'', name:'opt2'})
			                         },
			                         {	
			                        	items:new Ext.form.Checkbox({boxLabel:ASC.message('vsmc_vehicleSpecModels_Highlights'),labelSeparator:'', name:'opt2', checked:true})
			                         },
				                    {	
			                        	items:new Ext.form.Checkbox({boxLabel:ASC.message('vsmc_vehicleSpecModels_Interior'),labelSeparator:'', name:'opt2'})
			                         },
				                    {	
			                        	items: new Ext.form.Checkbox({boxLabel:ASC.message('vsmc_vehicleSpecModels_Performance') ,labelSeparator:'', name:'opt2'})
			                        },
				                    {	
			                        	items: new Ext.form.Checkbox({boxLabel:ASC.message('vsmc_vehicleSpecModels_Safety') ,labelSeparator:'', name:'opt2'})
			                        },
				                    {	
			                        	items:new Ext.form.Checkbox({boxLabel:ASC.message('vsmc_vehicleSpecModels_Dimensions'),labelSeparator:'', name:'opt2'})
			                        }
			                 ]
			             }]
			     });
		}// end pageform
		
		if(!Page.printWindow)
		{
			Page.printWindow= new Ext.Window({
				contentEl:"window_print",
				bodyStyle: 'padding:0px 0px 0;align:left;text-align:left;',
				width:300,
				height:300,
				constrainHeader: true,
				draggable: true,
				layout:'fit',    
	    		resizable :false,
	    		border : true,
	    		maximizable:false,
				closeAction:'hide',
				plain:true,
				title:"print",
				buttonAlign:"center",
				items:Page.printForm,
				buttons: [{
                    text: 'Print',
                    handler: function(){
						//alert('ok');
                    }
                 }]			          
			});
							
		}//end print window
		Page.printWindow.show();
	},
	
	initDisclaimerWindow: function (title)
	{
		var windowId = Ext.id();
		var html = '<iframe src="' + ASC.cfg.getContextPath() + '/bmo/pricingDisclosure.do?hideClose=true" style="border: none;width:100%;height:100%;" id = "disclaimerFrame" name="disclaimerFrame" frameborder="0"></iframe>';
		
		this.window = new Ext.Window({
			id: windowId,
			cls: '',
			title: title,
			closable: true,
			closeAction: 'hide',
			constrainHeader: true,
			draggable: true,
			header:true,
			width: 600,
			height: 290,			
			modal: true,
			resizable: false,
			plain: false,			
			layout: 'fit',
			border: false,
			items: {
				html: html,
				border: false
			}
		});
	},

	showDisclaimer: function (title)
	{
		if(this.window == null) {
			this.initDisclaimerWindow(title);
		}
		this.window.show();
		this.window.center();
	},
	getAQuote: function(ccode) {		
		var target='gaq';
		var linkInfo=eval('this.integrationVehMap.'+ccode);
		var vehicle = '';
		var year = '';
		var model = '';
		if (linkInfo) {
			vehicle = linkInfo.model;
			year = linkInfo.year;
			model = escape(linkInfo.vehicle);
		}
		
		var params='?target='+target+'&vehicle='+vehicle+'&year='+year+'&model='+model;
		var externalFullUrl=ASC.cfg.getBridgeUrl() +params;
		window.location.href=externalFullUrl;		
	},
	compareToComp: function(ccode) {		
		var target='compcomp';
		var linkInfo=eval('this.integrationVehMap.'+ccode);
		var vehicle = '';
		var year = '';		
		if (linkInfo) {
			vehicle = linkInfo.model;
			year = linkInfo.year;
		}	
		brandPopup(target,vehicle,linkInfo.year);		
	},
	
	setPageMetrics: function( page ){
		var mlc = this.lang+'/'+this.mlcYear+'/'+this.mlcVehicle;
		if( this.bmoPageName && this.bmoPageName !=''){
			mlc = mlc + '/build_my_own/'+this.bmoPageName;
		}
		mlc = mlc + '/specifications/'+page;
		ASC.Chrysler.trackPageMetrics(mlc);
	},
	
	setSelectedVehicle: function(modelYear){
		var popupParam = Page.isPopup? "&popup=true" : "";
		var viewTypeCode = Page.SNIViewType == "list" ? "L":"M";
		var sniParam  = Page.fromSNI == "true" ? "&fromSNI=true&viewTypeCode="+viewTypeCode : "";
		if(Page.isPopup)
			parent.Page.changeWindowTitle(modelYear);
		window.location = ASC.cfg.getContextPath()+'/vsmc/vehicleSpecModels.do?modelYearCode='+modelYear+popupParam+sniParam;
	}
	
}); 

ASC.onReady(Page.init, Page);