HJ.GenericSignup = Class.create();

HJ.GenericSignup.prototype = Object.extend(new Af.StepsMaker(), {

	initialize: function(listObj, step1TargetContainerId) {
		this.doInitialize(listObj, step1TargetContainerId);
	},

	// this way subclasses can override initialize and invoke doInitialize
	doInitialize: function(listObj, step1TargetContainerId) {
		this.url = {
			"step1":"/GenericSignup.htm",
			"step2":"/GenericSignup.htm",
			"stepPaymentRequest":"/PaymentRequestStep.htm",
			"stepPaymentRequestThroughAmazon":"/AmazonPaymentRequestStep.htm",
			"step3":"/StepsEmails.htm",
			"step4":"/GenericSignupRecipient.htm",
			"stepPaymentAttempt":"/PaymentAttemptStep.htm",
			"stepPaymentAttemptThroughAmazon":"/AmazonPaymentAttemptStep.htm",
			"step5":"/SenderConfirm.htm",
			"step6":"/RSVPConfirm.htm"
		};		

		this.targetContainerId = {
			"step1":step1TargetContainerId == null ?
                    "bodyContainer" : step1TargetContainerId,
			"step2":"bodyContainer",
			"stepPaymentRequest":step1TargetContainerId == null ?
					"bodyContainer" : step1TargetContainerId,		
			"stepPaymentRequestThroughAmazon":step1TargetContainerId == null ? "bodyContainer" : step1TargetContainerId,		
			"step3":step1TargetContainerId == null ?
                    "bodyContainer" : step1TargetContainerId,
			"step4":step1TargetContainerId == null ?
                    "bodyContainer" : step1TargetContainerId,
        	"stepPaymentAttempt":step1TargetContainerId == null ?
                    "bodyContainer" : step1TargetContainerId,
        	"stepPaymentAttemptThroughAmazon":step1TargetContainerId == null ? "bodyContainer" : step1TargetContainerId,		
			"step5":step1TargetContainerId == null ?
                    "bodyContainer" : step1TargetContainerId,
			"step6":step1TargetContainerId == null ?
                    "bodyContainer" : step1TargetContainerId			
		};
		
		this.listObj = listObj;

		// Must declare templateType per template		
		this.data = new Array;
		this.data['item'] = new Array;
		this.data['item'][0] = new Object();
			
		this.tl = null;
		//  Row Divs as not to rely on tables for the front end.  
		//  name should match the 
		this.rowDiv = "<div class=\"genericSignupItems\"><input type=\"text\" name=\"description\" value=\"\" class=\"dark\"/></div>" +
				"<div class=\"signUpMiniCal\"><input name=\"time\" type=\"dueDate\" value=\"\" /><img src=\"image/icon_calendar.gif\" alt=\"Calendar\" /></div>" +
                "<div class=\"signUpVolunteerHide\" ><input type=\"hidden\" value=\"\" class=\"\"/></div>" +
                "<div class=\"helperIdHide\" ><input type=\"hidden\" value=\"\" class=\"\"/></div>" +
                "<div class=\"helperEventIdHide\" ><input type=\"hidden\" value=\"\" class=\"\"/></div>" +
                "<div class=\"UUID\" ><input type=\"hidden\" value=\"\" class=\"\"/></div>" +
				"<div class=\"volunteerNotesHide\"><input type=\"hidden\" value=\"\" class=\"\"/></div>" +
        		"<div class=\"driveDelete\"><a href=\"#\"><span class=\"closeBtn\" title=\"Delete\"></span></a></div>" +
        		"<div class=\"AddItem\" valign=\"middle;\"><a href=\"#\"><img src=\"image/icon_add.gif\" border=\"0\" class=\"addIcon\">Add item</a></div>";

		this.rowDivHelper = "<div class=\"genericSignupItems\"><input type=\"text\" name=\"description\" value=\"\" class=\"dark\"/></div>" +
				"<div class=\"signUpMiniCal\"><input name=\"time\" type=\"dueDate\" value=\"\" /><img src=\"image/icon_calendar.gif\" alt=\"Calendar\" /></div>" +
                "<div class=\"signUpVolunteer\" ><input type=\"text\" value=\"Volunteer Name Will Go Here\" class=\"\"/></div>" +
                "<div class=\"helperId\" ><input type=\"hidden\" value=\"\" class=\"\"/></div>" +
                "<div class=\"helperEventId\" id=\"helperEventId\" ><input type=\"hidden\" value=\"\" class=\"\"/></div>" +
                "<div class=\"listItemUUID\" ><input type=\"hidden\" value=\"\" class=\"\"/></div>" +
        		"<div class=\"volunteerNotes\"  ><input type=\"text\" value=\"\" class=\"\"/></div>";
		
		this.rowDiv2 = "<span name=\"description\" class=\"genericSignupItems\"></span>" +
                    "<span class=\"signUpMiniCal\" name=\"dueDate\"></span>" +
                    "<span class=\"signUpVolunteer\" name=\"helper\"><input disabled=\"disabled\" type=\"text\" value=\"\" class=\"dark\"/></span>" +
                    "<span name=\"removeHelper\" ><a href=\"#\" style=\"display:none;\">Remove</a></span>" +
	                "<div class=\"helperId\" ><input type=\"hidden\" value=\"\" class=\"\"/></div>" +
	                "<div class=\"helperEventId\" ><input type=\"hidden\" value=\"\" class=\"\"/></div>" + 
	                "<div class=\"listItemUUID\" ><input type=\"hidden\" value=\"\" class=\"\"/></div>" +
        			"<span class=\"volunteerNotes\" name=\"notes\"><input type=\"text\" value=\"\" class=\"dark\"/></span>";

		this.listFields = new Array('notes', 'lastEmailString',
                                    'lastEmailSubject', 'lastEmailNote',
                                    'collectPayments', 'suggestedAmount',
                                    'helperCanModifyAmount', 'showFeesToHelper',
                                    'nextStep', 'notifyOrganizerOnSignup');
		this.listItemFields = new Array('description', 'dueDate',
                                        'helper', 'helperId', 'helperEventId', 'UUID', 'notes');
		this.templateType = HJ.TEMPLATE_TYPE_GENERIC_SIGNUP;
		this.initializeSelectedStepFromQueryString();		
		this.itemCount = 0;
		this.setDataObject();
	},
	
	//  Map Workspace data to local data..
	setDataObject: function() {
		if (this.listObj!=null)	{	
			this.data = this.listObj;
			this.doInitialRoute();
		}
	},	

	//  Save Step 1 to work locally.
	saveHoldData: function() {								
		//  
		//this.data['name'] = this.signupNameFieldElement.value;
		if (this.selectedStep != 4) {
			this.data['name'] = document.getElementById('name').value;
			this.data['notes'] = document.getElementById('notes').value;
		  	var notifyOrganizerOnSignupElem = document.getElementById('notifyOrganizerOnSignup');
			if (notifyOrganizerOnSignupElem != null && notifyOrganizerOnSignupElem.checked) {
				this.data['notifyOrganizerOnSignup'] = "true";
			} else {
				this.data['notifyOrganizerOnSignup'] = "false";
			}
		}
		
		//  listitems
		var listDivs = this.listContainer.childNodes;
		var listData = new Array;
		var idx = 0;
		for (var i=0; i<listDivs.length; i++) {
			var listItem = listDivs[i];
			if (listItem.tagName != 'DIV') {
				continue;
			}
			var listItemInputs = listItem.getElementsByTagName('input');
			var rowData = new Object();
			if (this.selectedStep == 4) {
				this.data['item'][idx].notes = listItemInputs[4].value;
				idx++;
			} else {
				rowData['description'] = listItemInputs[0].value;
				rowData['dueDate'] = listItemInputs[1].value;
				rowData['helper'] = listItemInputs[2].value;
				rowData['helperId'] = listItemInputs[3].value;
				rowData['helperEventId'] = listItemInputs[4].value;
				rowData['UUID'] = listItemInputs[5].value;
				rowData['notes'] = listItemInputs[6].value;
				listData.push(rowData);
			}
		} 
		if (this.selectedStep != 4) {
			this.data['item'] = listData;
		}
 	},			

	//  Step 1
	loadStep1:function() {
	    this.helperHeading = document.getElementById('helperHeading');
		this.selectedStep == 1 ? this.helperHeading.className='hide'
                : this.helperHeading.className = 'helperHeading';
	    
	    this.helperNotesHeading = document.getElementById('volunteerNotesHeading');
		this.selectedStep == 1 ? this.helperNotesHeading.className='hide' : null;

		this.signupNameFieldElement = document.getElementById('name');
		this.notes = document.getElementById('notes');
		Element.extend(this.notes);
		
		Element.extend(this.signupNameFieldElement);
		Event.observe(this.signupNameFieldElement, 'keypress',
             this.processSignupNameFieldKeyPress.bindAsEventListener(this));
		Event.observe(this.signupNameFieldElement, 'click',
             this.eraseDefaultField.bindAsEventListener(this));

		//  Container Div for itemlists..
        //  Not universal since step3 doesn't use it
		this.listContainer = document.getElementById('listItems');
		
		//  Universal Nav bars - resides in Step 1 and remains
		this.sideNavBar = document.getElementById('sideNavBar');
				
		this.navDivs = this.sideNavBar.getElementsByTagName('div');
		for (var i=0; i<this.navDivs.length; i++) {
			this.navDivs[i].onclick =
                    this.navBarClicked.bindAsEventListener(this);
		}
		
		//this.signupNameFieldElement =
        //  document.getElementById('signupNameFieldId');
	
		if (this.data['name']!=null){
			document.getElementById('name').value = this.data['name'];						
		}
		if (this.data['notes']!=null || this.data['notes']!=undefined) {
			document.getElementById('notes').innerHTML = this.data['notes'];
		}
		
		var notifyOrganizerOnSignupElem = document.getElementById('notifyOrganizerOnSignup');
		if (notifyOrganizerOnSignupElem != null) {
			if (this.data['notifyOrganizerOnSignup'] != null && 
				this.data['notifyOrganizerOnSignup'] != undefined &&
				this.data['notifyOrganizerOnSignup'] == "true") {
				notifyOrganizerOnSignupElem.checked = true;
			} else {
				notifyOrganizerOnSignupElem.checked = false;
			}
		}

		this.signupNameFieldElement.value == '' ?
                this.signupNameFieldElement.className = 'signupDark':
                this.signupNameFieldElement.className = 'dark';		
		
		this.itemCount = 0;			
		if (this.data['item']!=null) {
			var items = this.data['item'];
			for (var i=0; i<items.length; i++) {
				this.addItem(items[i], i);	
			}				
		}
		document.getElementById('name').focus();
	},

	// Step 2 - Step 3 is email and universal
	loadStep2:function() {
		this.loadStep1();

		if (this.sideNavBar!=null)
			this.sideNavBar.className = 'navStep2';

		this.backButton.style.display = 'block';

		document.getElementById('topInstructions').innerHTML = "Take a moment to review. Interested in adding your name (or someone else's) as a volunteer? Do so by clicking on the volunteer box.";
	},

	loadStep4: function() {
		this.doLoadStep4();
	},
	
	doLoadStep4:function() {		
		if (this.data['name']!=null || this.data['name']!=undefined)
			document.getElementById('name').innerHTML = this.data['name'];

		if (this.data['notes']!=null || this.data['notes']!=undefined) {
			document.getElementById('notes').innerHTML = textDisplay(this.data['notes']);
		}
		
		this.listContainer = document.getElementById('listItems');
		
		var listItems = this.data['item'];
	
		if (listItems!=null) {
			for (var i=0; i<listItems.length; i++) {
				var signupDiv = document.createElement('div');
				signupDiv.innerHTML = this.rowDiv2;
				signupDiv.className = "driveFormCont";
							
				signupDiv.id = listItems[i].divName = 'signupDiv_'+i;
				var dataFields = signupDiv.getElementsByTagName('span');

                var description = listItems[i].description;
				if (description==null || description=='undefined') {
					listItems[i].description = '';
                    description = '';
				}
				dataFields[0].innerHTML = description;

                var dueDate = listItems[i].dueDate;
				if (dueDate==null || dueDate=='undefined') {
					listItems[i].dueDate = '';
                    dueDate = '';
				}
				dataFields[1].innerHTML = dueDate;

				var helperInputField = signupDiv.getElementsByTagName('input');

                var helper = listItems[i].helper;
				if (helper == null || helper == 'undefined' || helper == 'Volunteer Name Will Go Here') {
					listItems[i].helper = helper = '';
				}
				helperInputField[0].value = helper;	
				
                var helperId = listItems[i].helperId;
				if (helperId == null || helperId == 'undefined' || helperId == '') {
					listItems[i].helperId = helperId = '';
					listItems[i].helper = helper = '';
				}
				helperInputField[1].value = helperId;	

                var helperEventId = listItems[i].helperEventId;
				if (helperEventId == null || helperEventId == 'undefined') {
					listItems[i].helperEventId = helperEventId = '';
				}
				helperInputField[2].value = helperEventId;	
				
                var listItemUUID = listItems[i].UUID;
				if (listItemUUID == null || listItemUUID == 'undefined') {
					listItems[i].UUID = listItemUUID = '';
				}
				helperInputField[3].value = listItemUUID;	

				// notes field
                var notes = listItems[i].notes;
				if (notes == null || notes == 'undefined' || notes == '') {
					listItems[i].notes = notes = '';
				}
				helperInputField[4].value = notes;
				helperInputField[4].id = "notes_"+i;

				if (helperId!=null && helperId != "" && login==null) {
					if(helper != null && helper != ''  && helper != 'undefined') {
						helperInputField[0].disabled = 'disabled';
						helperInputField[4].disabled = 'disabled';
					}
					else {
						helperInputField[0].disabled = false;							
						helperInputField[4].disabled = false;
					}
				} else {
					helperInputField[0].disabled = false;
					helperInputField[0].onclick = this.selectHelper.bindAsEventListener(this);
					helperInputField[0].onfocus = this.selectHelper.bindAsEventListener(this);
				}
				
				/*  ----  fix for bug id 3498: disable ability for the helper to remove herself
				if (helperId != null && helperId != "" && this.data['helperID'] == helperId) {
					var aTag = signupDiv.getElementsByTagName("a")[0];
					aTag.style.display = "block";
					aTag.name = i.toString();
					aTag.onclick = this.removeHelper.bindAsEventListener(this, i);
				}
				*/

				this.listContainer.appendChild(signupDiv);
			}		
		}
/*		
		var inputs = document.getElementsByTagName('input');

		for (var i=0; i<inputs.length; i++) {
			if (inputs[i].inputs) = false;
		} */ 
	},

	//  Add lilst item..  Div name index corresponds to item index in this.data	
	addItem:function (item, index) {
		var myItem = item; 
		var firstFlag = false;
		
		myItem == 'first' ? firstFlag=true:null;

		if (index == null) {
			if (this.data['item']!=null) {
				index = this.data['item'].length;
			} else {
				index = 0;
			}
		}
		var currentElemAtPosition = document.getElementById("item_"+index);

		var itemDiv = document.createElement('div');
		this.selectedStep==1
                ? itemDiv.innerHTML = this.rowDiv
                : itemDiv.innerHTML = this.rowDivHelper;
		
		//itemDiv.innerHTML = this.rowDiv;
		itemDiv.className = "driveFormCont";		
		itemDiv.id = "item_" + index;
		var itemFields = itemDiv.getElementsByTagName('input');
		var itemCalImg = itemDiv.getElementsByTagName('img')[0];
		var itemDelete = itemDiv.getElementsByTagName('a')[0];
		var itemAdd = itemDiv.getElementsByTagName('a')[1];
		
		if (this.data['item'].length == 0) {
			itemFields[0].className = 'neededDark';
	
			Event.observe(itemFields[0], 'click',
                            this.eraseDefaultField.bindAsEventListener(this));
			Event.observe(itemFields[0], 'keypress',
                            this.eraseDefaultField.bindAsEventListener(this));
		
		}
		itemFields[1].onclick = this.showMiniCal.bindAsEventListener(this);
		itemFields[1].onfocus = this.showMiniCal.bindAsEventListener(this);
		itemCalImg.onclick = this.showMiniCal.bindAsEventListener(this);

		if (itemFields[2] != null) {
			itemFields[2].onclick = this.selectHelper.bindAsEventListener(this);
			itemFields[2].onfocus = this.selectHelper.bindAsEventListener(this);
			itemFields[2].onkeypress = HJ.ignoreAnyKeyPress;
		}
				 
		if (myItem!=null){
			myItem['description']==null || myItem['description']=='undefined'
                    ? myItem['description']='':null;
			itemFields[0].value = myItem['description'];
			itemFields[0].className =='neededDark'
                    ? itemFields[0].className = 'dark' : null;

			myItem['dueDate']==null || myItem['dueDate']=='undefined'
                    ? myItem['dueDate']='':null;
			itemFields[1].value = myItem['dueDate'];		

			myItem['helper']==null || myItem['helper']=='undefined'
                    ? myItem['helper']='':null;
			itemFields[2].value = myItem['helper'];		

			myItem['helperId']==null || myItem['helperId']=='undefined'
                    ? myItem['helperId']='':null;
			itemFields[3].value = myItem['helperId'];		

			myItem['helperEventId']==null ||
                                    myItem['helperEventId']=='undefined'
                    ? myItem['helperEventId']='':null;
			itemFields[4].value = myItem['helperEventId'];		

			myItem['UUID']==null ||
						            myItem['UUID']=='undefined'
						? myItem['UUID']='':null;
			itemFields[5].value = myItem['UUID'];		

			myItem['notes']==null ||
						            myItem['notes']=='undefined'
						? myItem['notes']='':null;
			itemFields[6].value = myItem['notes'];
		}

		if (itemDelete != null) {
			itemDelete.onclick = this.deleteItem.bindAsEventListener(this);
		}
		
		if (itemAdd != null) {
			itemAdd.onclick = this.processAddItemEvent.bindAsEventListener(this);
		}
		
		Element.extend(itemDiv);
		Event.observe(itemDiv, 'keypress',
                       this.processItemFieldKeyPress.bindAsEventListener(this));
		
		this.addItemElementToDisplay(itemDiv, index);
		this.itemCount++;
		
		return false;
	}
});