var statusHelpText = '<h2>Hulp bij Activiteiten-beheer, Persreizen-status</h2>';
	statusHelpText += '<a href="#" onclick="$(this.parentNode).hide()" style="float:right;">[X]</a>';
	statusHelpText += '<p>Hieronder ziet u een overzicht van de reacties op uw uitnodiging.</p>';
	
	activity.persreisStatus = Class.create(activity, {
		initialize:function($super, container, controller){
			$super(container, controller);
			this.instID = 'activity.persreisStatus.' + parseInt(Math.random()*1000000);
		},
		
		openStatus : function(persreisID){
			// get metadata
			this.persreisID = persreisID;
			var RPCObj = new rpc;
			RPCObj.debug = true;
			RPCObj.attachWaiter(this.waiter, this);
			RPCObj.attachUnWaiter(unWaiter, this);
			RPCObj.createCall('persclubPersreis', this.writeStatus.bind(this), this);
			RPCObj.call('getStatus', "mailingID=" + persreisID);
			
		},
		
		writeStatus : function(req){
			this.persreis = req.responseJSON.persreis;
			this.invites = req.responseJSON.invites;
			this.srcBasket = req.responseJSON.basket;
			this.noReponseYet = req.responseJSON.invites;
			this.basketItems = $H({});
			this.setBasketItems();			
			this.rowIdx = 0;
			
			this.container.update('');
			// add help container:
			var helpContainer = new Element('div', {id:this.instID + "_helpContainer", className:'inlineHelp'}).update(statusHelpText);
			helpContainer.hide();
			this.container.insert(helpContainer);
			var helpLink =  new Element('a', {href:'#', style:"float:right;"}).update('Help');
			this.container.insert(helpLink);
			helpLink.observe('click',
				(function(){$(this.instID + "_helpContainer").show()}).bind(this)
			)
			
			var div = new Element('div', {className:'invitationStatusPage'}).update('<h2>Status voor Persreis:' + this.persreis.name + "</h2>");
			this.container.insert(div);
			if (this.persreis.dtSent == '0000-00-00 00:00:00'){
				// invites have not been sent yet
				div.insert("De uitnodigingen zijn nog niet verzonden.");
			}else{
				div.insert("De uitnodigingen zijn verzonden op " + this.persreis.dtSent + '.');				
			}
			this.writeHead(div);
			var dataDiv = new Element('div', {className:'dataContainer'});
			div.insert(dataDiv);
			
			this.invites.each(
				(function(invObj){
					this.writeRow(invObj, dataDiv);
					this.rowIdx++;
				}).bind(this)
			)
			$('activityEditor').style.height = (parseInt($('activityEditor').getHeight()) + 500) + 'px';
			var exportContainer = new Element('a', {href:"#", id:this.instID + "_exportContainer"}).update("lijst downloaden");
			this.container.insert(exportContainer);
			exportContainer.observe('click', this.exportList.bind(this))
		},
		
		writeRow : function(invObj, container){
			var row = new Element('div', {className:'inviteRow'});
			container.insert(row);
//			if ((this.rowIdx % 2) == 0) row.className = "inviteRow unev";
			
			var item = new Element('span', {className:'field tools', alt:name});
			row.insert(item);
			this.writeTools(item, invObj);

			var name = invObj.first_name + ' ' + invObj.suffix + " " + invObj.last_name;
			var item = new Element('span', {className:'field', alt:name}).update(name);
			row.insert(item);

			var email = '&nbsp';
			if (invObj.email) email = invObj.email; 
			var item = new Element('span', {className:'field', alt:email}).update(email);
			row.insert(item);

			var mobiel = '&nbsp';
			if (invObj.phone) mobiel = invObj.phone; 
			var item = new Element('span', {className:'field', alt:mobiel}).update(mobiel);
			row.insert(item);

			var fromList = new Element('img', {src:"/images/red.png", className:'dot'});
			if (this.isInviteFromList(invObj)) {
				fromList.src = "/images/green.png";
			}
			var item = new Element('span', {className:'field small'}).update(fromList);
			row.insert(item);

			var collegue = new Element('img', {src:"/images/red.png", className:'dot'});
			if (invObj.type=='collegue'){
				collegue.src = "/images/green.png";
			}
			var item = new Element('span', {className:'field small'}).update(collegue);
			row.insert(item);

			var willgo = new Element('img', {src:"/images/red.png", className:'dot'});
			if (invObj.willgo == '1'){
				willgo.src = "/images/green.png";
			}
			var item = new Element('span', {className:'field small'}).update(willgo);
			row.insert(item);
			
			var checkbox = new Element('input', {type:'checkbox', id:invObj.id+"_maygo"});
			checkbox.invObj = invObj;
			var item = new Element('span', {className:'field small'}).update(checkbox);
			row.insert(item);
			checkbox.observe('click', this.setMayGo.bindAsEventListener(this))
			if (invObj.maygo == '1') checkbox.checked = true;
			
			var toggleableLayer = new Element('div', {className:'inlineInvitationDetails', id:invObj.id + '_inlineInvitationDetails'});
			row.insert(toggleableLayer);
			toggleableLayer.hide();
			
			// last item get a line extra:
			item.setStyle("border-right:1px solid #DDDDDD;");
		},
		
		writeHead : function(container){
			var row = new Element('div', {className:'head'}).update();
			container.insert(row);
			
			var item = new Element('span', {className:'field tools'}).update('tools');
			row.insert(item);
			
			var item = new Element('span', {className:'field'}).update('Naam');
			row.insert(item);
			var item = new Element('span', {className:'field'}).update('Email');
			row.insert(item);
			var item = new Element('span', {className:'field'}).update('Mobiel');
			row.insert(item);
			var item = new Element('span', {className:'field small'}).update('Lijst?');
			row.insert(item);
			var item = new Element('span', {className:'field small'}).update('Collega');
			row.insert(item);
			var item = new Element('span', {className:'field small'}).update('Wil mee');
			row.insert(item);
			var item = new Element('span', {className:'field small'}).update('Mag mee');
			row.insert(item);
			// set extra line at last item
			item.setStyle("border-right:1px solid #AAAAAA;");
		},
		
		writeTools : function(item, invObj){
			var container = new Element('div', {className:'toolsContainer'});
			item.insert(container);
			
			// view:
			var img = new Element('img', {src:'/images/view.png'});
			img.invObj = invObj;
			container.insert(img);
			img.observe('click', this.viewInvitation.bindAsEventListener(this));

//			// edit:
			var img = new Element('img', {src:'/images/edit.gif'});
			img.invObj = invObj;
			container.insert(img);
			img.observe('click', this.editInvitation.bindAsEventListener(this));

			// mail: (future)
//			var img = new Element('img', {src:'/images/email.gif'});
//			img.invObj = invObj;
//			container.insert(img);
//			img.observe('click', this.emailInvitation.bindAsEventListener(this));

			// delete:
			var img = new Element('img', {src:'/images/del.gif'});
			img.invObj = invObj;
			container.insert(img);
			img.observe('click', this.deleteInvitation.bindAsEventListener(this));

		},
		
		getInlineContainer : function(invObj){
			$$('.inlineInvitationDetails').each(
				function(elem){
					if (elem.visible()) elem.hide();
				}	
			)
			$(invObj.id + '_inlineInvitationDetails').update('');
			$(invObj.id + '_inlineInvitationDetails').show();
			return $(invObj.id + '_inlineInvitationDetails');			
			
		},
		
		viewInvitation : function(e){
			var invObj = e.element().invObj;
			var container = this.getInlineContainer(invObj);
			var closer  = new Element('img', {src:"/images/del_icon.png", align:'right', style:'z-index:99;cursor:pointer'});
			container.insert(closer);
			closer.observe('click', (function(){container.update('');container.hide()}).bind(this))
			
			this.writeViewField(container, 'Naam', invObj.first_name + " " + invObj.suffix + " "  + invObj.last_name);
			this.writeViewField(container, 'Email', invObj.email);
			this.writeViewField(container, 'Mobiel', invObj.phone);
			if (invObj.willgo == "0"){
				this.writeViewField(container, 'Reden ', invObj.why);
			}
			
			for (index in invObj){
				if (index.indexOf('custom_') > -1){
					var namedIndex = index.replace('custom_', '');
					this.writeViewField(container, namedIndex, invObj[index]);
				}
			}
//			this.writeViewField(container, 'Paspoort-nummer', invObj.passport + "( naam : " + invObj.passport_name + ")");
//			this.writeViewField(container, 'Opmerkingen ', invObj.remarks);
			
			// src invitation (from basket);
			if (!invObj.journalist_id || !invObj.journalist){
				// create selection list to connect response to basketitem;
				var row = new Element('div', {className:'row'});
				container.insert(row);
				var item = new Element('span', {className:'title'}).update('Hoort bij uitnodiging aan : ');
				row.insert(item);
				var item = new Element('span', {className:'data'}).update(invObj.email_original);
				row.insert(item);
			}else{
				var row = new Element('div', {className:'row'});
				container.insert(row);
				var item = new Element('span', {className:'title'}).update('Hoort bij uitnodiging aan :');
				row.insert(item);
				if (invObj.journalist.tussenvoegsel != 'undefined'){
					var naam =invObj.journalist.voornaam + " " + invObj.journalist.tussenvoegsel + " " + invObj.journalist.achternaam;
				}else{
					var naam =invObj.journalist.voornaam + " " + invObj.journalist.achternaam;
				}
				var link = new Element('a',{id:invObj.journalist.journalist_id + "journalist", href:"#"}).update(naam)
				var item = new Element('span', {className:'data'}).update(link);
				row.insert(item);
				link.jID = invObj.journalist.journalist_id;
				link.observe('click', this.showJournalist.bindAsEventListener(this));
				var journalistContainer = new Element('div', {id:invObj.journalist.journalist_id + "_journalistContainer"});
				journalistContainer.hide();
				container.insert(journalistContainer);
			}
		},
		
		showJournalist : function(event){
			if ( $(parseInt(event.element().id) + "_journalistContainer").visible() ){
				$(parseInt(event.element().id) + "_journalistContainer").hide();
				return;
			}else{
				var jID = parseInt(event.element().jID);
				var func = (function(req){
					this._showJournalist(req, parseInt(event.element().id));
				}).bind(this)
				var RPCObj = new rpc;
	//			RPCObj.debug = true;
				RPCObj.attachWaiter(this.waiter, this);
				RPCObj.attachUnWaiter(this.unWaiter, this);
				RPCObj.createCall('persclubSearch', func, this);
				RPCObj.call('getJournalistHTML', "jID=" + jID);
			}
		},
		
		_showJournalist: function(req, mediaID){
			var container = $(mediaID + "_journalistContainer");
			container.update(req.responseText);
			container.show();
//			new Effect.SlideDown(container, {duration:'0.3'});
		},		
		
		writeViewField : function(container, title, value){
			var row = new Element('div', {className:'row'});
			container.insert(row);
			var item = new Element('span', {className:'title'}).update(title);
			row.insert(item);
			var item = new Element('span', {className:'data'}).update(value);
			row.insert(item);
		},
		
		editInvitation : function(e){
			var invObj = e.element().invObj;
			var container = this.getInlineContainer(invObj);
			var closer  = new Element('img', {src:"/images/del_icon.png", align:'right', style:'z-index:99;cursor:pointer'});
			container.insert(closer);
			closer.observe('click', (function(){container.update('');container.hide()}).bind(this))
			

			this.writeEditField(container, 'Voornaam', 'first_name',invObj );
			this.writeEditField(container, 'Tussenvoegsel', 'suffix',invObj );
			this.writeEditField(container, 'Achternaam', 'last_name',invObj );
			this.writeEditField(container, 'Email', 'email',invObj );
			this.writeEditField(container, 'Mobiel', 'phone',invObj );
//			this.writeEditField(container, 'Paspoort-nummer', 'passport',invObj );
//			this.writeEditField(container, 'Naam op paspoort', 'passport_name', invObj );
			
			// add save button:
			var btn = new Element('button').update('opslaan');
			container.insert(btn);
			btn.invObj = invObj;
			btn.observe('click', this.saveInvitation.bindAsEventListener(this));
			
			return;
		},
		
		saveInvitation: function(e){
			var btnParentContainer = $(e.element().parentNode);
			var invObj = e.element().invObj;
			
			var RPCObj = new rpc;
			RPCObj.debug = true;
			RPCObj.createCall('persclubPersreis', '', this);
			RPCObj.setMethod('updateInvitation');

			RPCObj.attachWaiter(this.waiter, this);
			RPCObj.attachUnWaiter(this.unWaiter, this);
			
			for (token in invObj){
				if ($(invObj.id + '_' + token)){
					var value = $(invObj.id + '_' + token).getValue();
					value = '<![CDATA[' + encodeURIComponent(value) + " ]]>";
					RPCObj.addArgument(token, value);
				}
			}
			RPCObj.addArgument('id', invObj.id);
			RPCObj.attachWaiter(this.waiter, this);
			RPCObj.attachUnWaiter(this.unWaiter, this);
			RPCObj.setCallback(this.reload.bind(this));
			RPCObj.call();			
		},
		
		reload : function(){
			this.openStatus(this.persreisID);
		},
		
		writeEditField : function(container, title, key, invObj){
			var row = new Element('div', {className:'row'});
			container.insert(row);
			var item = new Element('span', {className:'title'}).update(title);
			row.insert(item);
			var item = new Element('input', {type:'text', value:invObj[key], id:invObj.id + '_' + key, className:'data'});
			row.insert(item);
		},
		

		
//		emailInvitation : function(e){
//			var invObj = e.element().invObj;
//			console.log(invObj);
//		},
		
		deleteInvitation : function(e){
			if (confirm('Weet u het zeker?')){
				var invObj = e.element().invObj.id;
				var RPCObj = new rpc;
				RPCObj.debug = true;
				RPCObj.attachWaiter(this.waiter, this);
				RPCObj.attachUnWaiter(unWaiter, this);
				RPCObj.createCall('persclubPersreis', this.reload.bind(this), this);
				RPCObj.call('deleteInvitation', "invID=" + invObj);
			}
		},

		
		isInviteFromList : function(invObj){
			var bool = false;
			var found = '';

			if (invObj.journalist_id){
				this.basketItems.keys().each(
					(function(jID){
						if (jID == invObj.journalist_id){
							invObj.journalist = this.basketItems.get(jID);
							bool = true;
						}
					}).bind(this)
				)
			}
			return bool;
		},
		
		setBasketItems : function(){
			// woopydeloopy!
			this.srcBasket.each(
				(function(basket){
					if (basket.data[0]){
						if (basket.data[0].items){
							basket.data[0].items.each(
								(function(basketItem){
									if (basketItem.journalist){
										this.basketItems.set(basketItem.journalist.journalist_id, basketItem.journalist); 
									}
								}).bind(this)
							)
						}
					}
				}).bind(this)
			)
		},
		
		setMayGo : function(e){
			var elem = e.element();
			var invObj = elem.invObj;
		
			var RPCObj = new rpc;
			RPCObj.debug = true;
			RPCObj.attachWaiter(this.waiter, this);
			RPCObj.attachUnWaiter(unWaiter, this);
			RPCObj.createCall('persclubPersreis', this._setMayGo.bind(this), this);

			if (elem.getValue() == 'on'){
				RPCObj.call('setMayGo', "invID=" + invObj.id, "mayGo=1");	
			}else{
				RPCObj.call('setMayGo', "invID=" + invObj.id, "mayGo=0");
			}
		},
		
		_setMayGo : function(req){
			
		},
		
		exportList : function(){
			var iframe = new Element('iframe', {width:'0',height:'0', frameborder:'0', name:this.instID + '_download', id:this.instID + '_download', src:''});
			$(document.body).insert(iframe);
			iframe.setAttribute('src', 'index.php?&action=persclubPersreis&rpc=1&xmlReq=<command><call><method>exportInvitations</method><arg>persreisID=' + this.persreisID + '</arg></call></command>')
		}
		
	})