/**
 * Enrol form behavior
 */

var FnEnrol = Class.create();
FnEnrol.prototype = {

	/**
	 * Initialize
	 */
	initialize : function( elm ){
		//this.formElm = elm;
		this.residentialAddressSetup();
		
		if ($(elm).id === 'enrol') {
			this.preventDoubleSubmission(elm);
		}
		
		//EnrolData.load(this.onDataLoaded.bind(this));
	},

	residentialAddressSetup : function() {
		var checkbox = $('address_same');
		checkbox.observe('click', this.residentialAddressChange.bind(this));
	},

	residentialAddressChange : function () {
		var div = $('residential-address');
		var checkbox = $('address_same');
		if (checkbox.checked) {
			div.hide().setStyle('zoom', '0');
		}
		else {
			div.show();
		}
	},
	
	preventDoubleSubmission: function (form) {
		var $form = $(form),
			button = $form.select('button[type="submit"]').first(),
			spinner = $form.select('.form-submitting').first();

		$form.observe('submit', function () {
		
			button.hide();
			spinner.show();
			
		
		});
	
	}

	/**
	 * Handle on success event after filter html is loaded
	 */
/*
	onDataLoaded : function(){
		var program = this.formElm.select('.program').first();
		program.insert({after : EnrolData.filterHtml});
		program.hide();
		this.setup();
	},
*/

	/**
	 * Setup form and elements
	 */
/*
	setup : function() {

		// Select elements
		this.selQual	= this.formElm.select('[name=qualification]').first();
		this.selArea	= this.formElm.select('[name=area]').first();
		this.selCourse	= this.formElm.select('[name=course]').first();
		this.selModule  = this.formElm.select('[name=module]').first();
		this.selMethod	= this.formElm.select('[name=method]').first();
		this.selCampus	= this.formElm.select('[name=campus]').first();
		this.selElms = [this.selQual, this.selArea, this.selCourse, this.selModule, this.selMethod, this.selCampus];

		// hide optional fields
		var areaField = this.formElm.select('.sel-area').first();
		var moduleField = this.formElm.select('.sel-module').first();
		areaField.hide();
		moduleField.hide();

		// User is Fitnation member ? checkbox
		this.checkMember = this.formElm.select('[name=fitnation_member]');
		this.checkMember.each(function(elm){
			                      elm.observe('click', this.handleMemberChange.bind(this));
		                      }.bind(this));

		// Set initial disable
		this.selElms.each(this.disableSelect);
		this.enableSelect(this.selElms.first());

		// Set initial selectIndex
		this.selElms.each(this.resetSelect);

		// Remove all other items excerpt first and last
		this.selElms.each(function(elm,index){ if((index != 0) && (index != (this.selElms.size()-1))){ this.clearOptions(elm);}}.bind(this));

		// Add change handle evento to select elements
		this.selQual.observe('change', this.handleSelChange.bind(this));
		this.selArea.observe('change', this.handleSelChange.bind(this));
		this.selCourse.observe('change', this.handleSelChange.bind(this));
		this.selModule.observe('change', this.handleSelChange.bind(this));
		this.selMethod.observe('change', this.handleSelChange.bind(this));

		// Init PaymentSummary element
		this.initSummary();

		// Load filter
		// this.loadFilter();
	},
*/

	/**
	 * Add/init summary payment element
	 */
/*
	initSummary : function() {

		// Prepare payment summary
		this.summaryElement = new Element('div', { 'class' : 'payment-summary', 'style' : 'display: none' });

		this.summaryElement.info = new Element('div');
		this.summaryElement.total = new Element('p', {'class' : 'total'});
		this.summaryElement.insert('<h3>Payment Summary</h3>');
		this.summaryElement.insert(this.summaryElement.info);
		this.summaryElement.insert(this.summaryElement.total);

		// Append payment summray
		this.formElm.select('.is-member').first().insert({after: this.summaryElement});

		this.resetSummary();
		this.summaryElement.show();
	},

*/
	/**
	 * Update summary payment info
	 */
/*
	updateSummary : function(){

		if(this.selMethod.getValue() == 0 ) {
			this.resetSummary();
		} else {

			// Prefixing delivery method
			var method = this.getSelectText(this.selMethod);
			if( method == 'Campus' ) {
				method = ' on ' + method;
			} else if (method == 'Correspondence') {
				method = ' by ' + method;
			} else {
				method = ' ' + method;
			}

			// Get data
			var course = EnrolData.data.rel[this.selQual.selectedIndex-1].rel[this.selArea.selectedIndex-1].rel[this.selCourse.selectedIndex-1];
			var module = course.rel[this.selModule.selectedIndex-1].rel[this.selMethod.selectedIndex-1];

			var text = this.notNullModuleOptions().length <= 1
				? this.getSelectText(this.selCourse)
				: this.getSelectText(this.selModule);

			var html = ['<p><a href="', course.url, '" class="ext">',
						'1 x ', text, ',', method, '</a></p>'];

			// add a note about extra charge for postage
			if (module.equipment_fee == 'yes') {
				html.push(['<p><em>* Note:</em> an extra charge will be applicable',
						   ' for postage of the equipment kit.  Fitnation will',
						     ' contact you to advise of the amount before it is',
						     ' charged to your credit card.</p>'].join(''));
			}


			// Update info
			this.summaryElement.info.innerHTML = html.join('');

			// Add open in a new window behavior
			this.summaryElement.info.select('a.ext').first().observe('click', handleRelExternalLink);

			// Write total
			this.summaryElement.total.update('Total: ' + this.renderPrice(module) + ' (AUD)');
		}

	},
*/

	/**
	 * Render a module's price
	 * @param {hash} module
	 * @return {string} price text
	 */
/*
	renderPrice: function(module) {
		if (module.pay_by_instalment == 'y') {
			return ['$', module.deposit_amount,
					' + $', module.instalment_amount,
					' X ', module.num_instalments,
					' <em>(per ', module.instalment_frequency, ')</em>'].join('');
		}
		else {
			// If is member use price_sale
			return '$' + ((this.isMember()==1)
					      ? module.price_sale
					      : module.price);
		}
	},

*/
	/**
	 * Reset summary payment info to default valuess
	 */
/*
	resetSummary : function(){
		this.summaryElement.info.update('&nbsp;');
		this.summaryElement.total.update('Total: $0');
	},

*/
	/**
	 * Return if option group Is Member is On/Off
	 * @return 0/1 Integer
	 */
/*
	isMember : function(){
		var checked = this.formElm.select('[name=fitnation_member]:checked').first();
		return checked ? checked.getValue() : -1;
	},
*/

	/**
	 * Load filter from query string parameters
	 */
/*
	loadFilter : function(){
		var initFilters = $(window.location).toString().toQueryParams();

		// load initial category
		if(initFilters.c && initFilters.p){

			// select corresponding program category
			this.setOptionIndex(this.selQual, initFilters.c);
			this.doSelectChange(this.selQual, EnrolData.data.rel[this.selQual.selectedIndex-1].rel);

		    // load initial category
		} else if(initFilters.c){

			// select corresponding program category
			this.setOptionIndex(this.selQual, initFilters.c);
			this.doSelectChange(this.selQual, EnrolData.data.rel[this.selQual.selectedIndex-1].rel);
		}

	},

*/
	/**
	 * Return option index based on value
	 */
/*
	getOptionIndex : function(elm, value){
		var index = -1;
		for(var i = 0; i < elm.options.length; i++){
			if( elm.options[i].value == value ) {
				index = i;
			}
		}
		return index;
	},
*/

	/**
	 * Set select index/value
	 */
/*
	setOptionIndex : function(elm, value) {
		elm.value = value ;
		elm.selectedIndex = this.getOptionIndex(elm, value);
	},

*/
	/**
	 * Get selected option text
	 * @param {Element} elm Select element
	 * @return {string} selected option text
	 */
/*
	getSelectText : function(elm){
		return elm.options[elm.selectedIndex].text;
	},
*/


	/**
	 * Enable select element
	 * @param {Element} elm Select element
	 */
/*
	enableSelect : function(elm){
		elm.removeAttribute('disabled');
		elm.disabled = false;
	},
*/

	/**
	 * Disable select element
	 * @param {Element} elm Select element
	 */
/*
	disableSelect : function(elm){
		elm.setAttribute('disabled', 'disabled');
		elm.disabled = true;
	},
*/

	/**
	 * Disable all down select elements
	 * @param {Element} elm Current select element
	 */
/*
	disableDownElements : function(elm){
		var pos = this.getSelectIndex(elm);
		for(i=pos+1; i<this.selElms.size(); i++){
			this.disableSelect(this.selElms[i]);
			this.clearOptions(this.selElms[i]);
		}
		this.resetSummary();
		this.updateProgramId();
	},

*/

	/**
	 * reset selectedIndex and value on element
	 * @param {Element} elm Select element
	 */
/*
	resetSelect : function(elm){
		elm.selectedIndex = 0;
	},

*/
	/**
	 * Check if a select element is clean
	 * @param {Element} elm Select element
	 * @return {boolean} Returns true if select element only have first option
	 */
/*
	isCleared : function(elm){
		if(elm.options.length == 1){
			return true;
		} else {
			return false;
		}
	},
*/

	/**
	 * Clear all options for a select except first one
	 * @param {Element} elm Select element
	 */
/*
	clearOptions : function(elm){
		elm.select('option').each(function(elm, index){
			                          if(index!=0) elm.remove();
		                          });
	},
*/

	/**
	 * Load filtered elements to select
	 * @param {Element} elm Select element
	 * @param {array} values Corresponding array from JSON file
	 * @param {integer} id Item index
	 */
/*
	loadOptions : function(elm, values, id ){
		// clear select options and disable down elements if necessary
		if(!this.isCleared(elm)) {
			this.clearOptions(elm);
			this.disableDownElements(elm);
		}

		// If we have options to add
		if(values.size() != 0) {

			// find corresponding items
			var _ind = 0;
			values.each(function(item, index){
							if(item && item.id == id ) { _ind = index; }
						});

			// get items
			var _rels = values[_ind].rel;

			// special case: .sel-module in enquire form
			if (this.formElm.readAttribute("id") == 'enquire'
				&& elm.readAttribute("name") == "module") {
				_rels = [{id: 0, title: 'NA'}];
			}

			// add OPTIONs
			this.insertOptions(elm, _rels);
		}
	},

	insertOptions: function(elm, options) {
		var html = [];
		options.each(function(r) {
						 if (!r) { return; }
						 html.push(['<option value="',
									r.id, '">',
									r.title, '</option>'].join(''));
					 });
		var title = elm.select('option.title').first();
		title.insert({after: html.join('')});
	},
*/

	/**
	 * Auto select an option if is the only one with value <> 0
	 */
/*
	autoSelect : function(elm){
		// special case: only 1 option, and it's a null value
		var numOptions = elm.select('option').size();
		if (numOptions <= 2) {
			elm.selectedIndex = numOptions-1;
			this.doSelectChange(elm, null, 'force');
		}
		else {
			var notNullValues = elm.select('option[value!=0]').size();
			elm.selectedIndex = notNullValues == 1 ? 1 : 0;
		}
	},

*/
	/**
	 * Get select element index
	 * @param {Element} elm Select element
	 * @return element index in this.selElms
	 */
/*
	getSelectIndex : function(elm){
		return this.selElms.indexOf(elm);
	},

*/
	/**
	 * Get next select element
	 * @param {Element} elm Current select element
	 * @return {Element} Next select element
	 */
/*
	nextElement: function(elm){
		return this.selElms[this.getSelectIndex(elm)+1];
	},

	numCourseOptions: function() {
		return EnrolData.data.rel[this.selQual.selectedIndex-1].rel[0].rel.length;
	},

	hasCourseOptions: function() {
		return this.numCourseOptions > 1;
	},

	numAreaOptions: function() {
		return EnrolData.data.rel[this.selQual.selectedIndex-1].rel.length;
	},

	notNullAreaOptions: function() {
		var options = EnrolData.data.rel[this.selQual.selectedIndex-1].rel;
		return this.filterNullOptions(options);
	},

	notNullModuleOptions: function() {
		var options = EnrolData.data.rel[this.selQual.selectedIndex-1]
			.rel[this.selArea.selectedIndex-1]
			.rel[this.selCourse.selectedIndex-1].rel;
		return this.filterNullOptions(options);
	},

	filterNullOptions: function(options) {
		var notNullOptions = [];
		options.each(function(item) {
						 if (item && item.id && item.id != 0) {
							 notNullOptions.push(item);
						 }
					 });
		return notNullOptions;
	},

*/
	/**
	 * Handle change on a dropdown
	 * @param event
	 */
/*
	handleSelChange : function(event){
		var elm = Event.element(event);

		var notNullValues = elm.select('option[value!=0]').size();
		var numOptions = elm.select('option').size();

		// all options are null
		if (notNullValues == 0) {
			elm.selectedIndex = numOptions-1;
			this.doSelectChange(elm, null, 'force');
		}
		// only 1 value which isn't null
		else if (notNullValues == 1) {
			elm.selectedIndex = numOptions-1;
			this.doSelectChange(elm, null, 'force');
		}
		else {
			this.doSelectChange(elm);
		}
	},

*/
	/**
	 * Handle user member checkbox changed
	 */
/*
	handleMemberChange : function(event){
		this.updateSummary();
	},

	getSelectData: {
		qualification: function(self) {
			return EnrolData.data.rel;
		},

		area: function(self) {
			var data = self.getSelectData.qualification(self);
			return data[self.selQual.selectedIndex-1].rel;
		},

		course: function(self) {
			var data = self.getSelectData.area(self);
			return data[self.selArea.selectedIndex-1].rel;
		},

		module: function(self) {
			var data = self.getSelectData.course(self);
			return data[self.selCourse.selectedIndex-1].rel;
		},

		method: function(self) {
			var data = self.getSelectData.module(self);
			return data[self.selModule.selectedIndex-1].rel;
		}
	},

*/
	/**
	 * Actions to do when a select value is changed
	 */
/*
	doSelectChange : function(elm, data, type) {
		type = type || 'normal';
		data = data || this.getSelectData[elm.name](this);
		var value = elm.getValue();

		var areaField = this.formElm.select('.sel-area').first();
		var courseField = this.formElm.select('.sel-course').first();
		var moduleField = this.formElm.select('.sel-module').first();
		var moduleLabel = moduleField.select('label').first();
		var moduleTitle = moduleField.select('option.title').first();

		switch(elm.name) {
		case 'qualification':
			courseField.show();
			moduleField.hide();
			if (this.notNullAreaOptions().length == 0) {
				areaField.hide();
			} else {
				areaField.show();
			}

			this.doDefaultSelectChange(elm, data, type);
			break;

		case 'area':
			courseField.show();
			moduleField.hide();
			if (this.notNullAreaOptions().length == 0) {
				if (this.numCourseOptions() == 1) {
					courseField.hide();
					moduleField.show();

					moduleLabel.innerHTML = 'Course';
					moduleTitle.innerHTML = 'Select Course ...';
				}
				else {
					moduleField.show();
					moduleLabel.innerHTML = 'Options';
					moduleTitle.innerHTML = 'Select Options ...';
				}
			}

			this.doDefaultSelectChange(elm, data, type);
			break;

		case 'course':
			if (this.notNullAreaOptions().length > 0) {
				if (this.notNullModuleOptions().length > 1) {
					moduleField.show();
					moduleLabel.innerHTML = 'Options';
					moduleTitle.innerHTML = 'Select Options ...';
				}
			}

			this.doDefaultSelectChange(elm, data, type);
			break;

		case 'method':
			// reset campus select
			this.resetSelect(this.selCampus);
			this.clearOptions(this.selCampus);

			// Enable selCampus only if delivery method is Campus
			if(elm.options[elm.selectedIndex].text == 'Campus') {
				// find out what Campuses are available, and populate the dropdown
				var campuses = data[this.selMethod.selectedIndex-1].campuses;

				var selCampus = this.selCampus;
				campuses.each(function(name){
								  selCampus.insert(['<option value="', name, '">', name, '</option>'].join(''));
							  });
				this.enableSelect(this.selCampus);
			} else {
				this.enableSelect(this.selCampus);
				this.selCampus.insert('<option value="0">NA</option>');
			}

			this.updateSummary();
			this.updateProgramId();
			break;

		default:
			this.doDefaultSelectChange(elm, data, type);
			break;
		}

		this.updateVal(this.selCourse, 'course');
		this.updateVal(this.selMethod, 'method');
	},

	doDefaultSelectChange: function(elm, data, type) {
		var value = elm.getValue();
		var nextElm = this.nextElement(elm);

		if(type == 'force' || value != 0){
			this.loadOptions(nextElm, data, value);
			this.resetSelect(nextElm);
			this.enableSelect(nextElm);
			// auto select to trigger change event too
			this.autoSelect(nextElm);
		} else {
			this.disableDownElements(elm);
		}
	},
*/

	/**
	 * Update program id form element
	 */
/*
	updateProgramId : function(){
		var value = this.selMethod.getValue();
		var moduleIdElm = this.formElm.select('[name=module_id]').first();
		var ind = 0;
		var val = "0";

		if( value != 0 ) {
			for(i=0; i<moduleIdElm.length; i++){
				if(moduleIdElm.options[i].value == value ){
					ind = i;
				}
			};
		}
		moduleIdElm.selectedIndex = ind;
		moduleIdElm.setValue(value);
	},

	updateVal: function(sel, name) {
		var index = sel.selectedIndex;
		if (index < 0) {
			return;
		}

		var val = sel.select('option')[index].innerHTML;
		this.formElm.select('[name=val_'+name+']').first().value = val;

		if (name == 'method' && this.notNullAreaOptions().length > 0) {
			var courseIndex = this.selCourse.selectedIndex;
			var moduleIndex = this.selModule.selectedIndex;
			this.selModule.select('option')[moduleIndex].value = this.selCourse.select('option')[courseIndex].innerHTML;
		}
	}
*/
};

/**
 * Test scenarios for the Enrol form
 */
var EnrolTest = function($) {
    return {
        /**
         * Load a test scenario
         */
        scenario: function(num) {
            var scenarios = {
                1: this.expiredCardScenario
            };

            scenarios[num].call(this);
        },

        expiredCardScenario: function() {
            var values = {
                title: 'Mr',
                first_name: 'Testy',
                surname: 'Testington',
                date_of_birth: '01/01/1980',
                email_address: 'test@test.com',
                phone: 'phone',
                address: 'address',
                suburb: 'suburb',
                postcode: 'postcode',
                state: 'state',
                country: 'Albania',

                cc_number: '4444333322221111',
                cc_expiry_month: '01',
                cc_expiry_year: '10',
                cc_name: 'T Testington',
                cc_type: 'visa'
            };

            this.setFormValues(values);
        },

        setFormValues: function(values) {
            var form = $('#enrol');
            $.each(values,
                   function(name, value) {
                       var elm = form.find('[name='+name+']');
                       if (!elm.length) {
                           console.error('no element: ', name);
                       }

                       var type = elm.attr('type');
                       elm.val(value);
                   });
        }
    };
}(jQuery);