function cl(s){
		//console.log(s)
	}
	

	
	window.addEvent('domready', function(){ 
		if($('clientContent')){
			new ThePage('clientContent');
		}                                                                                                                                   
	})
	
	
	var DisplayTools = new Class({
		stripe: function(){
	    	this.el.getElements('div.record').each(function(e, i){          
				e.removeClass('dark')
				e.removeClass('active')
				if(i % 2 == 1){
					e.addClass('dark') 	
				}
			}.bind(this))	
	    },
	    
	    clearActive: function(){
	    	$$('div.record').each(function(e, i){          
				e.removeClass('active')
			}.bind(this))	
	    },
	    
	    stripeKeepActive: function(){
	    	this.el.getElements('div.record').each(function(e, i){          
				e.removeClass('dark')
				if(i % 2 == 1){
					e.addClass('dark') 	
				}
			}.bind(this))	
	    }	    
	})
	
	var ThePage = new Class({
		initialize: function(element){                                                                   
			this.element = $(element);
			this.initChildren();
			this.latestClient = 0;  	
		},
		initChildren: function(){
        	this.callCard = new CallCard({}, this);	
        	this.clients = new Clients('clientsCont', {}, this, this.callCard);
		    this.contacts = new Contacts('contactsCont', {}, this, this.callCard);
		    this.controls = new Controls('controlsCont', {}, this, this.callCard);  
		    		
		},
		clearAll: function(){
			$('clientRecords').empty(); 
			$('contactRecords').empty();        
			$('callCardInner').empty();
			this.callCard.el.setStyle('display','none')  
		},
		
		exportContents: function(source, medium){
			if(medium == 'print'){
				window.open("exportClientList.php?medium="+medium+"&source="+source+"&detailType="+this.callCard.contents+"&searchType="+this.controls.searchType+"&searchString="+this.controls.searchString+"&clientID="+this.contacts.lastClientID+"&id="+this.callCard.selectorID)  
			}else{
//				alert('Please provide feedback to KND as to what you\'d like to see in these csv reports')
				document.location = "exportClientList.php?medium="+medium+"&source="+source+"&detailType="+this.callCard.contents+"&searchType="+this.controls.searchType+"&searchString="+this.controls.searchString+"&clientID="+this.contacts.lastClientID+"&id="+this.callCard.selectorID;
			}
		}
	})
	
	
	/**************** CONTROLS **************/
	var Controls = new Class({
		Implements: Options,
		options:{color:'blue'},
		initialize: function(e, options, page, callCard){                                                                   
			this.setOptions(options),
			this.controlEl = $(e);
			this.initControls(page);
			this.callCard = callCard; 
			this.page = page;	
		},
		initControls: function(page){
			
			$('searchBtn').addEvent('click', function(event){

                this.deactivateAddBtns();
                this.page.clearAll(); 
                this.searchType = $('searchSelector').get('value');
                this.searchString = $('searchString').get('value');
                if(this.searchType == 'contacts'){
                    this.page.contacts.getContacts()
                    this.deactivateAddBtns();
                }else{
                	this.activateAddBtns();  
                	this.page.clients.searchClients() 
				} 
            }.bind(this));
            
            $('showAllBtn').addEvent('click', function(event){ 
	            //reactivate add buttons
	            this.page.clearAll(); 
	            this.searchType = "clients";
	            this.searchString = "";
	            this.page.clients.searchClients()
	            this.activateAddBtns();  
            }.bind(this));
		}, 
		
		activateAddBtns: function(){
			$('addClientBtn').disabled = false;
			$('addClientBtn').removeClass('inactive');
			$('addContactBtn').disabled = false;
			$('addContactBtn').removeClass('inactive');  
			
		},
		
		deactivateAddBtns: function(){
			$('addClientBtn').disabled = true;
			$('addClientBtn').addClass('inactive');
			$('addContactBtn').disabled = true;
			$('addContactBtn').addClass('inactive');
		}
	});
	

	/**************** CLIENTS **************/
	var Clients = new Class({
		Extends: DisplayTools,
		Implements: Options,
		options:{color:'blue'},
		initialize: function(e, options, page, callCard){                                                                   
			this.setOptions(options),
            this.el = $(e);
			this.page = page;
			this.callCard = callCard;
			this.initHeader();
			this.initAddBtn();
			this.initChildren(); 	
		},
		
		initChildren: function(){   
			this.el.getElements('div.record').each(function(e, i){     
				new ClientNode(e, this.options, this, this.page, this.callCard);      
			}.bind(this))     
			this.stripe();
		},
		
		initHeader: function(){
			this.el.getElements('a.exportBtn').each(function(e){     
                e.addEvent('click', function(event){ 
	                this.page.exportContents('client', 'csv')  
	            }.bind(this));   
            }.bind(this))
            
            this.el.getElements('a.printBtn').each(function(e){     
                e.addEvent('click', function(event){ 
	                this.page.exportContents('client', 'print') 
	            }.bind(this));   
            }.bind(this))			
		},
		
		initAddBtn: function(){
			this.el.getElements('input.addBtn').each(function(e){     
                e.addEvent('click', function(event){ 
	                this.callCard.setContents('client');
	                this.callCard.addNew();
	            }.bind(this));   
            }.bind(this))
		},
				
		searchClients: function(){
			new Request({	
			url:'includes/ajax/update_client.php', 
			async:'false', 
			onSuccess:  function(responseText){ 
							$('clientRecords').set('html', responseText);
							this.initChildren();                                    
						}.bind(this) 
			}).send("action=search_client_records&searchType="+this.page.controls.searchType+"&searchString="+this.page.controls.searchString);	
		}
	});
	  	
	/**************** CLIENT NODE **************/
	var ClientNode = new Class({
        Implements: Options,
        options:{color:'blue'},
        
        initialize: function(e, options, parent, page, callCard){
            this.setOptions(options),
            this.el = $(e);
            this.page = page;
            this.parent = parent;
            this.setMyID();
            this.callCard = callCard;
            this.initActions();
        },
        
        setMyID: function(){
			this.id = this.el.get('id').split('_');
        	this.id = this.id[1];
		},
		
        initActions: function(){
            
            this.el.getElements('div.title').each(function(e){     
            	e.addEvent('click', function(event){ 
	                this.activateClient()  
	            }.bind(this));       
            }.bind(this))
            
            this.el.getElements('a.deleteBtn').each(function(e){     
            	e.addEvent('click', function(event){ 
	                this.deleteClient(); 
	            }.bind(this));       
            }.bind(this))
        },
        
        activateClient: function(){
        	this.parent.stripe();
            //this.el.addClass('active');
            this.page.latestClient = this.id
            this.page.contacts.getContacts(this.id);
            this.callCard.setSelector(this.id) 
            this.callCard.getDetails('client');           
        },
        
        deleteClient: function(){
        	//make ajax call to delete client
      		if(confirm("Are you sure you want to delete this client and contacts related to it?")){
      			new Request({	
				url:'includes/ajax/update_client.php', 
				async:'false', 
				onSuccess:  function(responseText){        
								this.el.dispose();
								this.parent.stripeKeepActive();
								if(this.callCard.selectorID == this.id && this.callCard.contents == 'client'){
									this.callCard.el.setStyle('display', 'none')
								}
						}.bind(this) 
				}).send("action=delete_client&client_id="+this.id);      
			}
        }
    })
    
    /**************** CONTACTS **************/
	var Contacts = new Class({
		Extends: DisplayTools,
		Implements: Options,
		options:{color:'blue'},
		initialize: function(e, options, page, callCard){                                                                   
			this.setOptions(options), 
			this.el = $(e);
			this.id = this.el.get('id');
			this.page = page;
			this.lastClientID = 0;
			this.callCard = callCard;
			this.initHeader();
			this.initAddBtn();
			this.initChildren();  	
		},
		
		initAddBtn: function(){
			this.el.getElements('input.addBtn').each(function(e){     
                e.addEvent('click', function(event){ 
	                this.callCard.setContents('contact');
	                this.callCard.addNew();
	            }.bind(this));   
            }.bind(this))
		},
		
		initChildren: function(){		    
			this.el.getElements('div.record').each(function(e){     
				new ContactNode(e, this.options, this, this.page, this.callCard);	
			}.bind(this))       
		},
		
		initHeader: function(){
			this.el.getElements('a.exportBtn').each(function(e){     
                e.addEvent('click', function(event){ 
	                this.page.exportContents('contact', 'csv')  
	            }.bind(this));   
            }.bind(this))
            
            this.el.getElements('a.printBtn').each(function(e){     
                e.addEvent('click', function(event){ 
	               this.page.exportContents('contact', 'print') 
	            }.bind(this));   
            }.bind(this))			
		},
		
		updateRecords: function(){
			alert('updating');
		},
		                                  
		getContacts: function(clientID, defaultActive){
        	this.lastClientID = clientID
        	new Request({	
			url:'includes/ajax/update_client.php', 
			async:'false', 
			onSuccess:  function(responseText){ 
							$('contactRecords').set('html', responseText);
							this.initChildren();
							this.stripe();
							if($('contact_'+defaultActive)){
        						$('contact_'+defaultActive).addClass('active')	
        					}
						}.bind(this) 
			}).send("action=get_contact_records&searchType="+this.page.controls.searchType+"&searchString="+this.page.controls.searchString+"&client_id="+clientID);
        }                                                    
	})
	
	/**************** CONTACT NODE **************/  
    var ContactNode = new Class({
        Implements: Options,
        options:{color:'blue'},
        
        initialize: function(e, options, parent, page, callCard){
            this.setOptions(options),
            this.el = e;
            this.getMyID(); 
            this.callCard = callCard;
            this.page = page;
            this.parent = parent;
            this.initActions();
        },
        getMyID: function(){
			this.id = this.el.get('id').split('_');
        	this.id = this.id[1];
		},
        initActions: function(){
            this.el.getElements('div.title').each(function(e){     
            	e.addEvent('click', function(event){ 
	                this.activateContact() 
	            }.bind(this));       
            }.bind(this))
            
            this.el.getElements('a.deleteBtn').each(function(e){     
            	e.addEvent('click', function(event){ 
	                this.deleteContact(); 
	            }.bind(this));       
            }.bind(this))
        },
        
        activateContact: function(){

        	this.parent.stripe();
            //this.el.addClass('active');
            this.callCard.setSelector(this.id) 
            this.page.latestContact = this.id; 
            this.callCard.getDetails('contact');
        },
        
        deleteContact: function(){
        	//make ajax call to delete client
      		if(confirm("Are you sure you want to delete this contact?")){
      			new Request({	
				url:'includes/ajax/update_client.php', 
				async:'false', 
				onSuccess:  function(responseText){        
								if(this.callCard.selectorID == this.id && this.callCard.contents == 'contact'){
									this.callCard.el.setStyle('display', 'none')
								}
								this.el.dispose();
								this.parent.stripeKeepActive();
						}.bind(this) 
				}).send("action=delete_contact&contact_id="+this.id);      
			}
        }
    })
    
    
	/**************** CALL CARD **************/  
	
    var CallCard = new Class({ 
    	Extends: DisplayTools, 
        Implements: Options,
        options:{color:'blue'},
        
        initialize: function(options, parent){
            this.setOptions(options);
            this.el = $('callCard');
            this.parent = parent;
            this.content = $('callCardInner');
            this.initActions();
            this.contents = "";
            this.previousContents = "";
            this.previousSelectorID = "";
            
        },
        
        
        
        initActions: function(){
        	
        	this.el.getElements('a.exportBtn').each(function(e){     
                e.addEvent('click', function(event){ 
	                this.parent.exportContents('callCard', 'csv')  
	            }.bind(this));   
            }.bind(this))
            
            this.el.getElements('a.printBtn').each(function(e){     
                e.addEvent('click', function(event){ 
	               this.parent.exportContents('callCard', 'print') 
	            }.bind(this));   
            }.bind(this))	
        	
        	
        	this.el.getElements('input.editBtn').each(function(e){   
            	e.addEvent('click', function(event){
	                this.lastAction = 'edit';
	                this.editDetails(); 
	            }.bind(this));       
            }.bind(this))
            
            this.el.getElements('input.saveBtn').each(function(e){   
            	e.addEvent('click', function(event){
	                if(this.el.hasClass('new')){
	                	this.el.removeClass('new')
	                    this.insertDetails() 
	                }else{
	                	this.saveDetails(); 
	                }
	            }.bind(this));       
            }.bind(this))
            
            this.el.getElements('input.cancelBtn').each(function(e){   
            	e.addEvent('click', function(event){
	                this.cancelEdit()
	            }.bind(this));       
            }.bind(this))		    
        },
        
        unhide: function(){
        	this.el.setStyle('display', 'block');  
        },
        
        
        cancelEdit: function(){
        	if(this.contents != this.previousContents && this.action == 'add'){
        		this.setSelector(this.selectorID);
        		this.getDetails(this.previousContents);
        	}else{
        		this.getDetails()
			}
        
        },
        
        saveDetails: function(){
        	if($('edit_title').get('value') == ""){
        		alert("Please enter a "+this.contents+" name");
        	}else{
        		new Request({	
				url:'includes/ajax/update_client.php', 
				async:'false', 
				onSuccess:  function(responseText){ 
								this.updateTitle();
								this.getDetails()
							}.bind(this) 
				}).send(this.toQueryString()+"&action=update_"+this.contents+"_call_card&"+this.contents+"_id="+this.selectorID);	
			}
        },
        
        updateTitle: function(){
        	$(this.contents+'_'+this.selectorID).getElement('.title').set('text', $('edit_title').get('value'))        	
        },
        
        insertDetails: function(){
        	new Request({	
			url:'includes/ajax/update_client.php', 
			async:'false', 
			onSuccess:  function(responseText){ 
							this.setSelector(responseText);
							this.getDetails()
							this.parent.contacts.getContacts(this.parent.contacts.lastClientID, responseText);
							this.clearActive()
						}.bind(this) 
			}).send(this.toQueryString()+"&action=add_"+this.contents+"_call_card");	
        },
        
        toQueryString: function(){
        	var query_string = ""; 
        	var name;
        	this.el.getElements('[type=text],[type=hidden],select').each(function(e){
        		query_string += e.get('name')+"="+e.get('value')+"&";
        	})
			return query_string;        	
        	
        
        },
        
        editDetails: function(){
        	this.action = 'edit'; 
        	new Request({	
			url:'includes/ajax/update_client.php', 
			async:'false', 
			onSuccess:  function(responseText){ 
							this.updateContent(responseText);
							this.el.addClass('editMode');
							this.initLocations();
							this.initAddBtn();
						}.bind(this) 
			}).send("action=edit_"+this.contents+"_call_card&"+this.contents+"_id="+this.selectorID);
        },
        
        setSelector:function(id){
        	this.previousSelectorID = this.selectorID;
	        this.selectorID = id;
        },
        
        setContents:function(contents){
        	this.previousContents = this.contents;
	        this.contents = contents;
        },
        
        getDetails: function(contents){
        	
        	if(contents != undefined){
        		this.setContents(contents)
        	} 
        	if($(this.contents+'_'+this.selectorID)){
        		$(this.contents+'_'+this.selectorID).addClass('active')
			}
        	this.unhide();
        	new Request({	
			url:'includes/ajax/update_client.php', 
			async:'false', 
			onSuccess:  function(responseText){ 
							this.updateContent(responseText);
							
						}.bind(this) 
			}).send("action=get_"+this.contents+"_call_card&"+this.contents+"_id="+this.selectorID);
        },
        
        
        updateContent: function(html){
        	this.content.set('html', html);
        	this.el.removeClass('editMode');	
        },
        
        initLocations: function(){
        	this.el.getElements('.item').each(function(e){
        		new Location(e, {}, this, this.parent);	
        	})
        },
        
        initAddBtn: function(type){
        	this.el.getElements('a.addBtn').each(function(e){
            	e.addEvent('click', function(event){
            		
            		this.getBlank(e)
		        	   
		        }.bind(this));       
	        }.bind(this))		
        },
        
        getBlank: function(addBtn){
        	new Request({	
			url:'includes/ajax/update_client.php', 
			async:'false', 
			onSuccess:  function(responseText){ 
							var newLoc = new Element('div', {'class':'item location'})
            				newLoc.set('html', responseText); 
            				newLoc.injectBefore(addBtn);
							new Location(newLoc, {}, this, this.parent);
							 
						}.bind(this) 
						
			}).send("action=new_"+this.contents+"_call_card"); 
			
        },
        
        addNew: function(){
        	this.unhide();
        	this.el.addClass('editMode');
        	this.action = 'add';
        	new Request({	
			url:'includes/ajax/update_client.php', 
			async:'false', 
			onSuccess:  function(responseText){ 
							this.updateContent(responseText);
							this.el.addClass('editMode new');
							//this.initLocations();
							this.initAddBtn();
						}.bind(this) 
			}).send("action=get_blank_"+this.contents+"_call_card&client_id="+this.parent.latestClient+"&"+this.contents+"_id=new");		
        } 
    })
    
    
    var Location = new Class({
    	Implements: Options,
        options:{color:'blue'},
        
        initialize: function(el, options, parent, page){
        
            this.setOptions(options);
            this.el = el;
            this.parent = parent;
            this.page = page;
            this.initActions();
            
        },
        
        initActions: function(){
        	this.el.getElements('a.deleteBtn').each(function(e){ 
            	e.addEvent('click', function(event){
	                this.deleteLocation(); 
	            }.bind(this));       
            }.bind(this))    
        },
        
        deleteLocation: function(){
        	this.el.dispose()
        }
    })