var albums_store = "";

Ext.onReady(function(){
	Ext.QuickTips.init();
	
	var albums_tpl = new Ext.XTemplate(
		'<tpl for=".">',
		'<tpl if="ev_start_row">',
		'<div class="album_row">',
		'</tpl>',
			'<div class="album_event" id="event_{ev_id}">',
				'<div class="album_event_pic">',
					'<a href="{ev_photo_link}"><img src="'+g_params["site_base_domain"]+'{ev_picture}" alt="{ev_title}" /></a>',
				'</div>',
				'<div class="album_event_title"><a href="{ev_link}" ext:qtip="{ev_full_title}">{ev_title}</a></div>',
				'<div class="album_event_subtitle">',
					'<div class="details">',
						'{ev_event_date} by {ev_poster}<br />',
					'</div>',
				'</div>',
				'<div class="album_event_text">',
					'<div class="details">',
						'{ev_photos} Photos | {ev_views} views<br />',
						'Updated {ev_photo_date}',
					'</div>',
				'</div>',
			'</div>',
		'<tpl if="ev_end_row">',
		'</div>',
		'</tpl>',
		'</tpl>'
	);
	
	albums_store = new Ext.data.JsonStore({
		url: location.href+'&get_albums',
		root: 'albums',
		totalProperty: 'totalCount',
		fields:[
			'ev_id',
			'ev_picture',
			'ev_title',
			'ev_full_title',
			'ev_link',
			'ev_event_date',
			'ev_photo_link',
			'ev_photo_date',
			'ev_poster',
			'ev_views',
			'ev_photos',
			'ev_start_row',
			'ev_end_row'
		],
		baseParams: {
			'attending_filter':attending_filter, //-1 for My Activity Albums, 0 for main page
			'form[mem_network]':network //-1 for My Activity Albums, anything for main page
		}
	});
	albums_store.load();
	
	var albums_panel = new Ext.Panel({
		id:'albums_view',
		frame: false,
		border: false,
		width: 731,
		autHeight: true,
		collapsible: false,
		layout: 'fit',
		tbar: new Ext.PagingToolbar({
			cls: 'paging_bar_full',
			id: 'paging_top',
			pageSize: 20,
		    displayMsg : 'Albums {0}-{1} of {2}',
		    displayInfo: true,
		    emptyMsg: 'No albums to display',
			store: albums_store
		}),
		bbar: new Ext.PagingToolbar({
			cls: 'paging_bar_full',
			id: 'paging_bottom',
			pageSize: 20,
		    displayMsg : 'Albums {0}-{1} of {2}',
		    displayInfo: true,
		    emptyMsg: 'No albums to display',
			store: albums_store
		}),
		items: new Ext.DataView({
			store: albums_store,
			autoHeight:true,
			tpl: albums_tpl,
			id: 'events_photos_dataview',
			multiSelect: false,
			overClass:'event-over',
			itemSelector: 'div.album_event',
			emptyText: 'No albums to display',
			loadingText: 'Loading... Please wait...'
		})
	});

   	albums_panel.render('albums_list');
});