

// Copyright (c) NimbleCat, 2008

// make sure that the required includes are there
 if (typeof NC == 'undefined') {
       alert("element.js requires the NC JavaScript framework");
 }
 
 /* constructor
 * 
 */ 
  NC.widget.WizardPage = function( step, pageLabel) {
		var fnSuperClass = NC.widget.WizardPage.superclass.constructor;
		this.step = step; // used to display "step x of Y" 
		fnSuperClass.call( this, -1);
		this.pageLabel = pageLabel;
  }
  
  NC.lang.extend(NC.widget.WizardPage, NC.widget.Element, 
  {
  	render: function( targetDiv) {
  		alert( "overide WizardPage.render()");
  	},
  	
  	save: function() {
  		alert( "override WizardPage.save()");
  	},
  	
  	validate: function( wizard) {
  		return true;
  	},
  	
  	setValidateFn: function( validateFn) {
  		this.validate = validateFn;
  	},
  	
  	serialize: function() {
  		alert( "override WizardPage.serialize(()");
  	},
  	
  	startFieldContainer: function() {
  		return '<div class="fieldcontainer">';
  	},
  	
  	endFieldContainer: function() {
  		return '</div><div style="clear:both"></div>';
  	},
  	
  	startFieldLabel: function() {
  		return '<div class="fieldlabel">';
  	},
  	
  	startLongFieldLabel: function() {
  		return '<div class="longfieldlabel">';
  	},
  	
  	endFieldLabel: function() {
  		return '</div>';
  	},
  	
  	startFieldSequence: function() {
  		return '<div class="field">';
  	},
  	
  	endFieldSequence: function() {
  		return '</div>';
  	},
  	
  	
  	createTextField: function(text) {
  		var content = '';
//		content += '<div class="field">';
		content += text;
//		content += '</div>';
  		return content;
  	},
  	
  	requiredFlag: function() {
  		return '<span class="requiredflag">*</span>';
  	},
  	
  	createButton: function( fieldLabel, fnName, imageUrl) {
		var content = '<input onclick="' + fnName + '" type="image" border="0" name="' + fieldLabel + '" id="' + fieldLabel + '" src="' 
			+ imageUrl + '" width="12" height="12">'; 
		return content;		
  	},
  	
  	createFieldHeader: function(value, size) {
  		var content = '';
  		size = (typeof size == 'undefined') ? 15 : size;
  		content += '<input type="text" class="fieldheader" '  + '" size="' + size +  '" value="' + value + '">'
//  		content += '</div>';
  		return content;
  	},
  	
  	createTextEditField: function(fieldLabel, name, value, size, maxSize, required) {
  		var content = '';
  		if (fieldLabel.length > 0) {
//  			content += '<div class="fieldlabel">';
  			content += fieldLabel;
//  			content += '</div>';
  		}
  		size = (typeof size == 'undefined') ? 15 : size;
  		maxSize = (typeof maxSize== 'undefined') ? 30 : maxSize;
//  		content += '<div class="field">';
		var fieldclass = 'inputfield';
		if (required == 1) {
			fieldclass = 'inputfieldreq';
		}
  		content += '<input type="text" class="' + fieldclass + '" name="' + name + '" id="' + name + '" size="' + size + '" maxlength="' + maxSize + '" value="' + value + '">'
//  		content += '</div>';
		if (required == 1) {
			content += this.requiredFlag();
		}
  		return content;
  	},
  	
  	createCheckbox: function( fieldLabel, name, value, checked, radio, required) {
  		var content = '';
  		if (fieldLabel.length > 0) {
//  			content += '<div class="fieldlabel">';
  			content += fieldLabel;
//  			content += '</div>';
  		}
  		var type = 'checkbox';
  		if (radio) {
  			type = 'radio';
  		}
//  		content += '<div class="field">';
		var fieldclass = 'inputfield';
		if (required == 1) {
			fieldclass = 'inputfieldreq';
		}
  		content += '<input class="' + fieldclass + '" type="' + type + '" name="' + name + '" id="' + name + '" value="' + value + '" ';
  		if (checked) {
  			content += 'checked' ;
  		}
  		content += '>';
//  		content += '</div>';
		if (required == 1) {
			content += this.requiredFlag();
		}
  		return content;
  	},
  	
  	createRadioButtons: function( name, labels, values, checked, required) {
  		var content = '';
  		for (var i = 0; i < values.length; i++) {
  			content += this.createCheckbox( labels[i], name, values[i], checked[i], true) ;
  		}
		if (required == 1) {
			content += this.requiredFlag();
		}
  		return content;
  	},
  	
  	createSelectBox: function( fieldLabel, name, labels, values, selected, required) {
  		var content = '';
  		if (fieldLabel.length > 0) {
//  			content += '<div class="fieldlabel">';
  			content += fieldLabel;
//  			content += '</div>';
  		}
//  		content += '<div class="field">';
		var fieldclass = 'inputfield';
		if (required == 1) {
			fieldclass = 'inputfieldreq';
		}
  		content += '<select class="' + fieldclass + '" name="' + name  + '" id="' + name + '" >';
  		for (var i = 0; i < values.length; i++) {
  			content += '<option value="' + values[i] + '"';
  			if ( selected[i]) {
  				content += ' selected ';
  			}
  			content += '>' + labels[i] + '</option>';
  		}
  		content += '</select>';
//  		content += '</div>';
		if (required == 1) {
			content += this.requiredFlag();
		}
  		return content;
  	}
  	
  
  });
  
 
 
/* constructor
 * 
 */ 
  NC.widget.Wizard = function(
  	 title,
 	 targetDivId,				// div into which wizard page content will be placed
 	 pages,						// array of Wizard page objects
 	 startPage,					// first page to display
 	 onFinish,					// method to call on finish
 	 onCancel,					// method to call on cancel
 	 onUpdate,					// method to call on resume update complete
 	 updateUrl,					// update url
 	 enableAllPageFinish
  ) {
		var fnSuperClass = NC.widget.Wizard.superclass.constructor;
		fnSuperClass.call( this, -1);
		this.title = title;
		this.targetDivId = targetDivId;
		this.pages = pages;
		this.currentPage = startPage;
		this.onFinish = onFinish;
		this.onCancel = onCancel;
		this.onUpdate = onUpdate;
		this.updateUrl = updateUrl;
		this.enableAllPageFinish = enableAllPageFinish
  }
  
  
  NC.lang.extend(NC.widget.Wizard, NC.widget.Element, 
  {
  	NCWizardBannerId : "NCWizardBanner",
  	NCWizardPageId : "NCWizardPage",
  	NCWizardNavId : "NCWizardNav",
  	NCWizardPreviousId : "NCWizardPrevious",
  	NCWizardNextId : "NCWizardNext",
  	NCWizardFinishId : "NCWizardFinish",
  	NCWizardCancelId : "NCWizardCancel",
  	NCWizardErrorId : "NCWizardError",
  	
  	compose: function() {
  		var content = '';
  		content += '<div class="ncwizardcontainer">';
		content += '<div class="ncwizardbanner" id="' + this.NCWizardBannerId + '"> ';
		content += this.title;
		content += '</div> ';
		content += '<div class="ncwizarderror" id="' + this.NCWizardErrorId + '"> ';
		content += "";
		content += '</div> ';
		content += '<div class="ncwizardpagecontainer">'; // page container
			content += '<div class="ncwizardpagespacer">'; // page spacer
			content += '</div> ';
			content += '<div class="ncwizardpage" id="' + this.NCWizardPageId + '"> ';
			content += '</div> ';
		content += '</div> ';
		content += '<div style="clear:both"></div>';
		content += '<div class="ncwizardnav" id = "' + this.NCWizardNavId + '"> ';
		content += '<span class="requiredflaglabel">*</span>Fields marked like this are required.<br><br>';
		content += '<input type="button" border="0"  title="" class="ncbutton" name="previousButton" id="' + this.NCWizardPreviousId + '" value="Previous"> ';
		content += '<input type="button" border="0"  title="" class="ncbutton" name="nextButton" id="' + this.NCWizardNextId + '" value="Next"> ';
		content += '<input type="button" border="0"  title="" class="ncbutton" name="finishButton" id="' + this.NCWizardFinishId + '" value="Finish"> ';
		content += '<input type="button" border="0"  title="" class="ncbutton" name="finishButton" id="' + this.NCWizardCancelId + '" value="Cancel"> ';
		content += '</div> ';
		content += '</div>';
		var targetDiv = document.getElementById(this.targetDivId);
		targetDiv.innerHTML = content;
  	},
  	
  	clearError: function() {
  		var errorDiv = document.getElementById( this.NCWizardErrorId);
  		errorDiv.style.display="none";
  		errorDiv.innerHTML = ""; //  hide it and remove the error message
  	},
  	
  	showError: function( message) {
  		var errorDiv = document.getElementById( this.NCWizardErrorId);
  		errorDiv.style.display="block";
		message += NC.messages.MsgCallSupport;
  		errorDiv.innerHTML = message; //  hide it and remove the error message
  	},
  	
  	showPrevious: function( event) {
		var target = NC.core.Event.getEventTarget(event);
  		var wizard = target.wizard;
  		if (wizard.currentPage > 0) {
  			if (wizard.pages[wizard.currentPage].validate( wizard)) {
	  			wizard.pages[wizard.currentPage].save();
	  			wizard.currentPage -= 1;
	  			wizard.clearError();
	  			wizard.renderCurrentPage();
  			}
  		}
  		
  	},

  	showNext: function(event) {
		var target = NC.core.Event.getEventTarget(event);
  		var wizard = target.wizard;
   		if (wizard.currentPage < (wizard.pages.length - 1) ) {
  			if (wizard.pages[wizard.currentPage].validate(wizard)) {
	  			wizard.pages[wizard.currentPage].save();
	  			wizard.currentPage += 1;
	  			wizard.clearError();
	  			wizard.renderCurrentPage();
  			}
  		}
  		
  	},
  	
  	doFinish: function(event) {
		var target = NC.core.Event.getEventTarget(event);
  		var wizard = target.wizard;
  		if (wizard.onFinish != null) {
  			if (wizard.pages[wizard.currentPage].validate(wizard)) {
	  			if (wizard.currentPage >= 0) {
	  				wizard.pages[wizard.currentPage].save();
	  			}
	  			wizard.clearError();
	  			wizard.onFinish();
 				NC.util.AjaxManager.displayNavigationBar();
  			}
  		}
  		
  	},
  	
  	doCancel: function(event) {
		var target = NC.core.Event.getEventTarget(event);
  		var wizard = target.wizard;
  		var proceed = true;
  		if (wizard.onCancel != null) {
  			proceed = wizard.onCancel();
  		}
 		NC.util.AjaxManager.displayNavigationBar();
  		if (proceed) {
	  		wizard.clearError();
	  		if (typeof(showTabView) != 'undefined') { // a bit of a hack...
	  			showTabView();
	  		}
	  		else {
	  			NC.util.AjaxManager.showPreviousMainFrameContent(); // punt - go to the previous page
	  		}
  		}
  		
  	},
  	
  	renderCurrentPage: function() {
  		this.finishButton.enable( this.enableAllPageFinish);
		if (this.pages && this.pages[ this.currentPage]) {
			this.pages[this.currentPage].render( this.NCWizardPageId);
		}
		if (this.currentPage == 0) {
			this.previousButton.enable( false);
		}
		else {
			this.previousButton.enable( true);
		}
		if (this.currentPage == this.pages.length -1) {
			this.nextButton.enable( false);
			if (this.enableAllPageFinish == false) {
				this.finishButton.enable( true);
			}
		}
		else {
			this.nextButton.enable( true);
		}
  	},

	addPageToBeginning: function( page) {
		this.pages.unshift( page);
	},

	addPageToEnd: function( page) {
		this.pages.push( page);
	},
	
	getPageByLabel: function( pageLabel) {
		var i;
		for (var i = 0; i < this.pages.length; i++) {
			if (this.pages[i].pageLabel == pageLabel) {
				return this.pages[i];
			}
		}
	},
  	
  	init: function() {
  		// create object for next, previous and finish buttons
		this.previousButton = new NC.widget.Button(this.NCWizardPreviousId);
		this.previousButton.init();
		this.nextButton = new NC.widget.Button(this.NCWizardNextId);
		this.nextButton.init();
		this.finishButton = new NC.widget.Button(this.NCWizardFinishId);
		this.finishButton.init();
		this.cancelButton = new NC.widget.Button(this.NCWizardCancelId);
		this.cancelButton.init();


		this.previousButton.addDomEvent(NC.core.EventType.Click, this.showPrevious, false);
		this.nextButton.addDomEvent(NC.core.EventType.Click, this.showNext, false);
		this.finishButton.addDomEvent(NC.core.EventType.Click, this.doFinish, false);
		this.cancelButton.addDomEvent(NC.core.EventType.Click, this.doCancel, false);
		
		
		var previousButtonElement = document.getElementById( this.NCWizardPreviousId);
		var nextButtonElement = document.getElementById( this.NCWizardNextId);
		var finishButtonElement = document.getElementById( this.NCWizardFinishId);
		var cancelButtonElement = document.getElementById( this.NCWizardCancelId);
		previousButtonElement.wizard = this;
		nextButtonElement.wizard = this;
		finishButtonElement.wizard = this;
		cancelButtonElement.wizard = this;
		this.renderCurrentPage();
		NC.util.AjaxManager.hideNavigationBar();
  	},
  	
  	submit: function() {
  		// call the serialize functions for all of the pages and post
  	}
  
  });
 
 