classified_store = '';

Ext.onReady(function(){
	Ext.QuickTips.init();
	
	var classified_tpl = new Ext.XTemplate(
		'<tpl for=".">',
		'<tpl if="column_headings">',
			'<div id="function_bar">',
				'<div id="classified_blank" class="function_title">',
					'&nbsp;',
				'</div>',
				'<div id="classified_title_extra_long" class="function_title">',
					'Title, Posting Date, &amp; Category',
				'</div>',
				'<div id="classified_location" class="function_title">',
					'Location',
				'</div>',
				'<div id="classified_photos" class="function_title">',
					'Photos',
				'</div>',
				'<div id="classified_status" class="function_title">',
					'Status',
				'</div>',
			'</div>',
		'</tpl>',
		'<tpl if="expired">',
			'<div id="expired_bar">Expired Ads <span>- You can repost expired ads by editing them.</span></div>',
		'</tpl>',
		'<div class="classified_div" id="classified_{id}">',
			'<div class="classified_fields classified_checkbox">',
				'<input type="checkbox" name="classified[{id}]" />',
			'</div>',
			'<div class="classified_fields classified_title_extra_long">',
				'<div class="classified_title_title"><a href="javascript:details({id})">{title}</a></div><br />',
				'<div class="classified_title_text">Posted {date} in {category} > {sub_category}</div>',
			'</div>',
			'<div class="classified_fields classified_location">',
				'<tpl if="location"><span>{location}</span><br /></tpl>',
				'<tpl if="city">{city}</tpl>',
			'</div>',
			'<div class="classified_fields classified_photos">',
				'<tpl if="photos">',
					'<img src="'+g_params["static_media_domain"]+'/public/modules/board/photo.png" />',
				'</tpl>',
			'</div>',
			'<div class="classified_fields classified_status" id="classified_status_{id}">',
				'<tpl if="status">{status}</tpl>',
			'</div>',
		'</div>',
		'<div class="classified_details_div" id="classified_details_{id}">',
			'<div class="desc_side">',
				'<div class="description">',
					'{description}',
				'</div>',
				'<div class="desc_spacer">&nbsp;</div>',
				'<div class="description">',
					'<div class="location">',
						'<span class="desc_title">Location:</span> {location}, {city}',
					'</div>',
				'</div>',
				'<div class="desc_photos">',
					'<tpl if="photos">{[Ext.ux.Lightbox.register("a.classified_gallery_"+values.id+"", true)]}</tpl>',
					'<tpl if="photo1"><a href="/sites/glocals{photo1}" class="classified_gallery_{id}"><img src="/sites/glocals{photo1}" /></a></tpl>',
					'<tpl if="photo2"><a href="/sites/glocals{photo2}" class="classified_gallery_{id}"><img src="/sites/glocals{photo2}" /></a></tpl>',
					'<tpl if="photo3"><a href="/sites/glocals{photo3}" class="classified_gallery_{id}"><img src="/sites/glocals{photo3}" /></a></tpl>',
					'<tpl if="photo4"><a href="/sites/glocals{photo4}" class="classified_gallery_{id}"><img src="/sites/glocals{photo4}" /></a></tpl>',
				'</div>',
				'<div class="desc_links">',
					'<a href="javascript:send_message({mem_id},\'{mem_name_js}\',\'{mem_photo}\',get_ycoord(\'classified_{id}\'),{id},\'{title_js}\')"><img src="'+g_params["static_media_domain"]+'/public/members/mail.jpg" alt="" /></a>',
					'&nbsp;<a href="javascript:send_message({mem_id},\'{mem_name_js}\',\'{mem_photo}\',get_ycoord(\'classified_{id}\'),{id},\'{title_js}\')">Send {mem_first_name} a message</a>',
					'&nbsp;&nbsp;|&nbsp;&nbsp;',
					'{mark}',
					'&nbsp;&nbsp;|&nbsp;&nbsp;',
					'<a href="javascript:send_to_friends({id});">Send to Friends</a>',
					'&nbsp;&nbsp;|&nbsp;&nbsp;',
					'<a href="javascript:report_to_admin({id});">Report to Admin</a>',
				'</div>',
			'</div>',
			'<div class="poster_side">',
				'<div class="poster_row">',
					'<div class="post_photo">',
						'<a href="{mem_link}"><img src="{mem_photo}" alt="{mem_name}" /></a>',
					'</div>',
					'<div class="post_details">',
						'<span class="post_views">Views:</span> {views}<br /><br />',
						'Posted by:<br />',
						'<a href="{mem_link}">{mem_name}</a>',
					'</div>',
				'</div>',
				'<div class="poster_contact">',
					'<span class="desc_title">Contact Numbers:</span><br />{contact}',
				'</div>',
				'<div class="post_spacer">&nbsp;</div>',
				'<div class="post_message">',
					'<a href="javascript:send_message({mem_id},\'{mem_name_js}\',\'{mem_photo}\',get_ycoord(\'classified_{id}\'),{id},\'{title_js}\')"><img src="'+g_params["static_media_domain"]+'/public/members/mail.jpg" alt="" /></a>',
					'&nbsp;<a href="javascript:send_message({mem_id},\'{mem_name_js}\',\'{mem_photo}\',get_ycoord(\'classified_{id}\'),{id},\'{title_js}\')">Send {mem_first_name} a message</a>',
				'</div>',
				'<div class="post_spacer">&nbsp;</div>',
			'</div>',
		'</div>',
		'</tpl>'
	);
	
	classified_store = new Ext.data.JsonStore({
		url: location.href+'&get_classified_services',
		root: 'classifieds',
		totalProperty: 'totalCount',
		fields:[
    		'column_headings',
    		'id',
    		'title',
    		'title_js',
    		'date',
    		'category',
    		'sub_category',
    		'location',
    		'city',
    		'network',
    		'photos',
    		'status',
    		'description',
    		'photos',
    		'photo1',
    		'photo2',
    		'photo3',
    		'photo4',
    		'mark',
			'mem_id',
			'mem_link',
			'mem_name',
			'mem_name_js',
			'mem_first_name',
			'mem_photo',
			'views',
			'contact',
			'expired'
		],
		baseParams:({'form[bl_city_network]':bl_city_network})
	});
	classified_store.load();
	
	
	var classified_panel = new Ext.Panel({
		id:'classified_view',
		frame: false,
		border: false,
		width: 731,
		autHeight: true,
		collapsible: false,
		layout: 'fit',
		tbar: new Ext.PagingToolbar({
			cls: 'paging_bar_full',
			id: 'paging_top_full_long',
			pageSize: g_params["extjs_limit"],
		    displayMsg : '{0}-{1} of {2}',
		    displayInfo: true,
			store: classified_store
		}),
		bbar: new Ext.PagingToolbar({
			cls: 'paging_bar_full',
			id: 'paging_bottom_full_long',
			pageSize: g_params["extjs_limit"],
		    displayMsg : '{0}-{1} of {2}',
		    displayInfo: true,
			store: classified_store
		}),
		items: new Ext.DataView({
			store: classified_store,
			autoHeight:true,
			tpl: classified_tpl,
			id: 'main_dataview_full',
			multiSelect: false,
			overClass:'classified-over',
			itemSelector: 'div.classified_div',
			emptyText: 'No classifieds to display',
			loadingText: 'Loading... Please wait...'
		})
	});

   	classified_panel.render('classified_list');

    // turn on validation errors beside the field globally
    Ext.form.Field.prototype.msgTarget = 'side';

   	/*
     * ================  Simple form  =======================
     */
   	
   	function filter_services_sub_categories(record, id, master){
        if(record.data.master == master || record.data.master == -1){
                return true;
        }
        else{
                return false;
        }
	}

	function services_categories_store_filter_func(){
		services_categories_result_combo = Ext.getCmp('bl_yc_id');
		services_sub_categories_combo = Ext.getCmp('bl_yc_id_sub');
		services_sub_categories_combo.store.filterBy(filter_services_sub_categories.createDelegate(services_sub_categories_combo.store,[services_categories_result_combo.getValue()],true));
		services_sub_categories_combo.setValue(0);
	}

	var staticForm = new Ext.form.BasicForm('search');
    staticForm.add(
	    new Ext.form.ComboBox({
			transform: 'bl_yc_id',
			id: 'bl_yc_id',
		    displayField:'label',
		    valueField:'id',
		    layout: 'form',
		    value: Ext.get('bl_yc_id').getValue(),
		    store: new Ext.data.SimpleStore({
		         fields:['id', 'master', 'label'],
		         data: staticCombo.services_categories
		    }),
		    triggerAction:'all',
		    autoWidth: true,
		    mode:'local',
	    	listeners:{select:services_categories_store_filter_func}
	   }),
	    new Ext.form.ComboBox({
			transform: 'bl_yc_id_sub',
			id: 'bl_yc_id_sub',
		    displayField:'label',
		    valueField:'id',
		    layout: 'form',
		    value: Ext.get('bl_yc_id_sub').getValue(),
		    store: new Ext.data.SimpleStore({
		         fields:['id', 'master', 'label'],
		         data: staticCombo.services_sub_categories
		    }),
		    triggerAction:'all',
		    autoWidth: true,
		    mode:'local'
	   })
	);
	staticForm.render();
});