/*
 * Ext JS Library 2.2.1
 * Copyright(c) 2006-2009, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://extjs.com/license
 */

var item_id;
var email_compose_win;
var panel_friends_list;
var filter_by_city_network;
var friends_view;
var invite_view;
var email_view;
var search_by_name;
var store_friends_list = '';
var store_invite_list = '';
var store_email_list = '';

function insert_emails(){
	MyRecordType = Ext.data.Record.create(['email']);
	if (document.getElementById("external_emails_list").value!='')
	{
		var el = document.getElementById("external_emails_list").value;
		var arr_email = el.split(",");
	
		for(var i=0;i<arr_email.length;i++){
	 		myrec = new MyRecordType({"email":arr_email[i]});
			store_email_list.add(myrec);
		}
		
		document.getElementById("invite_dataview_panel").style.display="block";
		document.getElementById("num_invites_glocals").innerHTML = store_invite_list.data.length;
	}
	document.getElementById("external_emails_list").value = '';
};

function add_all_friends() {
	store_friends_list.each(friends_to_invite);
	store_friends_list.removeAll();

	document.getElementById("num_invites_glocals").innerHTML = store_invite_list.data.length;
}

function friends_to_invite(record) {
	store_invite_list.add(record);
}

function remove_all_friends() {
	store_invite_list.each(invite_to_friends);
	store_invite_list.removeAll();

	document.getElementById("num_invites_glocals").innerHTML = store_invite_list.data.length;
}

function invite_to_friends(record) {
	store_friends_list.add(record);
}

function remove_all_emails() {
	store_email_list.removeAll();

	document.getElementById("num_invites_glocals").innerHTML = store_invite_list.data.length;
}

Ext.onReady(function(){
    var xd = Ext.data;

    var filter =  function(){
		var filter = Ext.getCmp('filter');
		store_friends_list.filter('sf_name', filter.getValue());
	};
	
	var filter_city_network =  function(){
		var filter = Ext.getCmp('filter_by_network');
		store_friends_list.filter('sf_network_id', filter.getValue());
	};
	
    store_friends_list = new Ext.data.Store({
        proxy: new Ext.data.HttpProxy({
            url: g_params["base_domain"]+'/email/compose/&friend_invite_list',
            method: 'post'
        }),
        reader: new Ext.data.JsonReader({
            root: 'names',
            totalProperty: 'totalCount',
            id: 'post_id'
        }, [
            {name: 'sf_name'},
            {name: 'sf_picture'},
            {name: 'sf_network_id'},
            {name: 'sf_id'}
        ])
    });
    
    store_invite_list = new Ext.data.Store({
        reader: new Ext.data.JsonReader({
            root: 'names',
            totalProperty: 'totalCount',
            id: 'post_id'
        }, [
            {name: 'sf_name'},
            {name: 'sf_picture'},
            {name: 'sf_id'}
        ])
    });

    store_email_list = new Ext.data.Store({
        reader: new Ext.data.JsonReader({
            root: 'names',
            totalProperty: 'totalCount',
            id: 'post_id'
        }, [
            {name: 'email'}
        ])
    });
    
    var tpl_friends_list = new Ext.XTemplate(
		'<tpl for=".">',
		'<div class="name-search-item-invite-dataview">',
			'<div class="name-search-item-photo"><img src="{sf_picture}" alt="{sf_name}" /></div>',
			'<div class="name-search-item-name">{sf_name}</div>',
		'</div>',
		'</tpl>'
	);
	
	 var tpl_invite_list = new Ext.XTemplate(
		'<tpl for=".">',
        '<div class="list_name">',
	    	'{sf_name}&nbsp;<span class="list_x">x</span>&nbsp;<span class="list_divider">|</span>',
	    '</div>',
        '</tpl>'
	);

	 var tpl_email_list = new Ext.XTemplate(
		'<tpl for=".">',
        '<div class="list_name">',
	    	'{email}&nbsp;<span class="list_x">x</span>&nbsp;<span class="list_divider">|</span>',
	    '</div>',
        '</tpl>'
	);

	friends_view = new Ext.DataView({
        id: 'friends_view',
        store: store_friends_list,
        tpl: tpl_friends_list,
        autoHeight:true,
        multiSelect: false,
        overClass:'name-search-item-invite-dataview-selected',
        itemSelector:'div.name-search-item-invite-dataview',
        emptyText: 'No friends to display',
        autoScroll: true,
        listeners: {
        	click: {
        		fn:function (dv,index, node,e ){
        			var record = friends_view.getRecord(node);
        			store_friends_list.remove(record);
        			store_invite_list.add(record);
        			document.getElementById("num_invites_glocals").innerHTML = store_invite_list.data.length;
        		}
        	}
        },
		loadingText: 'Loading... Please wait...'
    });
    
        
    invite_view = new Ext.DataView({
        id: 'invite_view_friends',
        store: store_invite_list,
        tpl: tpl_invite_list,
        autoHeight:true,
        multiSelect: true,
        overClass:'x-view-over',
        itemSelector:'div.list_name',
        emptyText: '',
        autoScroll: true,
        border:false,
        listeners: {     
        	click: {
        		fn:function (dv,index, node,e ){
        			var record = invite_view.getRecord(node);
        			store_invite_list.remove(record);
        			store_friends_list.add(record);
        			document.getElementById("num_invites_glocals").innerHTML = store_invite_list.data.length;
        		}
        	}
        },
		loadingText: 'Loading... Please wait...'
    });
        
    email_view = new Ext.DataView({
        id: 'email_view',
        store: store_email_list,
        tpl: tpl_email_list,
        autoHeight:true,
        multiSelect: true,
        overClass:'x-view-over',
        itemSelector:'div.list_name',
        emptyText: 'Empty recipient list.',
        autoScroll: true,
        border:false,
        listeners: {     
        	click: {
        		fn:function (dv,index, node,e ){
        			var record = email_view.getRecord(node);
        			store_email_list.remove(record);
        			document.getElementById("num_invites_glocals").innerHTML = store_invite_list.data.length;
        		}
        	}
        },
		loadingText: 'Loading... Please wait...'
    });
        
  search_by_name = new Ext.form.TextField({
        hideLabel: true,
        id: 'filter',
        selectOnFocus: true,
        emptyText: 'Search Friends',
        width: 162,
        height:(Ext.isIE ? 20 : 18),
    	listeners: {
    		'render': {fn:function(){
	    		Ext.getCmp('filter').el.dom.style.marginTop = '1px';
		    	Ext.getCmp('filter').getEl().on('keyup', function(){
		    		filter();
		    	}, this, {buffer:500});
    		}, scope:this}
    	} 
    });    
    
    filter_by_city_network = new Ext.form.ComboBox({
        hideLabel: true,
		id: 'filter_by_network',
		typeAhead: true,
		triggerAction: 'all',
		width: 173,
        height:(Ext.isIE ? 20 : 18),
		mode: 'local',
    	displayField:'label',
    	valueField:'id',
        emptyText: 'Filter Networks',
    	store: new Ext.data.SimpleStore({
			        fields: ['id', 'label'],
			        data : [['', 'All Cities/Networks'],['1', 'Geneva'],['2', 'Lausanne'],['3', 'Zurich'],['4', 'Basel'],['6', 'Bern']]
			    }),
	    listeners: {
			'select': {fn:filter_city_network, scope:this}
	    }
	});
    
    panel_friends_list = new Ext.Panel({
        id:'friends_list_panel',
        frame:false,
        border: false,
        width: 160,
        autoHeight:true,
        items:[friends_view]
    });
    
	email_compose_win = new Ext.Window({
		title: 'Send to Friends',
		cls: 'email_compose',
		border: false,
		bodyBorder: false,
		
		bodyStyle: 'padding-left: 13px; padding-right:13px;',
		shadow: false,
		resizable: false,
        width       : 650,
		autoHeight      : true,
        closeAction :'hide',
		layout: 'fit',
		items: {
			xtype: 'form',
			cls: 'feedback-form',
			border: false,
			labelAlign: 'left',
			labelWidth:57,
			bodyBorder: false,
			autoHeight: true,
			defaults: {hideMode: 'offsets'},
			items: [{
				layout:'column',
				border:false,
				width:650,
				items:[{
					layout:'form',
					border:false,
					width:408,
					items:[{
						border:false,
						html: '<div class="left send_to_friends_label">Select glocals friends from the list on the right [<span id="num_invites_glocals">0</span>]</div><div class="right"><a href="javascript:remove_all_friends();">Remove all</a></div>'
					},
						invite_view
					,{
						layout:'form',
						border:false,
						width:408,
						id:'subject_body_panel',
						items:[{
							border:false,
							html: '<div class="send_to_friends_label">Enter email addresses of friends not on glocals (separate with comma)</div>'
						},{
							xtype:'textarea',
							hideLabel: true,
							name: 'external_emails_list',
							id: 'external_emails_list_friends',
							height:50,
							width:408
						},{
							border:false,
							html: '<div class="send_to_friends_label">Add a personal message (optional)</div>'
						},{
							xtype:'htmleditor',
							enableAlignments: false,
							enableColors: false,
							enableFont: false,
							enableFontSize: false,
							enableFormat: false,
							enableLinks: false,
							enableLists: false,
							enableSourceEdit: false,
							id: 'em_body',
							hideLabel: true,
							height:175,
							width:408,
							listeners: {
				            	activate: function(e) {
				            		e.execCmd('delete');
				            	}
							}
						}]
					}]
				},{
					border:false,
					id: 'inner_middle_line_friends',
					width:31,
					html: ''
				},{
					layout:'form',
					border:false,
					width:204,
					items:[{
						layout:'column',
						border:false,
						width:204,
						height:24,
						items:[
							search_by_name,
						{
					    	border: false,
					    	width:19,
			        		html:'<div id="search_icon"><img src="'+g_params["static_media_domain"]+'/public/search-box-btn.jpg" /></div>'
						}]
					},
						filter_by_city_network,
		   	        {
				    	border: false,
		        		html:'<div class="ext_field">Select one by one or <a href="javascript:add_all_friends();">send to all</a></div>'
		   	        },{
		   	        	layout:'column',
		   	        	border:false,
		   	        	id:'friends_dataview_panel',
		   	        	items:[panel_friends_list]
		   	        }]
				}]
			}],
			buttonAlign: 'left',
			buttons: [{
				minWidth: 40,
				icon: g_params["static_media_domain"]+'/public/global/popup/btn-send-message.png',
				cls: "send-btn x-btn-text-icon",
				handler: function() {
					var action_ids = '';
					for (i=0;i<store_invite_list.data.length;i++)
					{
						action_ids += store_invite_list.data.items[i].data.sf_id+'\t';
					}
					var emails = Ext.getCmp("external_emails_list_friends").getValue();
					if (!emails)
						var count_sent = 0;
					else {
						var email_count = emails.split(',');
						var count_sent = email_count.length;
					}
					count_sent = count_sent + store_invite_list.data.length;
		        	$('.x-panel-btns').hide();
					if (action_ids != '' || emails != ''){
						Ext.Ajax.request({
							url: location.href+'&send_to_friends',
							params: { 
								'form[em_body]':  Ext.getCmp("em_body").getValue(),
								'form[em_type]':  1,
								'form[em_bcc_list]': action_ids,
								'form[emails]': emails,
								'form[id]': item_id
							},
							method: 'post',
							callback: function(options, success, response){
								if (success==true){
				                	store_invite_list.removeAll();
									document.getElementById("num_invites_glocals").innerHTML = 0;
									Ext.getCmp("em_body").setValue('');
									Ext.getCmp("filter").setValue('');
									Ext.getCmp("filter_by_network").setValue('');
									Ext.getCmp("external_emails_list_friends").setValue('');
						        	$('.x-panel-btns').show();
			                        email_compose_win.hide();
									Ext.MessageBox.show({
					   					title:'Message Sent',
					   					msg: 'Your message was sent to '+count_sent+(count_sent>1 ? ' people.' : ' person.'),
										buttons: Ext.MessageBox.OK,
									   width: 364,
									  cls:'feedbackm'
									});
								}
							}
						}); 
					}
					else {
						alert('Please choose someone to send your message to.');
					}
		        }
            },{
				minWidth: 50,
				icon: g_params["static_media_domain"]+'/public/global/popup/btn-cancel.jpg',
				cls: "cancel-btn x-btn-text-icon",
                handler  : function(){
                    email_compose_win.hide();
                }
            }]
		}
    });
});


function send_to_friends(id){
	if(fake_user){
		open_login_popup();
		return;
	}
	
	item_id = id;
	store_invite_list.removeAll();
    store_friends_list.load();

	Ext.getCmp("em_body").setValue('');
	
    email_compose_win.show();

    document.getElementById("num_invites_glocals").innerHTML = 0;
}