// pass the element with data-staff-id and data-staff-name
		// action "deactivate" "activate"
		var updateStaffRole = function(staff_name, staff_id, action){

			if (action != "activate" && action != "deactivate"){
				return;
			}			

			// create simple popup content
			var content = new Element("div", {
				html: "Are you sure you want to "+ action +" <strong>" + staff_name + "</strong>??",
				'styles': {
			        'padding': '10px'
			    }
			});
			
			var responseConsole = new Element("div", {
				id: "role_change_console",
				class: 'console'
			}).inject(content);
			
			new Popup.confirm({
				content: content,
				title: '<strong>'+action+'?</strong>',
				confirmText: action,
				confirmClass: "popup-confirm",
				onConfirm: function(){		
					
					// start the ajax loader while it does it's thing
					$('popup-loading').setStyle('visibility', 'visible');
					
					$$('.popup input[type=button]').each(function(button){ button.disabled = true; });
						
					//update db
					new Request.JSON({
						url: "/~mitoc/wall/db/"+action+"_staff.php", 
						method: 'get', 
						data: {
							"staff_id": staff_id
						},
						onComplete: function(json){

							if(json.error == undefined){
								
								// show success message
								$('role_change_console').setProperty("class", "response-success");
								$('role_change_console').innerHTML = json.message;
		
								// reload the page after 5 sec
								(function(){ window.location.reload(); }).delay(1000);
								
							} else if (json.error.length > 0){
								
								// show error messages
								$('role_change_console').setProperty("class", "response-error");
								$('role_change_console').empty();
								for(var i = 0; i < json.error.length; i++){
									$('role_change_console').innerHTML += "- " + json.error[i] + "<br>";
								}
								
								$$('.popup input[type=button]').each(function(button){ button.disabled = false; });
								
							}
				    	}
					}).send();

						
				}
			}).show();
		};
	
		var deactivateStaff = function (staff_name, staff_id) {
			updateStaffRole(staff_name, staff_id, "deactivate");
		}
		
		var activateStaff = function (staff_name, staff_id) {
			updateStaffRole(staff_name, staff_id, "activate");
		}
			
			
			// inject images into profile-picture
			// $$('.profile').each(function(profile){
			// 	
			// 	var staff_id = profile.getProperty('data-staff-id');
			// 	
			// 	// remove any old images
			// 	profile.getElements('.profile-img').each(function(img){
			// 		img.destroy();
			// 	});
			// 	
			// 	new Asset.image("/~mitoc/wall/img/profile/" + staff_id + '_95x95.jpg?' + Math.random(), {
			// 	
			// 		onload: function(){
			// 			this.inject(profile.getElement('.profile-picture'));
			// 		},
			// 		onerror: function(){
			// 			//profile.getElement('.profile-picture').setStyle('display', 'none');
			// 		}
			// 		
			// 	});
			// 	
			// 	// new Element('img', {
			// 	// 	// the random number makes it refresh
			// 	// 	'src': "/~mitoc/wall/img/profile/" + staff_id + '_95x95.jpg?' + Math.random(), 
			// 	// 	'class': 'profile-img'
			// 	// }).inject(profile.getElement('.profile-picture'));
			// 	
			// 	
			// });
			

		
		function viewPastHours(name, id){

			// JSON encoded array of {"name": staff_name, "id": staff_id}
			Cookie.dispose('filterList'); // remove filterList if there.
			var filterList = [{"name": name, "id": id}];
			Cookie.write('filterList', JSON.encode(filterList), {path: "/~mitoc/wall/past-hours/"});

			window.location = "/~mitoc/wall/past-hours";
		}